[Summary view] [Print] [Text view]

   1  /**
   2   * The DokuWiki editor features
   3   *
   4   * These are the advanced features of the editor. It does NOT contain any
   5   * code for the toolbar buttons and it functions. See toolbar.js for that.
   6   */
   7  
   8  var dw_editor = {
   9  
  10      /**
  11       * initialize the default editor functionality
  12       *
  13       * All other functions can also be called separately for non-default
  14       * textareas
  15       */
  16      init: function(){
  17          var $editor = jQuery('#wiki__text');
  18          if($editor.length === 0) {
  19              return;
  20          }
  21  
  22          dw_editor.initSizeCtl('#size__ctl',$editor);
  23  
  24          if($editor.attr('readOnly')) {
  25              return;
  26          }
  27  
  28          $editor.keydown(dw_editor.keyHandler);
  29  
  30      },
  31  
  32      /**
  33       * Add the edit window size and wrap controls
  34       *
  35       * Initial values are read from cookie if it exists
  36       *
  37       * @param selector ctlarea the div to place the controls
  38       * @param selector editor  the textarea to control
  39       */
  40      initSizeCtl: function(ctlarea,editor){
  41          var $ctl      = jQuery(ctlarea),
  42              $textarea = jQuery(editor);
  43  
  44          if($ctl.length === 0 || $textarea.length === 0) {
  45              return;
  46          }
  47  
  48          $textarea.css('height', DokuCookie.getValue('sizeCtl') || '300px');
  49  
  50          var wrp = DokuCookie.getValue('wrapCtl');
  51          if(wrp){
  52              dw_editor.setWrap($textarea[0], wrp);
  53          } // else use default value
  54  
  55          jQuery.each([
  56              ['larger', function(){dw_editor.sizeCtl(editor,100);}],
  57              ['smaller', function(){dw_editor.sizeCtl(editor,-100);}],
  58              ['wrap', function(){dw_editor.toggleWrap(editor);}]
  59          ], function (_, img) {
  60              jQuery(document.createElement('img'))
  61                  .attr('src', DOKU_BASE+'lib/images/' + img[0] + '.gif')
  62                  .attr('alt', '')
  63                  .on('click', img[1])
  64                  .appendTo($ctl);
  65          });
  66      },
  67  
  68      /**
  69       * This sets the vertical size of the editbox and adjusts the cookie
  70       *
  71       * @param selector editor  the textarea to control
  72       * @param int val          the relative value to resize in pixel
  73       */
  74      sizeCtl: function(editor,val){
  75          var $textarea = jQuery(editor),
  76              height = parseInt($textarea.css('height')) + val;
  77          $textarea.css('height', height+'px');
  78          DokuCookie.setValue('sizeCtl',$textarea.css('height'));
  79      },
  80  
  81      /**
  82       * Toggle the wrapping mode of the editor textarea and adjusts the
  83       * cookie
  84       *
  85       * @param selector editor  the textarea to control
  86       */
  87      toggleWrap: function(editor){
  88          var $textarea = jQuery(editor),
  89              wrap = $textarea.attr('wrap');
  90          dw_editor.setWrap($textarea[0],
  91                            (wrap && wrap.toLowerCase() == 'off') ? 'soft' : 'off');
  92          DokuCookie.setValue('wrapCtl',$textarea.attr('wrap'));
  93      },
  94  
  95      /**
  96       * Set the wrapping mode of a textarea
  97       *
  98       * @author Fluffy Convict <fluffyconvict@hotmail.com>
  99       * @author <shutdown@flashmail.com>
 100       * @link   http://news.hping.org/comp.lang.javascript.archive/12265.html
 101       * @link   https://bugzilla.mozilla.org/show_bug.cgi?id=41464
 102       * @param  DomObject textarea
 103       * @param  string wrapAttrValue
 104       */
 105      setWrap: function(textarea, wrapAttrValue){
 106          textarea.setAttribute('wrap', wrapAttrValue);
 107  
 108          // Fix display for mozilla
 109          var parNod = textarea.parentNode;
 110          var nxtSib = textarea.nextSibling;
 111          parNod.removeChild(textarea);
 112          parNod.insertBefore(textarea, nxtSib);
 113      },
 114  
 115      /**
 116       * Make intended formattings easier to handle
 117       *
 118       * Listens to all key inputs and handle indentions
 119       * of lists and code blocks
 120       *
 121       * Currently handles space, backspace, enter and
 122       * ctrl-enter presses
 123       *
 124       * @author Andreas Gohr <andi@splitbrain.org>
 125       * @fixme handle tabs
 126       * @param event e - the key press event object
 127       */
 128      keyHandler: function(e){
 129          if(jQuery.inArray(e.keyCode,[8, 10, 13, 32]) === -1) {
 130              return;
 131          }
 132          var selection = DWgetSelection(this);
 133          if(selection.getLength() > 0) {
 134              return; //there was text selected, keep standard behavior
 135          }
 136          var search    = "\n"+this.value.substr(0,selection.start);
 137          var linestart = Math.max(search.lastIndexOf("\n"),
 138                                   search.lastIndexOf("\r")); //IE workaround
 139          search = search.substr(linestart);
 140  
 141          if((e.keyCode == 13 || e.keyCode == 10) && e.ctrlKey) { // Ctrl-Enter (With Chrome workaround)
 142              // Submit current edit
 143              jQuery('#edbtn__save').trigger('click');
 144              e.preventDefault(); // prevent enter key
 145              return false;
 146          }else if(e.keyCode == 13){ // Enter
 147              // keep current indention for lists and code
 148              var match = search.match(/(\n  +([\*-] ?)?)/);
 149              if(match){
 150                  var scroll = this.scrollHeight;
 151                  var match2 = search.match(/^\n  +[\*-]\s*$/);
 152                  // Cancel list if the last item is empty (i. e. two times enter)
 153                  if (match2 && this.value.substr(selection.start).match(/^($|\r?\n)/)) {
 154                      this.value = this.value.substr(0, linestart) + "\n" +
 155                                   this.value.substr(selection.start);
 156                      selection.start = linestart + 1;
 157                      selection.end = linestart + 1;
 158                      DWsetSelection(selection);
 159                  } else {
 160                      insertAtCarret(this.id,match[1]);
 161                  }
 162                  this.scrollTop += (this.scrollHeight - scroll);
 163                  e.preventDefault(); // prevent enter key
 164                  return false;
 165              }
 166          }else if(e.keyCode == 8){ // Backspace
 167              // unindent lists
 168              var match = search.match(/(\n  +)([*-] ?)$/);
 169              if(match){
 170                  var spaces = match[1].length-1;
 171  
 172                  if(spaces > 3){ // unindent one level
 173                      this.value = this.value.substr(0,linestart)+
 174                                   this.value.substr(linestart+2);
 175                      selection.start = selection.start - 2;
 176                      selection.end   = selection.start;
 177                  }else{ // delete list point
 178                      this.value = this.value.substr(0,linestart)+
 179                                   this.value.substr(selection.start);
 180                      selection.start = linestart;
 181                      selection.end   = linestart;
 182                  }
 183                  DWsetSelection(selection);
 184                  e.preventDefault(); // prevent backspace
 185                  return false;
 186              }
 187          }else if(e.keyCode == 32){ // Space
 188              // intend list item
 189              var match = search.match(/(\n  +)([*-] )$/);
 190              if(match){
 191                  this.value = this.value.substr(0,linestart)+'  '+
 192                               this.value.substr(linestart);
 193                  selection.start = selection.start + 2;
 194                  selection.end   = selection.start;
 195                  DWsetSelection(selection);
 196                  e.preventDefault(); // prevent space
 197                  return false;
 198              }
 199          }
 200      }
 201  
 202  
 203  };
 204  
 205  jQuery(dw_editor.init);