rt/share/html/NoAuth/RichText/FCKeditor/editor/_source/classes/fckspecialcombo.js

   1 /*\r
   2  * FCKeditor - The text editor for Internet - http://www.fckeditor.net\r
   3  * Copyright (C) 2003-2009 Frederico Caldeira Knabben\r
   4  *\r
   5  * == BEGIN LICENSE ==\r
   6  *\r
   7  * Licensed under the terms of any of the following licenses at your\r
   8  * choice:\r
   9  *\r
  10  *  - GNU General Public License Version 2 or later (the "GPL")\r
  11  *    http://www.gnu.org/licenses/gpl.html\r
  12  *\r
  13  *  - GNU Lesser General Public License Version 2.1 or later (the "LGPL")\r
  14  *    http://www.gnu.org/licenses/lgpl.html\r
  15  *\r
  16  *  - Mozilla Public License Version 1.1 or later (the "MPL")\r
  17  *    http://www.mozilla.org/MPL/MPL-1.1.html\r
  18  *\r
  19  * == END LICENSE ==\r
  20  *\r
  21  * FCKSpecialCombo Class: represents a special combo.\r
  22  */\r
  23 \r
  24 var FCKSpecialCombo = function( caption, fieldWidth, panelWidth, panelMaxHeight, parentWindow )\r
  25 {\r
  26         // Default properties values.\r
  27         this.FieldWidth         = fieldWidth || 100 ;\r
  28         this.PanelWidth         = panelWidth || 150 ;\r
  29         this.PanelMaxHeight     = panelMaxHeight || 150 ;\r
  30         this.Label                      = '&nbsp;' ;\r
  31         this.Caption            = caption ;\r
  32         this.Tooltip            = caption ;\r
  33         this.Style                      = FCK_TOOLBARITEM_ICONTEXT ;\r
  34 \r
  35         this.Enabled = true ;\r
  36 \r
  37         this.Items = new Object() ;\r
  38 \r
  39         this._Panel = new FCKPanel( parentWindow || window ) ;\r
  40         this._Panel.AppendStyleSheet( FCKConfig.SkinEditorCSS ) ;\r
  41         this._PanelBox = this._Panel.MainNode.appendChild( this._Panel.Document.createElement( 'DIV' ) ) ;\r
  42         this._PanelBox.className = 'SC_Panel' ;\r
  43         this._PanelBox.style.width = this.PanelWidth + 'px' ;\r
  44 \r
  45         this._PanelBox.innerHTML = '<table cellpadding="0" cellspacing="0" width="100%" style="TABLE-LAYOUT: fixed"><tr><td nowrap></td></tr></table>' ;\r
  46 \r
  47         this._ItemsHolderEl = this._PanelBox.getElementsByTagName('TD')[0] ;\r
  48 \r
  49         if ( FCK.IECleanup )\r
  50                 FCK.IECleanup.AddItem( this, FCKSpecialCombo_Cleanup ) ;\r
  51 \r
  52 //      this._Panel.StyleSheet = FCKConfig.SkinPath + 'fck_contextmenu.css' ;\r
  53 //      this._Panel.Create() ;\r
  54 //      this._Panel.PanelDiv.className += ' SC_Panel' ;\r
  55 //      this._Panel.PanelDiv.innerHTML = '<table cellpadding="0" cellspacing="0" width="100%" style="TABLE-LAYOUT: fixed"><tr><td nowrap></td></tr></table>' ;\r
  56 //      this._ItemsHolderEl = this._Panel.PanelDiv.getElementsByTagName('TD')[0] ;\r
  57 }\r
  58 \r
  59 function FCKSpecialCombo_ItemOnMouseOver()\r
  60 {\r
  61         this.className += ' SC_ItemOver' ;\r
  62 }\r
  63 \r
  64 function FCKSpecialCombo_ItemOnMouseOut()\r
  65 {\r
  66         this.className = this.originalClass ;\r
  67 }\r
  68 \r
  69 function FCKSpecialCombo_ItemOnClick( ev, specialCombo, itemId )\r
  70 {\r
  71         this.className = this.originalClass ;\r
  72 \r
  73         specialCombo._Panel.Hide() ;\r
  74 \r
  75         specialCombo.SetLabel( this.FCKItemLabel ) ;\r
  76 \r
  77         if ( typeof( specialCombo.OnSelect ) == 'function' )\r
  78                 specialCombo.OnSelect( itemId, this ) ;\r
  79 }\r
  80 \r
  81 FCKSpecialCombo.prototype.ClearItems = function ()\r
  82 {\r
  83         if ( this.Items )\r
  84                 this.Items = {} ;\r
  85 \r
  86         var itemsholder = this._ItemsHolderEl ;\r
  87         while ( itemsholder.firstChild )\r
  88                 itemsholder.removeChild( itemsholder.firstChild ) ;\r
  89 }\r
  90 \r
  91 FCKSpecialCombo.prototype.AddItem = function( id, html, label, bgColor )\r
  92 {\r
  93         // <div class="SC_Item" onmouseover="this.className='SC_Item SC_ItemOver';" onmouseout="this.className='SC_Item';"><b>Bold 1</b></div>\r
  94         var oDiv = this._ItemsHolderEl.appendChild( this._Panel.Document.createElement( 'DIV' ) ) ;\r
  95         oDiv.className = oDiv.originalClass = 'SC_Item' ;\r
  96         oDiv.innerHTML = html ;\r
  97         oDiv.FCKItemLabel = label || id ;\r
  98         oDiv.Selected = false ;\r
  99 \r
 100         // In IE, the width must be set so the borders are shown correctly when the content overflows.\r
 101         if ( FCKBrowserInfo.IsIE )\r
 102                 oDiv.style.width = '100%' ;\r
 103 \r
 104         if ( bgColor )\r
 105                 oDiv.style.backgroundColor = bgColor ;\r
 106 \r
 107         FCKTools.AddEventListenerEx( oDiv, 'mouseover', FCKSpecialCombo_ItemOnMouseOver ) ;\r
 108         FCKTools.AddEventListenerEx( oDiv, 'mouseout', FCKSpecialCombo_ItemOnMouseOut ) ;\r
 109         FCKTools.AddEventListenerEx( oDiv, 'click', FCKSpecialCombo_ItemOnClick, [ this, id ] ) ;\r
 110 \r
 111         this.Items[ id.toString().toLowerCase() ] = oDiv ;\r
 112 \r
 113         return oDiv ;\r
 114 }\r
 115 \r
 116 FCKSpecialCombo.prototype.SelectItem = function( item )\r
 117 {\r
 118         if ( typeof item == 'string' )\r
 119                 item = this.Items[ item.toString().toLowerCase() ] ;\r
 120 \r
 121         if ( item )\r
 122         {\r
 123                 item.className = item.originalClass = 'SC_ItemSelected' ;\r
 124                 item.Selected = true ;\r
 125         }\r
 126 }\r
 127 \r
 128 FCKSpecialCombo.prototype.SelectItemByLabel = function( itemLabel, setLabel )\r
 129 {\r
 130         for ( var id in this.Items )\r
 131         {\r
 132                 var oDiv = this.Items[id] ;\r
 133 \r
 134                 if ( oDiv.FCKItemLabel == itemLabel )\r
 135                 {\r
 136                         oDiv.className = oDiv.originalClass = 'SC_ItemSelected' ;\r
 137                         oDiv.Selected = true ;\r
 138 \r
 139                         if ( setLabel )\r
 140                                 this.SetLabel( itemLabel ) ;\r
 141                 }\r
 142         }\r
 143 }\r
 144 \r
 145 FCKSpecialCombo.prototype.DeselectAll = function( clearLabel )\r
 146 {\r
 147         for ( var i in this.Items )\r
 148         {\r
 149                 if ( !this.Items[i] ) continue;\r
 150                 this.Items[i].className = this.Items[i].originalClass = 'SC_Item' ;\r
 151                 this.Items[i].Selected = false ;\r
 152         }\r
 153 \r
 154         if ( clearLabel )\r
 155                 this.SetLabel( '' ) ;\r
 156 }\r
 157 \r
 158 FCKSpecialCombo.prototype.SetLabelById = function( id )\r
 159 {\r
 160         id = id ? id.toString().toLowerCase() : '' ;\r
 161 \r
 162         var oDiv = this.Items[ id ] ;\r
 163         this.SetLabel( oDiv ? oDiv.FCKItemLabel : '' ) ;\r
 164 }\r
 165 \r
 166 FCKSpecialCombo.prototype.SetLabel = function( text )\r
 167 {\r
 168         text = ( !text || text.length == 0 ) ? '&nbsp;' : text ;\r
 169 \r
 170         if ( text == this.Label )\r
 171                 return ;\r
 172 \r
 173         this.Label = text ;\r
 174 \r
 175         var labelEl = this._LabelEl ;\r
 176         if ( labelEl )\r
 177         {\r
 178                 labelEl.innerHTML = text ;\r
 179 \r
 180                 // It may happen that the label is some HTML, including tags. This\r
 181                 // would be a problem because when the user click on those tags, the\r
 182                 // combo will get the selection from the editing area. So we must\r
 183                 // disable any kind of selection here.\r
 184                 FCKTools.DisableSelection( labelEl ) ;\r
 185         }\r
 186 }\r
 187 \r
 188 FCKSpecialCombo.prototype.SetEnabled = function( isEnabled )\r
 189 {\r
 190         this.Enabled = isEnabled ;\r
 191 \r
 192         // In IE it can happen when the page is reloaded that _OuterTable is null, so check its existence\r
 193         if ( this._OuterTable )\r
 194                 this._OuterTable.className = isEnabled ? '' : 'SC_FieldDisabled' ;\r
 195 }\r
 196 \r
 197 FCKSpecialCombo.prototype.Create = function( targetElement )\r
 198 {\r
 199         var oDoc = FCKTools.GetElementDocument( targetElement ) ;\r
 200         var eOuterTable = this._OuterTable = targetElement.appendChild( oDoc.createElement( 'TABLE' ) ) ;\r
 201         eOuterTable.cellPadding = 0 ;\r
 202         eOuterTable.cellSpacing = 0 ;\r
 203 \r
 204         eOuterTable.insertRow(-1) ;\r
 205 \r
 206         var sClass ;\r
 207         var bShowLabel ;\r
 208 \r
 209         switch ( this.Style )\r
 210         {\r
 211                 case FCK_TOOLBARITEM_ONLYICON :\r
 212                         sClass = 'TB_ButtonType_Icon' ;\r
 213                         bShowLabel = false;\r
 214                         break ;\r
 215                 case FCK_TOOLBARITEM_ONLYTEXT :\r
 216                         sClass = 'TB_ButtonType_Text' ;\r
 217                         bShowLabel = false;\r
 218                         break ;\r
 219                 case FCK_TOOLBARITEM_ICONTEXT :\r
 220                         bShowLabel = true;\r
 221                         break ;\r
 222         }\r
 223 \r
 224         if ( this.Caption && this.Caption.length > 0 && bShowLabel )\r
 225         {\r
 226                 var oCaptionCell = eOuterTable.rows[0].insertCell(-1) ;\r
 227                 oCaptionCell.innerHTML = this.Caption ;\r
 228                 oCaptionCell.className = 'SC_FieldCaption' ;\r
 229         }\r
 230 \r
 231         // Create the main DIV element.\r
 232         var oField = FCKTools.AppendElement( eOuterTable.rows[0].insertCell(-1), 'div' ) ;\r
 233         if ( bShowLabel )\r
 234         {\r
 235                 oField.className = 'SC_Field' ;\r
 236                 oField.style.width = this.FieldWidth + 'px' ;\r
 237                 oField.innerHTML = '<table width="100%" cellpadding="0" cellspacing="0" style="TABLE-LAYOUT: fixed;"><tbody><tr><td class="SC_FieldLabel"><label>&nbsp;</label></td><td class="SC_FieldButton">&nbsp;</td></tr></tbody></table>' ;\r
 238 \r
 239                 this._LabelEl = oField.getElementsByTagName('label')[0] ;               // Memory Leak\r
 240                 this._LabelEl.innerHTML = this.Label ;\r
 241         }\r
 242         else\r
 243         {\r
 244                 oField.className = 'TB_Button_Off' ;\r
 245                 //oField.innerHTML = '<span className="SC_FieldCaption">' + this.Caption + '<table cellpadding="0" cellspacing="0" style="TABLE-LAYOUT: fixed;"><tbody><tr><td class="SC_FieldButton" style="border-left: none;">&nbsp;</td></tr></tbody></table>' ;\r
 246                 //oField.innerHTML = '<table cellpadding="0" cellspacing="0" style="TABLE-LAYOUT: fixed;"><tbody><tr><td class="SC_FieldButton" style="border-left: none;">&nbsp;</td></tr></tbody></table>' ;\r
 247 \r
 248                 // Gets the correct CSS class to use for the specified style (param).\r
 249                 oField.innerHTML = '<table title="' + this.Tooltip + '" class="' + sClass + '" cellspacing="0" cellpadding="0" border="0">' +\r
 250                                 '<tr>' +\r
 251                                         //'<td class="TB_Icon"><img src="' + FCKConfig.SkinPath + 'toolbar/' + this.Command.Name.toLowerCase() + '.gif" width="21" height="21"></td>' +\r
 252                                         '<td><img class="TB_Button_Padding" src="' + FCK_SPACER_PATH + '" /></td>' +\r
 253                                         '<td class="TB_Text">' + this.Caption + '</td>' +\r
 254                                         '<td><img class="TB_Button_Padding" src="' + FCK_SPACER_PATH + '" /></td>' +\r
 255                                         '<td class="TB_ButtonArrow"><img src="' + FCKConfig.SkinPath + 'images/toolbar.buttonarrow.gif" width="5" height="3"></td>' +\r
 256                                         '<td><img class="TB_Button_Padding" src="' + FCK_SPACER_PATH + '" /></td>' +\r
 257                                 '</tr>' +\r
 258                         '</table>' ;\r
 259         }\r
 260 \r
 261 \r
 262         // Events Handlers\r
 263 \r
 264         FCKTools.AddEventListenerEx( oField, 'mouseover', FCKSpecialCombo_OnMouseOver, this ) ;\r
 265         FCKTools.AddEventListenerEx( oField, 'mouseout', FCKSpecialCombo_OnMouseOut, this ) ;\r
 266         FCKTools.AddEventListenerEx( oField, 'click', FCKSpecialCombo_OnClick, this ) ;\r
 267 \r
 268         FCKTools.DisableSelection( this._Panel.Document.body ) ;\r
 269 }\r
 270 \r
 271 function FCKSpecialCombo_Cleanup()\r
 272 {\r
 273         this._LabelEl = null ;\r
 274         this._OuterTable = null ;\r
 275         this._ItemsHolderEl = null ;\r
 276         this._PanelBox = null ;\r
 277 \r
 278         if ( this.Items )\r
 279         {\r
 280                 for ( var key in this.Items )\r
 281                         this.Items[key] = null ;\r
 282         }\r
 283 }\r
 284 \r
 285 function FCKSpecialCombo_OnMouseOver( ev, specialCombo )\r
 286 {\r
 287         if ( specialCombo.Enabled )\r
 288         {\r
 289                 switch ( specialCombo.Style )\r
 290                 {\r
 291                         case FCK_TOOLBARITEM_ONLYICON :\r
 292                                 this.className = 'TB_Button_On_Over';\r
 293                                 break ;\r
 294                         case FCK_TOOLBARITEM_ONLYTEXT :\r
 295                                 this.className = 'TB_Button_On_Over';\r
 296                                 break ;\r
 297                         case FCK_TOOLBARITEM_ICONTEXT :\r
 298                                 this.className = 'SC_Field SC_FieldOver' ;\r
 299                                 break ;\r
 300                 }\r
 301         }\r
 302 }\r
 303 \r
 304 function FCKSpecialCombo_OnMouseOut( ev, specialCombo )\r
 305 {\r
 306         switch ( specialCombo.Style )\r
 307         {\r
 308                 case FCK_TOOLBARITEM_ONLYICON :\r
 309                         this.className = 'TB_Button_Off';\r
 310                         break ;\r
 311                 case FCK_TOOLBARITEM_ONLYTEXT :\r
 312                         this.className = 'TB_Button_Off';\r
 313                         break ;\r
 314                 case FCK_TOOLBARITEM_ICONTEXT :\r
 315                         this.className='SC_Field' ;\r
 316                         break ;\r
 317         }\r
 318 }\r
 319 \r
 320 function FCKSpecialCombo_OnClick( e, specialCombo )\r
 321 {\r
 322         // For Mozilla we must stop the event propagation to avoid it hiding\r
 323         // the panel because of a click outside of it.\r
 324 //      if ( e )\r
 325 //      {\r
 326 //              e.stopPropagation() ;\r
 327 //              FCKPanelEventHandlers.OnDocumentClick( e ) ;\r
 328 //      }\r
 329 \r
 330         if ( specialCombo.Enabled )\r
 331         {\r
 332                 var oPanel                      = specialCombo._Panel ;\r
 333                 var oPanelBox           = specialCombo._PanelBox ;\r
 334                 var oItemsHolder        = specialCombo._ItemsHolderEl ;\r
 335                 var iMaxHeight          = specialCombo.PanelMaxHeight ;\r
 336 \r
 337                 if ( specialCombo.OnBeforeClick )\r
 338                         specialCombo.OnBeforeClick( specialCombo ) ;\r
 339 \r
 340                 // This is a tricky thing. We must call the "Load" function, otherwise\r
 341                 // it will not be possible to retrieve "oItemsHolder.offsetHeight" (IE only).\r
 342                 if ( FCKBrowserInfo.IsIE )\r
 343                         oPanel.Preload( 0, this.offsetHeight, this ) ;\r
 344 \r
 345                 if ( oItemsHolder.offsetHeight > iMaxHeight )\r
 346 //              {\r
 347                         oPanelBox.style.height = iMaxHeight + 'px' ;\r
 348 \r
 349 //                      if ( FCKBrowserInfo.IsGecko )\r
 350 //                              oPanelBox.style.overflow = '-moz-scrollbars-vertical' ;\r
 351 //              }\r
 352                 else\r
 353                         oPanelBox.style.height = '' ;\r
 354 \r
 355 //              oPanel.PanelDiv.style.width = specialCombo.PanelWidth + 'px' ;\r
 356 \r
 357                 oPanel.Show( 0, this.offsetHeight, this ) ;\r
 358         }\r
 359 \r
 360 //      return false ;\r
 361 }\r
 362 \r
 363 /*\r
 364 Sample Combo Field HTML output:\r
 365 \r
 366 <div class="SC_Field" style="width: 80px;">\r
 367         <table width="100%" cellpadding="0" cellspacing="0" style="table-layout: fixed;">\r
 368                 <tbody>\r
 369                         <tr>\r
 370                                 <td class="SC_FieldLabel"><label>&nbsp;</label></td>\r
 371                                 <td class="SC_FieldButton">&nbsp;</td>\r
 372                         </tr>\r
 373                 </tbody>\r
 374         </table>\r
 375 </div>\r
 376 */\r