Tinymce with Ext 4.0.7

[zombeerose]

Any chance of supporting multiple instances of the editor?

Ext.widget({xtype:'tinymcefield',renderTo:Ext.getBody()});
Ext.widget({xtype:'tinymcefield',renderTo:Ext.getBody()});
...

[svitalius]

First off – Thanks Harald for making a great solution for bringing TinyMCE into ExtJS. It works great!

One thing I'm struggling with is how to add custom buttons to the toolbar. In a non-extjs implementation of TinyMCE you can do this by simply adding the following to tinymce.init()

setup: function(editor) {
  editor.addButton('custom-button, {
    title: 'Custom Button',
    image: 'images/example.png',
    onclick: function() {
        // do whatever
    }
  });
} 

However, this approach does not seem to work in the extjs implementation. I've tried adding that code in a variety of places from the tinymceConfig when instantiating to the globalSettings and initEditor -> tinymceConfig.setup functions in TinyMCE.js class file. None of those seem to do the trick.

Has anyone done this successfully? If so, how? If not, any ideas?

Cheers!

[zombeerose]

@svitalius

Try adding the button during the handler for "onBeforeRenderUI" instead of "setup"...

editor.onBeforeRenderUI.add(function(ed){
  ed.addButton('custom-id',{
    'class': 'my-css-class',
    title: 'custom button'
  });
});

That's how I inject my buttons.

[svitalius]

Thanks for the reply zombeerose.

What I just figured out is that both approaches actually work. The reason why my custom button wasn't showing up is because I wasn't actually instantiating it through the button config - ie: theme_advanced_buttons1: 'bold, italic, customBtnId, etc....'

Bonehead oversight on my part.

[svitalius]

I've added added a custom button to tinymce that when clicked opens a ext window extended to a custom file browser. When a file is selected or uploaded I would like to insert an image tag into the tinymce editor, ideally outside of the tag containing the current cursor position – so that I can float it next to the current <p>.

Any thoughts on how to go about this would be super appreciated!

Cheers.

[Dmoney]

@svitalius

WHERE are you putting your setup function. I'm trying to add a button I tried adding a listener for setup but the function is never called.

[Dmoney]

nevermind, this worked for me.

editor.onBeforeRenderUI.add(function(ed){  ed.addButton('custom-id',{    'class': 'my-css-class',    title: 'custom button'  });});