[CKEditor Dev] #7280: Ability to switch toolbar at runtime

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: new
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------
These is a feature that people have requested several times, these are two
related tickets (although they don't request the same thing) #6374 and
#7038

This is a request to provide a editor.setToolbar() method that can change
the current toolbar to a new one on the fly, it's almost possible with
this code:

{{{
// Set new Toolbar
CKEDITOR.editor.prototype.setToolbar = function( toolbar )
{
// Destroy previous toolbar
var toolbars, index = 0, i,
items, instance;
toolbars = this.toolbox.toolbars;
for ( ; index < toolbars.length; index++ )
{
items = toolbars[ index ].items;
for ( i = 0; i < items.length; i++ )
{
instance = items[ i ];
if ( instance.clickFn )
CKEDITOR.tools.removeFunction( instance.clickFn );
if ( instance.keyDownFn )
CKEDITOR.tools.removeFunction( instance.keyDownFn );

if ( instance.index )
CKEDITOR.ui.button._.instances[ instance.index ] = null;
}
}

// Set new one
this.config.toolbar = toolbar;

// create it
var toolbarLocation = this.config.toolbarLocation,
space = document.getElementById('cke_' + toolbarLocation +
'_' + this.name),
html = this.fire( 'themeSpace', { space : toolbarLocation,
html : '' } ).html;

space.innerHTML = html;
}

}}}

But there are two issues that have to be patched in order to work this
way.

The patch addresses just those issues, but a more robust and compact
setToolbar method could be created.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280>
CKEditor <http://ckeditor.com/>
The text editor for Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Changes (by alfonsoml):

* status: new => review

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:1>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Changes (by satya):

* cc: satya_minnekanti@… (added)

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:2>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Comment(by alfonsoml):

This second patch is a reorganization of the code in the toolbar plugin to
provide the editor.setToolbar method in an easy way reusing the existing
code. It's basically a reorganization of the code to reuse the create HTML
and destroy toolbar code.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:3>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Comment(by pauljvrw):

Replying to [comment:3 alfonsoml]:

> This second patch is a reorganization of the code in the toolbar plugin
to provide the editor.setToolbar method in an easy way reusing the
existing code. It's basically a reorganization of the code to reuse the
create HTML and destroy toolbar code.

patch 2 is patch 1 when I try to view or download it.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:4>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Changes (by pauljvrw):

* cc: paul@… (added)

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:5>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Comment(by alfonsoml):

Thanks for the warning. I've removed that duplicated version and uploaded
the correct one.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:6>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Comment(by pauljvrw):

Replying to [comment:6 alfonsoml]:

> Thanks for the warning. I've removed that duplicated version and
uploaded the correct one.

I tested this with in combination with fullscreen mode and got the
following error:

TypeError: buttonNode is null
http://<mytestmachine>/pub/ckeditor-3.5.3-toolbarpatch/_source/plugins/maximize/plugin.js
Line 299

To reproduce:
{{{
var editor = CKEDITOR.instances.<FIELDID>;
editor.setToolbar( "Full" );
editor.execCommand("maximize");
}}}

The combination of your patches in combination with the code block I added
to #7038 for auto toolbar switching works by the way. So thanks, almost
there.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:7>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Comment(by pauljvrw):

Replying to [comment:6 alfonsoml]:
> Thanks for the warning. I've removed that duplicated version and
uploaded the correct one.

Found another bug after the patches were applied:

Fout: CKEDITOR.config.specialChars is undefined
Sourcefile: http://<mytestmachine>/pub/ckeditor-
custom/realworks_cke.js?Fri%20Apr%2001%202011%2016:06:17%20GMT+02001
Line: 54

How to reproduce: add the following to your own config js:

{{{
CKEDITOR.config.specialChars = CKEDITOR.config.specialChars.concat( [[
'&permil;', 'Promille' ]] );
}}}

You can also see in the editor as a result the setting:
{{{
CKEDITOR.config.removePlugins = 'elementspath';
}}}
no longer works after these patches when you concat special chars.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:8>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Comment(by pauljvrw):

Forgot to translate Fout to Error :)

Replying to [comment:8 pauljvrw]:

> Replying to [comment:6 alfonsoml]:
> > Thanks for the warning. I've removed that duplicated version and
uploaded the correct one.
>
> Found another bug after the patches were applied:
>
> Fout: CKEDITOR.config.specialChars is undefined
> Sourcefile: http://<mytestmachine>/pub/ckeditor-
custom/realworks_cke.js?Fri%20Apr%2001%202011%2016:06:17%20GMT+02001
> Line: 54
>
> How to reproduce: add the following to your own config js:
>
> {{{
> CKEDITOR.config.specialChars = CKEDITOR.config.specialChars.concat( [[
'&permil;', 'Promille' ]] );
> }}}
>
> You can also see in the editor as a result the setting:
> {{{
> CKEDITOR.config.removePlugins = 'elementspath';
> }}}
> no longer works after these patches when you concat special chars.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:9>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: assigned

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Changes (by alfonsoml):

* status: review => assigned

Comment:

I've fixed the maximize problem, but now I see problems when switching to
source view.
I'll provide a new patch when everything is working.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:10>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Changes (by alfonsoml):

* status: assigned => review

Comment:

This new patch fixes the problems that I've found, but I haven't noticed
any problem about the elementsPath plugin.
If I try to use {{{CKEDITOR.config.specialChars =

CKEDITOR.config.specialChars.concat( [[ '&permil;', 'Promille' ]] ); }}}

in my config file I get an error stating that CKEDITOR.config.specialChars
is undefined.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:11>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Comment(by pauljvrw):

Replying to [comment:11 alfonsoml]:

> This new patch fixes the problems that I've found, but I haven't noticed
any problem about the elementsPath plugin.
> If I try to use {{{CKEDITOR.config.specialChars =
CKEDITOR.config.specialChars.concat( [[ '&permil;', 'Promille' ]] ); }}}
in my config file I get an error stating that CKEDITOR.config.specialChars
is undefined.

I retested after patch 3 and still get the elements patch bug after the
patch.
I added a screenshot. Here is a cleaned up version of our config (no
external plugins etc):


{{{
CKEDITOR.config.toolbar_rw_small = [
['Bold','Italic','Underline'],
['NumberedList','BulletedList'],
['TextColor'],
['FontSize'],
['Maximize']
];

CKEDITOR.config.toolbar_email = [
['Cut','Copy','Paste','PasteText','PasteFromWord'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],
['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
['Link','Unlink'],
['Image','Table','HorizontalRule','SpecialChar','Smiley'],
['TextColor','BGColor','Source', 'SpellChecker', 'Scayt'],
['Font','FontSize'],['Styles','Format','-','Maximize']
];

CKEDITOR.config.startupFocus = false;
CKEDITOR.config.skin = 'office2003';

CKEDITOR.config.defaultLanguage = 'nl';

CKEDITOR.config.toolbarCanCollapse = true;
CKEDITOR.config.toolbarStartExpanded = true;
CKEDITOR.config.enterMode = CKEDITOR.ENTER_BR;

CKEDITOR.config.specialChars = CKEDITOR.config.specialChars.concat( [[
'&permil;', 'Promille' ]] );

CKEDITOR.config.resize_dir = 'both';
CKEDITOR.config.resize_enabled = false;

CKEDITOR.config.EMailProtection = 'none';
CKEDITOR.config.removePlugins = 'elementspath';
}}}

Furthermore the concat on specialChars should work (and does before the
patch). This because it is in the documentation of how to add custom
special chars:
http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.specialChars

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:12>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Comment(by pauljvrw):

Replying to [comment:11 alfonsoml]:
> This new patch fixes the problems that I've found, but I haven't noticed
any problem about the elementsPath plugin.
> If I try to use {{{CKEDITOR.config.specialChars =
CKEDITOR.config.specialChars.concat( [[ '&permil;', 'Promille' ]] ); }}}
in my config file I get an error stating that CKEDITOR.config.specialChars
is undefined.

I forgot to mention that if I remove the concat line from our config (see
the previous reply) the
{{{
CKEDITOR.config.removePlugins = 'elementspath';
}}}
does work.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:13>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Comment(by alfonsoml):

Sorry, but I'm unable to reproduce your problems.

the concat only works when you work with the released code, if you try to
use the _source version then the CKEDITOR.config object is populated after
the config file has been processed, so it will fail.

In that case the error makes the whole editor fail and doesn't load.

I've been testing with the replaceByClass sample, and looked briefly at
other samples and they behaved properly.

I don't know what browser you are using, it's clearly not IE due to the
rounded borders, but I haven't found any that had the rendering problems
with the collapse button and the height of the buttons in the dropdown
elements.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:14>

[CKEditor]

#7280: Ability to switch toolbar at runtime
--------------------------+-------------------------------------------------
Reporter: alfonsoml | Owner: alfonsoml

Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Keywords: |
--------------------------+-------------------------------------------------

Comment(by pauljvrw):

Replying to [comment:14 alfonsoml]:

> Sorry, but I'm unable to reproduce your problems.
>
> the concat only works when you work with the released code, if you try
to use the _source version then the CKEDITOR.config object is populated
after the config file has been processed, so it will fail.
>
> In that case the error makes the whole editor fail and doesn't load.
>
> I've been testing with the replaceByClass sample, and looked briefly at
other samples and they behaved properly.

We do what the replacebycode sample does. But then with a custom config
included in the head section of the html. And a function to do the replace
with our config:

{{{
CKEDITOR.replace(oArray.id, {
customConfig : '/pub/ckeditor-custom.js?' + (new Date() +
1),
toolbar : oArray.toolbar,
startupFocus : oArray.focus
});
}}}

That may explain why with us the editor does load with the _source
version.

By the way, is there a good reason that the _source and released code do
things differently? I would think that only makes testing en developing
harder.

> I don't know what browser you are using, it's clearly not IE due to the
rounded borders,

That is related to css we have. I added a screen shot that shows IE7, FF
and Chrome to show any problem is not browser related.

> but I haven't found any that had the rendering problems with the
collapse button and the height of the buttons in the dropdown elements.

There is a separate ticket this. But again it is css related.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:15>

[CKEditor]

#7280: Ability to switch toolbar at runtime

---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:

Resolution: | Keywords:
---------------------------+-----------------------

Comment (by pauljvrw):

Can someone review this latest 7280_4.patch patch so it can be added to
the releases?

It works great for us in our production environment. We have been using
these patches for months now and we have used this latest patch in our
production environment from when it was added to this ticket.

We use it in a custom toolbar switch plugin like requested in ticket 7038.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:16>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime

---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:

Resolution: | Keywords:
---------------------------+-----------------------

Comment (by j.swiderski):

I have managed to run it only in relase version, not in source.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:17>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime

---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:

Resolution: | Keywords:
---------------------------+-----------------------

Comment (by pauljvrw):

Replying to [comment:17 j.swiderski]:

> I have managed to run it only in relase version, not in source.

Is that because you a concat line like mentioned in comment 12?

See comment 14 for the solution: remove the concat line.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:18>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime

---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:

Resolution: | Keywords:
---------------------------+-----------------------

Comment (by j.swiderski):

Sorry for my last comment.

I was not able to run it on trunk (got empty toolbar) but it is working
great in release code with both ckeditor.js and ckeditor_source.js.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:19>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime

---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:

Resolution: | Keywords:
---------------------------+-----------------------

Comment (by pauljvrw):

The patch is no longer up to date. The toolbar plugin has changed from
3.6.3 to 3.6.4. A line with:
{{{
requires : [ 'button' ],
}}}
was added. Adjusting the patch for that everything runs fine for me.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:20>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime

---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:

Resolution: | Keywords:
---------------------------+-----------------------

Comment (by j.swiderski):

#939 was marked as duplicate.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:21>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime

---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:

Resolution: | Keywords:
---------------------------+-----------------------

Comment (by j.swiderski):

One of the users has asked me about possibility to change toolbar when you
press maximize button.

As a result I'm attaching the maximize patch that should be used on trunk
version of CKEditor. Then new release should be built of course.

The patch contains 7280_4.patch, toolbars and method entered in config.js,
simple events added in replacebycode.html sample and maximize plugin which
fires beforeMaximize event. The last is very important as you must change
CKEditor toolbar before maximize will start calculating how much space it
can take for which element.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:22>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime

---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:

Resolution: | Keywords:
---------------------------+-----------------------

Comment (by j.swiderski):

#9792 was marked as duplicate.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:23>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime

---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:

Resolution: | Keywords:
---------------------------+-----------------------

Comment (by j.swiderski):

#10088 was marked as duplicate.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:24>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime

---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review

Priority: Normal | Milestone:
Component: UI : Toolbar | Version:

Resolution: | Keywords:
---------------------------+-----------------------

Comment (by jscouvert):

Hi,

I would like to know if this method work on ckeditor 4.X.X ?

Thanks

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:25>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#7280: Ability to switch toolbar at runtime
---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Resolution: | Keywords:
---------------------------+-----------------------

Comment (by j.swiderski):

You can try using it in v4, however fix was prepared for v3 thus it may
not work.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:26>

[CKEditor]

#7280: Ability to switch toolbar at runtime
---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Resolution: | Keywords:
---------------------------+-----------------------

Comment (by jscouvert):

Ok. I'll try to make it work.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:27>

[CKEditor]

#7280: Ability to switch toolbar at runtime
---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Resolution: | Keywords:
---------------------------+-----------------------

Comment (by pauljvrw):

I just tried 7280_maximize.patch on ckeditor 4.1.1.
Based on the patch modifications were easily applied by hand.

It does not work though. The following piece of the patch gives an error:

{{{
space = document.getElementById( 'cke_' + toolbarLocation + '_' +
this.name );
space.innerHTML = generateToolbarHtml( this );
}}}

The 'document.getElementById' returns null and causes an 'TypeError: space
is null' error on the next line. The element name in ckeditor 4 must be
slightly different.

It would be nice to have an updated patch for ckeditor 4.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:28>

[CKEditor]

#7280: Ability to switch toolbar at runtime
---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Resolution: | Keywords:
---------------------------+-----------------------

Comment (by pauljvrw):

I created a plugin for this to see if it could be done without changes in
the ckeditor base code:
https://github.com/paulveldema/ckeditor-
plugins/blob/master/toolbarswitch/plugin.js
this is inspired on
http://stackoverflow.com/questions/12531002/change-ckeditor-toolbar-
dynamically

It is still buggy though. For example some buttons no longer work after
switching tool bars. Most work though.

Can anyone give me some tips on which java script to look at to make the
remaining buttons work after switching? Any changes in the plugins that do
not work to make them toolbar switch friendly would be appreciated.

Tested on ckeditor 4.1.1 and 4.1.2.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:29>

[CKEditor]

#7280: Ability to switch toolbar at runtime
---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Resolution: | Keywords:
---------------------------+-----------------------

Comment (by pauljvrw):

I added the toolbar switch plugin to the addons:
http://ckeditor.com/addon/toolbarswitch

From attachment 7280_maximize.patch​ the change in
plugins/panelbutton/plugin.js is needed to keep the text color button
working after switching the toolbar. It would be nice if someone could
commit that change to master. As far I could test it has no adverse
effects.

What exactly does not yet work with the plugin is listed on the addon
page. If there is a single small patch (cksource or the plugin) that can
get the remaining group of buttons working I am very interested.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:30>

[CKEditor]

#7280: Ability to switch toolbar at runtime
---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Resolution: | Keywords:
---------------------------+-----------------------

Comment (by pauljvrw):

Question on a needed fix for the toolbarswitch plugin (version 4.1 of
ckeditor):

With the toolbarswitch plugin enabled and maximizing the editor to switch
the toolbar afterwards the maximize button label is not changed to
'minimize'. The cause is a 'null' error on the second line in the
following code piece of the maximize plugin:

{{{
var buttonNode = CKEDITOR.document.getById( button._.id );
buttonNode.getChild( 1 ).setHtml( label );
buttonNode.setAttribute( 'title', label );
buttonNode.setAttribute( 'href', 'javascript:void("' + label + '");' );
}}}

I could change it to:

{{{
var buttonNode = CKEDITOR.document.getById( button._.id );
if (buttonNode) {
buttonNode.getChild( 1 ).setHtml( label );
buttonNode.setAttribute( 'title', label );
buttonNode.setAttribute( 'href', 'javascript:void("' + label + '");'
);
}
}}}

However then the label would no longer change to 'minimize' when the
editor is maximized.
Does anyone have an alternative solution?

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:31>

[CKEditor]

#7280: Ability to switch toolbar at runtime
---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Resolution: | Keywords:
---------------------------+-----------------------

Comment (by j.swiderski):

In CKEditor 4 we have introduced ACF thus this issue seems much more
complicated now.

There might be two solutions.[[BR]]
'''Solution 1:'''
* We could inroduce methods like {{{hideButton(buttonName,
shouldRevmoeACFRules);}}} and {{{disableButton(buttonName,
shouldRevmoeACFRules);}}}. With such simple method users could
disable/enable, hide/show buttons based on whatever actions they desire.
* Additionally we could introduce
{{{(hide|disable)ToolbarGroup(toolbarGroupName, shouldRevmoeACFRules);}}}
* Parameter remove corresponding ACF rules is something to rethink. I
believe that in most cases users will not want to change ACF rules they
have and will just enjoy UI changes but there might be small percent of
users who will want this so perhaps we could think of such option or
simply say you need to destroy/create editor in that case. [[BR]] This is
much work for us and less work for CKEditor users/devs.

'''Solution 2:'''
* I was suggested on support channel. We could provide marker CSS classes
that can be used to search DOM elements and change button visibility.
[[BR]] This is less work for us and much more work for CKEditor
users/devs.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:32>

[CKEditor]

#7280: Ability to switch toolbar at runtime
---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Resolution: | Keywords:
---------------------------+-----------------------

Comment (by Reinmar):

Well... one thing is sure - we need this on API level not CSS level. For
example, it must be integrated with keyboard support.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:33>

[CKEditor]

#7280: Ability to switch toolbar at runtime
---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Resolution: | Keywords:
---------------------------+-----------------------

Comment (by j.swiderski):

#12278 was marked as duplicate.

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:34>

[CKEditor]

#7280: Ability to switch toolbar at runtime
---------------------------+-----------------------
Reporter: alfonsoml | Owner: alfonsoml
Type: New Feature | Status: review
Priority: Normal | Milestone:
Component: UI : Toolbar | Version:
Resolution: | Keywords:
---------------------------+-----------------------

Changes (by bmulholland):

* cc: me@… (added)

--
Ticket URL: <http://dev.ckeditor.com/ticket/7280#comment:35>