DokuWiki

It's better when it's simple

User Tools

Site Tools


tips:wordcounter

This is an old revision of the document!


Adding a Word/Charcounter to the Editform

Adding the following JavaScript code to your conf/userscript.js (if it does not exist, just create it) will add an automatic word and character counter at the top right of the edit textarea. The count is updated on each keyup event and will show word and character counts of the currently edited section and the whole page.

conf/userscript.js
/**
 * Script to add a wordcounter on the edit form
 *
 * @author Andreas Gohr <andi@splitbrain.org>
 * @author Lars Flintzak
 * @license GPL 2
 */
 
var wordcounter_timeout;
 
function wordcounter(text){
    var list = text.split(/[^\w\-_]+/);
    var len  = list.length;
    if(list[len-1] == '') len--;
    if(list[0] == '') len--;
    if(len < 0) len=0;
    return len;
}
 
function charcounter(text){
    var list = text.split(/[^\w\-_]+/);
    var len  = text.length;
    if(list[len-1] == '') len--;
    if(list[0] == '') len--;
    if(len < 0) len=0;
    return len;
}
 
addInitEvent(function(){
    var form = $('dw__editform');
    if(!form) return;
    var div = document.createElement('div');
    div.id = 'word__counter__output';
    div.style.position = 'absolute';
    div.style.width    = '80px';
    div.style.right = '50px';
    div.style.top   = (findPosY(form.elements.wikitext)+10)+'px';
    div.style.color = '#0a0';
 
    form.appendChild(div);
    var all = wordcounter(form.elements.prefix.value);
        all += wordcounter(form.elements.suffix.value);
 
    var zei_all = charcounter(form.elements.prefix.value);
        zei_all += charcounter(form.elements.suffix.value);
 
    addEvent(form.elements.wikitext,'keyup',function(){
        if(wordcounter_timeout) window.clearTimeout(wordcounter_timeout);
        wordcounter_timeout = window.setTimeout(function(){
            var len = wordcounter(form.elements.wikitext.value);
            var zei = charcounter(form.elements.wikitext.value);
            div.innerHTML =
                'Section: <br />'+
                '&nbsp;&nbsp;'+zei+' chars<br />'+
                '&nbsp;&nbsp;'+len+' words<br />'+
                'Total: <br />'+
                '&nbsp;&nbsp;'+(zei_all+zei)+' chars<br />'+
                '&nbsp;&nbsp;'+(all+len)+' words';
        },1000);
        return true;
    });
});

Discussion

Can this be turned into a plugin that generates the word counter on all pages in the DokuWiki?

tips/wordcounter.1268341630.txt.gz · Last modified: 2010-03-11 22:07 by 67.175.65.231

Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
CC Attribution-Share Alike 4.0 International Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki