[Sommaire] [Imprimer]

   1  /*
   2   * FCKeditor - The text editor for Internet - http://www.fckeditor.net
   3   * Copyright (C) 2003-2007 Frederico Caldeira Knabben
   4   * 
   5   * == BEGIN LICENSE ==
   6   * 
   7   * Licensed under the terms of any of the following licenses at your
   8   * choice:
   9   * 
  10   *  - GNU General Public License Version 2 or later (the "GPL")
  11   *    http://www.gnu.org/licenses/gpl.html
  12   * 
  13   *  - GNU Lesser General Public License Version 2.1 or later (the "LGPL")
  14   *    http://www.gnu.org/licenses/lgpl.html
  15   * 
  16   *  - Mozilla Public License Version 1.1 or later (the "MPL")
  17   *    http://www.mozilla.org/MPL/MPL-1.1.html
  18   * 
  19   * == END LICENSE ==
  20   * 
  21   * File Name: fcktoolbarbuttonui.js
  22   *     FCKToolbarButtonUI Class: interface representation of a toolbar button.
  23   * 
  24   * File Authors:
  25   *         Frederico Caldeira Knabben (www.fckeditor.net)
  26   */
  27  
  28  var FCKToolbarButtonUI = function( name, label, tooltip, iconPathOrStripInfoArray, style, state )
  29  {
  30      this.Name        = name ;
  31      this.Label        = label || name ;
  32      this.Tooltip    = tooltip || this.Label ;
  33      this.Style        = style || FCK_TOOLBARITEM_ONLYICON ;
  34      this.State        = state || FCK_TRISTATE_OFF ;
  35      
  36      this.Icon = new FCKIcon( iconPathOrStripInfoArray ) ;
  37  
  38      if ( FCK.IECleanup )
  39          FCK.IECleanup.AddItem( this, FCKToolbarButtonUI_Cleanup ) ;
  40  }
  41  
  42  
  43  FCKToolbarButtonUI.prototype._CreatePaddingElement = function( document )
  44  {
  45      var oImg = document.createElement( 'IMG' ) ;
  46      oImg.className = 'TB_Button_Padding' ;
  47      oImg.src = FCK_SPACER_PATH ;
  48      return oImg ;
  49  }
  50  
  51  FCKToolbarButtonUI.prototype.Create = function( parentElement )
  52  {
  53      var oMainElement = this.MainElement ;
  54      
  55      if ( oMainElement )
  56      {
  57          FCKToolbarButtonUI_Cleanup.call(this) ;
  58          
  59          if ( oMainElement.parentNode )
  60              oMainElement.parentNode.removeChild( oMainElement ) ;
  61          oMainElement = this.MainElement = null ;
  62      }
  63  
  64      var oDoc = FCKTools.GetElementDocument( parentElement ) ;
  65      
  66      // Create the Main Element.
  67      oMainElement = this.MainElement = oDoc.createElement( 'DIV' ) ;
  68      oMainElement._FCKButton = this ;        // IE Memory Leak (Circular reference).
  69      oMainElement.title        = this.Tooltip ;
  70  
  71      // The following will prevent the button from catching the focus.
  72      if ( FCKBrowserInfo.IsGecko )
  73           oMainElement.onmousedown    = FCKTools.CancelEvent ;
  74  
  75      this.ChangeState( this.State, true ) ;
  76  
  77      if ( this.Style == FCK_TOOLBARITEM_ONLYICON && !this.ShowArrow )
  78      {
  79          // <td><div class="TB_Button_On" title="Smiley">{Image}</div></td>
  80          
  81          oMainElement.appendChild( this.Icon.CreateIconElement( oDoc ) ) ;
  82      }
  83      else
  84      {
  85          // <td><div class="TB_Button_On" title="Smiley"><table cellpadding="0" cellspacing="0"><tr><td>{Image}</td><td nowrap>Toolbar Button</td><td><img class="TB_Button_Padding"></td></tr></table></div></td>
  86          // <td><div class="TB_Button_On" title="Smiley"><table cellpadding="0" cellspacing="0"><tr><td><img class="TB_Button_Padding"></td><td nowrap>Toolbar Button</td><td><img class="TB_Button_Padding"></td></tr></table></div></td>
  87          
  88          var oTable = oMainElement.appendChild( oDoc.createElement( 'TABLE' ) ) ;
  89          oTable.cellPadding = 0 ;
  90          oTable.cellSpacing = 0 ;
  91  
  92          var oRow = oTable.insertRow(-1) ;
  93          
  94          // The Image cell (icon or padding).
  95          var oCell = oRow.insertCell(-1) ;
  96          
  97          if ( this.Style == FCK_TOOLBARITEM_ONLYICON || this.Style == FCK_TOOLBARITEM_ICONTEXT )
  98              oCell.appendChild( this.Icon.CreateIconElement( oDoc ) ) ;
  99          else
 100              oCell.appendChild( this._CreatePaddingElement( oDoc ) ) ;
 101          
 102          if ( this.Style == FCK_TOOLBARITEM_ONLYTEXT || this.Style == FCK_TOOLBARITEM_ICONTEXT )
 103          {
 104              // The Text cell.
 105              oCell = oRow.insertCell(-1) ;
 106              oCell.className = 'TB_Button_Text' ;
 107              oCell.noWrap = true ;
 108              oCell.appendChild( oDoc.createTextNode( this.Label ) ) ;
 109          }
 110          
 111          if ( this.ShowArrow )
 112          {
 113              if ( this.Style != FCK_TOOLBARITEM_ONLYICON )
 114              {    
 115                  // A padding cell.
 116                  oRow.insertCell(-1).appendChild( this._CreatePaddingElement( oDoc ) ) ;
 117              }
 118              
 119              oCell = oRow.insertCell(-1) ;
 120              var eImg = oCell.appendChild( oDoc.createElement( 'IMG' ) ) ;
 121              eImg.src    = FCKConfig.SkinPath + 'images/toolbar.buttonarrow.gif' ;
 122              eImg.width    = 5 ;
 123              eImg.height    = 3 ;
 124          }
 125  
 126          // The last padding cell.
 127          oCell = oRow.insertCell(-1) ;
 128          oCell.appendChild( this._CreatePaddingElement( oDoc ) ) ;
 129      }
 130      
 131      parentElement.appendChild( oMainElement ) ;
 132  }
 133  
 134  FCKToolbarButtonUI.prototype.ChangeState = function( newState, force )
 135  {
 136      if ( !force && this.State == newState )
 137          return ;
 138  
 139      var e = this.MainElement ;
 140  
 141      switch ( parseInt( newState, 10 ) )
 142      {
 143          case FCK_TRISTATE_OFF :
 144              e.className        = 'TB_Button_Off' ;
 145              e.onmouseover    = FCKToolbarButton_OnMouseOverOff ;
 146              e.onmouseout    = FCKToolbarButton_OnMouseOutOff ;
 147              e.onclick        = FCKToolbarButton_OnClick ;
 148              
 149              break ;
 150              
 151          case FCK_TRISTATE_ON :
 152              e.className        = 'TB_Button_On' ;
 153              e.onmouseover    = FCKToolbarButton_OnMouseOverOn ;
 154              e.onmouseout    = FCKToolbarButton_OnMouseOutOn ;
 155              e.onclick        = FCKToolbarButton_OnClick ;
 156              
 157              break ;
 158  
 159          case FCK_TRISTATE_DISABLED :
 160              e.className        = 'TB_Button_Disabled' ;
 161              e.onmouseover    = null ;
 162              e.onmouseout    = null ;
 163              e.onclick        = null ;
 164  
 165              break ;
 166      }
 167  
 168      this.State = newState ;
 169  }
 170  
 171  function FCKToolbarButtonUI_Cleanup()
 172  {
 173      if ( this.MainElement )
 174      {
 175          this.MainElement._FCKButton = null ;
 176          this.MainElement = null ;
 177      }
 178  }    
 179  
 180  // Event Handlers.
 181  
 182  function FCKToolbarButton_OnMouseOverOn()
 183  {
 184      this.className = 'TB_Button_On_Over' ;
 185  }
 186  
 187  function FCKToolbarButton_OnMouseOutOn()
 188  {
 189      this.className = 'TB_Button_On' ;
 190  }
 191  
 192  function FCKToolbarButton_OnMouseOverOff()
 193  {
 194      this.className = 'TB_Button_Off_Over' ;
 195  }
 196  
 197  function FCKToolbarButton_OnMouseOutOff()
 198  {
 199      this.className = 'TB_Button_Off' ;
 200  }
 201  
 202  function FCKToolbarButton_OnClick( e )
 203  {
 204      if ( this._FCKButton.OnClick )
 205          this._FCKButton.OnClick( this._FCKButton ) ;
 206  }
 207  
 208  /* 
 209      Sample outputs:
 210  
 211      This is the base structure. The variation is the image that is marked as {Image}:
 212          <td><div class="TB_Button_On" title="Smiley">{Image}</div></td>
 213          <td><div class="TB_Button_On" title="Smiley"><table cellpadding="0" cellspacing="0"><tr><td>{Image}</td><td nowrap>Toolbar Button</td><td><img class="TB_Button_Padding"></td></tr></table></div></td>
 214          <td><div class="TB_Button_On" title="Smiley"><table cellpadding="0" cellspacing="0"><tr><td><img class="TB_Button_Padding"></td><td nowrap>Toolbar Button</td><td><img class="TB_Button_Padding"></td></tr></table></div></td>
 215  
 216      These are samples of possible {Image} values:
 217          
 218          Strip - IE version:
 219              <div class="TB_Button_Image"><img src="strip.gif" style="top:-16px"></div>
 220          
 221          Strip : Firefox, Safari and Opera version
 222              <img class="TB_Button_Image" style="background-position: 0px -16px;background-image: url(strip.gif);">
 223          
 224          No-Strip : Browser independent:
 225              <img class="TB_Button_Image" src="smiley.gif">
 226  */