Setting tristate of custom button when selection changes

I have written a plugin that adds a button. When pressed, this button creates a dialog. After the OK button is hit, the selected text is placed inside a span with class 'myClass'.

Now, if the selection caret is placed inside such an element, I want my button to be highlighted. This would be similar to the way the Bold, Italic and Underline buttons behave. How can I accomplish this in my plugin, without altering the core files?

I'm sure a lot of developers would appreciate an answer to this problem, since what I'm trying to do is something very common.

Mon, 05/03/2010 - 19:55

bozozo

Joined: 03/05/2010

Posts: 2

Re: Setting tristate of custom button when selection changes

Never mind... I figured it out by viewing the source of the standard elementspath plugin.

Solution:

CKEDITOR.plugins.add( 'myplugin',
{
   init : function( editor )
   {
      //...

      editor.on( 'selectionChange', function( e )
         {
            if (e.data.selection.getStartElement().hasClass('myClass'))
               editor.getCommand('mypluginCommand').setState(CKEDITOR.TRISTATE_ON);
            else
               editor.getCommand('mypluginCommand').setState(CKEDITOR.TRISTATE_OFF);
         }
      )

      //...
   }
   
   //...
}