Changeset 558


Ignore:
Timestamp:
08/25/06 13:45:41 (8 years ago)
Author:
mokhet
Message:
  • add prototype.removeEvent and prototype.notifierRemove
  • apply color picker IE fix and saved colors from ticket #85
  • bring back anonymous function in events (when available) for a better diff with trunk
  • disable patch from ticket #827 until a proper fix for IE is found
  • fix undeclared variable used in popup.js
  • fix undefined parameter used in listType plugin
Location:
branches/mokhet
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • branches/mokhet/htmlarea.js

    r551 r558  
    367367  this.showLoading = false; 
    368368 
     369  // size of color picker cells 
     370  this.colorPickerCellsize = '6px'; 
     371  // granularity of color picker cells (number per column/row) 
     372  this.colorPickerGranularity = 18; 
     373  // position of color picker from toolbar button 
     374  this.colorPickerPosition = 'bottom,right'; 
     375 
    369376  /** CUSTOMIZING THE TOOLBAR 
    370377   * ------------------------- 
     
    889896  var tb_row = null; 
    890897  var tb_objects = {}; 
    891   // wrong case name. Should be this._toolBarObjects according to the comment 5 lines above 
     898  // [mokhet] wrong case name. Should be this._toolBarObjects according to the comment 5 lines above 
    892899  this._toolbarObjects = tb_objects; 
    893900 
     
    11281135        }; 
    11291136       
    1130 //        editor.freeLater(obj); 
    11311137        editor.freeLater(obj, ['element', 'state']); 
    1132  
    11331138        tb_objects[txt] = obj; 
    11341139      break; 
     
    11591164      }; 
    11601165//      editor.freeLater(el); 
    1161 //      editor.freeLater(obj); 
    11621166      editor.freeLater(obj, ['element', 'cmd', 'state', 'imgel', 'swapImage']); 
    11631167 
     
    11691173 
    11701174      // handlers to emulate nice flat toolbar buttons 
    1171       function el_onmouseout() 
    1172       { 
    1173         if ( obj.enabled ) 
    1174         { 
    1175           //HTMLArea._removeClass(el, "buttonHover"); 
    1176           HTMLArea._removeClass(el, "buttonActive"); 
    1177           if ( obj.active ) 
     1175      editor.addEvent( 
     1176        el, 
     1177        "mouseout", 
     1178        function() 
     1179        { 
     1180          if ( obj.enabled ) 
    11781181          { 
    1179             HTMLArea._addClass(el, "buttonPressed"); 
     1182            //HTMLArea._removeClass(el, "buttonHover"); 
     1183            HTMLArea._removeClass(el, "buttonActive"); 
     1184            if ( obj.active ) 
     1185            { 
     1186              HTMLArea._addClass(el, "buttonPressed"); 
     1187            } 
    11801188          } 
    11811189        } 
    1182       } 
    1183       function el_onmousedown(ev) 
    1184       { 
    1185         if ( obj.enabled ) 
    1186         { 
    1187           HTMLArea._addClass(el, "buttonActive"); 
    1188           HTMLArea._removeClass(el, "buttonPressed"); 
    1189         } 
    1190         HTMLArea.Events.stop(ev); 
    1191       } 
     1190      ); 
     1191 
     1192      editor.addEvent( 
     1193        el, 
     1194        "mousedown", 
     1195        function(ev) 
     1196        { 
     1197          if ( obj.enabled ) 
     1198          { 
     1199            HTMLArea._addClass(el, "buttonActive"); 
     1200            HTMLArea._removeClass(el, "buttonPressed"); 
     1201          } 
     1202          HTMLArea.Events.stop(ev); 
     1203        } 
     1204      ); 
     1205 
    11921206      // when clicked, do the following: 
    1193       function el_onclick(ev) 
    1194       { 
    1195         if ( obj.enabled ) 
    1196         { 
    1197           HTMLArea._removeClass(el, "buttonActive"); 
    1198           //HTMLArea._removeClass(el, "buttonHover"); 
    1199           if ( HTMLArea.is_gecko ) 
     1207      editor.addEvent( 
     1208        el, 
     1209        "click", 
     1210        function(ev) 
     1211        { 
     1212          if ( obj.enabled ) 
    12001213          { 
    1201             editor.activateEditor(); 
     1214            HTMLArea._removeClass(el, "buttonActive"); 
     1215            //HTMLArea._removeClass(el, "buttonHover"); 
     1216            if ( HTMLArea.is_gecko ) 
     1217            { 
     1218              editor.activateEditor(); 
     1219            } 
     1220            obj.cmd(editor, obj.name, obj); 
    12021221          } 
    1203           obj.cmd(editor, obj.name, obj); 
    1204         } 
    1205         HTMLArea.Events.stop(ev); 
    1206       } 
    1207       editor.addEvent(el, 'mouseout', el_onmouseout); 
    1208       editor.addEvent(el, 'mousedown', el_onmousedown); 
    1209       editor.addEvent(el, 'click', el_onclick); 
     1222          HTMLArea.Events.stop(ev); 
     1223        } 
     1224      ); 
    12101225 
    12111226      var i_contain = HTMLArea.makeBtnImg(btn[1]); 
     
    14331448  } 
    14341449 
     1450  if ( typeof colorPicker == 'undefined' ) 
     1451  { 
     1452    HTMLArea._loadback(_editor_url + 'popups/color_picker.js', this.generate, this ); 
     1453    return false; 
     1454  } 
     1455 
    14351456  if ( _editor_skin !== "" ) 
    14361457  { 
     
    16081629 
    16091630    // update the original form.submit() function. See ticket #823 
     1631    // disabled until a proper fix for IE is found 
     1632/* 
    16101633    if ( !textarea.form.xinha_submit ) 
    16111634    { 
     
    16281651      }; 
    16291652    } 
    1630      
    1631     // this variable should already be saved when the editor was generating 
     1653*/ 
     1654    // [mokhet] this variable should already be saved when the editor was generating 
    16321655    var initialTAContent = textarea.value; 
    16331656 
    16341657    // onreset revert the HTMLArea content to the textarea content 
    1635     function form_onreset() 
    1636     { 
    1637       editor.setHTML(editor.inwardHtml(initialTAContent)); 
    1638       editor.updateToolbar(); 
    1639       return true; 
    1640     } 
    1641     editor.prependDom0Event(textarea.form, 'reset', form_onreset); 
     1658    editor.prependDom0Event( 
     1659      textarea.form, 
     1660      'reset', 
     1661      function() 
     1662      { 
     1663        editor.setHTML(editor.inwardHtml(initialTAContent)); 
     1664        editor.updateToolbar(); 
     1665        return true; 
     1666      } 
     1667    ); 
    16421668  } 
    16431669 
    16441670  // add a handler for the "back/forward" case -- on body.unload we save 
    16451671  // the HTML content into the original textarea. 
    1646   function backforward() 
    1647   { 
    1648     textarea.value = editor.outwardHtml(editor.getHTML()); 
    1649     return true; 
    1650   } 
    1651   editor.prependDom0Event(window, 'unload', backforward); 
     1672  editor.prependDom0Event( 
     1673    window, 
     1674    'unload', 
     1675    function() 
     1676    { 
     1677      textarea.value = editor.outwardHtml(editor.getHTML()); 
     1678      return true; 
     1679    } 
     1680  ); 
    16521681 
    16531682  // Hide textarea 
     
    16591688  // Add an event to initialize the iframe once loaded. 
    16601689  editor._iframeLoadDone = false; 
    1661   function iframe_onload() 
    1662   { 
    1663     if ( !editor._iframeLoadDone ) 
    1664     { 
    1665       editor._iframeLoadDone = true; 
    1666       editor.initIframe(); 
    1667     } 
    1668     return true; 
    1669   } 
    1670   editor.addEvent(iframe, 'load', iframe_onload); 
     1690  editor.addEvent( 
     1691    iframe, 
     1692    'load', 
     1693    function() 
     1694    { 
     1695      if ( !editor._iframeLoadDone ) 
     1696      { 
     1697        editor._iframeLoadDone = true; 
     1698        editor.initIframe(); 
     1699      } 
     1700      return true; 
     1701    } 
     1702  ); 
    16711703 
    16721704  return true; 
     
    23672399      var doc = editor._doc; 
    23682400      // if we have multiple editors some bug in Mozilla makes some lose editing ability 
    2369       editor.addEvent(doc, 'mousedown', editor.activateEditor, false, editor); 
     2401      editor.addEvent( 
     2402        doc, 
     2403        "mousedown", 
     2404        function() 
     2405        { 
     2406          editor.activateEditor(); 
     2407          return true; 
     2408        } 
     2409      ); 
    23702410 
    23712411      // intercept some events; for updating the toolbar & keyboard handlers 
     
    30903130          for ( var ka = 0; ka < attrs.length; ++ka ) 
    30913131          { 
    3092             // eval ???? why not using the following line instead ? 
     3132            // [mokhet] eval ???? why not using the following line instead ? 
    30933133            // if ( !ancestors[k][attrs[ka]] ) 
    30943134            if ( !eval("ancestors[k]." + attrs[ka]) ) 
     
    36673707}; 
    36683708 
    3669 // Why is this is still in the trunk ? 
     3709// [mokhet] move to deprecated.js ticket #829 
    36703710// there's no reference to it anywhere else even in plugins 
    36713711HTMLArea.prototype._formatBlock = function(block_format) 
     
    37663806    } 
    37673807  } 
    3768  
     3808  return true; 
    37693809}; 
    37703810 
     
    42474287{ 
    42484288  var editor = this;    // for nested functions 
     4289  var btn = editor._toolbarObjects[cmdID].element; 
    42494290  if ( cmdID == 'hilitecolor' ) 
    42504291  { 
     
    42624303    } 
    42634304  } 
    4264   this._popupDialog( 
    4265     editor.config.URIs.select_color, 
    4266     function(color) 
    4267     { 
    4268       // selection not canceled 
    4269       if ( color ) 
    4270       { 
    4271         editor._doc.execCommand(cmdID, false, "#" + color); 
    4272       } 
    4273     }, 
    4274     HTMLArea._colorToRgb(this._doc.queryCommandValue(cmdID))); 
     4305  var cback = function(color) { editor._doc.execCommand(cmdID, false, color); }; 
     4306  if ( HTMLArea.is_ie ) 
     4307  { 
     4308    var range = editor._createRange(editor._getSelection()); 
     4309    cback = function(color) 
     4310    { 
     4311      range.select(); 
     4312      editor._doc.execCommand(cmdID, false, color); 
     4313    }; 
     4314  } 
     4315  var picker = new colorPicker({cellsize:editor.config.colorPickerCellsize,callback:cback,granularity:editor.config.colorPickerGranularity}); 
     4316  picker.open(editor.config.colorPickerPosition, btn); 
    42754317}; 
    42764318 
     
    52975339 
    52985340// FIXME!!! this should return false for IE < 5.5 
     5341// @todo : this should check for objects existence and NOT on useragent strings 
    52995342HTMLArea.checkSupportedBrowser = function() 
    53005343{ 
     
    53885431  } 
    53895432}; 
     5433 
     5434/** 
     5435 * Remove the notifier for the couple ev / fn 
     5436 * @param {string} ev EventNotifier type to remove 
     5437 * @param {object} fn Function to remove 
     5438 * @return {boolean} true if the removing was successfull 
     5439 * @public 
     5440 */ 
     5441HTMLArea.prototype.notifyRemove = function(ev, fn) 
     5442{ 
     5443  if ( this._notifyListeners[ev] ) 
     5444  { 
     5445    var index = this._notifyListeners[ev].indexOf(fn); 
     5446    if ( index != -1 ) 
     5447    { 
     5448      this._notifyListeners[ev].splice(index, 1); 
     5449      return true; 
     5450    } 
     5451  } 
     5452  return false; 
     5453}; 
     5454 
    53905455 
    53915456/* 
     
    66076672  if ( returnValue ) 
    66086673  { 
    6609     this.notifyOn('dispose', function() { HTMLArea.Events.remove(element, type, handler, scope); }); 
     6674    function notifier() { HTMLArea.Events.remove(element, type, handler, scope); } 
     6675    function notifierRemove() 
     6676    { 
     6677      // call the notifier to actually remove the listener 
     6678      notifier(); 
     6679      // remove the notifiers 
     6680      this.notifyRemove('dispose', notifier); 
     6681      this.notifyRemove('remove_event_autodisposer', notifierRemove); 
     6682    } 
     6683    this.notifyOn('dispose', notifier); 
     6684    this.notifyOn('remove_event_autodisposer', notifierRemove); 
    66106685  } 
    66116686  return returnValue; 
     
    66326707{ 
    66336708  return this.addEvent(element, type, handler, 'prepend', scope, arbitraryObj); 
     6709}; 
     6710 
     6711/** 
     6712 * Remove an event listener and remove the associated dispose notifier 
     6713 * @see HTMLArea.Events.remove, @see HTMLArea.prototype.addEvent 
     6714 * @public 
     6715 */ 
     6716HTMLArea.prototype.removeEvent = function(element, type, handler, scope) 
     6717{ 
     6718  this.notifyOf('remove_event_autodisposer'); 
    66346719}; 
    66356720 
     
    72247309/* 
    72257310--------------------------------------------------------------------------- 
    7226   COMPATIBILITY ALIAS 
     7311  EVENT COMPATIBILITY ALIAS 
    72277312--------------------------------------------------------------------------- 
    72287313*/ 
  • branches/mokhet/plugins/ListType/list-type.js

    r430 r558  
    3737  { 
    3838    editor._ListType = editor.addPanel( 'right' ); 
    39     HTMLArea.freeLater( editor, '_ListType' ); 
     39    editor.freeLater( editor, '_ListType' ); 
    4040    HTMLArea.addClass( editor._ListType, 'ListType' ); 
    4141    // hurm, ok it's pretty to use the background color for the whole panel, 
     
    4646      function(e,args) 
    4747      { 
    48         if ( args.mode == 'text' ) editor.hidePanel( editor._ListType ); 
     48        if ( args.mode == 'text' ) { editor.hidePanel( editor._ListType ); } 
    4949      } 
    5050    ); 
     
    130130ListType.prototype.onUpdateToolbar = function() 
    131131{ 
    132   if ( this.editor.config.ListType.mode == 'toolbar' ) return ; 
     132  if ( this.editor.config.ListType.mode == 'toolbar' ) { return ; } 
    133133  var parent = this.editor.getParentElement(); 
    134   while ( parent && !/^[o|u]l$/i.test( parent.tagName ) ) 
     134  while ( parent && parent.tagName && !/^[o|u]l$/i.test( parent.tagName ) ) 
     135  { 
    135136    parent = parent.parentNode; 
    136   if (parent && /^[o|u]l$/i.test( parent.tagName ) ) 
     137  } 
     138  if (parent && parent.tagName && /^[o|u]l$/i.test( parent.tagName ) ) 
    137139  { 
    138140    this.showPanel( parent ); 
    139141  } 
    140   else if (this.editor._ListType.style.display != 'none') 
     142  else if ( this.editor._ListType.style.display != 'none' ) 
    141143  { 
    142144    this.editor.hidePanel( this.editor._ListType ); 
  • branches/mokhet/popups/color_picker.js

    r376 r558  
    7575  function colorPicker(params) 
    7676  { 
     77    // if the savedColors is empty, try to read the savedColors from cookie 
     78    if ( colorPicker.savedColors.length == 0 ) 
     79    { 
     80      colorPicker.loadColors(); 
     81    } 
    7782    var picker = this; 
    7883    this.callback = params.callback?params.callback:function(color){alert('You picked ' + color )}; 
    7984 
     85    this.websafe  = params.websafe?params.websafe:false; 
    8086    this.cellsize = params.cellsize?params.cellsize:'10px'; 
    8187    this.side     = params.granularity?params.granularity:18; 
     
    289295        this.table.style.left = (left - (this.table.offsetWidth - element.offsetWidth)) + 'px'; 
    290296      } 
     297      // IE ONLY - prevent windowed elements (<SELECT>) to render above the colorpicker 
     298      /*@cc_on 
     299      this.iframe.style.top = this.table.style.top; 
     300      this.iframe.style.left = this.table.style.left; 
     301      @*/ 
    291302    }; 
    292303 
     
    339350              } 
    340351            } 
    341             td.onclick = function() { picker.callback(this.colorCode); picker.close(); } 
     352            td.onclick = function() { colorPicker.remember(this.colorCode); picker.callback(this.colorCode); picker.close(); } 
    342353            td.appendChild(document.createTextNode(' ')); 
    343354            td.style.cursor = 'pointer'; 
     
    414425            } 
    415426          } 
    416           td.onclick = function() { picker.callback(this.colorCode); picker.close(); } 
     427          td.onclick = function() { colorPicker.remember(this.colorCode); picker.callback(this.colorCode); picker.close(); } 
    417428          td.appendChild(document.createTextNode(' ')); 
    418429          td.style.cursor = 'pointer'; 
     
    430441        td.style.padding = '3px'; 
    431442 
     443        if ( this.websafe ) 
     444        { 
    432445        var div = document.createElement('div'); 
    433446        var label = document.createElement('label'); 
     
    440453        div.appendChild(label); 
    441454        td.appendChild(div); 
     455        } 
    442456 
    443457        var div = document.createElement('div'); 
     
    467481        td.appendChild(sampleTable); 
    468482 
     483        var savedColors = document.createElement('div'); 
     484        savedColors.style.clear = 'both'; 
     485 
     486        function createSavedColors(color) 
     487        { 
     488          var is_ie = false; 
     489          /*@cc_on is_ie = true; @*/ 
     490          var div = document.createElement('div'); 
     491          div.style.width = '13px'; 
     492          div.style.height = '13px'; 
     493          div.style.margin = '1px'; 
     494          div.style.border = '1px solid black'; 
     495          div.style.cursor = 'pointer'; 
     496          div.style.backgroundColor = color; 
     497          div.style[ is_ie ? 'styleFloat' : 'cssFloat'] = 'left'; 
     498          div.onclick = function() { picker.callback(color); picker.close(); }; 
     499          div.onmouseover = function() 
     500          { 
     501            picker.chosenColor.value = color; 
     502            picker.backSample.style.backgroundColor = color; 
     503            picker.foreSample.style.color = color; 
     504          }; 
     505          savedColors.appendChild(div); 
     506        } 
     507        for ( var savedCols = 0; savedCols < colorPicker.savedColors.length; savedCols++ ) 
     508        { 
     509          createSavedColors(colorPicker.savedColors[savedCols]); 
     510        } 
     511        td.appendChild(savedColors); 
    469512 
    470513        this.tbody.appendChild(tr); 
    471514        document.body.appendChild(this.table); 
    472  
     515        // IE ONLY - prevent windowed elements (<SELECT>) to render above the colorpicker 
     516        /*@cc_on 
     517        if ( !this.iframe ) 
     518        { 
     519          this.iframe = document.createElement('iframe'); 
     520          this.iframe.style.zIndex = 999; 
     521          this.table.style.zIndex = 1000; 
     522          this.iframe.style.position = 'absolute'; 
     523          this.iframe.style.width = this.table.offsetWidth; 
     524          this.iframe.style.height = this.table.offsetHeight; 
     525          this.iframe.border = 0; 
     526          this.iframe.frameBorder = 0; 
     527          this.iframe.frameSpacing = 0; 
     528          this.iframe.marginWidth = 0; 
     529          this.iframe.marginHeight = 0; 
     530          this.iframe.hspace = 0; 
     531          this.iframe.vspace = 0; 
     532          document.body.appendChild(this.iframe); 
     533        } 
     534        this.iframe.style.display = ''; 
     535        @*/ 
    473536      } 
    474537      else 
     
    496559    { 
    497560      this.table.style.display = 'none'; 
     561      // IE ONLY - prevent windowed elements (<SELECT>) to render above the colorpicker 
     562      /*@cc_on 
     563      if ( this.iframe ) { this.iframe.style.display = 'none'; } 
     564      @*/ 
    498565    }; 
    499  
    500566  } 
     567 
     568// array of the saved colors 
     569colorPicker.savedColors = []; 
     570 
     571// add the color to the savedColors 
     572colorPicker.remember = function(color) 
     573{ 
     574  // check if this color is known 
     575  for ( var i = colorPicker.savedColors.length; i--; ) 
     576  { 
     577    if ( colorPicker.savedColors[i] == color ) 
     578    { 
     579      return false; 
     580    } 
     581  } 
     582  // insert the new color 
     583  colorPicker.savedColors.splice(0, 0, color); 
     584  // limit elements 
     585  colorPicker.savedColors = colorPicker.savedColors.slice(0, 21); 
     586  //[mokhet] probably some more parameters to send to the cookie definition 
     587  // like domain, secure and such, especially with https connection i presume 
     588  // save the cookie 
     589  var expdate = new Date(); 
     590  expdate.setMonth(expdate.getMonth() + 1); 
     591 
     592  document.cookie = 'XinhaColorPicker=' + escape (colorPicker.savedColors.join('-')) + ';expires=' + expdate.toGMTString(); 
     593  return true; 
     594}; 
     595 
     596// try to read the colors from the cookie 
     597colorPicker.loadColors = function() 
     598{ 
     599  var index = document.cookie.indexOf('XinhaColorPicker'); 
     600  if ( index != -1 ) 
     601  { 
     602    var begin = (document.cookie.indexOf('=', index) + 1); 
     603    var end = document.cookie.indexOf(';', index); 
     604    if ( end == -1 ) { end = document.cookie.length; } 
     605    colorPicker.savedColors = unescape(document.cookie.substring(begin, end)).split('-'); 
     606  } 
     607}; 
  • branches/mokhet/popups/popup.js

    r504 r558  
    1111// 
    1212// $Id$ 
    13 HTMLArea = window.opener.HTMLArea; 
     13var HTMLArea = window.opener.HTMLArea; 
    1414 
    1515function getAbsolutePos(el) { 
Note: See TracChangeset for help on using the changeset viewer.