JS function to undo

Question

  (function() {
tinymce.create('tinymce.plugins.custom', {
    init : function(ed, url) {
        ed.addButton('custom', {
            title : 'custom',
            text: 'custom',
            icon: false,
            onclick: function() { 
                ed.focus();
                ed.selection.setContent('<p class="custom">' + ed.selection.getContent() + '</p>');
            }
        });
    },
    createControl : function(n, cm) {
        return null;
    },
});
tinymce.PluginManager.add('custom', tinymce.plugins.custom);
})();

I've added a button to TinyMCE using the above JS code.

So, when user clicks the button, it wraps any highlighted words into tags.

My question is, how do I make it so that if the highlighted words are already in tag, then it should remove the tag?

Answer 1

Keep an array store of tags, remove the tag if found in array, push to array if not

var tags = [];


...

onclick: function() { 
    var content = ed.selection.getContent();
    var index = tags.indexOf(content);
    ed.focus();

    if (index === -1) {
        ed.selection.setContent('<p class="custom">' + content + '</p>');
        tags.push(content);
    } else {
        ed.selection.setContent(content);
        tags.splice(index, 1);
    }
}