I'm trying to manipulate the FCK Editor toolbar for a site that I use. I do not have access to the server.
The site is using the default "Basic" toolbar, but I'd like to add the Indent/Outdent buttons to the toolbar. This would all need to be done at runtime. (I'm using a greasemonkey script to try to interact) Here's what I've tried and the problems I'm running into:
1. Changing the definition for "Basic" and calling Load('Basic'). This loads a second toolbar identical to the first, except that the extra buttons are there. Only the extra buttons work on the second toolbar.
2. Changing the definition for "Basic", erasing the toolbar's innerHTML, and calling Load('Basic'). This LOOKS right, but the only buttons that work are the new ones.
3. using the following code in FCKeditor_OnComplete:
var oOutdent = new FCKToolbarButton('Outdent', FCKLang.DecreaseIndent, null, null, false, true); oOutdent.IconPath = FCKConfig.SkinPath + 'toolbar/outdent.gif';
var oIndent = new FCKToolbarButton('Indent', FCKLang.IncreaseIndent, null, null, false, true); oIndent.IconPath = FCKConfig.SkinPath + 'toolbar/indent.gif';
oToolbars.AddSeparator()
oToolbars.AddItem('Indent', oIndent)
oToolbars.AddItem('Outdent', oOutdent)
Problem here: FCKLang does not exist.
4. Modifying the previous code going through editorInstance.EditorWindow.parent.FCK instead... the problem here is that, for whatever reason, at this stage of execution, parent exists but is blank. I don't really understand how OnComplete can have already fired but parent.FCK doesn't exist yet, but that's the problem I'm having.
5. Tossing alerts in my code resulted in the toolbar not actually displaying until after I cleared the alert, so I changed the ['Basic'] definition thinking it would just appear the right way. No such luck. The ToolbarSet.Toolbars[0] array had the right definitions in it, but they didn't appear in the bar.
From all of this I have deduced that OnComplete is being called after the toolbar has been created, but before it's all actually be written to the page.
Is there an easy way to change the toolbar at runtime? I'd be happy to just define a different toolbar and switch to that one, but I can't seem to find the right commands to do it, and the documentation is very, very lacking.
Any suggestions would be appreciated.
The site is using the default "Basic" toolbar, but I'd like to add the Indent/Outdent buttons to the toolbar. This would all need to be done at runtime. (I'm using a greasemonkey script to try to interact) Here's what I've tried and the problems I'm running into:
1. Changing the definition for "Basic" and calling Load('Basic'). This loads a second toolbar identical to the first, except that the extra buttons are there. Only the extra buttons work on the second toolbar.
2. Changing the definition for "Basic", erasing the toolbar's innerHTML, and calling Load('Basic'). This LOOKS right, but the only buttons that work are the new ones.
3. using the following code in FCKeditor_OnComplete:
var oOutdent = new FCKToolbarButton('Outdent', FCKLang.DecreaseIndent, null, null, false, true); oOutdent.IconPath = FCKConfig.SkinPath + 'toolbar/outdent.gif';
var oIndent = new FCKToolbarButton('Indent', FCKLang.IncreaseIndent, null, null, false, true); oIndent.IconPath = FCKConfig.SkinPath + 'toolbar/indent.gif';
oToolbars.AddSeparator()
oToolbars.AddItem('Indent', oIndent)
oToolbars.AddItem('Outdent', oOutdent)
Problem here: FCKLang does not exist.
4. Modifying the previous code going through editorInstance.EditorWindow.parent.FCK instead... the problem here is that, for whatever reason, at this stage of execution, parent exists but is blank. I don't really understand how OnComplete can have already fired but parent.FCK doesn't exist yet, but that's the problem I'm having.
5. Tossing alerts in my code resulted in the toolbar not actually displaying until after I cleared the alert, so I changed the ['Basic'] definition thinking it would just appear the right way. No such luck. The ToolbarSet.Toolbars[0] array had the right definitions in it, but they didn't appear in the bar.
From all of this I have deduced that OnComplete is being called after the toolbar has been created, but before it's all actually be written to the page.
Is there an easy way to change the toolbar at runtime? I'd be happy to just define a different toolbar and switch to that one, but I can't seem to find the right commands to do it, and the documentation is very, very lacking.
Any suggestions would be appreciated.
RE: Toolbar Manipulation at Runtime
* For your efforts 1 and 2 maybe hiding the original toolbar works:
// Just hiding the toolbar:
editorInstance.EditorWindow.parent.document.getElementById("xExpanded").style.display = "none";
// And hiding the small bar showing when the toolbar is collapsed is this:
editorInstance.EditorWindow.parent.document.getElementById("xCollapsed").style.display = "none";
// when you want to hide the collapse handle do:
editorInstance.EditorWindow.parent.document.getElementById("xCollapseHandle").style.display = "none";
// or hiding the expand handle. This seems to be the same as hiding the object with id 'xCollapsed' mentioned above:
editorInstance.EditorWindow.parent.document.getElementById("xExpandHandle").style.display = "none";
// To just collapse the toolbars, like normally done with the small arrow, do:
editorInstance.EditorWindow.parent.FCK.ToolbarSet._ChangeVisibility(true);
// expanding it again is
editorInstance.EditorWindow.parent.FCK.ToolbarSet._ChangeVisibility(false);
* For 3, you did try 'editorInstance.EditorWindow.parent.FCKLang'? Not sure if that's what you say in 4...
* For the loading order, see http://wiki.fckeditor.net/Developer%27s ... ding_Order
please update us with your findings.
RE: Toolbar Manipulation at Runtime
<script type="text/javascript">
var oFCKeditor = new FCKeditor('FCKeditor1');
oFCKeditor.BasePath = "/FCKeditor/";
oFCKeditor.Config["ToolbarSets"]["Basic"] = [
['Bold','Italic','Underline'],
['OrderedList','UnorderedList'],
['Link','Unlink','Anchor','Image'],
['TextColor','BGColor']
];
oFCKeditor.Create();
</script>
This should work. Though I cannot try it, I am pretty sure, it'll work
RE: Toolbar Manipulation at Runtime
Just read this in the old release notes of 2.3Beta:
It is now possible to easily change the toolbar using the JavaScript API by just calling <EditorInstance>.ToolbarSet.Load( '<ToolbarName>' ). See _testcases/010.html for a sample.
Didn't know that, but sounds very usefull. Let us know if it works.
This of course assumes that you have server access (to create the toolbarset). But I think it would be great to have the possibility to create a new toolbar at runtime. I'll submit a request for that.
...
Just tested it and it work nicely in 2.3b 'FCKeditor_2.3b/FCKeditor/_testcases/010.html', but I don't think there's an example file for 2.3+. You can test it by coding it yourself or by downloading 2.3beta ( http://downloads.sourceforge.net/fckedi ... .3b.tar.gz or http://downloads.sourceforge.net/fckedi ... r_2.3b.zip )
RE: Toolbar Manipulation at Runtime
Create a new toolbar set with ['Indent', 'Outdent']
Load this one using the .Load() command. Not sure why I didn't think of this before.
Thanks for all of your suggestions.