What I want to do is modify a div's style inside the tinymce generated editor when the variable showToolbar
is false, after the component has been loaded. In particular, the div is the one with class name 'mce-edit-area'
I have a class that works as a tinymce editor as follows:
public class MyRichTextEditor extends TextArea<String> {
protected TinyMCESettings settings;
private boolean showToolbar;
private boolean readOnly;
public MyRichTextEditor(String id, boolean showToolbar, boolean readOnly) {
super(id);
this.showToolbar = showToolbar;
this.readOnly = readOnly;
settings = new TinyMCESettings(TinyMCESettings.Theme.modern);
settings.addCustomSetting("content_style: \"body { font-family: Verdana,sans-serif; font-size: 15px; }\"");
addSettings();
add(new TinyMceBehavior(settings));
}
protected void addSettings() {
settings.setMenuBar(false);
settings.addCustomSetting("force_p_newlines : true");
settings.addCustomSetting("force_br_newlines : true");
settings.addCustomSetting("convert_newlines_to_brs : false");
settings.addCustomSetting("remove_linebreaks : true");
if (showToolbar) {
addToolbars();
settings.addCustomSetting("readonly : " + (readOnly ? "1" : "0"));
} else {
settings.addCustomSetting("readonly : " + (readOnly ? "1" : "0"));
settings.addCustomSetting("toolbar:false");
}
}
My initial approach was something like this:
@Override
public void renderHead(IHeaderResponse response) {
super.renderHead(response);
if(!showToolbar){
response.render(OnDomReadyHeaderItem.forScript("change style here via javascript..."));
}
}
However, this did not work. Also tried using OnLoadHeaderItem instead of OnDomHeaderItem, which supposedly excecutes in a later priority, in case the generated editor had not been created at the time I was calling the javascript via OnDomHeaderItem. However, in both cases, the generated editor seemed to be created after my javascript calls, so they had no effect.
What would be a proper solution for this problem? Is there a way to figure out when exactly the generated editor is created?