CKeditor and character/word counting

We currently use fckeditor for text areas, I'm working on integrating ckeditor as it's pretty darn slick. The only and I do mean only thing I can't figure out is how implement a word count via javascript, Here's what worked inside fckeditor (I just included this code at the top of the page, and it would replace a div with a word count that would be updated as the user typed)

My question is how would i go about refactoring this code to work with ckeditor?

function FCKeditor_OnComplete(editorInstance) {
    fckeditor_word_count(editorInstance);
    editorInstance.Events.AttachEvent('OnSelectionChange', fckeditor_word_count);
   }

function fckeditor_word_count(editorInstance) {
    var matches = editorInstance.GetData().replace(/<[^<|>]+?>|&nbsp;/gi,' ').match(/\b/g);
    var count = 0;
    if(matches) {
        count = matches.length/2;
    }
    document.getElementById('word_count').innerHTML = count + " word" + (count == 1 ? "" : "s") + " approx";
}

Any help would be much appreciated as I'd love to move over to ckeditor

Thu, 09/03/2009 - 04:52

rubyninja

Joined: 02/09/2009

Posts: 8

Re: CKeditor and character/word counting

Cmon, I see you all looking at this take a stab at it... or point me in decent direction

Thu, 09/03/2009 - 17:40

bidulemachin

Joined: 13/07/2009

Posts: 7

Re: CKeditor and character/word counting

I would also be really interested in a way to dynamically count the characters typed in the CKEDITOR Api

Thanks in advance

Fri, 09/04/2009 - 01:52

rubyninja

Joined: 02/09/2009

Posts: 8

Re: CKeditor and character/word counting

bump

Fri, 09/04/2009 - 17:46

hendecasyllabic

Joined: 18/08/2009

Posts: 32

Re: CKeditor and character/word counting

Create yourself a plugin

You can look at the scayt plugin as it fires everytime you do stuff (as it is constantly doing spell check) for inspiration.

and then in config you just need to add the plugin to list that it loads up.
extraPlugins:'wordcount'

The advantage of the plugin approach is you could also put a button on the toolbar so the user can fire it at will rather than having it constantly doing it's thing

(function()
{
   CKEDITOR.plugins.wordcount =
   {
   };
   
   function counter ( evt )
   {
      var editor = evt.editor;
      /*
      Do stuff with it here
      */
   
   };
   var plugin = CKEDITOR.plugins.wordcount;
   
   CKEDITOR.plugins.add( 'wordcount',
   {
      init : function( editor )
      {
               editor.on( 'insertHtml', counter );
               editor.on( 'insertElement', counter );
      }
   } );
})();