Page MenuHomePhabricator

VE on Test Instance: Change behavior for adding/removing params
Closed, ResolvedPublic5 Estimated Story Points

Assigned To
Authored By
Lena_WMDE
Aug 28 2020, 3:12 PM
Referenced Files
F32360725: Params with checkboxes.png
Sep 23 2020, 9:51 AM
F32360693: Screen Shot 2020-09-23 at 11.44.33.png
Sep 23 2020, 9:44 AM
F32360620: Params in sidebar.png
Sep 23 2020, 8:43 AM
F32358015: Sidebar w trash.png
Sep 21 2020, 5:32 PM
F32357657: Param List - mult Templates.png
Sep 21 2020, 8:23 AM
F32357651: Param List - Sidebar.png
Sep 21 2020, 8:23 AM
F32254712: With TemplateData.png
Sep 10 2020, 5:25 PM
F32254710: Sidebar Specs.png
Sep 10 2020, 5:25 PM

Description

Tasks split out from umbrella ticket T260816: VE Dialog on the Test Instance: Sidebar and Dialog layout/behaviour changes

Requirements
For the sidebar:

  • Remove trashcan from small toolbar at bottom right of VE sidebar.
  • Update parameter list in sidebar
    • The sidebar will display all parameters defined for the template (in TemplateData), not just those that have been added in the template dialog.
    • The icon to the left of the parameter names is removed and replaced with an OOUI checkbox (unclear if you can use the entire widget, because only checkbox is clickable - see below). These are used to add and remove parameters to the invocation of the template, i.e. shown or removed from the main input section on the right.
      • Required parameters should have a disabled, selected checkbox and cannot be removed from the template.
      • Added parameters should have a selected checkbox
      • Un-added parameters should have an un-selected checkbox
      • Clickable area for the add/remove function is limited to the checkbox itself and does not include the name of the parameter. Clicking on the name of the parameters allows the user to jump to this parameter in the main input section on the right, and the cursor is inserted into that parameter's field (current behavior).
      • Current behavior should not be broken: The two scrollable windows should stay in sync. If the parameter is clicked then it should jump on the right side, but if on the right a new field is in focus the sidebar should also scroll to match and highlight the current parameter.
      • When a parameter is not yet added, then clicking on the parameter name adds it. Clicking on the name again though does not remove it.
    • If template has no parameters, show 'No parameters' text instead of checkboxes.

For the main input area of the dialog:

  • Remove the 'Add more information' dropdown at the bottom of the main input area, where parameters are currently added to templates. However, still allow this to appear at the bottom of the the main input area, if the user clicks the add parameter button in the bottom left menu bar.
  • Remove the trash icons which show next to the parameter name when it's "in focus"

Mocks

Params with checkboxes.png (889×621 px, 67 KB)

Ignore the search bar, this is implemented in T263474: VE Dialog on Test Instance: Search for parameters within a template

Checkbox: 20x20px
Parameter names: Body
16px padding between parameters and between param/template name

Related Objects

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes
Lena_WMDE set the point value for this task to 8.Sep 3 2020, 8:37 AM

When a template has hundreds of parameters, I worry that this might fall apart:

The sidebar will display all parameters, not just those that have been added. The parameter icon to the left of the parameter names is removed and replaced with "+"/"-" buttons (same buttons & behaviour as in the TemplateWizard sidebar). These are used to add and remove them to the template, i.e. shown in or removed from the main input section on the right.

Is there an affordance to search template names?

Not a blocker, I can implement as written and we'll see how it goes!

@ECohen_WMDE

Remove the 'Add more information' dropdown at the bottom of the main input area, where parameters are currently added to templates.

There needs to still be a way to add unknown template parameters. For example, when the TemplateData is incomplete and has not been updated to document a newly-implemented parameter.
I suggest we either leave "add more information", or have a button that does this.

When a template has hundreds of parameters, I worry that this might fall apart:

The sidebar will display all parameters, not just those that have been added. The parameter icon to the left of the parameter names is removed and replaced with "+"/"-" buttons (same buttons & behaviour as in the TemplateWizard sidebar). These are used to add and remove them to the template, i.e. shown in or removed from the main input section on the right.

Is there an affordance to search template names?

Not a blocker, I can implement as written and we'll see how it goes!

Yes, please implement as written. I'm a bit less worried, as this is already the behavior in TemplateWizard and it works quite well (you can try it out there already if you're curious). The current dropdown actually makes it much harder to work with templates with many parameters (it's hard to get an overview and to add/remove them to understand each parameter).

@ECohen_WMDE

Remove the 'Add more information' dropdown at the bottom of the main input area, where parameters are currently added to templates.

There needs to still be a way to add unknown template parameters. For example, when the TemplateData is incomplete and has not been updated to document a newly-implemented parameter.
I suggest we either leave "add more information", or have a button that does this.

Yes, I've considered this. There is still a way to do this by clicking on the 'parameter' icon/button at the bottom of the sidebar. Please remove the dropdown and add information completely. I guess the question is, what shows when you click on it? I guess clicking this button just brings back the same 'Add more information' box - we should consider renaming this but we can do that in a different ticket.

Screen Shot 2020-09-07 at 13.06.26.png (242×524 px, 20 KB)

Yes, please implement as written. I'm a bit less worried, as this is already the behavior in TemplateWizard and it works quite well (you can try it out there already if you're curious). The current dropdown actually makes it much harder to work with templates with many parameters (it's hard to get an overview and to add/remove them to understand each parameter).

Sounds good, thanks for the confirmation!

I guess clicking [the add unknown parameter] button just brings back the same 'Add more information' box - we should consider renaming this but we can do that in a different ticket.

Screen Shot 2020-09-07 at 13.06.26.png (242×524 px, 20 KB)

Perfect, this should be easy.

Also want to add a note - that when the parameter name style changes, the truncation should stay for parameter names which are too long. Just wanted to make sure this doesn't get lost during the changes. Here is a screenshot of the current situation:

Screen Shot 2020-09-07 at 18.14.23.png (397×222 px, 24 KB)

Lena_WMDE updated the task description. (Show Details)
ECohen_WMDE renamed this task from Change behaviour for adding/removing params to VE on Test Instance: Change behavior for adding/removing params.Sep 23 2020, 9:44 AM
ECohen_WMDE updated the task description. (Show Details)

We may have been wrong to split this work up before looking at the implementation. The left sidebar including buttons is a standard "outline" view, and will need to be completely replaced to change behavior as desired.

The only possible change given the existing components would be to disable the trash icon, showing it in gray.

So, I'll create the new sidebar and will probably have to stitch some of these tasks back together.

WIP branch is pushed as https://gitlab.com/wmde/mediawiki-extensions-VisualEditor/-/commits/new_sidebar

We have to rewrite the entire BookletLayout, which is probably for the better.

Minor question about behavior: what should we do if the template invocation is missing values for some of the template's required parameters? With the checkboxes disabled, it will be impossible to add those. So should we automatically add empty parameter fields for every required param?

It's generally considered bad behavior for a wiki editing tool to change wikitext in unexpected ways just by opening and saving a page / dialog, so we would possibly want to *not* update these empty parameter values, even if they are required and we displayed the fields. (In a further complication, there would be no way in this case to specify an explicit empty value.)

Update: VisualEditor already has the behavior described in my last comment. Required parameters are always included in the parameter value pane.

awight changed the point value for this task from 8 to 5.Oct 6 2020, 11:58 AM

We need to decide on an order for the parameters. I see we declined T261505: Group and order params by priority in sidebar, and presumably we want to stick with the natural order of parameters? So, anything listed in paramOrder and then the remaining parameters in alphabetical order?

We need to decide on an order for the parameters.

It's trickier than I thought. Currently, the parameters show up in the order given in the template invocation. But this isn't easy to integrate with the paramOrder or alphabetical order, so we might have to change the order of both the content and the sidebar. Or have just the enabled parameters displayed first, in their order of appearance in the wikitext.

When a new parameter is enabled, should it insert into the correct place in both the content and outline views, for example according to paramOrder? There's a similar question when removing parameters. Both concerns lead me to think that the parameters should always appear in a fixed order.

For now, I'll order alphabetically. But it's a really unsatisfying experience, for example my test template starts with several pages of "1blankname", "1blankname1", etc.

Remaning work is to:

  • focus newly added fields
  • Trash can on new unknown field is broken.
  • Decide parameter order (can be split into a follow-up task)
  • Deploy new_sidebar to the demo server

@ECohen_WMDE @Lena_WMDE Should there be a special style for manually-added parameters? I just noticed that we need to:

  • Include any undocumented parameters present in the wikitext, in the sidebar.
  • Sort undocumented parameters the same as the others, for example "foo" would be inserted between "errors" and "footnotes".
  • When an undocumented parameter is unchecked, its outline element should disappear. This different than the other parameters, which will stay in the outline view when unchecked.

Note that I've broken the multi-template use case with this code. I'm going forward on the assumption that T263414: Change behaviour for adding/removing templates will rewrite most of that logic anyway.

I've deployed to the test server. I'll create follow-up tickets for the issues discovered while doing this task.

Lena_WMDE claimed this task.
Lena_WMDE moved this task from Demo to Done on the WMDE-QWERTY-Sprint-2020-10-07 board.
Lena_WMDE updated the task description. (Show Details)
Lena_WMDE updated the task description. (Show Details)
Lena_WMDE updated the task description. (Show Details)