Grants:IdeaLab/Build/Tools

IdeaLab MakeSpace Current - Sprint planning - Phabricator - Translation - Meeting notes - Idea toolkit - Portal redesign - Maintenance Older - Gadget specification - Notification/messaging - User scenarios

Specifications for tools to help facilitate activities in IdeaLab.

These tools will also be repurposed for Individual Engagement Grants, and Travel & Participation Support, Learning Patterns and more.

Rationale

See also Grants:IdeaLab/Build/March-June_2014_sprint_plan#Goals

We want to make the experience of participating in the IdeaLab easier and more engaging, so that we can elicit more ideas from a larger and more diverse group of Wikimedians. We also want to make it easier for people to realize their ideas—as grant funded projects, volunteer-driven initiatives, or even research projects. A few well-placed technical tools will help us streamline existing workflows and encourage collaboration.

Not every part of the IdeaLab user experience needs to be automated or assisted by special tools. Basic interactions (such as editing or commenting on an existing idea) can be accomplished by clicking the "edit" button. However, other interactions that many users might find confusing or tedious can be gadgetized without disrupting the editing experience for other folks who want to edit the wiki in the normal way.

Our decisions on which aspects of the IdeaLab experience to support with special tools focus on these types of user actions:

• actions that are performed frequently
• actions performed by users in many different roles
• actions that are commonly performed by inexperienced editors
• actions that are unfamiliar to most users
• actions that require editing complex markup
• actions that are meant to be performed quickly
• actions that require a series of distinct steps

Add Me gadget

A gadget that lets you quickly and easily show your support for something presented on a wiki-page, without leaving that page or editing markup directly. Gadget needs to be built flexibly for multiple uses: we should be able to deploy this to different sorts of pages: IdeaLab ideas, Grant proposals, learning patterns, etc.

Pages

• Meta:AddMe: documentation
• Meta:AddMe/Config: translatable configuration file for outputted page text (endorse/join message prefix, output section headings)
• Meta:AddMe/InterfaceText: translatable configuration file for the text elements in the dialogue box
• MediaWiki:Gadget-addMe: gadget description page
• MediaWiki:Gadget-addMe.css: gadget css
• MediaWiki:Gadget-addMe.js: gadget javascript

old pages (to be deleted)

• add pages you would like to be deleted, here

Current use case for Add Me

Primary

Joining and endorsing an idea on the IdeaLab. See Grants:IdeaLab/Build/March-June_2014_sprint_plan#Join_.26_endorse

Secondary

Endorsing a learning pattern, research project, IEG proposal or TPS proposal.

Add Me Specification: Endorse

A JavaScript gadget that displays a single dialog box in which the user enters an endorsement message to be added to a section of the page they're on, along with their signature.

requirements (out of date)
Workflow requirements The dialog box is invoked when the user presses a button (or clicks a link) on a wiki page. DoneThe dialog box can contain short, simple instructions. Half-done/On trialThe user can cancel the process easily, for example by clicking a cancel button, or clicking the wiki page outside the dialog box. Unsaved input is discarded. After the user has completed all required fields and clicked the complete button in the dialog box, the content they entered can be: Doneappended to the existing contents of a specified section of a specified wiki page (endorse use case) after the edit is committed: Donethe page is purged/refreshed in the user's browser. Done after refresh, a post-edit feedback message pops up, telling the user that their action has completed successfully, and directing their attention to the relevant section of the page Done the page is added to the user's watchlist Done Gadget displays a descriptive error message if the form fails to submit or if the page does not save (for example, if there is an edit conflict). Configuration requirements Not doneThe gadget can be enabled for logged-in users only Special fields in the dialog box can contain some kinds of validation, including: Done the free text field can require a wiki signature (‘~~~~') message before the form can be submitted. The gadget uses an external configuration file to specify elements of the user interaction and information display that can be customized to create different workflows on different portals. Examples of elements that should be configurable include: The display text of the dialogue box, including DoneThe box title DoneThe hint text in the text field DoneThe description text (below title) DoneThe display text of the “submit” button (e.g. "endorse", "join") DoneThe display text of the "cancel" button DoneThe post-edit feedback message DoneThe error message DoneThe name of the section that the endorsements are appended to Removed requirements for 'endorse' use case Rejecteda record of this action is appended to an event log on a separate wiki page. Add Me buttons on multiple pages within the same portal and/or namespace that use the same instance of the AddMe gadget (share a config file) record to a shared event log. (both use cases) Rejected a free text form field that can be character limited (e.g., no more than 140 characters) Rejecteda list of options the user can choose from (single or multi-selection), pre-populated with names associated with specific categories that appear on the page the gadget was invoked from RejectedThe form fields that are displayed in the dialogue box RejectedThe location of the event log page (e.g. Grants:IdeaLab/Ideas/Endorsements, Grants:IdeaLab/Ideas/Joiners) Notes RejectedWe may want to create this gadget as a single-guider Guided Tour. Potential advantages of working within this existing framework include reusability, decreased development time, built-in eventlogging, and built in tooltips (useful for providing contextual post-edit feedback messages). Potential disadvantages include unanticipated constraints the framework may impose on our ability to build the tool according to our needs. For an example of a single-guider tour, see this page about Microsurveys. Not done There needs to be a graceful fallback. Example, if the gadget is not enabled for user (or if they have JS disabled), clicking the "endorse" button triggers a preload/editintro workflow where the user can add their signature and comment to the #endorsements section of the page in an edit window using plain wikitext. This is the current workflow for endorsing learning patterns. This will be taken care of by the button template button template. If Javascript is enabled for the user's browser, clicking the button will activate the gadget. If not enabled, clicking the button will send the user to the section of the page for endorsements (e.g. Grants:IEG/Heather's_test#Endorsements).

Add Me Specification: Join

A JavaScript gadget that displays a single dialog box in which the user selects from a list of roles in which they can join a project, then enters a message to be added to the "Participants" section of the page they're on, along with their signature.

requirements (out of date)
Workflow requirements The dialog box is invoked when the user presses a button (or clicks a link) on a wiki page. The dialog box can contain short, simple instructions. The user can cancel the process easily, for example by clicking a cancel button or an 'x' in the upper right-hand corner of the box. After the user has completed all required fields and clicked the complete button in the dialog box: the content they entered can be appended to the existing contents of a specified section of the page they are on. The role they joined as is pre-pended to their message text (for example, "Joined as Researcher.") in bold text. If a section with the specified title does not exist, the section is created as a second-level heading (== Participants ==) appended to the end of the page. their username is added as the value of an empty parameter of the specified type within the infobox template. The username is added as a wikilink of the form [[User:Username|Username]] after the edit is committed: the page is purged/refreshed in the user's browser. after refresh, a post-edit feedback message pops up, telling the user that their action has completed successfully, and directing their attention to the relevant section(s) of the page the page is added to the user's watchlist if the form fails to submit or if the page does not save (for example, if there is an edit conflict), the gadget displays a descriptive error message Configuration requirements The gadget can be enabled for logged-in users only Special fields in the dialog box can contain some kinds of validation, including: a single-select list (for example, radio-button style) of available roles in which they can join the project. Roles appear in the list if: They are among the role parameters that the gadget recognizes (specified in config file) There is at least 1 empty parameter of that type in the template (extra parameters will be numbered, like researcher, researcher2, researcher3...) a multiline text field that can require a message before the form can be submitted. a single-line text field that can require a generic role title (if generic roles are enabled and the user selects the generic role from the available roles) The gadget uses an external configuration file to specify elements of the user interaction and information display that can be customized to create different workflows on different portals. Examples of elements that should be configurable include: The box title The hint text in the text field The description text (below title) The display text of the “submit” button (e.g. "endorse", "join") The display text of the "cancel" button The post-edit feedback message The error message The name of the section that the join message is appended to (for example, "participants") The display title ("Researcher", "Designer") of all available roles The infobox parameter (researcher=, designer=) of all available roles The sticker icon of all available roles Whether a user can join as a generic "participant" role The title of the generic role ("Participant", "Team member", etc) The infobox parameter of the generic role The sticker icon of the generic role Removed requirements removed requirements go here Notes notes go here

Bugs (out of date)
Bugs from v1 endorse gadget The button seems kind of large (too much green around the word). Done Needs a space added between comment and signature (right now they run together when saved). Siko (WMF) (talk) 17:36, 28 April 2014 (UTC) Done The config file setup says IEG, but this text is actually for IdeaLab (I'm not sure if I'll break something by changing it myself in the config file) Siko (WMF) (talk) 17:36, 28 April 2014 (UTC) Done When logged out, clicking the button does nothing. Are we not allowing IPs to endorse? I think that's fine, but an error message telling them to log-in would be good in that case. Siko (WMF) (talk) 17:36, 28 April 2014 (UTC) Sbouterse (WMF), that's because it's currently implemented as a userscript that only works if you have installed it. I think that once we make it a gadget, we should allow IP editors to endorse. However, we may want to make that a configurable option, because for some use-cases (like "join this idea") we may want to only allow logged-in users to use the gadget. Jmorgan (WMF) (talk) 21:18, 29 April 2014 (UTC) Not done Ahhhh yes, of course. I don't think we need to make this configurable - IPS can endorse things everywhere else now, it is likely ok if our gadget allows same, though it would be best for it to warn the person before saving in case they just forgot to login :) Want to add this to the spec? Siko (WMF) (talk) 16:19, 30 April 2014 (UTC) Done The button doesn't do anything on Firefox for me, even when logged in. Siko (WMF) (talk) 17:36, 28 April 2014 (UTC) Hmm... it worked fine for me on Firefox 20.0 (Mac) Jmorgan (WMF) (talk) 22:17, 29 April 2014 (UTC) I'm on same FF 2.0 for Mac, but perhaps I've got some special add-ons that are blocking it. No worries, as long as it works for others. Anyone else testing other browsers? Siko (WMF) (talk) 16:19, 30 April 2014 (UTC) Done When I add a signature to my endorsement, the username shows up after the timestamp, rather than before. See my two endorsements on the test page from 20:36 and 20:38 today. Jmorgan (WMF) (talk) 20:39, 29 April 2014 (UTC) Done When I try to re-mark the config.js page for translation, I get an "Error of type MWException" Jmorgan (WMF) (talk) 20:55, 29 April 2014 (UTC) Done Need to be able to add the <languages /> tag to endorseConfig.js, so that a list of existing langcode subpages is displayed (see top of Grants:IdeaLab for an example. Jmorgan (WMF) (talk) 21:12, 29 April 2014 (UTC) Done The text box within the "Endorse" dialog box can be expanded horizontally beyond the edge of the dialog box border by clicking and dragging the lower-right corner. Consider revising so that the text box can only be expanded vertically, not horizontally. Jmorgan (WMF) (talk) 21:20, 29 April 2014 (UTC) Done In the edit comment for an endorsement, here is no whitespace between "Endorsed by" and the username. See the edit history of our test IEG for examples. Jmorgan (WMF) (talk) 17:43, 2 May 2014 (UTC) The gadget needs to ignore whitespace characters around the section heading. The gadget should read == Endorsements == and ==Endorsements== as equivalent, just like the MediaWiki parser does. Jmorgan (WMF) (talk) 17:43, 2 May 2014 (UTC) When the gadget creates an "Endorsements" section on a page that did not previously have one, it adds a lot of whitespace characters after the first "==". See the endorsements section of our test TPS proposal for an example. Jmorgan (WMF) (talk) 17:43, 2 May 2014 (UTC) Bugs from v1 join gadget Done "Your comment will be signed..." should be slightly larger and slightly closer to the text box. Done The entry under participants should start with the role bolded.. Volunteer I love this idea and I want to help! heather walls (talk) 05:59, 28 May 2014 (UTC) Done The selection box should have the same left side padding as the text box. Done edit summary says "Joining message from Heatherawalls" and "Heatherawalls joined the project". Should it say "Joined as a ...." (the rest of the listing says who it is). Done I signed up as a volunteer but didn't show up in the infobox. When I tried it again I showed up twice. Done When I removed all the roles from the actual page (except researcher =) there was no listing for a volunteer. Then when I hit the button it told me I could be a volunteer but not a researcher. After that saved I could choose researcher or volunteer but the infobox does not say it is looking for a volunteer. However many times I added myself as a volunteer, I didn't show up in the infobox. It looks like when it adds a volunteer to no volunteers that it doesn't know how to make a new number. Done Still doesn't appear to be pulling all the strings from the config files - Siko copyedited User:Jeph_paul/endorseConfig and User:Jeph_paul/joinInterfaceMessages, not sure why but some of the strings still don't match the text in those files. Jeph, please test with closer look at the strings that are supposed to be displayed & confirm when all appears to be working correctly on your end. Done There should not be a comma after the role Volunteer and before the comment. heather walls (talk) Bugs combined Add-me gadget (pre-deploy) Done I erased the section headers and after adding myself as a participant it did not create a section header. Done I was not thanked for joining or endorsing. Done I was thanked for my second endorsement but it was placed under the participants, not endorsements. Done There are two spaces between my role sign up and the thing above it. Done Joining as a participant's 2 edits, summaries should read: "Adding my name to the participants section" and "Adding my name to the infobox" Done "Volunteer" should always show up in the bottom of the infobox, below "this idea could really use..." but it doesn't. (this may be probox bug) Done The thank you for my 3rd endorsement points to the first one. Done While we're at it, can you remove half of the padding from both sides of the main popups? Make it visually closer to the infobox. Done My dropdown for join doesn't have roles (just arrows): Grants:IEG/New_Features Done "How would you like to help this project?" now looks squished visually between the role box and the text box. There are 2 spaces between my endorsement & the section header above it (note: this happenswhen it was creating the first endorsements section on the page, when adding to a list of existing endorsements the spacing is correct. see Grants:IEG/New_Features#Endorsements) One extra line is being added by the backend when a new section is created using the API. Originally there were 2 lines, the extra one from the code has been removed. Done The edit summary appears to be going into the section name rather than the edit summary (at least for join, please also test for endorse when fixing) (see: Grants:IdeaLab/Jeph_test#ParticipantsAdding_my_name_to_the_participants_section. Bugs from Add-me gadget in production Loading bar/spinner needed Done Title in both join and endorse windows show text as "Join Comment" and "Endorse Comment" (see Heather's email screenshot) Done When logged out, I'm not seeing the agreed-upon error messages (although I do appreciate that the buttons still work for IP-siko). for 'join', the default role (the one you can always join as) should be configurable, not "volunteer". Done Error styling not matching the styleguide For Learning Patterns, a new section header is created every time the user endorses (see Grants:Learning_patterns/test) For Learning Patterns, the user's browser does not scroll down to the endorsements section when they endorse (see Grants:Learning_patterns/test) AddMe sometimes deletes parts of Probox template when you try to join. See this revision Jmorgan (WMF) (talk) 23:40, 25 July 2014 (UTC) can only join as volunteer sometimes, even when there are other open role params (see same revision as above, and also the state of the page at the previous revision) Jmorgan (WMF) (talk) 23:40, 25 July 2014 (UTC) when first endorsement created the "Endorsements" section, there was no edit comment. Edit comment should be specifiable in config, and should be descriptive (example: "endorsing this idea"). See this revision Jmorgan (WMF) (talk) 23:40, 25 July 2014 (UTC) Done When endorsing this page, my endorsement got saved, but I got no post-edit feedback (wasn't moved to the section, no bubble appeared). Appears this happened because the first endorsement in the section (above mine) was missing the bullet point star. Siko (WMF) (talk) 18:20, 21 August 2014 (UTC) add bugs here

Form wizard

A wizard that provides a structured, step-by-step workflow for creating a new wiki-page and populating it with content.

As with AddMe above, this wizard should be made modular and extensible so that it can be adapted to other contexts beyond the initial use case (IdeaLab, TPS, IEG, PEG).

Pages

• Meta:FormWizard: end-user documentation
• configuration pages (one per portal): translatable configuration file for specifying the interface text, form elements, default output values, and portal-specific configuration requirements

• Meta:FormWizard/Config/IdeaLab
• Meta:FormWizard/Config/Learning_patterns
• Meta:FormWizard/Config/TPS
• Meta:FormWizard/Config/IEG
• Meta:FormWizard/Config/PEG
• Meta:FormWizard/Config (default config)

• MediaWiki:Gadget-formWizard: gadget description page
• MediaWiki:Gadget-formWizard.css: gadget css
• MediaWiki:Gadget-formWizard.js: gadget javascript

Test pages

Pages with a functional "create this (Idea/Request/Pattern) button"

• Grants:IEG/New_Features
• Grants:IdeaLab/Build
• Grants:Learning_patterns/test
• Grants:TPS/Test

Usage

1. Create a new IdeaLab idea page, and a /Toolkit subpage that contains useful information for developing the idea 2. Expand that page with new sections and infobox params, to turn an Idea into a grant proposal

Use cases

• Grants:IdeaLab/Build/March-June_2014_sprint_plan#Creating_an_idea
• Grants:IdeaLab/Build/March-June_2014_sprint_plan#Kit_for_expanding_an_idea
• Grants:IdeaLab/Build/March-June_2014_sprint_plan#Turning_ideas_into_project_plans

Form wizard specification: creating an idea

A JavaScript gadget that displays a series of dialog boxes in which the user enters structured input to create a new wiki page using a small number of standard form elements.

requirements (out of date)
The first step of the workflow is invoked when the user presses a button or clicks a link on a wiki page. for the IdeaLab, the link/button will be displayed on Grants:IdeaLab/Ideas If the user is not logged in, they will be asked if they would like to log in before creating their idea. If they click "log in", the dialog box will close and they will be redirected to the login page. If they click "Continue anyway" they will continue to a second dialog box, which will be the first step in the idea-creation process. Each dialog box represents a distinct step in the page-creation workflow. In the first step, you add content. In the second step, you add additional information, like images and roles. The user can cancel the process easily in two ways: clicking a 'cancel' button within the dialogue box, or by clicking an 'x' in the upper-right-hand corner of the dialogue box. Step 1 Basic information Idea title and infobox summary (required), problem statement (optional), solution statement (optional) The title of the page appears both in the page path and in the project= parameter of the infobox. Example: "Grants:IdeaLab/My_cool_project", "project=My cool project". The namespace and path of the page that preceeds the title (example: Grants:IdeaLab/) is specified in the Form Wizard configuration file The title field has a 60 character limit Summary. A text box with a short summary of the page that will appear in the summary= parameter of the infobox. We will impose a 120-character limit on this summary, to encourage people to be succinct. Wikilinks and other basic wiki markup will be supported. Placeholder text like please write a short summary of your idea for the infobox. What problem does this solve? A more detailed description of the problem, issue, or situation the idea is intended to address. No character limit. Wikilinks and other wiki markup will be supported. Placeholder text: please summarize the problem this idea is intended to solve. What is the solution? A more detailed description of the solution the idea provides. No character limit. Wikilinks and other wiki markup will be supported. Placeholder text: please summarize the solution you are proposing. Step 2 Additional details Idea roles (optional) and Icon (optional) Roles. The user will select which roles are necessary for their idea "project". They can select as many of the available roles as the want. For each selected role, they will be prompted to enter how many people they would like to allow to join that role. The corresponding number of parameters for that role will be populated in the infobox. For example, if the user selects 1 'researcher' and 2 'community organizer', there will be one open researcher= parameter and two open community organizer parameters (community_organizer= and community_organizer2=) in the infobox when the page is created. The 'volunteer' role will not be one of the choices. Even if the user does not select any other roles, The more_participants= parameter in the infobox will be set to YES by default, which will display the 'join' button, allowing people to join as volunteers. Users will have to manually change this parameter to read 'NO' in the infobox after they create their idea if they do not want people to be able to join through the 'join' gadget. Icon. The user will be able to select an icon image for their project, which will appear in the infobox. The user pastes the filename of an image that is hosted on Wikimedia Commons into a single-line text field. The image filename will be populated in the image= parameter of the infobox when the page is created. There will be a hyperlink to Wikimedia Commons in the dialog box, which when clicked will open the Commons main page in a new tab or window (so that the user doesn't lose what they've entered so far). Once the page is created After the user has gone through all required steps in the workflow, filled in all required fields, and clicked 'complete' button in the final dialogue box, a new wiki page is created. the user is automatically redirected to the page they created the new page is added to the user's watchlist a post-edit feedback message pops up, telling the user that their action has completed successfully, and directing their attention to relevant information on the page A 'toolkit' subpage with the title /Toolkit, which contains useful information about next steps for expanding or advertising the idea, finding collaborators, project planning, etc. This page will be linked to in the infobox. Other information about the Idea is populated in the newly-created page by default when the page is created; the user does not have to input this information. Content that is populated by default includes: Section headings, transcluded templates, and basic categories of the new page are populated from a page template that is specified in the Form Wizard configuration file (similar to the current Idea-creation workflow in the IdeaLab). The user's username or IP address (if not logged in), which will be automatically added to the creator= parameter in the infobox, and wikilinked (example: creator=[[User:Jtmorgan|Jtmorgan]]) The date and time the page was created, which is added to the timestamp= parameter in the infobox.

Form wizard configuration

The gadget uses an external configuration file to specify elements of the interaction and information display that users will want to customize to build different workflows.

requirements (out of date)
All display text of the dialogue box (step titles, instructions, etc) will be specified by the form creator. The display text of all buttons in the workflow will be specified by the form creator. The post-edit feedback message will be specified by the form creator. a namespace will be specified by the form creator. Pages created by the wizard will be in this namespace. a portal page will be specified by the form creator. Pages created by the wizard will be sub-pages of this page. generic page categories will be specified by the form creator. the wizard can have multiple steps a timestamp is automatically generated when the page is created. It goes in timestamp field of infobox. a creator (username or IP address) is automatically generated. It goes in creator field of infobox. a page template will be specified by the form creator. Pages created by the wizard will use this template. an infobox will be specified by the form creator. The infobox must accept at least 4 parameters: creator, project, summary, timestamp. the infobox will be placed in the top section of the created page. a talkpage template will be specified by the form creator. This template will go at the top of the project talk page, which will be created when the project page is created. If the form creator elects to create a subpage of the project, they will specify the name of that page and the subpage template to use in the config file. Step 1 A dialogue box for setting required fields for infobox, plus any additional fields the form creator specifies. The first step contains two mandatory fields that elicit required information from the user. title (used in project field of infobox and in page title) summary (used in summary field of infobox) Additional single and multiline text fields, and multi-select checklists may be added. The wizard returns all user input in plaintext. Wikimarkup is allowed. Step 2 A dialogue box for adding and populating additional infobox parameters and page sections. This step is optional. The form creator designates whether they want to have a one or two step wizard in the config file. Additional single and multiline text fields, and multi-select checklists may be added. The wizard returns all user input in plaintext. Wikimarkup is allowed. Form elements single-line text field multi-line text field numeric stepper multi-select option list dropdown single-select option list checkbox multi-select option list thumbnail image (static) text with hyperlink (static; target="_blank") Adding additional multiline text fields to steps 1 or 2 Either dialog boxcan also contain any(?) number of multiline text fields. Text the user inputs here will go into page sections that are specified in the config. The form creator may set each field as required or optional in the config. The form creator may set a character limit for these fields in the config. The form creator will define the title of these fields in the config. The form creator will define the placeholder text of these fields in the config. Adding additional single line text fields to steps 1 or 2 Either dialog box can also contain any(?) number of single line text fields. Text the user inputs here will go into infobox parameters that are specified in the config. The form creator may set each field as required or optional in the config. The form creator may set a character limit for these fields in the config. The form creator will define the title of these fields in the config. The form creator will define the placeholder text of these fields in the config. Adding Multi-select checklists to steps 1 or 2 Either dialog box can also contain any(?) number of multi-select checklists. Text the user inputs here will go into infobox parameters that are specified in the config. The form creator defines the infobox parameters for each item in the checklist in the config. Items that the user checks will be added as infobox parameters when the page is created. The form creator defines whether they will allow the user to specify multiple, numbered parameters for each checklist item. The form creator will define the title of the checklist field in the config. The form creator will define the title of each checklist item in the config. The form creator may designate a default value for the parameters of the checklist items. If they do so, the default will be the same for all checklist items. If the do not define a default value, the parameters will be added to the infobox but left empty.

Form wizard specification: expanding an idea

Overall, this is very similar to the functionality of create an idea. The biggest differences are that

1. the gadget is adding sections to a page, rather than creating a new page.
2. the gadget needs to change the value of existing infobox parameter, not just add parameters
3. the gadget will be triggered by a button on the idea page itself, or on a subpage (For the IdeaLab, the subpage will be "Grants:IdeaLab/MyIdea/Toolkit")

requirements (out of date)
Adding sections to pages need to be able to add blank sections and sub-sections to the page need to be able to add sections and sub-sections with default values (such as HTML comments) which are specified in the config all sections are added to the end of the page, in the order they are specified in the config Updating infobox need to be able to specify certain infobox parameters in the config, and change their value to either a) a default value specified in the config, or B) a value that the user enters in the workflow for example, a user needs to be able to update the portal= and status= parameters when changing an IdeaLab idea to an IEG proposal

8/9 IdeaLab Hackathon feedback

What people liked

1. GrantsCat
2. join forces with the Hackathon. Get developers involved.

What people disliked

1. problem/solution parameters were too short (char limit)
2. summary was limited (char limit)
3. why is the solution right up front? the solution is what you are going to work on.

• perhaps solutions should not be mandatory?

1. roles are not entirely clear to people. (tooltip AND information page linked clearly in the Form Wizard)

Suggestions

1. sub-ideas for milestones?
2. when you create/join/endorse an idea, it should be added to your notifications

bug list (out of date)
Open bugs Done 'error-messageLength': 'You've reached the word limit', and 'error-notFilled': 'Please fill out this mandatory field', should be used for all forms (seems like more work for each form creator to make those configurable) Siko (WMF) (talk) 23:57, 7 July 2014 (UTC) comment: I actually haven't seen any of these messages pop up at all, in any of my tests. They are in the config, but I don't know if the feature has been implemented. Jmorgan (WMF) (talk) 22:42, 24 July 2014 (UTC) Not done in config, hidden fields should not always be within other field dictionaries (confusing) Jmorgan (WMF) (talk) 15:57, 15 July 2014 (UTC) Not done what is the difference between section & section-header in config file? Siko (WMF) (talk) 17:15, 8 July 2014 (UTC) Done user needs to be able to set value of params via a dropdown widget in the dialogue box. The dropdown will allow them to select from a set of values for the param: example: "goal=" could be set to "participation", "quality", or "readership". Jmorgan (WMF) (talk) 22:42, 24 July 2014 (UTC) Not done In the projectImage section of the IdeaLab config, the field 'link':'Search Wikimedia Commons for an image' appears to always create a link to Wikimedia Commons to the dialogue box. This should not be hard-coded: the user who creates the config should be able to specify both the display text AND the hyperlink address for any 'link' field. That will allow the 'link' field to be used in the context of other form elements. Jmorgan (WMF) (talk) 22:51, 24 July 2014 (UTC) UPDATE: I tried adding 'url' and 'link' params to the IdeaLab config file so that a link to the roles page was present in the stepper list. However, this change is not reflected in the FormWizard. Jmorgan (WMF) (talk) 18:49, 22 August 2014 (UTC) Done for IdeaLab, the /Toolkit page should be created before the Idea page, so that it is not redlinked in the infobox. Jmorgan (WMF) (talk) 23:24, 24 July 2014 (UTC) Not done Workshop bug. "Create an idea" button on Grants:IdeaLab/Ideas does not work for this account: User:Jon Harald Søby. The problem does not appear to be due to a character encoding issue, because other accounts with 'ø' in the username are able to trigger the "Create an idea" dialog box. It also does not appear to be a browser-specific issue, or an issue of end-user configurations to the browser, because the dialog box is triggered when Jon Soby is logged out, and when he logs in under other accounts. Jmorgan (WMF) (talk) 15:26, 18 August 2014 (UTC) Not done Workshop bug. titles with a '/' in them may break the page-creation workflow (note: bug reported, but not confirmed or duplicated) Jmorgan (WMF) (talk) 15:26, 18 August 2014 (UTC) Not done Workshop bug. Grants:IdeaLab/Gamified_Microcontributions_on_Wikipedia was 'created' twice within the same minute. When the idea was 'created' the second time, many page sections were duplicated. See the first and second revisions to the page. Jmorgan (WMF) (talk) 15:26, 18 August 2014 (UTC) Not done Workshop bug. Crossproject_Wikiproject_hub. Specified 1 researcher in initial idea-creation workflow. One person joined as researcher. Several other edits were made. Then, when someone joined as volunteer2, the researcher was deleted. Jmorgan (WMF) (talk) 15:41, 18 August 2014 (UTC) Closed bugs Done user-selected image should be re-sized so it displays as a small thumb in the interface Done pagename shows up as 'undefined' even though the title field of the infobox is filled in. Examples: Grants:TPS/Test/undefined, Grants:Learning_patterns/test/undefined Done 'back' and 'done' buttons too close together Done no error message is displayed if page you type into the title field already exists We wont display a message, instead we'll have the validation as part of the UI, tick mark or something else that Heather comes up with Done post-edit not displayed after page is created The user gets redirected to the new page, do we need one? Yes, and some way to draw attention to next steps Siko (WMF) (talk) 23:57, 7 July 2014 (UTC) Done Cleanup the dialog and closing it Doneimage setup (step2) isn't like Heather's mock at all - we're missing spots for various kinds of text & instructions, etc. Not sure where in config file those should go - please generate one for Idea to make it match mock. Siko (WMF) (talk) 23:57, 7 July 2014 (UTC) Done "Done" and "Next" buttons turn grey when you try to add a custom image Jmorgan (WMF) (talk) 15:57, 15 July 2014 (UTC) Done stepperList should not let people add negative values Jmorgan (WMF) (talk) 15:57, 15 July 2014 (UTC) won't fix. stepperList up/down arrows are VERY small. consider removing? Jmorgan (WMF) (talk) 15:57, 15 July 2014 (UTC) Done validated input in form fields yields a blue "X". It should probably be a Blue "check mark", yes? Done 'back'/'done', 'next'/'cancel' buttons are in reverse order (see Heather's mock for the correct ordering Jmorgan (WMF) (talk) 17:21, 21 July 2014 (UTC) Done "Thank you for creating your idea!" pop-up still appears on Grants:IdeaLab and Grants:IdeaLab/Build for JM (using Chrome for Mac) Jmorgan (WMF) (talk) 17:21, 21 July 2014 (UTC) Donehow do we create alternative to "Form" in start of each step (first text in each step appears to be hard-coded)? Siko (WMF) (talk) 23:57, 7 July 2014 (UTC) Done Role parameters shouldn't have 0 in the name (researcher0, designer0, etc). Is this fixable by changing the config? Jmorgan (WMF) (talk) 15:57, 15 July 2014 (UTC) Done timestamp not working Jmorgan (WMF) (talk) 15:57, 15 July 2014 (UTC) Done adding 'text-1' param to 'roleSelectionList' breaks the gadget--you cannot invoke the dialogue box by clicking 'create an idea'. See this revision Jmorgan (WMF) (talk) 17:21, 21 July 2014 (UTC) Done need to be able to specify which probox infobox to use. Done need to be able to set values for params in the config, that the user never sees: examples more_participants = NO, timestamp= ~~~~~ Done the formsGadgetConfig page gets very long very quickly, and is easy to break. Possible to store individual config dicts in subpages? Example: formsGadgetConfig/IdeaLab? Done need to be able to specify a subpage to create with the mainpage (substitute a template) in the config file

Probox Module

A configurable infobox framework built in Lua that is intended for use with the AddMe and Form Wizard gadgets. Probox provides an infobox framework that can be configured for multiple types of project pages such as IdeaLab Ideas, Learning Patterns, Grant proposals and Research projects. Each probox instance can support any number of named parameters, as well as numbered parameters (for the participants section).

The Module lives Module:Probox and the template at Template:Probox.

Related (non-Lua) examples:

• w:Template:Project_information
• w:Template:Infobox
• w:Template:Infobox_project
• Template:Editor_Engagement_Project

Features

1. add/remove categories based on parameter values
2. use numbered "role" parameters to display a list of participants in that role (volunteer1=, volunteer2=, etc)
3. display or hide "join" button
4. integration with AddMe gadget
5. advertise open roles (roles with open, numbered parameters in the infobox template)
6. set CSS styles at the level of the box, section, field, or text span
7. set CSS values for particular types of element globally
8. all interface text is translatable
9. provide default values for empty params
10. provide default values for required params which are left out of the infobox template
11. declare the order for all fields within section
12. unit testing infrastructure

Boxen

requirements (out of date)
Done Unfilled roles should be closer together vertically, maybe almost touching points (but not really touching). They should be vertically stacked, like the filled roles All native infobox notes and their styles should be accessible in one place. Content dicts should be separate for each template type all functions in main module should have detailed docstrings all dictionaries in Default, IEG, Patterns, and Idealab datasheets should have detailed docstrings step-by-step guide for creating a new probox mw-ui button click should trigger preload/editintro workflow if no JS. Workflow URL possibly stored in Probox datasheet? wikilink function equals-ignorecase regex function string.len(arg_val) > 0 function should be able to add categories based on any param isTemplateArg = true param in datasheet, to easily separate default display fields from ones the end-user controls add requirements/requests here

bug list (out of date)
Done "give feedback" link needs to point to the local talk page Done shouldn't have bullet points for unfilled roles Done unfilled roles should be listed in a vertical list, like filled roles Done }a role should always appear in the unfilled role list as long as there is at least 1 open param for that role in the infobox Done the "Join" button should only appear if more_participants=YES Done roles should be ordered Done image is optional Doneimage param should not be needed (currently causes script error) Done creator and member are the default kinds of participant ' Done volunteer' shouldn't be hard-coded Done determine if having an "arg" param in each field can be used to make the code simpler Done open roles should only display if more_participants = YES Done gives script error when called directly through invoke ([[Template:Probox/IEG|Example) UI buttons should be handled separately from images refactor "add categories" - make more general, and possibly use recursion here participant icon needs to be optional category should be a field in the bottom section should be able to make whole cta section optional (more_participants should not be required) "please add title" should happen when no title param or empty title param add bugs here

Internationalization

Each tool will need to support left-to-right and right-to-left languages, and interface elements will need to be translatable.

Notes

Users who do not have Javascript enabled within their browser, or who have turned the gadget off in their preferences, should be offered a fallback idea-creation workflow which is invoked by the same user action (button press). Example, if JS is not enabled for user, clicking the "create an idea" button triggers a preload/editintro workflow where the user can add basic information to a preloaded page template in an edit window, and then create the new page with that content.

See also

• IdeaLab sprint plan
• TPS sprint plan