first go on unobstrusive javascript, new toolbar

darcs-hash:20051008175404-7ad00-cd640de7660825b19d5e863cc8caf5467d59b055.gz

1 files changed, 49 insertions, 76 deletions

diff --git a/lib/scripts/spellcheck.js b/lib/scripts/spellcheck.js
index e86c079df..d47430c31 100644
--- a/lib/scripts/spellcheck.js
+++ b/lib/scripts/spellcheck.js
@@ -40,45 +40,19 @@
  * OF SUCH DAMAGE.
  */
 
-/**
- * Get the X offset of the top left corner of the given object
+/*
+ * Uses some general functions defined elsewhere. Here is a list:
  *
- * @author Garrison Locke <http://www.broken-notebook.com>
- */
-function findPosX(object){
-  var curleft = 0;
-  var obj = document.getElementById(object);
-  if (obj.offsetParent){
-    while (obj.offsetParent){
-      curleft += obj.offsetLeft;
-      obj = obj.offsetParent;
-    }
-  }
-  else if (obj.x){
-    curleft += obj.x;
-  }
-  return curleft;
-} //end findPosX function
-
-/**
- * Get the Y offset of the top left corner of the given object
+ * Defined in script.js:
  *
- * @author Garrison Locke <http://www.broken-notebook.com>
+ *   findPosX()
+ *   findPosY()
+ *   addEvent()
+ *
+ * Defined in edit.js:
+ *
+ *   createToolButton()
  */
-function findPosY(object){
-  var curtop = 0;
-  var obj = document.getElementById(object);
-  if (obj.offsetParent){
-    while (obj.offsetParent){
-      curtop += obj.offsetTop;
-      obj = obj.offsetParent;
-    }
-  }
-  else if (obj.y){
-    curtop += obj.y;
-  }
-  return curtop;
-} //end findPosY function
 
 /**
  * quotes single quotes
@@ -90,29 +64,6 @@ function qquote(str){
 }
 
 /**
- * This function generates a spellchecker button with localized tooltips
- */
-function spellButton(imageFile, speedTip, funcCall, accessKey) {
-  speedTip=escapeQuotes(speedTip);
-  funcCall=escapeQuotes(funcCall);
-
-  button = "<a ";
-  if(accessKey){
-    button = button+"accesskey=\""+accessKey+"\" ";
-    speedTip = speedTip+' [ALT+'+accessKey.toUpperCase()+']';
-  }
-  if(funcCall){
-    button = button+"href=\"javascript:"+funcCall+";\"";
-  }
-  button = button+">";
-  button = button+"<img width=\"24\" height=\"24\" src=\""+
-                DOKU_BASE+'lib/images/toolbar/'+imageFile+"\" border=\"0\" alt=\""+
-                speedTip+"\" title=\""+speedTip+"\">";
-  button = button+"</a>";
-  return button;
-}
-
-/**
  * AJAX Spellchecker Class
  *
  * Note to some function use a hardcoded instance named ajax_spell to make
@@ -127,11 +78,13 @@ function ajax_spell_class(){
   this.utf8ok = 1;
   this.handler = DOKU_BASE+'lib/exe/spellcheck.php';
   // to hold the page objects (initialized with init())
-  this.textboxObj = null;
+  this.textboxObj = null; 
   this.showboxObj = null;
   this.suggestObj = null;
-  this.actionObj  = null;
   this.editbarObj = null;
+  this.buttonObj = null;
+  this.imageObj  = null;
+
   // hold translations
   this.txtStart = 'Check Spelling';
   this.txtStop  = 'Resume Editing';
@@ -162,7 +115,6 @@ function ajax_spell_class(){
     this.editbarObj = document.getElementById('wikieditbar');
     this.showboxObj = document.getElementById('spell_result'); 
     this.suggestObj = document.getElementById('spell_suggest');
-    this.actionObj  = document.getElementById('spell_action'); 
 
     // set Translation Strings
     this.txtStart = txtStart;
@@ -172,11 +124,20 @@ function ajax_spell_class(){
     this.txtNoSug = txtNoSug;
     this.txtChange= txtChange;
 
+    // create ToolBar Button with ID and add it to the toolbar with null action
+    var toolbarObj = document.getElementById('toolbar');
+    this.buttonObj = createToolButton('spellcheck.png',txtStart,'k','spellcheck');
+    this.buttonObj.onclick = function(){return false;};
+    toolbarObj.appendChild(this.buttonObj);
+    this.imageObj  = document.getElementById('spellcheck_ico');
+
     // start UTF-8 compliance test - send an UTF-8 char and see what comes back
     ajax.AjaxFailedAlert = '';
     ajax.encodeURIString = false;
     ajax.onCompletion    = this.initReady;
     ajax.runAJAX('call=utf8test&data='+encodeURIComponent('ü'));
+
+    // second part of initialisation is in initReady() function
   }
 
   /**
@@ -208,16 +169,28 @@ function ajax_spell_class(){
   this.setState = function(state){
     switch (state){
       case 'stop':
-        ajax_spell.actionObj.innerHTML = spellButton("spellstop.png",ajax_spell.txtStop,"ajax_spell.resume()","");
+        ajax_spell.buttonObj.onclick   = function(){ ajax_spell.resume(); return false; };
+        ajax_spell.buttonObj.title     = ajax_spell.txtStop;
+        ajax_spell.buttonObj.accesskey = '';
+        ajax_spell.imageObj.src = DOKU_BASE+'lib/images/toolbar/spellstop.png';
         break;
       case 'noerr':
-        ajax_spell.actionObj.innerHTML = spellButton("spellnoerr.png",ajax_spell.txtNoErr,"ajax_spell.setState(\"start\")","");
+        ajax_spell.buttonObj.onclick   = function(){ajax_spell.setState('start'); return false; };
+        ajax_spell.buttonObj.title     = ajax_spell.txtNoErr;
+        ajax_spell.buttonObj.accesskey = '';
+        ajax_spell.imageObj.src = DOKU_BASE+'lib/images/toolbar/spellnoerr.png';
         break;
       case 'run':
-        ajax_spell.actionObj.innerHTML = spellButton("spellwait.gif",ajax_spell.txtRun,"","");
+        ajax_spell.buttonObj.onclick   = function(){return false;};
+        ajax_spell.buttonObj.title     = ajax_spell.txtRun;
+        ajax_spell.buttonObj.accesskey = '';
+        ajax_spell.imageObj.src = DOKU_BASE+'lib/images/toolbar/spellwait.gif';
         break;
       default:
-        ajax_spell.actionObj.innerHTML = spellButton("spellcheck.png",ajax_spell.txtStart,"ajax_spell.run()","k");
+        ajax_spell.buttonObj.onclick   = function(){ ajax_spell.run(); return false; };
+        ajax_spell.buttonObj.title     = ajax_spell.txtStart+' [ALT-K]';
+        ajax_spell.buttonObj.accesskey = 'k';
+        ajax_spell.imageObj.src = DOKU_BASE+'lib/images/toolbar/spellcheck.png';
         break;
     }
   }
@@ -311,10 +284,10 @@ function ajax_spell_class(){
     }
 
     // register click event
-    document.onclick = ajax_spell.docClick;
+    addEvent(document,'onclick',ajax_spell.docClick);
 
     // register focus event
-    ajax_spell.textboxObj.onfocus = ajax_spell.setState;
+    addEvent(ajax_spell.textboxObj,'onfocus',ajax_spell.setState);
 
     // get started
     ajax_spell.setState('start');    
@@ -395,14 +368,14 @@ function ajax_spell_class(){
    * @author Andreas Gohr <andi@splitbrain.org>
    */
   this.run = function(){
-    this.setState('run');
-    this.textboxObj.disabled = true;
-    var ajax = new sack(this.handler);
+    ajax_spell.setState('run');
+    ajax_spell.textboxObj.disabled = true;
+    var ajax = new sack(ajax_spell.handler);
     ajax.AjaxFailedAlert = '';
     ajax.encodeURIString = false;
     ajax.onCompletion    = this.start;
     ajax.runAJAX('call=check&utf8='+ajax_spell.utf8ok+
-                 '&data='+encodeURIComponent(this.textboxObj.value));
+                 '&data='+encodeURIComponent(ajax_spell.textboxObj.value));
   }
 
   /**
@@ -411,13 +384,13 @@ function ajax_spell_class(){
    * @author Andreas Gohr <andi@splitbrain.org>
    */
   this.resume = function(){
-    this.setState('run');
-    var text = this.showboxObj.innerHTML;
+    ajax_spell.setState('run');
+    var text = ajax_spell.showboxObj.innerHTML;
     if(text != ''){
-      var ajax = new sack(this.handler);
+      var ajax = new sack(ajax_spell.handler);
       ajax.AjaxFailedAlert = '';
       ajax.encodeURIString = false;
-      ajax.onCompletion    = this.stop;
+      ajax.onCompletion    = ajax_spell.stop;
       ajax.runAJAX('call=resume&utf8='+ajax_spell.utf8ok+
                    '&data='+encodeURIComponent(text));
     }