Функция toggleClass в TinyMCE API 3?

Question

TinyMCE 4 имеет удобную функцию toggleClass, http://archive.tinymce.com/wiki.php/api4:method.tinymce.dom.DOMUtils.toggleClass которую я хотел бы использовать, но этот конкретный проект включает в себя более старый TinyMCE 3.5.11 ..

Я надеялся, что в v3 будет работать следующее:

tinymce.create('tinymce.plugins.ClassToggle', {
    createControl: function(n, cm) {
        switch (n) {
            case 'exampleclasstoggle':
                var exampleclasstoggle = cm.createButton('exampleclasstoggle', {
                    title : 'Toggle example class',
                    image : '/admin/js/icons/exampleclass.png',
                    onclick : function(v) {
                        cm.editor.selection.toggleClass('example');
                    }
                });

                return exampleclasstoggle;
        }
    }
});

tinymce.PluginManager.add('classtoggle', tinymce.plugins.ClassToggle);

Но просто выдает ошибки, что toggleClass() не является функцией, так что API v3 просто не предлагает этого.

Кто-нибудь знает плагин для TinyMCE 3, который предоставляет toggleClass() или аналогичный, или есть лучший способ сделать это?

Я буквально хочу добавить кнопки в редактор для переключения пары предопределенных классов на любой выбранный элемент.

С уважением.

Answer 1

Удалось сделать это с помощью API tinymce.dom для доступа к функциям hasClass, addClass и removeClass...

tinymce.create('tinymce.plugins.ClassToggle', {
    createControl: function(n, cm) {
        switch (n) {
            case 'exampleclasstoggle':
                var exampleclasstoggle = cm.createButton('exampleclasstoggle', {
                    title : 'Toggle example class',
                    image : '/admin/js/icons/exampleclass.png',
                    onclick : function(v) {
                        if(cm.editor.dom.hasClass(cm.editor.selection.getNode(), 'example')) {
                            cm.editor.dom.removeClass(cm.editor.selection.getNode(), 'example');
                        } else {
                            cm.editor.dom.addClass(cm.editor.selection.getNode(), 'example');
                        }
                    }
                });

                return exampleclasstoggle;
        }
    }
});

tinymce.PluginManager.add('classtoggle', tinymce.plugins.ClassToggle);

Answer 2

Вот код из TinyMCE 4 для toggleClass:

    toggleClass: function(elm, cls, state) {
        this.$$(elm).toggleClass(cls, state).each(function() {
            if (this.className === '') {
                $(this).attr('class', null);
            }
        });
    }

Просто добавьте эту функцию в ваш код и передайте ей правильные параметры.

(Это в файле DOMUtils.js в TinyMCE 4)