Find the easiest way for users to get&set the toolbar configuration

[Wiktor Walc]

We made a big step forward making CKEditor more open for thirdparty plugins, plugin developers are now able to provide parts that integrate well with CKEditor.

We have now still a little problem with defininig the toolbar configuration, in case user wanted to change the default layout.

V3

The toolbar configuration is hardcoded. The full toolbar definition is available in the API docs and on the docs site.

Plugins developers need to provide instructions on how to enable the plugin and how to inject a button into the toolbar configuration.

V4

The toolbar configuration is generated automatically. The full toolbar definition is not available, because there is no "full" toolbar anymore. Each user is able to download a customized build of CKEditor with or without thirdparty plugins.

How to inform user what is his toolbar configuration in V4?

There are at least two approaches that we can take:

1) "Define" the toolbar in config.js

When building CKEditor, the builder could "automagically" generate the toolbar configuration and inject is as a comment in config.js.

Pros:

• relatively easy for user to start modifying his toolbar

Cons:

• buttons provided by plugins enabled with extraPlugins (e.g. downloaded separately from the addons repository) are not included in config.js. The user is in the same situation as in V3.

2) Provide the "toolbar" sample in each CKEditor build

Pros:

• the toolbar sample can easily grab all available buttons, even those registered by extra plugins, and display a nice user friendly information:
  • the currently used toolbar (in case user already set config.toolbar)
  • the "full" toolbar configuration for the reference

Cons:

• user that open config.js will have to read first the comment to open the sample page, to find out how to configure the toolbar.

The about page?

CKEditor V4 has become a WYSIWYG framework, where one build of CKEditor may differ a lot from another build. How about instead of having a toolbar sample, make the HTML page a bit more generic and, apart from displaying the available "full" toolbar, display also e.g. the list of enabled plugins?

[Frederico Caldeira Knabben]

I'm ok for solution "2" for now.

The "about" idea is something different and should handled separately.

[Piotrek Koszuliński]

I pushed t/9250.

You have to modify toolbar conf. to see its configuration in the sample.

[Garry Yao]

In toolbar sample the current toolbar section is not shown with custom configuration coded in config.js, in at least FF (Probably due to editor#instanceReady is not fired for display:none).

[Garry Yao]

I wonder if it would be even helpful to make this sample page a playground, allowing user to change toolbar configuration on the fly to show it instantly.

[Piotrek Koszuliński]

instanceReady indeed isn't fired and I reported that as a bug - #9446. Please skip FF for this review.

Regarding richer playground - it's a good idea for the future, but for v4 we need something simple ASAP :). Wiktor even came up with an idea for drag&drop toolbar builder :).

[Piotrek Koszuliński]

Masterised with ​https://github.com/ckeditor/ckeditor-dev/commit/2dd1b68