webcit/tiny_mce/themes/advanced/editor_template_src.js

   1 /* Import theme specific language pack */
   2 tinyMCE.importThemeLanguagePack('advanced');
   3
   4 // Variable declarations
   5 var TinyMCE_advanced_autoImportCSSClasses = true;
   6 var TinyMCE_advanced_resizer = new Object();
   7 var TinyMCE_advanced_buttons = [
   8         // Control id, button img, button title, command, user_interface, value
   9         ['bold', '{$lang_bold_img}', '{$lang_bold_desc}', 'Bold'],
  10         ['italic', '{$lang_italic_img}', '{$lang_italic_desc}', 'Italic'],
  11         ['underline', '{$lang_underline_img}', '{$lang_underline_desc}', 'Underline'],
  12         ['strikethrough', 'strikethrough.gif', '{$lang_striketrough_desc}', 'Strikethrough'],
  13         ['justifyleft', 'left.gif', '{$lang_justifyleft_desc}', 'JustifyLeft'],
  14         ['justifycenter', 'center.gif', '{$lang_justifycenter_desc}', 'JustifyCenter'],
  15         ['justifyright', 'right.gif', '{$lang_justifyright_desc}', 'JustifyRight'],
  16         ['justifyfull', 'full.gif', '{$lang_justifyfull_desc}', 'JustifyFull'],
  17         ['bullist', 'bullist.gif', '{$lang_bullist_desc}', 'InsertUnorderedList'],
  18         ['numlist', 'numlist.gif', '{$lang_numlist_desc}', 'InsertOrderedList'],
  19         ['outdent', 'outdent.gif', '{$lang_outdent_desc}', 'Outdent'],
  20         ['indent', 'indent.gif', '{$lang_indent_desc}', 'Indent'],
  21         ['cut', 'cut.gif', '{$lang_cut_desc}', 'Cut'],
  22         ['copy', 'copy.gif', '{$lang_copy_desc}', 'Copy'],
  23         ['paste', 'paste.gif', '{$lang_paste_desc}', 'Paste'],
  24         ['undo', 'undo.gif', '{$lang_undo_desc}', 'Undo'],
  25         ['redo', 'redo.gif', '{$lang_redo_desc}', 'Redo'],
  26         ['link', 'link.gif', '{$lang_link_desc}', 'mceLink', true],
  27         ['unlink', 'unlink.gif', '{$lang_unlink_desc}', 'unlink'],
  28         ['image', 'image.gif', '{$lang_image_desc}', 'mceImage', true],
  29         ['cleanup', 'cleanup.gif', '{$lang_cleanup_desc}', 'mceCleanup'],
  30         ['help', 'help.gif', '{$lang_help_desc}', 'mceHelp'],
  31         ['code', 'code.gif', '{$lang_theme_code_desc}', 'mceCodeEditor'],
  32         ['hr', 'hr.gif', '{$lang_theme_hr_desc}', 'inserthorizontalrule'],
  33         ['removeformat', 'removeformat.gif', '{$lang_theme_removeformat_desc}', 'removeformat'],
  34         ['sub', 'sub.gif', '{$lang_theme_sub_desc}', 'subscript'],
  35         ['sup', 'sup.gif', '{$lang_theme_sup_desc}', 'superscript'],
  36         ['forecolor', 'forecolor.gif', '{$lang_theme_forecolor_desc}', 'mceForeColor', true],
  37         ['backcolor', 'backcolor.gif', '{$lang_theme_backcolor_desc}', 'mceBackColor', true],
  38         ['charmap', 'charmap.gif', '{$lang_theme_charmap_desc}', 'mceCharMap'],
  39         ['visualaid', 'visualaid.gif', '{$lang_theme_visualaid_desc}', 'mceToggleVisualAid'],
  40         ['anchor', 'anchor.gif', '{$lang_theme_anchor_desc}', 'mceInsertAnchor'],
  41         ['newdocument', 'newdocument.gif', '{$lang_newdocument_desc}', 'mceNewDocument']
  42 ];
  43
  44 /**
  45  * Returns HTML code for the specificed control.
  46  */
  47 function TinyMCE_advanced_getControlHTML(button_name)
  48 {
  49         var buttonTileMap = new Array('anchor.gif','backcolor.gif','bullist.gif','center.gif',
  50                                                                                         'charmap.gif','cleanup.gif','code.gif','copy.gif','custom_1.gif',
  51                                                                                         'cut.gif','forecolor.gif','full.gif','help.gif','hr.gif',
  52                                                                                         'image.gif','indent.gif','left.gif','link.gif','numlist.gif',
  53                                                                                         'outdent.gif','paste.gif','redo.gif','removeformat.gif',
  54                                                                                         'right.gif','strikethrough.gif','sub.gif','sup.gif','undo.gif',
  55                                                                                         'unlink.gif','visualaid.gif');
  56
  57         // Lookup button in button list
  58         for (var i=0; i<TinyMCE_advanced_buttons.length; i++)
  59         {
  60                 var but = TinyMCE_advanced_buttons[i];
  61
  62                 if (but[0] == button_name)
  63                 {
  64                         // Check for it in tilemap
  65                         if (tinyMCE.settings['button_tile_map'])
  66                         {
  67                                 for (var x=0; !tinyMCE.isMSIE && x<buttonTileMap.length; x++)
  68                                 {
  69                                         if (buttonTileMap[x] == but[1])
  70                                         {
  71                                                 return '<a href="javascript:tinyMCE.execInstanceCommand(\'{$editor_id}\',\'' + but[3] + '\', ' + (but.length > 4 ? but[4] : false) + (but.length > 5 ? ', \'' + but[5] + '\'' : '') + ')" onmousedown="return false;"><img id="{$editor_id}_' + but[0] +'" src="{$themeurl}/images/spacer.gif" style="background-image:url({$themeurl}/images/buttons.gif); background-position: ' + (0-(x*20)) + 'px 0px" title="' + but[2] + '" width="20" height="20" class="mceButtonNormal" onmouseover="tinyMCE.switchClass(this,\'mceButtonOver\');" onmouseout="tinyMCE.restoreClass(this);" onmousedown="tinyMCE.restoreAndSwitchClass(this,\'mceButtonDown\');" /></a>';
  72                                         }
  73                                 }
  74                         }
  75
  76                         // Old style
  77                         return '<a href="javascript:tinyMCE.execInstanceCommand(\'{$editor_id}\',\'' + but[3] + '\', ' + (but.length > 4 ? but[4] : false) + (but.length > 5 ? ', \'' + but[5] + '\'' : '') + ')" onmousedown="return false;"><img id="{$editor_id}_' + but[0] + '" src="{$themeurl}/images/' + but[1] + '" title="' + but[2] + '" width="20" height="20" class="mceButtonNormal" onmouseover="tinyMCE.switchClass(this,\'mceButtonOver\');" onmouseout="tinyMCE.restoreClass(this);" onmousedown="tinyMCE.restoreAndSwitchClass(this,\'mceButtonDown\');" /></a>';
  78                 }
  79         }
  80
  81         // Custom controlls other than buttons
  82         switch (button_name)
  83         {
  84                 case "formatselect":
  85                         var html = '<select id="{$editor_id}_formatSelect" name="{$editor_id}_formatSelect" onfocus="tinyMCE.addSelectAccessibility(event, this, window);" onchange="tinyMCE.execInstanceCommand(\'{$editor_id}\',\'FormatBlock\',false,this.options[this.selectedIndex].value);" class="mceSelectList">';
  86                         var formats = tinyMCE.getParam("theme_advanced_blockformats", "p,address,pre,h1,h2,h3,h4,h5,h6", true).split(',');
  87                         var lookup = [
  88                                 ['p', '{$lang_theme_paragraph}'],
  89                                 ['address', '{$lang_theme_address}'],
  90                                 ['pre', '{$lang_theme_pre}'],
  91                                 ['h1', '{$lang_theme_h1}'],
  92                                 ['h2', '{$lang_theme_h2}'],
  93                                 ['h3', '{$lang_theme_h3}'],
  94                                 ['h4', '{$lang_theme_h4}'],
  95                                 ['h5', '{$lang_theme_h5}'],
  96                                 ['h6', '{$lang_theme_h6}']
  97                         ];
  98
  99                         html += '<option value="">{$lang_theme_block}</option>';
 100
 101                         // Build format select
 102                         for (var i=0; i<formats.length; i++)
 103                         {
 104                                 for (var x=0; x<lookup.length; x++)
 105                                 {
 106                                         if (formats[i] == lookup[x][0])
 107                                         {
 108                                                 html += '<option value="<' + lookup[x][0] + '>">' + lookup[x][1] + '</option>';
 109                                         }
 110                                 }
 111                         }
 112
 113                         html += '</select>';
 114                         //formatselect
 115                 return html;
 116
 117                 case "styleselect":
 118                         //styleselect
 119                 return '<select id="{$editor_id}_styleSelect" onmousedown="TinyMCE_advanced_setupCSSClasses(\'{$editor_id}\');" name="{$editor_id}_styleSelect" onfocus="tinyMCE.addSelectAccessibility(event, this, window);" onchange="tinyMCE.execInstanceCommand(\'{$editor_id}\',\'mceSetCSSClass\',false,this.options[this.selectedIndex].value);" class="mceSelectList">{$style_select_options}</select>';
 120
 121                 case "fontselect":
 122                         var fontHTML = '<select id="{$editor_id}_fontNameSelect" name="{$editor_id}_fontNameSelect" onfocus="tinyMCE.addSelectAccessibility(event, this, window);" onchange="tinyMCE.execInstanceCommand(\'{$editor_id}\',\'FontName\',false,this.options[this.selectedIndex].value);" class="mceSelectList"><option value="">{$lang_theme_fontdefault}</option>';
 123                         var iFonts = 'Arial=arial,helvetica,sans-serif;Courier New=courier new,courier,monospace;Georgia=georgia,times new roman,times,serif;Tahoma=tahoma,arial,helvetica,sans-serif;Times New Roman=times new roman,times,serif;Verdana=verdana,arial,helvetica,sans-serif;Impact=impact;WingDings=wingdings';
 124                         var nFonts = 'Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;Comic Sans MS=comic sans ms,sand;Courier New=courier new,courier;Georgia=georgia,palatino;Helvetica=helvetica;Impact=impact,chicago;Symbol=symbol;Tahoma=tahoma,arial,helvetica,sans-serif;Terminal=terminal,monaco;Times New Roman=times new roman,times;Trebuchet MS=trebuchet ms,geneva;Verdana=verdana,geneva;Webdings=webdings;Wingdings=wingdings,zapf dingbats';
 125                         var fonts = tinyMCE.getParam("theme_advanced_fonts", nFonts).split(';');
 126                         for (var i=0; i<fonts.length; i++) {
 127                                 if (fonts[i] != '') {
 128                                         var parts = fonts[i].split('=');
 129                                         fontHTML += '<option value="' + parts[1] + '">' + parts[0] + '</option>';
 130                                 }
 131                         }
 132
 133                         fontHTML += '</select>';
 134                         return fontHTML;
 135
 136                 case "fontsizeselect":
 137                         //fontsizeselect
 138                 return '<select id="{$editor_id}_fontSizeSelect" name="{$editor_id}_fontSizeSelect" onfocus="tinyMCE.addSelectAccessibility(event, this, window);" onchange="tinyMCE.execInstanceCommand(\'{$editor_id}\',\'FontSize\',false,this.options[this.selectedIndex].value);" class="mceSelectList">\
 139                 <option value="0">{$lang_theme_font_size}</option>\
 140                 <option value="1">1 (8 pt)</option>\
 141                 <option value="2">2 (10 pt)</option>\
 142                 <option value="3">3 (12 pt)</option>\
 143                 <option value="4">4 (14 pt)</option>\
 144                 <option value="5">5 (18 pt)</option>\
 145                 <option value="6">6 (24 pt)</option>\
 146                 <option value="7">7 (36 pt)</option>\
 147                 </select>';
 148
 149                 case "|":
 150                 case "separator":
 151                 return '<img src="{$themeurl}/images/spacer.gif" width="1" height="15" class="mceSeparatorLine">';
 152
 153                 case "spacer":
 154                 return '<img src="{$themeurl}/images/spacer.gif" width="1" height="15" border="0" class="mceSeparatorLine" style="vertical-align: middle" />';
 155
 156                 case "rowseparator":
 157                 return '<br />';
 158         }
 159
 160         return "";
 161 }
 162
 163 /**
 164  * Theme specific exec command handeling.
 165  */
 166 function TinyMCE_advanced_execCommand(editor_id, element, command, user_interface, value)
 167 {
 168         switch (command)
 169         {
 170                 case "mceForeColor":
 171                         var template = new Array();
 172                         var elm = tinyMCE.selectedInstance.getFocusElement();
 173                         var inputColor = tinyMCE.getAttrib(elm, "color");
 174
 175                         if (inputColor == '')
 176                                 inputColor = elm.style.color;
 177
 178                         if (!inputColor)
 179                                 inputColor = "#000000";
 180
 181                         template['file'] = 'color_picker.htm';
 182                         template['width'] = 220;
 183                         template['height'] = 190;
 184
 185                         tinyMCE.openWindow(template, {editor_id : editor_id, inline : "yes", command : "forecolor", input_color : inputColor});
 186                 return true;
 187
 188                 case "mceBackColor":
 189                         var template = new Array();
 190                         var elm = tinyMCE.selectedInstance.getFocusElement();
 191                         var inputColor = elm.style.backgroundColor;
 192
 193                         if (!inputColor)
 194                                 inputColor = "#000000";
 195
 196                         template['file'] = 'color_picker.htm';
 197                         template['width'] = 220;
 198                         template['height'] = 190;
 199
 200                         template['width'] += tinyMCE.getLang('lang_theme_advanced_backcolor_delta_width', 0);
 201                         template['height'] += tinyMCE.getLang('lang_theme_advanced_backcolor_delta_height', 0);
 202
 203                         tinyMCE.openWindow(template, {editor_id : editor_id, inline : "yes", command : "HiliteColor", input_color : inputColor});
 204                         //mceBackColor
 205                 return true;
 206
 207                 case "mceColorPicker":
 208                         if (user_interface) {
 209                                 var template = new Array();
 210                                 var inputColor = value['document'].getElementById(value['element_id']).value;
 211
 212                                 template['file'] = 'color_picker.htm';
 213                                 template['width'] = 220;
 214                                 template['height'] = 190;
 215
 216                                 template['width'] += tinyMCE.getLang('lang_theme_advanced_colorpicker_delta_width', 0);
 217                                 template['height'] += tinyMCE.getLang('lang_theme_advanced_colorpicker_delta_height', 0);
 218
 219                                 if (typeof(value['store_selection']) == "undefined")
 220                                         value['store_selection'] = true;
 221
 222                                 tinyMCE.lastColorPickerValue = value;
 223                                 tinyMCE.openWindow(template, {editor_id : editor_id, mce_store_selection : value['store_selection'], inline : "yes", command : "mceColorPicker", input_color : inputColor});
 224                         } else {
 225                                 var savedVal = tinyMCE.lastColorPickerValue;
 226                                 var elm = savedVal['document'].getElementById(savedVal['element_id']);
 227                                 elm.value = value;
 228                                 eval('elm.onchange();');
 229                         }
 230                 return true;
 231
 232                 case "mceCodeEditor":
 233                         var template = new Array();
 234
 235                         template['file'] = 'source_editor.htm';
 236                         template['width'] = parseInt(tinyMCE.getParam("theme_advanced_source_editor_width", 500));
 237                         template['height'] = parseInt(tinyMCE.getParam("theme_advanced_source_editor_height", 400));
 238
 239                         tinyMCE.openWindow(template, {editor_id : editor_id, resizable : "yes", scrollbars : "no", inline : "yes"});
 240                         //mceCodeEditor
 241                 return true;
 242
 243                 case "mceCharMap":
 244                         var template = new Array();
 245
 246                         template['file'] = 'charmap.htm';
 247                         template['width'] = 550;
 248                         template['height'] = 250;
 249
 250                         template['width'] += tinyMCE.getLang('lang_theme_advanced_charmap_delta_width', 0);
 251                         template['height'] += tinyMCE.getLang('lang_theme_advanced_charmap_delta_height', 0);
 252
 253                         tinyMCE.openWindow(template, {editor_id : editor_id, inline : "yes"});
 254                         //mceCharMap
 255                 return true;
 256
 257                 case "mceInsertAnchor":
 258                         var template = new Array();
 259
 260                         template['file'] = 'anchor.htm';
 261                         template['width'] = 320;
 262                         template['height'] = 90;
 263
 264                         template['width'] += tinyMCE.getLang('lang_theme_advanced_anchor_delta_width', 0);
 265                         template['height'] += tinyMCE.getLang('lang_theme_advanced_anchor_delta_height', 0);
 266
 267                         tinyMCE.openWindow(template, {editor_id : editor_id, inline : "yes"});
 268                 return true;
 269
 270                 case "mceNewDocument":
 271                         if (confirm(tinyMCE.getLang('lang_newdocument')))
 272                                 tinyMCE.execInstanceCommand(editor_id, 'mceSetContent', false, '');
 273
 274                         return true;
 275         }
 276
 277         // Default behavior
 278         return false;
 279 }
 280
 281 /**
 282  * Editor instance template function.
 283  */
 284 function TinyMCE_advanced_getEditorTemplate(settings, editorId)
 285 {
 286         function removeFromArray(in_array, remove_array)
 287         {
 288                 var outArray = new Array();
 289
 290                 for (var i=0; i<in_array.length; i++)
 291                 {
 292                         skip = false;
 293
 294                         for (var j=0; j<remove_array.length; j++)
 295                         {
 296                                 if (in_array[i] == remove_array[j])
 297                                 {
 298                                         skip = true;
 299                                 }
 300                         }
 301
 302                         if (!skip)
 303                         {
 304                                 outArray[outArray.length] = in_array[i];
 305                         }
 306                 }
 307
 308                 return outArray;
 309         }
 310
 311         function addToArray(in_array, add_array)
 312         {
 313                 for (var i=0; i<add_array.length; i++)
 314                 {
 315                         in_array[in_array.length] = add_array[i];
 316                 }
 317
 318                 return in_array;
 319         }
 320
 321         var template = new Array();
 322         var deltaHeight = 0;
 323
 324         var resizing = tinyMCE.getParam("theme_advanced_resizing", false);
 325         var path = tinyMCE.getParam("theme_advanced_path", true);
 326         var statusbarHTML = '<div id="{$editor_id}_path" class="mceStatusbarPathText" style="display: ' + (path ? "block" : "none") + '">&nbsp;</div><div id="{$editor_id}_resize" class="mceStatusbarResize" style="display: ' + (resizing ? "block" : "none") + '" onmousedown="TinyMCE_advanced_setResizing(event,\'{$editor_id}\',true);"></div><br style="clear: both" />';
 327         var layoutManager = tinyMCE.getParam("theme_advanced_layout_manager", "SimpleLayout");
 328
 329         // Setup style select options -- MOVED UP FOR EXTERNAL TOOLBAR COMPATABILITY!
 330         var styleSelectHTML = '<option value="">{$lang_theme_style_select}</option>';
 331         if (settings['theme_advanced_styles'])
 332         {
 333                 var stylesAr = settings['theme_advanced_styles'].split(';');
 334
 335                 for (var i=0; i<stylesAr.length; i++)
 336                 {
 337                         var key, value;
 338
 339                         key = stylesAr[i].split('=')[0];
 340                         value = stylesAr[i].split('=')[1];
 341
 342                         styleSelectHTML += '<option value="' + value + '">' + key + '</option>';
 343                 }
 344
 345                 TinyMCE_advanced_autoImportCSSClasses = false;
 346         }
 347
 348         switch(layoutManager)
 349         {
 350                 case "SimpleLayout" : //the default TinyMCE Layout (for backwards compatibility)...
 351                         var toolbarHTML = "";
 352                         var toolbarLocation = tinyMCE.getParam("theme_advanced_toolbar_location", "bottom");
 353                         var toolbarAlign = tinyMCE.getParam("theme_advanced_toolbar_align", "center");
 354                         var pathLocation = tinyMCE.getParam("theme_advanced_path_location", "none"); // Compatiblity
 355                         var statusbarLocation = tinyMCE.getParam("theme_advanced_statusbar_location", pathLocation);
 356                         var defVals = {
 357                                 theme_advanced_buttons1 : "bold,italic,underline,strikethrough,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,styleselect,formatselect",
 358                                 theme_advanced_buttons2 : "bullist,numlist,separator,outdent,indent,separator,undo,redo,separator,link,unlink,anchor,image,cleanup,help,code",
 359                                 theme_advanced_buttons3 : "hr,removeformat,visualaid,separator,sub,sup,separator,charmap"
 360                         };
 361
 362                         // Render rows
 363                         for (var i=1; i<100; i++) {
 364                                 var def = defVals["theme_advanced_buttons" + i];
 365
 366                                 buttons = tinyMCE.getParam("theme_advanced_buttons" + i, def == null ? '' : def, true, ',');
 367                                 if (buttons.length == 0)
 368                                         break;
 369
 370                                 buttons = removeFromArray(buttons, tinyMCE.getParam("theme_advanced_disable", "", true, ','));
 371                                 buttons = addToArray(buttons, tinyMCE.getParam("theme_advanced_buttons" + i + "_add", "", true, ','));
 372                                 buttons = addToArray(tinyMCE.getParam("theme_advanced_buttons" + i + "_add_before", "", true, ','), buttons);
 373
 374                                 for (var b=0; b<buttons.length; b++)
 375                                         toolbarHTML += tinyMCE.getControlHTML(buttons[b]);
 376
 377                                 if (buttons.length > 0) {
 378                                         toolbarHTML += "<br />";
 379                                         deltaHeight -= 23;
 380                                 }
 381                         }
 382
 383                         // Setup template html
 384                         template['html'] = '<table class="mceEditor" border="0" cellpadding="0" cellspacing="0" width="{$width}" height="{$height}" style="width:{$width}px;height:{$height}px"><tbody>';
 385
 386                         if (toolbarLocation == "top")
 387                         {
 388                                 template['html'] += '<tr><td class="mceToolbarTop" align="' + toolbarAlign + '" height="1" nowrap="nowrap">' + toolbarHTML + '</td></tr>';
 389                         }
 390
 391                         if (statusbarLocation == "top")
 392                         {
 393                                 template['html'] += '<tr><td class="mceStatusbarTop" height="1">' + statusbarHTML + '</td></tr>';
 394                                 deltaHeight -= 23;
 395                         }
 396
 397                         template['html'] += '<tr><td align="center"><span id="{$editor_id}"></span></td></tr>';
 398
 399                         if (toolbarLocation == "bottom")
 400                         {
 401                                 template['html'] += '<tr><td class="mceToolbarBottom" align="' + toolbarAlign + '" height="1">' + toolbarHTML + '</td></tr>';
 402                         }
 403
 404                         // External toolbar changes
 405                         if (toolbarLocation == "external")
 406                         {
 407                                 var bod = document.body;
 408                                 var elm = document.createElement ("div");
 409
 410                                 toolbarHTML = tinyMCE.replaceVars(toolbarHTML, tinyMCE.settings);
 411                                 toolbarHTML = tinyMCE.replaceVars(toolbarHTML, tinyMCELang);
 412                                 toolbarHTML = tinyMCE.replaceVar(toolbarHTML, 'style_select_options', styleSelectHTML);
 413                                 toolbarHTML = tinyMCE.replaceVar(toolbarHTML, "editor_id", editorId);
 414                                 toolbarHTML = tinyMCE.applyTemplate(toolbarHTML);
 415
 416                                 elm.className = "mceToolbarExternal";
 417                                 elm.id = editorId+"_toolbar";
 418                                 elm.innerHTML = '<table width="100%" border="0" align="center"><tr><td align="center">'+toolbarHTML+'</td></tr></table>';
 419                                 bod.appendChild (elm);
 420                                 // bod.style.marginTop = elm.offsetHeight + "px";
 421
 422                                 deltaHeight = 0;
 423                                 tinyMCE.getInstanceById(editorId).toolbarElement = elm;
 424
 425                                 //template['html'] = '<div id="mceExternalToolbar" align="center" class="mceToolbarExternal"><table width="100%" border="0" align="center"><tr><td align="center">'+toolbarHTML+'</td></tr></table></div>' + template["html"];
 426                         }
 427                         else
 428                         {
 429                                 tinyMCE.getInstanceById(editorId).toolbarElement = null;
 430                         }
 431
 432                         if (statusbarLocation == "bottom")
 433                         {
 434                                 template['html'] += '<tr><td class="mceStatusbarBottom" height="1">' + statusbarHTML + '</td></tr>';
 435                                 deltaHeight -= 23;
 436                         }
 437
 438                         template['html'] += '</table>';
 439                         //"SimpleLayout"
 440                 break;
 441
 442                 case "RowLayout" : //Container Layout - containers defined in "theme_advanced_containers" are rendered from top to bottom.
 443                         template['html'] = '<table class="mceEditor" border="0" cellpadding="0" cellspacing="0" width="{$width}" height="{$height}" style="width:{$width}px;height:{$height}px"><tbody>';
 444
 445                         var containers = tinyMCE.getParam("theme_advanced_containers", "", true, ",");
 446                         var defaultContainerCSS = tinyMCE.getParam("theme_advanced_containers_default_class", "container");
 447                         var defaultContainerAlign = tinyMCE.getParam("theme_advanced_containers_default_align", "center");
 448
 449                         //Render Containers:
 450                         for (var i = 0; i < containers.length; i++)
 451                         {
 452                                 if (containers[i] == "mceEditor") //Exceptions for mceEditor and ...
 453                                 {
 454                                         template['html'] += '<tr><td align="center" class="mceEditor_border">\
 455                                                                                                 <span id="{$editor_id}"></span>\
 456                                                                                                 </td></tr>';
 457                                 }
 458                                 else if (containers[i] == "mceElementpath" || containers[i] == "mceStatusbar") // ... mceElementpath:
 459                                 {
 460                                         var pathClass = "mceStatusbar";
 461
 462                                         if (i == containers.length-1)
 463                                         {
 464                                                 pathClass = "mceStatusbarBottom";
 465                                         }
 466                                         else if (i == 0)
 467                                         {
 468                                                 pathClass = "mceStatusbar";
 469                                         }
 470                                         else
 471                                         {
 472                                                 deltaHeight-=2;
 473                                         }
 474
 475                                         template['html'] += '<tr><td class="' + pathClass + '" height="1">' + statusbarHTML + '</td></tr>';
 476                                         deltaHeight -= 22;
 477                                 }
 478                                 else //Render normal Container:
 479                                 {
 480                                         var curContainer = tinyMCE.getParam("theme_advanced_container_"+containers[i], "", true, ',');
 481                                         var curContainerHTML = "";
 482                                         var curAlign = tinyMCE.getParam("theme_advanced_container_"+containers[i]+"_align", defaultContainerAlign);
 483                                         var curCSS = tinyMCE.getParam("theme_advanced_container_"+containers[i]+"_class", defaultContainerCSS);
 484
 485                                         for (var j=0; j<curContainer.length; j++)
 486                                         {
 487                                                 curContainerHTML += tinyMCE.getControlHTML(curContainer[j]);
 488                                         }
 489
 490                                         if (curContainer.length > 0)
 491                                         {
 492                                                 curContainerHTML += "<br />";
 493                                                 deltaHeight -= 23;
 494                                         }
 495
 496                                         template['html'] += '<tr><td class="' + curCSS + '" align="' + curAlign + '" height="1">' + curContainerHTML + '</td></tr>';
 497                                 }
 498                         }
 499
 500                         template['html'] += '</tbody></table>';
 501                         //RowLayout
 502                 break;
 503
 504                 case "BorderLayout" : //will be like java.awt.BorderLayout of SUN Java...
 505                         // Not implemented yet...
 506                 break;
 507
 508                 case "CustomLayout" : //User defined layout callback...
 509                         var customLayout = tinyMCE.getParam("theme_advanced_custom_layout","");
 510
 511                         if (customLayout != "" && eval("typeof(" + customLayout + ")") != "undefined")
 512                         {
 513                                 template = eval(customLayout + "(template);");
 514                         }
 515                 break;
 516
 517                 default:
 518                         alert('UNDEFINED LAYOUT MANAGER! PLEASE CHECK YOUR TINYMCE CONFIG!');
 519                         //CustomLayout
 520                 break;
 521         }
 522
 523         template['html'] += '<div id="{$editor_id}_resize_box" class="mceResizeBox"></div>';
 524         template['html'] = tinyMCE.replaceVar(template['html'], 'style_select_options', styleSelectHTML);
 525         template['delta_width'] = 0;
 526         template['delta_height'] = deltaHeight;
 527
 528         return template;
 529 }
 530
 531 /**
 532  * Starts/stops the editor resizing.
 533  */
 534 function TinyMCE_advanced_setResizing(e, editor_id, state) {
 535         e = typeof(e) == "undefined" ? window.event : e;
 536
 537         var resizer = TinyMCE_advanced_resizer;
 538         var editorContainer = document.getElementById(editor_id + '_parent');
 539         var editorArea = document.getElementById(editor_id + '_parent').firstChild;
 540         var resizeBox = document.getElementById(editor_id + '_resize_box');
 541         var inst = tinyMCE.getInstanceById(editor_id);
 542
 543         if (state) {
 544                 // Place box over editor area
 545                 var width = editorArea.clientWidth;
 546                 var height = editorArea.clientHeight;
 547
 548                 resizeBox.style.width = width + "px";
 549                 resizeBox.style.height = height + "px";
 550
 551                 resizer.iframeWidth = inst.iframeElement.clientWidth;
 552                 resizer.iframeHeight = inst.iframeElement.clientHeight;
 553
 554                 // Hide editor and show resize box
 555                 editorArea.style.display = "none";
 556                 resizeBox.style.display = "block";
 557
 558                 // Add event handlers, only once
 559                 if (!resizer.eventHandlers) {
 560                         if (tinyMCE.isMSIE)
 561                                 tinyMCE.addEvent(document, "mousemove", TinyMCE_advanced_resizeEventHandler);
 562                         else
 563                                 tinyMCE.addEvent(window, "mousemove", TinyMCE_advanced_resizeEventHandler);
 564
 565                         tinyMCE.addEvent(document, "mouseup", TinyMCE_advanced_resizeEventHandler);
 566
 567                         resizer.eventHandlers = true;
 568                 }
 569
 570                 resizer.resizing = true;
 571                 resizer.downX = e.screenX;
 572                 resizer.downY = e.screenY;
 573                 resizer.width = parseInt(resizeBox.style.width);
 574                 resizer.height = parseInt(resizeBox.style.height);
 575                 resizer.editorId = editor_id;
 576                 resizer.resizeBox = resizeBox;
 577                 resizer.horizontal = tinyMCE.getParam("theme_advanced_resize_horizontal", true);
 578         } else {
 579                 resizer.resizing = false;
 580                 resizeBox.style.display = "none";
 581                 editorArea.style.display = tinyMCE.isMSIE ? "block" : "table";
 582                 tinyMCE.execCommand('mceResetDesignMode');
 583         }
 584 }
 585
 586 function TinyMCE_advanced_initInstance(inst) {
 587         if (tinyMCE.getParam("theme_advanced_resizing", false)) {
 588                 var w = TinyMCE_advanced_getCookie("TinyMCE_" + inst.editorId + "_width");
 589                 var h = TinyMCE_advanced_getCookie("TinyMCE_" + inst.editorId + "_height");
 590
 591                 TinyMCE_advanced_resizeTo(inst, w, h, tinyMCE.getParam("theme_advanced_resize_horizontal", true));
 592         }
 593 }
 594
 595 function TinyMCE_advanced_setCookie(name, value, expires, path, domain, secure) {
 596         var curCookie = name + "=" + escape(value) +
 597                 ((expires) ? "; expires=" + expires.toGMTString() : "") +
 598                 ((path) ? "; path=" + escape(path) : "") +
 599                 ((domain) ? "; domain=" + domain : "") +
 600                 ((secure) ? "; secure" : "");
 601
 602         document.cookie = curCookie;
 603 }
 604
 605 function TinyMCE_advanced_getCookie(name) {
 606         var dc = document.cookie;
 607         var prefix = name + "=";
 608         var begin = dc.indexOf("; " + prefix);
 609
 610         if (begin == -1) {
 611                 begin = dc.indexOf(prefix);
 612
 613                 if (begin != 0)
 614                         return null;
 615         } else
 616                 begin += 2;
 617
 618         var end = document.cookie.indexOf(";", begin);
 619
 620         if (end == -1)
 621                 end = dc.length;
 622
 623         return unescape(dc.substring(begin + prefix.length, end));
 624 }
 625
 626 function TinyMCE_advanced_resizeTo(inst, w, h, set_w) {
 627         var editorContainer = document.getElementById(inst.editorId + '_parent');
 628         var tableElm = editorContainer.firstChild;
 629         var iframe = inst.iframeElement;
 630
 631         if (w == null || w == "null") {
 632                 set_w = false;
 633                 w = 0;
 634         }
 635
 636         if (h == null || h == "null")
 637                 return;
 638
 639         w = parseInt(w);
 640         h = parseInt(h);
 641
 642         if (tinyMCE.isGecko) {
 643                 w += 2;
 644                 h += 2;
 645         }
 646
 647         var dx = w - tableElm.clientWidth;
 648         var dy = h - tableElm.clientHeight;
 649
 650         if (set_w)
 651                 tableElm.style.width = w + "px";
 652
 653         tableElm.style.height = h + "px";
 654
 655         iw = iframe.clientWidth + dx;
 656         ih = iframe.clientHeight + dy;
 657
 658         if (tinyMCE.isGecko) {
 659                 iw -= 2;
 660                 ih -= 2;
 661         }
 662
 663         if (set_w)
 664                 iframe.style.width = iw + "px";
 665
 666         iframe.style.height = ih + "px";
 667
 668         // Is it to small, make it bigger again
 669         if (set_w) {
 670                 var tableBodyElm = tableElm.firstChild;
 671                 var minIframeWidth = tableBodyElm.scrollWidth;
 672                 if (inst.iframeElement.clientWidth < minIframeWidth) {
 673                         dx = minIframeWidth - inst.iframeElement.clientWidth;
 674
 675                         inst.iframeElement.style.width = (iw + dx) + "px";
 676                 }
 677         }
 678 }
 679
 680 /**
 681  * Handles resizing events.
 682  */
 683 function TinyMCE_advanced_resizeEventHandler(e) {
 684         var resizer = TinyMCE_advanced_resizer;
 685
 686         // Do nothing
 687         if (!resizer.resizing)
 688                 return;
 689
 690         e = typeof(e) == "undefined" ? window.event : e;
 691
 692         var dx = e.screenX - resizer.downX;
 693         var dy = e.screenY - resizer.downY;
 694         var resizeBox = resizer.resizeBox;
 695         var editorId = resizer.editorId;
 696
 697         switch (e.type) {
 698                 case "mousemove":
 699                         if (resizer.horizontal)
 700                                 resizeBox.style.width = (resizer.width + dx) + "px";
 701
 702                         resizeBox.style.height = (resizer.height + dy) + "px";
 703                         break;
 704
 705                 case "mouseup":
 706                         TinyMCE_advanced_setResizing(e, editorId, false);
 707                         TinyMCE_advanced_resizeTo(tinyMCE.getInstanceById(editorId), resizer.width + dx, resizer.height + dy, resizer.horizontal);
 708
 709                         // Expire in a month
 710                         var expires = new Date();
 711                         expires.setTime(expires.getTime() + 3600000 * 24 * 30);
 712
 713                         // Set the cookies
 714                         TinyMCE_advanced_setCookie("TinyMCE_" + editorId + "_width", "" + (resizer.horizontal ? resizer.width + dx : ""), expires);
 715                         TinyMCE_advanced_setCookie("TinyMCE_" + editorId + "_height", "" + (resizer.height + dy), expires);
 716                         break;
 717         }
 718 }
 719
 720 /**
 721  * Insert link template function.
 722  */
 723 function TinyMCE_advanced_getInsertLinkTemplate()
 724 {
 725         var template = new Array();
 726
 727         template['file'] = 'link.htm';
 728         template['width'] = 330;
 729         template['height'] = 170;
 730
 731         // Language specific width and height addons
 732         template['width'] += tinyMCE.getLang('lang_insert_link_delta_width', 0);
 733         template['height'] += tinyMCE.getLang('lang_insert_link_delta_height', 0);
 734
 735         return template;
 736 };
 737
 738 /**
 739  * Insert image template function.
 740  */
 741 function TinyMCE_advanced_getInsertImageTemplate()
 742 {
 743         var template = new Array();
 744
 745         template['file'] = 'image.htm?src={$src}';
 746         template['width'] = 340;
 747         template['height'] = 245;
 748
 749         // Language specific width and height addons
 750         template['width'] += tinyMCE.getLang('lang_insert_image_delta_width', 0);
 751         template['height'] += tinyMCE.getLang('lang_insert_image_delta_height', 0);
 752
 753         return template;
 754 };
 755
 756 /**
 757  * Node change handler.
 758  */
 759 function TinyMCE_advanced_handleNodeChange (editor_id, node, undo_index,
 760                                                                                                                           undo_levels, visual_aid, any_selection)
 761 {
 762         function selectByValue(select_elm, value)
 763         {
 764                 if (select_elm)
 765                 {
 766                         for (var i=0; i<select_elm.options.length; i++)
 767                         {
 768                                 if (select_elm.options[i].value == value)
 769                                 {
 770                                         select_elm.selectedIndex = i;
 771                                         return true;
 772                                 }
 773                         }
 774                 }
 775
 776                 return false;
 777         };
 778
 779         function getAttrib(elm, name)
 780         {
 781                 return elm.getAttribute(name) ? elm.getAttribute(name) : "";
 782         };
 783
 784         // No node provided
 785         if (node == null)
 786         {
 787                 return;
 788         }
 789
 790         // Update path
 791         var pathElm = document.getElementById(editor_id + "_path");
 792
 793         if (pathElm)
 794         {
 795                 // Get node path
 796                 var parentNode = node;
 797                 var path = new Array();
 798
 799                 while (parentNode)
 800                 {
 801                         if (parentNode.nodeName.toLowerCase() == "body")
 802                         {
 803                                 break;
 804                         }
 805
 806                         // Only append element nodes to path
 807                         if (parentNode.nodeType == 1)
 808                         {
 809                                 path[path.length] = parentNode;
 810                         }
 811
 812                         parentNode = parentNode.parentNode;
 813                 }
 814
 815                 // Setup HTML
 816                 var html = "";
 817                 for (var i=path.length-1; i>=0; i--)
 818                 {
 819                         var nodeName = path[i].nodeName.toLowerCase();
 820                         var nodeData = "";
 821
 822                         if (nodeName == "b")
 823                         {
 824                                 nodeName = "strong";
 825                         }
 826
 827                         if (nodeName == "i")
 828                         {
 829                                 nodeName = "em";
 830                         }
 831
 832                         if (getAttrib(path[i], 'id') != "")
 833                         {
 834                                 nodeData += "id: " + path[i].getAttribute('id') + " ";
 835                         }
 836
 837                         var className = tinyMCE.getVisualAidClass(tinyMCE.getAttrib(path[i], "class"), false);
 838                         if (className != "" && className.indexOf('mceItem') == -1)
 839                                 nodeData += "class: " + className + " ";
 840
 841                         if (getAttrib(path[i], 'src') != "")
 842                         {
 843                                 nodeData += "src: " + path[i].getAttribute('src') + " ";
 844                         }
 845
 846                         if (getAttrib(path[i], 'href') != "")
 847                         {
 848                                 nodeData += "href: " + path[i].getAttribute('href') + " ";
 849                         }
 850
 851                         if (nodeName == "img" && tinyMCE.getAttrib(path[i], "class").indexOf('mceItemFlash') != -1)
 852                         {
 853                                 nodeName = "flash";
 854                                 nodeData = "";
 855                         }
 856
 857                         if (nodeName == "a" && (anchor = tinyMCE.getAttrib(path[i], "name")) != "")
 858                         {
 859                                 nodeName = "a";
 860                                 nodeName += "#" + anchor;
 861                                 nodeData = "";
 862                         }
 863
 864                         if (getAttrib(path[i], 'name').indexOf("mce_") != 0)
 865                         {
 866                                 var className = tinyMCE.getVisualAidClass(tinyMCE.getAttrib(path[i], "class"), false);
 867                                 if (className != "" && className.indexOf('mceItem') == -1)
 868                                         nodeName += "." + className;
 869                         }
 870
 871                         if (tinyMCE.isMSIE)
 872                         {
 873                                 html += '<a title="' + nodeData + '" href="javascript:void(0);" onmousedown="tinyMCE.execInstanceCommand(\'' + editor_id + '\',\'mceSelectNodeDepth\',false,\'' + i + '\');return false;" class="mcePathItem">' + nodeName + '</a>';
 874                         }
 875                         else
 876                         {
 877                                 html += '<a title="' + nodeData + '" href="javascript:tinyMCE.execInstanceCommand(\'' + editor_id + '\',\'mceSelectNodeDepth\',false,\'' + i + '\');" class="mcePathItem">' + nodeName + '</a>';
 878                         }
 879
 880                         if (i > 0)
 881                         {
 882                                 html += " &raquo; ";
 883                         }
 884                 }
 885
 886                 pathElm.innerHTML = tinyMCE.getLang('lang_theme_path') + ": " + html + '&nbsp;';
 887         }
 888
 889         // Reset old states
 890         tinyMCE.switchClassSticky(editor_id + '_justifyleft', 'mceButtonNormal');
 891         tinyMCE.switchClassSticky(editor_id + '_justifyright', 'mceButtonNormal');
 892         tinyMCE.switchClassSticky(editor_id + '_justifycenter', 'mceButtonNormal');
 893         tinyMCE.switchClassSticky(editor_id + '_justifyfull', 'mceButtonNormal');
 894         tinyMCE.switchClassSticky(editor_id + '_bold', 'mceButtonNormal');
 895         tinyMCE.switchClassSticky(editor_id + '_italic', 'mceButtonNormal');
 896         tinyMCE.switchClassSticky(editor_id + '_underline', 'mceButtonNormal');
 897         tinyMCE.switchClassSticky(editor_id + '_strikethrough', 'mceButtonNormal');
 898         tinyMCE.switchClassSticky(editor_id + '_bullist', 'mceButtonNormal');
 899         tinyMCE.switchClassSticky(editor_id + '_numlist', 'mceButtonNormal');
 900         tinyMCE.switchClassSticky(editor_id + '_sub', 'mceButtonNormal');
 901         tinyMCE.switchClassSticky(editor_id + '_sup', 'mceButtonNormal');
 902         tinyMCE.switchClassSticky(editor_id + '_anchor', 'mceButtonNormal');
 903         tinyMCE.switchClassSticky(editor_id + '_link', 'mceButtonDisabled', true);
 904         tinyMCE.switchClassSticky(editor_id + '_unlink', 'mceButtonDisabled', true);
 905         tinyMCE.switchClassSticky(editor_id + '_outdent', 'mceButtonDisabled', true);
 906         tinyMCE.switchClassSticky(editor_id + '_image', 'mceButtonNormal');
 907         tinyMCE.switchClassSticky(editor_id + '_hr', 'mceButtonNormal');
 908
 909         if (node.nodeName == "A" && tinyMCE.getAttrib(node, "class").indexOf('mceItemAnchor') != -1)
 910                 tinyMCE.switchClassSticky(editor_id + '_anchor', 'mceButtonSelected');
 911
 912         // Get link
 913         var anchorLink = tinyMCE.getParentElement(node, "a", "href");
 914
 915         if (anchorLink || any_selection)
 916         {
 917                 tinyMCE.switchClassSticky(editor_id + '_link', anchorLink ? 'mceButtonSelected' : 'mceButtonNormal', false);
 918                 tinyMCE.switchClassSticky(editor_id + '_unlink', anchorLink ? 'mceButtonSelected' : 'mceButtonNormal', false);
 919         }
 920
 921         // Handle visual aid
 922         tinyMCE.switchClassSticky(editor_id + '_visualaid', visual_aid ? 'mceButtonSelected' : 'mceButtonNormal', false);
 923
 924         if (undo_levels != -1)
 925         {
 926                 tinyMCE.switchClassSticky(editor_id + '_undo', 'mceButtonDisabled', true);
 927                 tinyMCE.switchClassSticky(editor_id + '_redo', 'mceButtonDisabled', true);
 928         }
 929
 930         // Within li, blockquote
 931         if (tinyMCE.getParentElement(node, "li,blockquote"))
 932         {
 933                 tinyMCE.switchClassSticky(editor_id + '_outdent', 'mceButtonNormal', false);
 934         }
 935
 936         // Has redo levels
 937         if (undo_index != -1 && (undo_index < undo_levels-1 && undo_levels > 0))
 938         {
 939                 tinyMCE.switchClassSticky(editor_id + '_redo', 'mceButtonNormal', false);
 940         }
 941
 942         // Has undo levels
 943         if (undo_index != -1 && (undo_index > 0 && undo_levels > 0))
 944         {
 945                 tinyMCE.switchClassSticky(editor_id + '_undo', 'mceButtonNormal', false);
 946         }
 947
 948         // Select class in select box
 949         var selectElm = document.getElementById(editor_id + "_styleSelect");
 950
 951         if (selectElm)
 952         {
 953                 TinyMCE_advanced_setupCSSClasses(editor_id);
 954
 955                 classNode = node;
 956                 breakOut = false;
 957                 var index = 0;
 958
 959                 do
 960                 {
 961                         if (classNode && classNode.className)
 962                         {
 963                                 for (var i=0; i<selectElm.options.length; i++)
 964                                 {
 965                                         if (selectElm.options[i].value == classNode.className)
 966                                         {
 967                                                 index = i;
 968                                                 breakOut = true;
 969                                                 break;
 970                                         }
 971                                 }
 972                         }
 973                 } while (!breakOut && classNode != null && (classNode = classNode.parentNode));
 974
 975                 selectElm.selectedIndex = index;
 976         }
 977
 978         // Select formatblock
 979         var selectElm = document.getElementById(editor_id + "_formatSelect");
 980
 981         if (selectElm)
 982         {
 983                 var elm = tinyMCE.getParentElement(node, "p,div,h1,h2,h3,h4,h5,h6,pre,address");
 984
 985                 if (elm)
 986                 {
 987                         selectByValue(selectElm, "<" + elm.nodeName.toLowerCase() + ">");
 988                 }
 989                 else
 990                 {
 991                         selectByValue(selectElm, "");
 992                 }
 993         }
 994
 995         // Select fontselect
 996         var selectElm = document.getElementById(editor_id + "_fontNameSelect");
 997         if (selectElm) {
 998                 var elm = tinyMCE.getParentElement(node);
 999
1000                 if (elm) {
1001                         var family = tinyMCE.getAttrib(elm, "face");
1002                         if (family == '')
1003                                 family = '' + elm.style.fontFamily;
1004
1005                         if (!selectByValue(selectElm, family))
1006                                 selectByValue(selectElm, "");
1007                 } else
1008                         selectByValue(selectElm, "");
1009         }
1010
1011         // Select fontsize
1012         var selectElm = document.getElementById(editor_id + "_fontSizeSelect");
1013         if (selectElm) {
1014                 var elm = tinyMCE.getParentElement(node);
1015
1016                 if (elm) {
1017                         var size = tinyMCE.getAttrib(elm, "size");
1018                         if (size == '') {
1019                                 var sizes = new Array('', '8px', '10px', '12px', '14px', '18px', '24px', '36px');
1020
1021                                 size = '' + elm.style.fontSize;
1022
1023                                 for (var i=0; i<sizes.length; i++) {
1024                                         if (('' + sizes[i]) == size) {
1025                                                 size = i;
1026                                                 break;
1027                                         }
1028                                 }
1029                         }
1030
1031                         if (!selectByValue(selectElm, size))
1032                                 selectByValue(selectElm, "");
1033                 } else
1034                         selectByValue(selectElm, "0");
1035         }
1036
1037         // Handle align attributes
1038         alignNode = node;
1039         breakOut = false;
1040         do
1041         {
1042                 if (!alignNode.getAttribute || !alignNode.getAttribute('align'))
1043                 {
1044                         continue;
1045                 }
1046
1047                 switch (alignNode.getAttribute('align').toLowerCase())
1048                 {
1049                         case "left":
1050                                 tinyMCE.switchClassSticky(editor_id + '_justifyleft', 'mceButtonSelected');
1051                                 breakOut = true;
1052                         break;
1053
1054                         case "right":
1055                                 tinyMCE.switchClassSticky(editor_id + '_justifyright', 'mceButtonSelected');
1056                                 breakOut = true;
1057                         break;
1058
1059                         case "middle":
1060                         case "center":
1061                                 tinyMCE.switchClassSticky(editor_id + '_justifycenter', 'mceButtonSelected');
1062                                 breakOut = true;
1063                         break;
1064
1065                         case "justify":
1066                                 tinyMCE.switchClassSticky(editor_id + '_justifyfull', 'mceButtonSelected');
1067                                 breakOut = true;
1068                         break;
1069                 }
1070         } while (!breakOut && (alignNode = alignNode.parentNode));
1071
1072         // Div justification
1073         var div = tinyMCE.getParentElement(node, "div");
1074         if (div && div.style.textAlign == "center")
1075                 tinyMCE.switchClassSticky(editor_id + '_justifycenter', 'mceButtonSelected');
1076
1077         // Do special text
1078         if (tinyMCE.isGecko && node.nodeType == 3)
1079         {
1080                 var inst = tinyMCE.getInstanceById(editor_id);
1081                 var doc = inst.getDoc();
1082
1083                 if (doc.queryCommandState("Bold"))
1084                 {
1085                         tinyMCE.switchClassSticky(editor_id + '_bold', 'mceButtonSelected');
1086                 }
1087
1088                 if (doc.queryCommandState("Italic"))
1089                 {
1090                         tinyMCE.switchClassSticky(editor_id + '_italic', 'mceButtonSelected');
1091                 }
1092
1093                 if (doc.queryCommandState("Underline") &&
1094                                                                                   (node.parentNode == null || node.parentNode.nodeName != "A"))
1095                 {
1096                         tinyMCE.switchClassSticky(editor_id + '_underline', 'mceButtonSelected');
1097                 }
1098
1099                 if (doc.queryCommandState("Strikethrough"))
1100                 {
1101                         tinyMCE.switchClassSticky(editor_id + '_strikethrough', 'mceButtonSelected');
1102                 }
1103         }
1104
1105         // Handle elements
1106         do
1107         {
1108                 switch (node.nodeName.toLowerCase())
1109                 {
1110                         case "b":
1111                         case "strong":
1112                                 tinyMCE.switchClassSticky(editor_id + '_bold', 'mceButtonSelected');
1113                         break;
1114
1115                         case "i":
1116                         case "em":
1117                                 tinyMCE.switchClassSticky(editor_id + '_italic', 'mceButtonSelected');
1118                         break;
1119
1120                         case "u":
1121                                 tinyMCE.switchClassSticky(editor_id + '_underline', 'mceButtonSelected');
1122                         break;
1123
1124                         case "strike":
1125                                 tinyMCE.switchClassSticky(editor_id + '_strikethrough', 'mceButtonSelected');
1126                         break;
1127
1128                         case "ul":
1129                                 tinyMCE.switchClassSticky(editor_id + '_bullist', 'mceButtonSelected');
1130                         break;
1131
1132                         case "ol":
1133                                 tinyMCE.switchClassSticky(editor_id + '_numlist', 'mceButtonSelected');
1134                         break;
1135
1136                         case "sub":
1137                                 tinyMCE.switchClassSticky(editor_id + '_sub', 'mceButtonSelected');
1138                         break;
1139
1140                         case "sup":
1141                                 tinyMCE.switchClassSticky(editor_id + '_sup', 'mceButtonSelected');
1142                         break;
1143
1144                         case "hr":
1145                                  tinyMCE.switchClassSticky(editor_id + '_hr', 'mceButtonSelected');
1146                         break;
1147
1148                         case "img":
1149                         if (getAttrib(node, 'name').indexOf('mce_') != 0)
1150                         {
1151                                 tinyMCE.switchClassSticky(editor_id + '_image', 'mceButtonSelected');
1152                         }
1153                         break;
1154                 }
1155         } while ((node = node.parentNode));
1156 };
1157
1158 // This function auto imports CSS classes into the class selection droplist
1159 function TinyMCE_advanced_setupCSSClasses(editor_id)
1160 {
1161         if (!TinyMCE_advanced_autoImportCSSClasses)
1162         {
1163                 return;
1164         }
1165
1166         var selectElm = document.getElementById(editor_id + '_styleSelect');
1167
1168         if (selectElm && selectElm.getAttribute('cssImported') != 'true')
1169         {
1170                 var csses = tinyMCE.getCSSClasses(editor_id);
1171                 if (csses && selectElm)
1172                 {
1173                         for (var i=0; i<csses.length; i++)
1174                         {
1175                                 selectElm.options[selectElm.length] = new Option(csses[i], csses[i]);
1176                         }
1177                 }
1178
1179                 // Only do this once
1180                 if (csses != null && csses.length > 0)
1181                 {
1182                         selectElm.setAttribute('cssImported', 'true');
1183                 }
1184         }
1185 };