Page MenuHomePhabricator

Allow WikiEditor toolbar to update multiple existing sections at once, instead of update a single existing section at time
Open, Needs TriagePublic

Description

Hello!

Actually it's very easy to add multiple sections at once, as you can see from the default configuration of the jquery.wikiEditor.js.

In the other hand, it's not efficient to edit multiple sections at once because you need to fire the jQuery.fn.wikiEditor's addToToolbar method once per each edited group and, if you have multiple groups, doing so can raise graphical bugs (e.g. the textarea with the first lines covered by the toolbar, I think because of the too many resize triggers called in unpredictable order of execution).

Actual examples

The syntax for adding multiple sections at once is the following (aka multiple section syntax):

$( '#wpTextbox1' ).wikiEditor( 'addToToolbar', {
	sections: {
		newSection1: {
			type: 'toolbar',
			label: 'New section 1',
			groups: {
				newGroup1: {
					tools: {
						plus: {
							label: 'Click here to increment wikilove',
							type: 'button',
							oouiIcon: 'heart',
							action: {
								type: 'encapsulate',
								options: {
									peri: 'πŸ†πŸ†πŸ†πŸ†πŸ†',
								}
							}
						}
					}
				}
			}
		},
		// and so on for new sections
	}
} );

Note that you can't use the above syntax to update existing section>groups (e.g. you can't use the above syntax to add buttons in existing groups). If you do this, you will duplicate each edited section/group.

The syntax for editing a single existing section>group is the following e.g. adding a button in the existing advanced > insert (aka single section syntax):

$( '#wpTextbox1' ).wikiEditor( 'addToToolbar', {
	section: 'advanced',
	group: 'insert',
	tools: {
		toolName: {
			label: 'Click here to increment wikilove',
			type: 'button',
			oouiIcon: 'heart',
			action: {
				type: 'encapsulate',
				options: {
					peri: 'πŸ†πŸ†πŸ†πŸ†πŸ†',
				}
			}
		},
	}
} );

The proposal

We can apply one of these:

  1. Sections should be unique for each toolbar. Groups shuld be unique in each section. Introducing a "preserve existing section/group" logic into the multiple section syntax would allow every user to declare their buttons in existing sections in a very compressed and consistent way. Users wouldn't care about questions like Β«is this section already existing or I have to create it?Β» to choose how add a button to the toolbar.
  2. or we can add an optional flag into the multiple section syntax as e.g. preserveExisting: true that, when specified, avoid to duplicate an existing section/group. In my opinion this is not a good solution because we do not have the above gains.
  3. or something else