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