Настройка контекстного меню в TinyMCE 4.0

Question

Я использую editor.plugins.contextmenu.onContextMenu.add настроить Контекстное плагин в TinyMCE 3.x, но не может использовать его в версии 4.0

Здесь ошибка я получаю:

TypeError: a.plugins.contextmenu.onContextMenu is undefined 

и мой код плагина:

tinymce.PluginManager.add("example", function(a,b) { 
    a.plugins.contextmenu.onContextMenu.add(function(th, menu, event) { 
    //my code for customizing contextmenu 
    }) 
    a.addButton("exampleHelp", { 
    text : "help", 
    icon : !1, 
    onclick : function() { 
    //some code 
    } 
    })  
}); 

ли связать его с init функции, которую я имел бы ru, используя в версии 3.X?

Answer 1

На данный момент я нашел временное решение:

a.on("contextmenu",function(n){ 
// console.log($(a.getDoc()).find(' .mce-floatpanel.mce-menu')); 
// find a way to add it into current context menu instead of deleting it 
$(a.getDoc()).find(' .mce-floatpanel.mce-menu').remove(); 
var i; 
var o=[] 
o.push({text:'option1'}) 
o.push({text:'option2'}) 
o.push({text:'menu option', menu:o}) 
t=new tinymce.ui.Menu({items:o,context:"contextmenu"}),t.renderTo(document.body) 
// fix positioning 
var r={x:n.pageX,y:n.pageY}; 
a.inline||(r=tinymce.DOM.getPos(a.getContentAreaContainer()), 
r.x+=n.clientX,r.y+=n.clientY),t.moveTo(r.x,r.y), 
a.on("remove",function() {t.remove(),t=null}) 
}) 

я удалить контекстное меню по умолчанию и заменить его с моим заказному меню. Но мне все еще нужно знать, как я могу добавить свои пункты в контекстное меню по умолчанию.

Answer 2

Мне удалось перепроектировать решение, посмотрев на table plugin code.

tinymce.init({ 
    plugins: "contextmenu", 
    contextmenu: "link image inserttable | cell row column deletetable | myMenuItem" 
}); 


// Inside plugin 
editor.addMenuItem('myMenuItem', { 
    text: 'My Menu Item', 
    context: 'div', // not sure what this does 
    onPostRender: postRender, 
    onclick: function() { console.log('hi!'); } 
}); 

// Determine whether menu item is visible 
function postRender() { 
    handleDisabledState(this, 'div.myCustomItem'); 
} 

function handleDisabledState(ctrl, selector) { 
    function bindStateListener() { 
     ctrl.visible(editor.dom.getParent(editor.selection.getStart(), selector)); 
     editor.selection.selectorChanged(selector, function(state) { 
      ctrl.visible(state); 
     }); 
    } 

    if (editor.initialized) 
     bindStateListener(); 
    else 
     editor.on('init', bindStateListener); 
} 

Таким образом, контекстное меню должно отображаться только в том случае, если оно находится внутри элемента div.myCustomItem. Если вы хотите, чтобы элемент контекстного меню всегда был видимым, прокомментируйте handleDisabledState()

Answer 3

Я нашел решение о том, как настраивать контекстное меню TinyMCE (4.1.9) на лету, см. Мой ответ и предлагаемое решение на этой странице : http://archive.tinymce.com/forum/viewtopic.php?pid=116109#p116109

Спасибо, Nic