Commit graph

31 commits

Author SHA1 Message Date
Thiemo Kreuz 60b69c575e Use generic "outline item selected" event for top-level parts
This also means we have to move the declaration/documentation of the
event up one level into the generic "part" widget.

Change-Id: I1b803201f8955b58136ee7f37c04c01edcd47395
2022-07-19 11:05:32 +00:00
Thiemo Kreuz 58c19747da Move debounce check from outline into part widget class
This just moves code to an – in my opinion – more appropriate place.
Here we can't forget it.

Change-Id: I8fff83b1586fc14d762b324e5443611370470983
2022-07-18 12:48:45 +02:00
Thiemo Kreuz 6d41da0de7 Use short syntax for transforming one event into another
Change-Id: Id794f2b620edebd6eab71e3380ce1eeffcdc95ef
2022-07-12 11:54:04 +02:00
Thiemo Kreuz 9297428eca Improve test coverage of template dialog outline
This focuses on some scenarios that are
a) complex enough to be worth a test,
b) but simple enough so I don't need to spend hours on comming up
   with a test setup. ;-)

This patch also simplifies the ARIA related code in
MWTransclusionOutlinePartWidget a bit.
* Check 1 of the 3 ARIA configs only. Only having one is already
  helpful and should not be skipped.
* No need for the large conditional. setAriaDescribedBy() works fine
  with undefined.

Bug: T291157
Change-Id: I142782ec9b96147de64497f4f6a373eae05b9c8e
2022-05-04 12:01:58 +02:00
Thiemo Kreuz bc0a34b0ed Add and fix default values in parameter documentation
Same random finds while working on something else. I carefully
checked and made sure these methods are actually called without the
optional parameter.

Change-Id: Iab36fd130258322985b5d6e7f8e1f7b4ee235ba2
2022-02-21 13:19:21 +00:00
WMDE-Fisch ef87088198 Wire move/delete hotkeys to button functionallity
The behavior is now consistant with what would happen when the
buttons are triggered.

Instead of emitting a button click I directly wired the methods
that will by triggerd by the click. This might make it easier to
remove the old sidbar later.

To avoid movement when the buttons should be disabled, an
additional check was added to the onMove method. It's not identical
to the more complex check in the outlineControlsWidget, but should
be enough for our use case. The onDelete method already just does
nothing if nothing is selected.

Bug: T300971
Change-Id: I8a278c9657c91fd648944b5a8c1204c9fff75b7e
2022-02-08 15:41:01 +01:00
Thiemo Kreuz 66f56f6c88 Defer creating template parameter search when it's not needed
From the user's perspective this is the same as before: When a
template doesn't have any parameters, there is no search field. The
moment the first (undocumented) parameter is added the search field
appears.

This is just delayed now. The widgets are only created the moment
they are actually needed.

This saves loading time and memory, especially in a multi-part
transclusion with many zero-parameter templates.

This also makes it a lot easier to change the minimal number of
parameters from 1 to e.g. 4.

Includes reverting the flexible header composition done in
Ib050e30a50ef965c1524e977d3a600c3ff836774

Bug: T298259
Change-Id: Ied7541d8d5c0b478a439dd31ce072e634287f181
2022-01-19 11:23:34 +01:00
Adam Wight a244f510c4 Make sidebar header and search field sticky during scroll
The search field will stay at the top of the window while scrolling a
single template.  In multi-part transclusions, the header will also
be sticky.

Hides the template header in single-part transclusions.

Bug: T298618
Change-Id: Ib050e30a50ef965c1524e977d3a600c3ff836774
2022-01-17 16:09:54 +01:00
WMDE-Fisch c1c167a17f Make better use of the ARIA mixin
Bug: T295353
Change-Id: I7ccb1e771516df8198c6e07cbf37e9739bc0ed71
2021-11-18 15:21:47 +00:00
WMDE-Fisch 26cab3125d Only use aria description on multipart transclusions
Moving responsibility to the part widget to check if we're in a
single transclusion.

Bug: T295353
Change-Id: I61b7891c04eb729647e2600318a97987fd88cb90
2021-11-15 12:22:12 +01:00
Thiemo Kreuz 58f5882957 Implement basic Ctrl+Shift+Up/Down/Del support in new sidebar
Note this patch is somewhat incomplete. The feature fully works and
I would like to see this patch merged as it is. But whenever you
press one of the keys the focus is stolen by some element on the
right side of the dialog. This makes it impossible to e.g. press
Ctrl+Shift+Down multiple times. The idea is to work on this in the
next patch.

Bug: T290262
Change-Id: Ic67f2a696c94f1e5c71134d681161221aecbfdf6
2021-09-27 08:29:12 +00:00
jenkins-bot b5388fec52 Merge "Regression: Fix broken click on top-level template elements" 2021-09-17 11:49:08 +00:00
jenkins-bot 4478eb15d8 Merge "Update and fix all @param config and @cfg documentation" 2021-09-16 20:09:15 +00:00
Thiemo Kreuz 482f4152cc Regression: Fix broken click on top-level template elements
The previous patch Id314ee8 was incomplete. The event changed.
The id in the event is not guaranteed to be a top-level partId any
more, but can be a template parameter's id.

Note: "Parameter id" and "pageName" is the same. The fact that
these ids match is how the left and the right side of the dialog
communicate.

Bug: T289043
Bug: T291151
Change-Id: I391f0f8edb96398fd33a2e0b01003013c52776da
2021-09-16 10:48:09 +02:00
Thiemo Kreuz cb685d1216 Fix enter sometimes focusing the wrong template part
The behavior of the enter key in the new template dialog sidebar
is somewhat inconsistent. When pressing enter on the name of a
template it sometimes just doesn't work, but focuses something
else.

I realized this is because the message "The … template doesn't
yet exist." does not have a link. There is nothing to focus in
this element. The code just gives up and the selection returns
to whatever was selected before.

It works when there is a link in the template header. But this
is not even that useful.

Let's try to always focus the first parameter instead. The user
can still press Shift + Tab to focus the link to the template
page.

Bug: T289043
Change-Id: Id314ee8ebf47d387df08c7fb432094b6d8f7a3d2
2021-09-14 18:14:05 +02:00
jenkins-bot 1e4ef48393 Merge "Use OOUI 'classes' property instead of .addClass()" 2021-09-13 11:46:19 +00:00
Thiemo Kreuz 6cb287c225 Fix space bar on top-level template parts loosing focus
As a reminder (not part of this patch): Pressing enter on the name of
a template should select it, and jump to the content area on the right.
Pressing space (that's what this patch is about) should select as well,
but not move the focus.

The best way to test the behavior is with a multi-part template.

Bug: T285323
Bug: T289043
Change-Id: I97d77f43b231696f92ba6758a6b8feac34e02e6d
2021-09-13 10:34:28 +02:00
Thiemo Kreuz aa556e3ef8 Update and fix all @param config and @cfg documentation
I tried to review all of them. Some of the changes I did:
* Make sure the `config` parameter is not marked as optional
  when it is not.
* Make sure default values are mentioned.
* List individual `@cfg` options when it makes sense.

Note I don't list all options a class could accept (e.g. via all
its parent classes and mixins). That's too much. Instead I checked
how a class is actually used and list only these options.

Even then I don't list everything, e.g. unspecific options
like "classes" that can be used pretty much everywhere.

Change-Id: Idf4fbe1dc3608ace277df9e385f2f140df3a2f50
2021-09-12 12:35:27 +00:00
Thiemo Kreuz cdc168d32a Use OOUI 'classes' property instead of .addClass()
The 'classes' property is a OOUI interface. Personally, I like
this code style better.

However. It appears like the code style in this codebase is
somewhat mixed. It looks like the top-level .$element always
uses .addClass(), while other code uses the 'classes' property.
Should we unify this?

Change-Id: I9ecd75e22d00f06ffd707f766dc9e8d748ff9a37
2021-09-11 17:41:45 +00:00
Thiemo Kreuz 06cf00f4c6 Rename and document select/focus events in template dialog
I tried hard to come up with the best possible names. Some of the
criteria I used:
* Longer and more unique is better. This makes it much easier to
  e.g. search for the event name.
* The term "part" should only be used for top-level parts. While
  template parameters have a unique id, they are not a subclass
  of …TransclusionPartModel and therefor not "parts".
* BookletLayout manages "pages" via "page names".
  * The page names of top-level parts are identical with the part
    id, see ve.ui.MWTemplateDialog.getPageFromPart.
  * The page names of parameters are identical with the parameter
    model id, see ve.ui.MWTemplateDialog.onAddParameter.

Some code knows parameter ids, but not what pages are. Other code
knows page names, but not what parameters are. The transition
currently happens in the …OutlineContainerWidget. We might want
to move this point up to the …TemplateDialog. But I would argue
this is good enough for now and can be changed later, if needed.

Bug: T285323
Change-Id: Iab2805b3203988db400b67c8d00e48905fdc53dc
2021-09-01 16:23:59 +00:00
Thiemo Kreuz 7a8ad64cbd Fix click/enter on template parameters not focusing the input
This got lost in patch I20dbd2b.

Both events come from the same sidebar class. The difference
between the two is:
* selectPart is when the button representing a top-level part
  is clicked.
* focusPart is when a parameter name is clicked while the
  parameter is already checked.

Yes, this is confusing at the moment. Following patches will
rename, merge and split a lot of these events to be much more
self-explaining.

Bug: T285323
Change-Id: I0c6b53c93c712ff5e47c1beb5199d590cba7ab1a
2021-09-01 16:01:17 +02:00
Thiemo Kreuz 99558f9076 Connect focus event from BookletLayout to new sidebar
This makes sure the corresponding top-leve part is selected in
the list on the left when navigating the main area on the
right.

Bug: T289043
Change-Id: Id1b398e1786c4099d5b14fe88dd21a106269096b
2021-08-30 17:00:52 +02:00
Thiemo Kreuz 544bd5688c Allow selecting top-level parts in the new sidebar
This is mostly, if not exclusively visual, at the moment. The
actual state is still managed by the old sidebar.

I made the element OptionWidgets for convenience. This gives us
all the functionality we need (primarily setSelected and
isSelected), without to much clutter. However, I didn't made
the container a SelectWidget. This comes with to much stuff we
don't need at this level, e.g. cursor key navigation.

Bug: T285323
Bug: T289043
Change-Id: I20dbd2ba23ceaa9125947b25e037c0bb3c91a471
2021-08-27 18:22:37 +02:00
Thiemo Kreuz 5fcc862eb1 Remove dependency from new sidebar to the BookletLayout
This replaces I8cf9ecd.

Significant changes:
* The …OutlineContainerWidget doesn't need to know the
  BookletLayout any more. The only remaining resason to have
  this dependency was some focus management. This is now done
  via an event.
* Renamed an existing event to match the new one. The two
  really mean and do the exact same, even if they are
  triggered from two different places.
* Simplified some existing code.
* Updated documentation.

Bug: T288827
Change-Id: Ifcf2cadabf7fa4b8ecb72e3937003fab3b00d9bb
2021-08-20 10:07:03 +02:00
Thiemo Kreuz 095c891040 Remove unused code from ve.ui.MWTransclusionOutlinePartWidget
* getPartId() is unused.
* Use this.data instead of a custom this.partId.
* No need to store this.header as a property.
* Rename the event to "headerClick". That's enough when the
  event comes from a widget that does have the word "part" in
  it's name.

Bug: T274544
Bug: T288827
Change-Id: I8c70425403c6cd6a19e3a1cacb2b085e5c8b2e46
2021-08-19 11:03:44 +00:00
Thiemo Kreuz 766b220f5a Finishing touches to new template editor sidebar
In detail:
* Allow clicks on all elements in the new sidebar. This should
  focus the corresponding element on the right.
* Make all elements in the new sidebar tabbable.
* Fix MWTransclusionOutlineTemplateWidget.createCheckbox() to
  not need a temporary param object any more.
* Rewrite more code in MWTransclusionOutlineTemplateWidget to
  be shorter and easier to read.
* Fix MWTemplateModel.addParameter() to not do way to much
  stuff when a parameter already exists.
* Update code documentation.
* Use more specific, less ambiguous variable and method names.

Bug: T274544
Change-Id: Iaf6f7d1b0f7bf0e9b03eb86d01f3eceadece6fe4
2021-07-15 08:40:35 +00:00
Thiemo Kreuz ff9f8a9e2d Focus template editor elements on click in the new sidebar
Clicks on the left side now focus elements on the right
side.

This patch also simplifies the …ContainerWidget constructor.
The config parameter should only be used for "OOUI things"
that are needed by subclasses and mixins. But the parameters
we have here are not "UI things".

Passing them as config passes them to classes where we don't
know what they do with it. What probably happens is that
some class keeps a reference to the entire config object,
which doesn't have a benefit and possibly blocks garbage
collection.

Bug: T274544
Change-Id: I0c0e4a1ba59dcb43141338ffe939c9c6783e000d
2021-07-15 08:40:28 +00:00
Thiemo Kreuz eb1f1e28a3 Make new template editor sidebar items actual ButtonElements
Actually reusing this OOUI mixin gives us a lot of well
developed functionality we need anyway. Most notably proper
event management, e.g. click events.

The number of CSS properties we need to override is managable,
I would argue. Let's see:
* Our buttons are not inline-elements, but should use the full
  width.
* No focus-border left and right for the same reason.
* We want much more inner padding.
* We want a stronger hover effect.
* We need to fine-tune the position of the icon. This is
  because of the inner padding.
* Need to get rid of a negative margin that's only relevant
  for inline-buttons.

I currently feel like the benefits are worth living with
slightly more brittle code. Note that we can undo this change
any time because all this is well encapsulated in this new
class.

Bug: T274544
Change-Id: I33f275a958964d49e803e56bf74a6fa961093da1
2021-07-14 13:31:40 +02:00
Thiemo Kreuz 170ca9d58a Reuse generic button widget for elements in the new sidebar
This introduces another generic "button-like" class that can
be reused in multiple places in the new sidebar. The main
change in this patch is the "add more information" button
which is now an instance of this new class as well.

This patch also simplifies over-complicated setup code in
related widgets.

Bug: T274544
Change-Id: I0cfe7675d02fdd5c5dc8d9198bb3f4aec9abf397
2021-07-13 17:23:27 +00:00
Thiemo Kreuz 31904688df Update new sidebar when moving template parts up/down
The new sidebar now updates accordingly when elements are
moved around.

Bug: T274544
Change-Id: Ic6bc3484c54523aa4edc6b48a843c47059569061
2021-07-13 10:18:20 +02:00
Thiemo Kreuz a1384f34f3 Add template outline widgets for all content types
The two new widgets are pretty trivial now, thanks to the base
class.

Note there is still no code to delete the widgets. That's also
why you will always see a placeholder widget at the top. This
will be fixed with the next patches.

This patch also renames most of the "…TemplateOutline…" classes
to "…TransclusionOutline…" The reason is that these widgets are
not for a single template, but part of the container widget for
a more complex transclusion (i.e. a sequence of multiple
templates and wikitext snippets).

Bug: T274544
Change-Id: If4219b0b8ad4d1969ab1ec5ec4db0728811bab35
2021-07-12 09:19:06 +02:00
Renamed from modules/ve-mw/ui/widgets/ve.ui.MWTemplateOutlinePartWidget.js (Browse further)