We may want to consider making this a default gadget. To do so, we need to make it awesome!

@TBolliger: Just to clarify, this initial proof-of concept task doesn't include actually inserting Wikitext into the editor, correct? I think it would be better to implement that part in a separate task as it involves handling different template format options, which is a bit tricky.

@kaldari Correct. I was not including showing the form for inputting data either but I guess we can do that as part of this.

A rudimentary start on a template wizard: https://en.wikipedia.org/wiki/User:Samwilson/TemplateWizard.js . Load with:

mw.loader.load( 'https://en.wikipedia.org/w/index.php?title=User:Samwilson/TemplateWizard.js&action=raw&ctype=text/javascript' );

No i18n, no validation of a bunch of things, no non-text parameter fields, no lots of other stuff. :-)

Woo, this looks really good! You've moved well into the second ticket T186662 so I'm assigning that to you.
Edit: It looks like #5 is the last bit left here so I'm leaving this open for now.

Thanks!

5. When you click "Insert template", or whatever, it should either tell the user that the template they entered doesn't exist (if it doesn't) or it should add the name of the template into the popup, but nothing else (no parameter form yet).

For non-existing templates it currently adds a header for the template (with a new-tab link) and does nothing else. I remember reading that we're going to want to be able to add new parameters for any template, so that could work here too, if we just have the header link be red (and a [!] or something next to it). That way there's not much difference in behaviour between existing/no-template-data/non-existing etc. What do you think?

Also: should I start setting up an extension for this? (I'm developing it locally as an extension anyway, because it's easier to work on that way).

In T186654#3998442, @Samwilson wrote:

For non-existing templates it currently adds a header for the template (with a new-tab link) and does nothing else. I remember reading that we're going to want to be able to add new parameters for any template, so that could work here too, if we just have the header link be red (and a [!] or something next to it). That way there's not much difference in behaviour between existing/no-template-data/non-existing etc. What do you think?

Hmm, I don't think we're going to want to be able to add new parameters for any template. How about we give them a message like the following?

Template:Dummy (redlink) could not be found. This may be because it doesn't exist or because it doesn't have TemplateData tags. Please fix that and try again. If you think you've found a bug tell us about it here (help page link).

Also: should I start setting up an extension for this? (I'm developing it locally as an extension anyway, because it's easier to work on that way).

So the extension is basically adding this JS script and not doing anything server-side? If so, I totally agree having this as an extension is a better idea than a gadget. The gadget is meant as a proof of concept anyway and I think it's working great.
You should hold off on setting up the extension for a bit. I can create the relevant tickets and we can discuss + estimate them at our next estimation meeting. We might want to discuss if we're setting this up as an extension anyway, we might as well offload some of the API heavy-lifting to PHP.

In T186654#3998497, @Niharika wrote:

Hmm, I don't think we're going to want to be able to add new parameters for any template. How about we give them a message like the following?

Template:Dummy (redlink) could not be found. This may be because it doesn't exist or because it doesn't have TemplateData tags. Please fix that and try again. If you think you've found a bug tell us about it here (help page link).

Great idea. Done.

I'm glad we don't have to handle non-TemplateData templates. :)

So the extension is basically adding this JS script and not doing anything server-side?

Yep, doesn't need anything in PHP. The main good thing if it's an extension is that it'll make i18n easier.

If so, I totally agree having this as an extension is a better idea than a gadget. The gadget is meant as a proof of concept anyway and I think it's working great.
You should hold off on setting up the extension for a bit. I can create the relevant tickets and we can discuss + estimate them at our next estimation meeting. We might want to discuss if we're setting this up as an extension anyway, we might as well offload some of the API heavy-lifting to PHP.

Okay, sounds good.

I think this is ready for review. There's lots about the code that I'm not happy with, but am planning to improve in the next iteration. Tests are coming too (but not in its gadget form, probably, although that's not too hard if we want to go that way).

Test with this in your common.js on any wiki:

mw.loader.load( 'https://en.wikipedia.org/w/index.php?title=User:Samwilson/TemplateWizard.js&action=raw&ctype=text/javascript' );

It's a proof-of-concept, so we shouldn't worry about long-term code quality/stability for now.

@Niharika is PM'ing this project, so I'll just chime in with my personal 2¢. I tested with Template:Infobox_single on ENWP and this look looks good on first glance, nice work!

Yup, this looks good. Nitpicking a bit - we should use oo-ui-flaggedElement-progressive class for both the Use and Insert buttons. I'm wondering if we should do away with Use completely. I guess we can hold on to it for now because I imagine it does make things slightly easier.
And we should add the red/yellow/green colors for required/suggested/optional params as in the mock. It would make it a bit more cheery!

As for tests, we should hold back on those until we've discussed the making this into an Extension. I'm gonna create tickets for that soon.

Good point about flagging em progressive (I thought it was 'constructive' but I guess that's for different things). Done.

I'm not sure about the colours: all the suggested colours seem to have meanings:

M82 Color palette (Wikimedia Design Style Guide/WikimediaUI)

17

Hmm, good point. We can pick slightly different color shades...Maybe -
Required fields: #E04006
Suggested fields: #F99D31
Optional fields: #78AB46
If you have a different color scheme in mind, we can try that too. I'm not married to the red, yellow, green scheme. But I do want those headings to stand out a bit.

Colours added.