[Sommaire] [Imprimer]

   1  /* ***** BEGIN LICENSE BLOCK *****
   2   * This file is part of DotClear.
   3   * Copyright (c) 2004 Olivier Meunier and contributors. All rights
   4   * reserved.
   5   *
   6   * DotClear is free software; you can redistribute it and/or modify
   7   * it under the terms of the GNU General Public License as published by
   8   * the Free Software Foundation; either version 2 of the License, or
   9   * (at your option) any later version.
  10   * 
  11   * DotClear is distributed in the hope that it will be useful,
  12   * but WITHOUT ANY WARRANTY; without even the implied warranty of
  13   * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  14   * GNU General Public License for more details.
  15   * 
  16   * You should have received a copy of the GNU General Public License
  17   * along with DotClear; if not, write to the Free Software
  18   * Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA
  19   *
  20   * ***** END LICENSE BLOCK ***** */
  21   
  22  /*     Usage
  23      # Toolbar
  24      echo
  25      '<script type="text/javascript" src="js/toolbar.js"></script>'.
  26      '<script type="text/javascript">'.
  27      "if (document.getElementById) {
  28          var tb = new dcToolBar(document.getElementById('p_content'),
  29          document.getElementById('p_format'),'images/');
  30  
  31          tb.btStrong('Strong emphasis');
  32          tb.btEm('Emphasis'');
  33          tb.btIns('Inserted');
  34          tb.btDel('Deleted');
  35          tb.btQ('Inline quote');
  36          tb.btCode('Code');
  37          tb.addSpace(10);
  38          tb.btBr('Line break');
  39          tb.addSpace(10);
  40          tb.btBquote('Blockquote');
  41          tb.btPre('Preformated text');
  42          tb.btList('Unordered list');
  43          tb.btList('Ordered list');
  44          tb.addSpace(10);
  45          tb.btLink('Link','URL?','Language?','fr');
  46          tb.btImgLink('External image','URL?');
  47          tb.addSpace(10);
  48          # create image manager from document tool
  49          tb.btImg('Internal image','images-popup.php');
  50          tb.draw('You can use the following shortcuts to refine your layout.');
  51      }
  52      </script>";
  53      # Fin toolbar */
  54  var img_path = "toolbar";
  55   
  56  function dcToolBar(textarea,format,img_path)
  57  {
  58      this.addButton        = function() {}
  59      this.addSpace        = function() {}
  60      this.draw            = function() {}
  61      this.btStrong        = function() {}
  62      this.btEm            = function() {}
  63      this.btIns        = function() {}
  64      this.btDel        = function() {}
  65      this.btQ            = function() {}
  66      this.btCode        = function() {}
  67      this.btBr            = function() {}
  68      this.btBquote        = function() {}
  69      this.btPre        = function() {}
  70      this.btList        = function() {}
  71      this.btLink        = function() {}
  72      this.btImgLink        = function() {}
  73      this.btImg        = function() {}
  74      this.insImg        = function() {}
  75      
  76      if (!document.createElement) {
  77          return;
  78      }
  79  
  80      if ((typeof(document["selection"]) == "undefined")
  81      && (typeof(textarea["setSelectionRange"]) == "undefined")) {
  82          return;
  83      }
  84      
  85      var toolbar = document.createElement("div");
  86      toolbar.id = "dctoolbar";
  87      
  88      function getFormat() {
  89          if (format == 'wiki') {
  90              return 'wiki';
  91          } else {
  92              return 'html';
  93          }
  94      }
  95      
  96      function addButton(src, title, fn) {
  97          var i = document.createElement('img');
  98          i.src = src;
  99          i.title = title;
 100          i.alt = title;
 101          i.onclick = function() { try { fn() } catch (e) { } return false };
 102          i.tabIndex = 400;
 103          toolbar.appendChild(i);
 104          addSpace(2);
 105      }
 106      
 107      function addSpace(w)
 108      {
 109          var s = document.createElement('span');
 110          s.style.padding='0 '+w+'px 0 0';
 111          s.appendChild(document.createTextNode(' '));
 112          toolbar.appendChild(s);
 113      }
 114      
 115      function encloseSelection(prefix, suffix, fn) {
 116          textarea.focus();
 117          var start, end, sel, scrollPos, subst;
 118          
 119          if (typeof(document["selection"]) != "undefined") {
 120              sel = document.selection.createRange().text;
 121          } else if (typeof(textarea["setSelectionRange"]) != "undefined") {
 122              start = textarea.selectionStart;
 123              end = textarea.selectionEnd;
 124              scrollPos = textarea.scrollTop;
 125              sel = textarea.value.substring(start, end);
 126          }
 127          
 128          if (sel.match(/ $/)) { // exclude ending space char, if any
 129              sel = sel.substring(0, sel.length - 1);
 130              suffix = suffix + " ";
 131          }
 132          
 133          if (typeof(fn) == 'function') {
 134              var res = (sel) ? fn(sel) : fn('');
 135          } else {
 136              var res = (sel) ? sel : '';
 137          }
 138          
 139          subst = prefix + res + suffix;
 140          
 141          if (typeof(document["selection"]) != "undefined") {
 142              var range = document.selection.createRange().text = subst;
 143              textarea.caretPos -= suffix.length;
 144          } else if (typeof(textarea["setSelectionRange"]) != "undefined") {
 145              textarea.value = textarea.value.substring(0, start) + subst +
 146              textarea.value.substring(end);
 147              if (sel) {
 148                  textarea.setSelectionRange(start + subst.length, start + subst.length);
 149              } else {
 150                  textarea.setSelectionRange(start + prefix.length, start + prefix.length);
 151              }
 152              textarea.scrollTop = scrollPos;
 153          }
 154      }
 155      
 156      function draw(msg) {
 157          var p = document.createElement('em');
 158          p.style.display='block';
 159          p.style.margin='-0.5em 0 0.5em 0';
 160          p.appendChild(document.createTextNode(msg));
 161          textarea.parentNode.insertBefore(p, textarea);
 162          textarea.parentNode.insertBefore(toolbar, textarea);
 163      }
 164      
 165      
 166      // ---
 167      function singleTag(wtag,htag,wetag) {
 168          if (getFormat() == 'wiki') {
 169              var stag = wtag;
 170              var etag = (wetag) ? wetag : wtag;
 171          } else {
 172              var stag = '<'+htag+'>';
 173              var etag = '</'+htag+'>';
 174          }
 175          encloseSelection(stag,etag);
 176      }
 177      
 178      function btStrong(label) {
 179          addButton(img_path+'bt_strong.png',label,
 180          function() { singleTag("'''",'strong'); });
 181      }
 182      
 183      function btEm(label) {
 184          addButton(img_path+'bt_em.png',label,
 185          function() { singleTag("''",'em'); });
 186      }
 187      
 188      function btIns(label) {
 189          addButton(img_path+'bt_ins.png',label,
 190          function() { singleTag('__','u'); });
 191      }
 192      
 193      function btDel(label) {
 194          addButton(img_path+'bt_del.png',label,
 195          function() { singleTag('--','stroke'); });
 196      }
 197      
 198      function btQ(label) {
 199          addButton(img_path+'bt_quote.png',label,
 200          function() { singleTag('{{','q','}}'); });
 201      }
 202      
 203      function btCode(label) {
 204          addButton(img_path+'bt_code.png',label,
 205          function() { singleTag('@@','code'); });
 206      }
 207      
 208      function btBr(label) {
 209          addButton(img_path+'bt_br.png',label,
 210          function() {
 211              var tag = getFormat() == 'wiki' ? "%%%\n" : "<br />\n";
 212              encloseSelection('',tag);
 213          });
 214      }
 215      
 216      function btBquote(label) {
 217          addButton(img_path+'bt_bquote.png',label,
 218          function() {
 219              encloseSelection("\n",'',
 220              function(str) {
 221                  if (getFormat() == 'wiki') {
 222                      str = str.replace(/\r/g,'');
 223                      return '> '+str.replace(/\n/g,"\n> ");
 224                  } else {
 225                      return "<blockquote>"+str+"</blockquote>\n";
 226                  }
 227              });
 228          });
 229      }
 230      
 231      function btPre(label) {
 232          addButton(img_path+'bt_pre.png',label,
 233          function() {
 234              encloseSelection("\n",'',
 235              function(str) {
 236                  if (getFormat() == 'wiki') {
 237                      str = str.replace(/\r/g,'');
 238                      return ' '+str.replace(/\n/g,"\n ");
 239                  } else {
 240                      return "<pre>"+str+"</pre>\n";
 241                  }
 242              });
 243          });
 244      }
 245      
 246      function btList(label,type) {
 247          var img = (type == 'ul') ? 'bt_ul.png' : 'bt_ol.png';
 248          var wtag = (type == 'ul') ? '*' : '#';
 249          
 250          addButton(img_path+img,label,
 251          function() {
 252              encloseSelection("",'',
 253              function(str) {
 254                  if (getFormat() == 'wiki') {
 255                      str = str.replace(/\r/g,'');
 256                      return wtag+' '+str.replace(/\n/g,"\n"+wtag+' ');
 257                  } else {
 258                      str = str.replace(/\r/g,'');
 259                      str = str.replace(/\n/g,"</li>\n <li>");
 260                      return "<"+type+">\n <li>"+str+"</li>\n</"+type+">";
 261                  }
 262              });
 263          });
 264      }
 265      
 266      function btLink(label,msg_url,msg_lang,default_lang) {
 267          addButton(img_path+'bt_link.png',label,
 268          function() {
 269              var href = window.prompt(msg_url,'');
 270              if (!href) { return; }
 271              
 272              var hreflang = window.prompt(msg_lang,default_lang);
 273              
 274              if (getFormat() == 'wiki') {
 275                  stag = '[';
 276                  var etag = '|'+href;
 277                  if (hreflang) { etag = etag+'|'+hreflang; }
 278                  etag = etag+']';
 279              } else {
 280                  var stag = '<a href="'+href+'"';
 281                  if (hreflang) { stag = stag+' hreflang="'+hreflang+'"'; }
 282                  stag = stag+'>';
 283                  etag = '</a>';
 284              }
 285              
 286              encloseSelection(stag,etag);
 287          });
 288      }
 289      
 290      function btImgLink(label,msg_src)
 291      {
 292          addButton(img_path+'bt_img_link.png',label,
 293          function() {
 294              encloseSelection('','',
 295              function(str) {
 296                  var src = window.prompt(msg_src,'');
 297                  if (!src) { return str; }
 298                  
 299                  if (getFormat() == 'wiki') {
 300                      if (str) {
 301                          return '(('+src+'|'+str+'))';
 302                      } else {
 303                          return '(('+src+'))';
 304                      }
 305                  } else {
 306                      if (str) {
 307                          return '<img src="'+src+'" alt="'+str+'" />';
 308                      } else {
 309                          return '<img src="'+src+'" alt="" />';
 310                      }
 311                  }
 312              });
 313          });
 314      }
 315      
 316      function btImg(label,url)
 317      {
 318          addButton(img_path+'bt_img.png',label,
 319          function() {
 320              popup(url);
 321          });
 322      }
 323      
 324      function insImg(src)
 325      {
 326          if (document.all) {
 327              textarea.focus();
 328              if (getFormat() == 'wiki') {
 329                  textarea.value = textarea.value+'(('+src+'))';
 330              } else {
 331                  textarea.value = textarea.value+'<img src="'+src+'" alt="" />';
 332              }
 333          } else {
 334              encloseSelection('','',
 335              function(str) {
 336                  if (getFormat() == 'wiki') {
 337                      if (str) {
 338                          return '(('+src+'|'+str+'))';
 339                      } else {
 340                          return '(('+src+'))';
 341                      }
 342                  } else {
 343                      if (str) {
 344                          return '<img src="'+src+'" alt="'+str+'" />';
 345                      } else {
 346                          return '<img src="'+src+'" alt="" />';
 347                      }
 348                  }
 349              });
 350          }
 351      }
 352      
 353      // methods
 354      this.addButton        = addButton;
 355      this.addSpace        = addSpace;
 356      this.draw            = draw;
 357      this.btStrong        = btStrong;
 358      this.btEm            = btEm;
 359      this.btIns        = btIns;
 360      this.btDel        = btDel;
 361      this.btQ            = btQ;
 362      this.btCode        = btCode;
 363      this.btBr            = btBr;
 364      this.btBquote        = btBquote;
 365      this.btPre        = btPre;
 366      this.btList        = btList;
 367      this.btLink        = btLink;
 368      this.btImgLink        = btImgLink;
 369      this.btImg        = btImg;
 370      this.insImg        = insImg;
 371  }