PHP Cross Reference of WordPress Subversion HEAD

[ Index ]     [ Classes ]     [ Functions ]     [ Variables ]     [ Constants ]

title

Body

[close]

/wp-includes/js/tinymce/themes/advanced/ -> editor_template.js (source)

   1  /**
   2   * $Id: editor_template_src.js 256 2007-04-24 09:03:20Z spocke $
   3   *
   4   * @author Moxiecode
   5   * @copyright Copyright © 2004-2007, Moxiecode Systems AB, All rights reserved.
   6   */
   7  
   8  /* Import theme specific language pack */
   9  tinyMCE.importThemeLanguagePack('advanced');
  10  
  11  var TinyMCE_AdvancedTheme = {
  12      // Private theme fields
  13      _defColors : "000000,993300,333300,003300,003366,000080,333399,333333,800000,FF6600,808000,008000,008080,0000FF,666699,808080,FF0000,FF9900,99CC00,339966,33CCCC,3366FF,800080,999999,FF00FF,FFCC00,FFFF00,00FF00,00FFFF,00CCFF,993366,C0C0C0,FF99CC,FFCC99,FFFF99,CCFFCC,CCFFFF,99CCFF,CC99FF,FFFFFF",
  14      _autoImportCSSClasses : true,
  15      _resizer : {},
  16      _buttons : [
  17          // Control id, button img, button title, command, user_interface, value
  18          ['bold', '{$lang_bold_img}', 'lang_bold_desc', 'Bold'],
  19          ['italic', '{$lang_italic_img}', 'lang_italic_desc', 'Italic'],
  20          ['underline', '{$lang_underline_img}', 'lang_underline_desc', 'Underline'],
  21          ['strikethrough', 'strikethrough.gif', 'lang_striketrough_desc', 'Strikethrough'],
  22          ['justifyleft', 'justifyleft.gif', 'lang_justifyleft_desc', 'JustifyLeft'],
  23          ['justifycenter', 'justifycenter.gif', 'lang_justifycenter_desc', 'JustifyCenter'],
  24          ['justifyright', 'justifyright.gif', 'lang_justifyright_desc', 'JustifyRight'],
  25          ['justifyfull', 'justifyfull.gif', 'lang_justifyfull_desc', 'JustifyFull'],
  26          ['bullist', 'bullist.gif', 'lang_bullist_desc', 'InsertUnorderedList'],
  27          ['numlist', 'numlist.gif', 'lang_numlist_desc', 'InsertOrderedList'],
  28          ['outdent', 'outdent.gif', 'lang_outdent_desc', 'Outdent'],
  29          ['indent', 'indent.gif', 'lang_indent_desc', 'Indent'],
  30          ['cut', 'cut.gif', 'lang_cut_desc', 'Cut'],
  31          ['copy', 'copy.gif', 'lang_copy_desc', 'Copy'],
  32          ['paste', 'paste.gif', 'lang_paste_desc', 'Paste'],
  33          ['undo', 'undo.gif', 'lang_undo_desc', 'Undo'],
  34          ['redo', 'redo.gif', 'lang_redo_desc', 'Redo'],
  35          ['link', 'link.gif', 'lang_link_desc', 'mceLink', true],
  36          ['unlink', 'unlink.gif', 'lang_unlink_desc', 'unlink'],
  37          ['image', 'image.gif', 'lang_image_desc', 'mceImage', true],
  38          ['cleanup', 'cleanup.gif', 'lang_cleanup_desc', 'mceCleanup'],
  39          ['help', 'help.gif', 'lang_help_desc', 'mceHelp'],
  40          ['code', 'code.gif', 'lang_theme_code_desc', 'mceCodeEditor'],
  41          ['hr', 'hr.gif', 'lang_theme_hr_desc', 'inserthorizontalrule'],
  42          ['removeformat', 'removeformat.gif', 'lang_theme_removeformat_desc', 'removeformat'],
  43          ['sub', 'sub.gif', 'lang_theme_sub_desc', 'subscript'],
  44          ['sup', 'sup.gif', 'lang_theme_sup_desc', 'superscript'],
  45          ['forecolor', 'forecolor.gif', 'lang_theme_forecolor_desc', 'forecolor', true],
  46          ['forecolorpicker', 'forecolor.gif', 'lang_theme_forecolor_desc', 'forecolorpicker', true],
  47          ['backcolor', 'backcolor.gif', 'lang_theme_backcolor_desc', 'HiliteColor', true],
  48          ['backcolorpicker', 'backcolor.gif', 'lang_theme_backcolor_desc', 'backcolorpicker', true],
  49          ['charmap', 'charmap.gif', 'lang_theme_charmap_desc', 'mceCharMap'],
  50          ['visualaid', 'visualaid.gif', 'lang_theme_visualaid_desc', 'mceToggleVisualAid'],
  51          ['anchor', 'anchor.gif', 'lang_theme_anchor_desc', 'mceInsertAnchor'],
  52          ['newdocument', 'newdocument.gif', 'lang_newdocument_desc', 'mceNewDocument']
  53      ],
  54  
  55      _buttonMap : 'anchor,backcolor,bold,bullist,charmap,cleanup,code,copy,cut,forecolor,help,hr,image,indent,italic,justifycenter,justifyfull,justifyleft,justifyright,link,newdocument,numlist,outdent,paste,redo,removeformat,strikethrough,sub,sup,underline,undo,unlink,visualaid,advhr,ltr,rtl,emotions,flash,fullpage,fullscreen,iespell,insertdate,inserttime,pastetext,pasteword,selectall,preview,print,save,replace,search,table,cell_props,delete_col,delete_row,col_after,col_before,row_after,row_before,merge_cells,row_props,split_cells,delete_table',
  56  
  57      /**
  58       * Returns HTML code for the specificed control.
  59       */
  60      getControlHTML : function(button_name) {
  61          var i, x, but;
  62  
  63          // Lookup button in button list
  64          for (i=0; i<TinyMCE_AdvancedTheme._buttons.length; i++) {
  65              but = TinyMCE_AdvancedTheme._buttons[i];
  66  
  67              if (but[0] == button_name && (button_name == "forecolor" || button_name == "backcolor"))
  68                  return tinyMCE.getMenuButtonHTML(but[0], but[2], '{$themeurl}/images/' + but[1], but[3] + "Menu", but[3], (but.length > 4 ? but[4] : false), (but.length > 5 ? but[5] : null));
  69  
  70              if (but[0] == button_name)
  71                  return tinyMCE.getButtonHTML(but[0], but[2], '{$themeurl}/images/' + but[1], but[3], (but.length > 4 ? but[4] : false), (but.length > 5 ? but[5] : null));
  72          }
  73  
  74          // Custom controlls other than buttons
  75          switch (button_name) {
  76              case "formatselect":
  77                  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">';
  78                  var formats = tinyMCE.getParam("theme_advanced_blockformats", "p,address,pre,h1,h2,h3,h4,h5,h6", true).split(',');
  79                  var lookup = [
  80                      ['p', '{$lang_theme_paragraph}'],
  81                      ['address', '{$lang_theme_address}'],
  82                      ['pre', '{$lang_theme_pre}'],
  83                      ['h1', '{$lang_theme_h1}'],
  84                      ['h2', '{$lang_theme_h2}'],
  85                      ['h3', '{$lang_theme_h3}'],
  86                      ['h4', '{$lang_theme_h4}'],
  87                      ['h5', '{$lang_theme_h5}'],
  88                      ['h6', '{$lang_theme_h6}'],
  89                      ['div', '{$lang_theme_div}'],
  90                      ['blockquote', '{$lang_theme_blockquote}'],
  91                      ['code', '{$lang_theme_code}'],
  92                      ['dt', '{$lang_theme_dt}'],
  93                      ['dd', '{$lang_theme_dd}'],
  94                      ['samp', '{$lang_theme_samp}']
  95                  ];
  96  
  97                  html += '<option value="">{$lang_theme_block}</option>';
  98  
  99                  // Build format select
 100                  for (var i=0; i<formats.length; i++) {
 101                      for (var x=0; x<lookup.length; x++) {
 102                          if (formats[i] == lookup[x][0])
 103                              html += '<option value="&lt;' + lookup[x][0] + '&gt;">' + lookup[x][1] + '</option>';
 104                      }
 105                  }
 106  
 107                  html += '</select>';
 108  
 109                  return html;
 110  
 111              case "styleselect":
 112                  return '<select id="{$editor_id}_styleSelect" onmousedown="tinyMCE.themes.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>';
 113  
 114              case "fontselect":
 115                  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>';
 116                  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';
 117                  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';
 118                  var fonts = tinyMCE.getParam("theme_advanced_fonts", nFonts).split(';');
 119                  for (i=0; i<fonts.length; i++) {
 120                      if (fonts[i] != '') {
 121                          var parts = fonts[i].split('=');
 122                          fontHTML += '<option value="' + parts[1] + '">' + parts[0] + '</option>';
 123                      }
 124                  }
 125  
 126                  fontHTML += '</select>';
 127                  return fontHTML;
 128  
 129              case "fontsizeselect":
 130                  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">'+
 131                          '<option value="0">{$lang_theme_font_size}</option>'+
 132                          '<option value="1">1 (8 pt)</option>'+
 133                          '<option value="2">2 (10 pt)</option>'+
 134                          '<option value="3">3 (12 pt)</option>'+
 135                          '<option value="4">4 (14 pt)</option>'+
 136                          '<option value="5">5 (18 pt)</option>'+
 137                          '<option value="6">6 (24 pt)</option>'+
 138                          '<option value="7">7 (36 pt)</option>'+
 139                          '</select>';
 140  
 141              case "|":
 142              case "separator":
 143                  return '<img src="{$themeurl}/images/separator.gif" width="2" height="20" class="mceSeparatorLine" alt="" />';
 144  
 145              case "spacer":
 146                  return '<img src="{$themeurl}/images/separator.gif" width="2" height="15" border="0" class="mceSeparatorLine" style="vertical-align: middle" alt="" />';
 147  
 148              case "rowseparator":
 149                  return '<br />';
 150          }
 151  
 152          return "";
 153      },
 154  
 155      /**
 156       * Theme specific execcommand handling.
 157       */
 158      execCommand : function(editor_id, element, command, user_interface, value) {
 159          switch (command) {
 160              case 'mceHelp':
 161                  tinyMCE.openWindow({
 162                      file : 'about.htm',
 163                      width : 480,
 164                      height : 380
 165                  }, {
 166                      tinymce_version : tinyMCE.majorVersion + "." + tinyMCE.minorVersion,
 167                      tinymce_releasedate : tinyMCE.releaseDate,
 168                      inline : "yes"
 169                  });
 170              return true;
 171  
 172              case "mceLink":
 173                  var inst = tinyMCE.getInstanceById(editor_id);
 174                  var doc = inst.getDoc();
 175                  var selectedText = "";
 176  
 177                  if (tinyMCE.isMSIE) {
 178                      var rng = doc.selection.createRange();
 179                      selectedText = rng.text;
 180                  } else
 181                      selectedText = inst.getSel().toString();
 182  
 183                  if (!tinyMCE.linkElement) {
 184                      if ((tinyMCE.selectedElement.nodeName.toLowerCase() != "img") && (selectedText.length <= 0))
 185                          return true;
 186                  }
 187  
 188                  var href = "", target = "", title = "", onclick = "", action = "insert", style_class = "";
 189  
 190                  if (tinyMCE.selectedElement.nodeName.toLowerCase() == "a")
 191                      tinyMCE.linkElement = tinyMCE.selectedElement;
 192  
 193                  // Is anchor not a link
 194                  if (tinyMCE.linkElement != null && tinyMCE.getAttrib(tinyMCE.linkElement, 'href') == "")
 195                      tinyMCE.linkElement = null;
 196  
 197                  if (tinyMCE.linkElement) {
 198                      href = tinyMCE.getAttrib(tinyMCE.linkElement, 'href');
 199                      target = tinyMCE.getAttrib(tinyMCE.linkElement, 'target');
 200                      title = tinyMCE.getAttrib(tinyMCE.linkElement, 'title');
 201                      onclick = tinyMCE.getAttrib(tinyMCE.linkElement, 'onclick');
 202                      style_class = tinyMCE.getAttrib(tinyMCE.linkElement, 'class');
 203  
 204                      // Try old onclick to if copy/pasted content
 205                      if (onclick == "")
 206                          onclick = tinyMCE.getAttrib(tinyMCE.linkElement, 'onclick');
 207  
 208                      onclick = tinyMCE.cleanupEventStr(onclick);
 209  
 210                      href = eval(tinyMCE.settings['urlconverter_callback'] + "(href, tinyMCE.linkElement, true);");
 211  
 212                      // Use mce_href if defined
 213                      mceRealHref = tinyMCE.getAttrib(tinyMCE.linkElement, 'mce_href');
 214                      if (mceRealHref != "") {
 215                          href = mceRealHref;
 216  
 217                          if (tinyMCE.getParam('convert_urls'))
 218                              href = eval(tinyMCE.settings['urlconverter_callback'] + "(href, tinyMCE.linkElement, true);");
 219                      }
 220  
 221                      action = "update";
 222                  }
 223  
 224                  var template = new Array();
 225  
 226                  template['file'] = 'link.htm';
 227                  template['width'] = 310;
 228                  template['height'] = 200;
 229  
 230                  // Language specific width and height addons
 231                  template['width'] += tinyMCE.getLang('lang_insert_link_delta_width', 0);
 232                  template['height'] += tinyMCE.getLang('lang_insert_link_delta_height', 0);
 233  
 234                  if (inst.settings['insertlink_callback']) {
 235                      var returnVal = eval(inst.settings['insertlink_callback'] + "(href, target, title, onclick, action, style_class);");
 236                      if (returnVal && returnVal['href'])
 237                          TinyMCE_AdvancedTheme._insertLink(returnVal['href'], returnVal['target'], returnVal['title'], returnVal['onclick'], returnVal['style_class']);
 238                  } else {
 239                      tinyMCE.openWindow(template, {href : href, target : target, title : title, onclick : onclick, action : action, className : style_class, inline : "yes"});
 240                  }
 241  
 242                  return true;
 243  
 244              case "mceImage":
 245                  var src = "", alt = "", border = "", hspace = "", vspace = "", width = "", height = "", align = "";
 246                  var title = "", onmouseover = "", onmouseout = "", action = "insert";
 247                  var img = tinyMCE.imgElement;
 248                  var inst = tinyMCE.getInstanceById(editor_id);
 249  
 250                  if (tinyMCE.selectedElement != null && tinyMCE.selectedElement.nodeName.toLowerCase() == "img") {
 251                      img = tinyMCE.selectedElement;
 252                      tinyMCE.imgElement = img;
 253                  }
 254  
 255                  if (img) {
 256                      // Is it a internal MCE visual aid image, then skip this one.
 257                      if (tinyMCE.getAttrib(img, 'name').indexOf('mce_') == 0)
 258                          return true;
 259  
 260                      src = tinyMCE.getAttrib(img, 'src');
 261                      alt = tinyMCE.getAttrib(img, 'alt');
 262  
 263                      // Try polling out the title
 264                      if (alt == "")
 265                          alt = tinyMCE.getAttrib(img, 'title');
 266  
 267                      // Fix width/height attributes if the styles is specified
 268                      if (tinyMCE.isGecko) {
 269                          var w = img.style.width;
 270                          if (w != null && w != "")
 271                              img.setAttribute("width", w);
 272  
 273                          var h = img.style.height;
 274                          if (h != null && h != "")
 275                              img.setAttribute("height", h);
 276                      }
 277  
 278                      border = tinyMCE.getAttrib(img, 'border');
 279                      hspace = tinyMCE.getAttrib(img, 'hspace');
 280                      vspace = tinyMCE.getAttrib(img, 'vspace');
 281                      width = tinyMCE.getAttrib(img, 'width');
 282                      height = tinyMCE.getAttrib(img, 'height');
 283                      align = tinyMCE.getAttrib(img, 'align');
 284                      onmouseover = tinyMCE.getAttrib(img, 'onmouseover');
 285                      onmouseout = tinyMCE.getAttrib(img, 'onmouseout');
 286                      title = tinyMCE.getAttrib(img, 'title');
 287  
 288                      // Is realy specified?
 289                      if (tinyMCE.isMSIE) {
 290                          width = img.attributes['width'].specified ? width : "";
 291                          height = img.attributes['height'].specified ? height : "";
 292                      }
 293  
 294                      //onmouseover = tinyMCE.getImageSrc(tinyMCE.cleanupEventStr(onmouseover));
 295                      //onmouseout = tinyMCE.getImageSrc(tinyMCE.cleanupEventStr(onmouseout));
 296  
 297                      src = eval(tinyMCE.settings['urlconverter_callback'] + "(src, img, true);");
 298  
 299                      // Use mce_src if defined
 300                      mceRealSrc = tinyMCE.getAttrib(img, 'mce_src');
 301                      if (mceRealSrc != "") {
 302                          src = mceRealSrc;
 303  
 304                          if (tinyMCE.getParam('convert_urls'))
 305                              src = eval(tinyMCE.settings['urlconverter_callback'] + "(src, img, true);");
 306                      }
 307  
 308                      //if (onmouseover != "")
 309                      //    onmouseover = eval(tinyMCE.settings['urlconverter_callback'] + "(onmouseover, img, true);");
 310  
 311                      //if (onmouseout != "")
 312                      //    onmouseout = eval(tinyMCE.settings['urlconverter_callback'] + "(onmouseout, img, true);");
 313  
 314                      action = "update";
 315                  }
 316  
 317                  var template = new Array();
 318  
 319                  template['file'] = 'image.htm?src={$src}';
 320                  template['width'] = 355;
 321                  template['height'] = 265 + (tinyMCE.isMSIE ? 25 : 0);
 322  
 323                  // Language specific width and height addons
 324                  template['width'] += tinyMCE.getLang('lang_insert_image_delta_width', 0);
 325                  template['height'] += tinyMCE.getLang('lang_insert_image_delta_height', 0);
 326  
 327                  if (inst.settings['insertimage_callback']) {
 328                      var returnVal = eval(inst.settings['insertimage_callback'] + "(src, alt, border, hspace, vspace, width, height, align, title, onmouseover, onmouseout, action);");
 329                      if (returnVal && returnVal['src'])
 330                          TinyMCE_AdvancedTheme._insertImage(returnVal['src'], returnVal['alt'], returnVal['border'], returnVal['hspace'], returnVal['vspace'], returnVal['width'], returnVal['height'], returnVal['align'], returnVal['title'], returnVal['onmouseover'], returnVal['onmouseout']);
 331                  } else
 332                      tinyMCE.openWindow(template, {src : src, alt : alt, border : border, hspace : hspace, vspace : vspace, width : width, height : height, align : align, title : title, onmouseover : onmouseover, onmouseout : onmouseout, action : action, inline : "yes"});
 333  
 334                  return true;
 335  
 336              case "forecolor":
 337                  var fcp = new TinyMCE_Layer(editor_id + '_fcPreview', false), p, img, elm;
 338  
 339                  TinyMCE_AdvancedTheme._hideMenus(editor_id);
 340  
 341                  if (!fcp.exists()) {
 342                      fcp.create('div', 'mceColorPreview', document.getElementById(editor_id + '_toolbar'));
 343                      elm = fcp.getElement();
 344                      elm._editor_id = editor_id;
 345                      elm._command = "forecolor";
 346                      elm._switchId = editor_id + "_forecolor";
 347                      tinyMCE.addEvent(elm, 'click', TinyMCE_AdvancedTheme._handleMenuEvent);
 348                      tinyMCE.addEvent(elm, 'mouseover', TinyMCE_AdvancedTheme._handleMenuEvent);
 349                      tinyMCE.addEvent(elm, 'mouseout', TinyMCE_AdvancedTheme._handleMenuEvent);
 350                  }
 351  
 352                  img = tinyMCE.selectNodes(document.getElementById(editor_id + "_forecolor"), function(n) {return n.nodeName == "IMG";})[0];
 353                  p = tinyMCE.getAbsPosition(img, document.getElementById(editor_id + '_toolbar'));
 354  
 355                  fcp.moveTo(p.absLeft, p.absTop);
 356                  fcp.getElement().style.backgroundColor = value != null ? value : tinyMCE.getInstanceById(editor_id).foreColor;
 357                  fcp.show();
 358  
 359                  return false;
 360  
 361              case "forecolorpicker":
 362                  this._pickColor(editor_id, 'forecolor');
 363                  return true;
 364  
 365              case "forecolorMenu":
 366                  TinyMCE_AdvancedTheme._hideMenus(editor_id);
 367  
 368                  // Create color layer
 369                  var ml = new TinyMCE_Layer(editor_id + '_fcMenu');
 370  
 371                  if (!ml.exists())
 372                      ml.create('div', 'mceMenu', document.body, TinyMCE_AdvancedTheme._getColorHTML(editor_id, 'theme_advanced_text_colors', 'forecolor'));
 373  
 374                  tinyMCE.switchClass(editor_id + '_forecolor', 'mceMenuButtonFocus');
 375                  ml.moveRelativeTo(document.getElementById(editor_id + "_forecolor"), 'bl');
 376  
 377                  ml.moveBy(tinyMCE.isMSIE && !tinyMCE.isOpera ? -1 : 1, -1);
 378  
 379                  if (tinyMCE.isOpera)
 380                      ml.moveBy(0, -2);
 381  
 382                  ml.show();
 383              return true;
 384  
 385              case "HiliteColor":
 386                  var bcp = new TinyMCE_Layer(editor_id + '_bcPreview', false), p, img;
 387  
 388                  TinyMCE_AdvancedTheme._hideMenus(editor_id);
 389  
 390                  if (!bcp.exists()) {
 391                      bcp.create('div', 'mceColorPreview', document.getElementById(editor_id + '_toolbar'));
 392                      elm = bcp.getElement();
 393                      elm._editor_id = editor_id;
 394                      elm._command = "HiliteColor";
 395                      elm._switchId = editor_id + "_backcolor";
 396                      tinyMCE.addEvent(elm, 'click', TinyMCE_AdvancedTheme._handleMenuEvent);
 397                      tinyMCE.addEvent(elm, 'mouseover', TinyMCE_AdvancedTheme._handleMenuEvent);
 398                      tinyMCE.addEvent(elm, 'mouseout', TinyMCE_AdvancedTheme._handleMenuEvent);
 399                  }
 400  
 401                  img = tinyMCE.selectNodes(document.getElementById(editor_id + "_backcolor"), function(n) {return n.nodeName == "IMG";})[0];
 402                  p = tinyMCE.getAbsPosition(img, document.getElementById(editor_id + '_toolbar'));
 403  
 404                  bcp.moveTo(p.absLeft, p.absTop);
 405                  bcp.getElement().style.backgroundColor = value != null ? value : tinyMCE.getInstanceById(editor_id).backColor;
 406                  bcp.show();
 407  
 408                  return false;
 409  
 410              case "HiliteColorMenu":
 411                  TinyMCE_AdvancedTheme._hideMenus(editor_id);
 412  
 413                  // Create color layer
 414                  var ml = new TinyMCE_Layer(editor_id + '_bcMenu');
 415  
 416                  if (!ml.exists())
 417                      ml.create('div', 'mceMenu', document.body, TinyMCE_AdvancedTheme._getColorHTML(editor_id, 'theme_advanced_background_colors', 'HiliteColor'));
 418  
 419                  tinyMCE.switchClass(editor_id + '_backcolor', 'mceMenuButtonFocus');
 420                  ml.moveRelativeTo(document.getElementById(editor_id + "_backcolor"), 'bl');
 421  
 422                  ml.moveBy(tinyMCE.isMSIE && !tinyMCE.isOpera ? -1 : 1, -1);
 423  
 424                  if (tinyMCE.isOpera)
 425                      ml.moveBy(0, -2);
 426  
 427                  ml.show();
 428              return true;
 429      
 430              case "backcolorpicker":
 431                  this._pickColor(editor_id, 'HiliteColor');
 432                  return true;
 433  
 434              case "mceColorPicker":
 435                  if (user_interface) {
 436                      var template = [];
 437      
 438                      if (!value['callback'] && !value['color'])
 439                          value['color'] = value['document'].getElementById(value['element_id']).value;
 440  
 441                      template['file'] = 'color_picker.htm';
 442                      template['width'] = 380;
 443                      template['height'] = 250;
 444                      template['close_previous'] = "no";
 445  
 446                      template['width'] += tinyMCE.getLang('lang_theme_advanced_colorpicker_delta_width', 0);
 447                      template['height'] += tinyMCE.getLang('lang_theme_advanced_colorpicker_delta_height', 0);
 448  
 449                      if (typeof(value['store_selection']) == "undefined")
 450                          value['store_selection'] = true;
 451  
 452                      tinyMCE.lastColorPickerValue = value;
 453                      tinyMCE.openWindow(template, {editor_id : editor_id, mce_store_selection : value['store_selection'], inline : "yes", command : "mceColorPicker", input_color : value['color']});
 454                  } else {
 455                      var savedVal = tinyMCE.lastColorPickerValue, elm;
 456  
 457                      if (savedVal['callback']) {
 458                          savedVal['callback'](value);
 459                          return true;
 460                      }
 461  
 462                      elm = savedVal['document'].getElementById(savedVal['element_id']);
 463                      elm.value = value;
 464  
 465                      if (elm.onchange != null && elm.onchange != '')
 466                          eval('elm.onchange();');
 467                  }
 468              return true;
 469  
 470              case "mceCodeEditor":
 471                  var template = new Array();
 472  
 473                  template['file'] = 'source_editor.htm';
 474                  template['width'] = parseInt(tinyMCE.getParam("theme_advanced_source_editor_width", 720));
 475                  template['height'] = parseInt(tinyMCE.getParam("theme_advanced_source_editor_height", 580));
 476  
 477                  tinyMCE.openWindow(template, {editor_id : editor_id, resizable : "yes", scrollbars : "no", inline : "yes"});
 478                  return true;
 479  
 480              case "mceCharMap":
 481                  var template = new Array();
 482  
 483                  template['file'] = 'charmap.htm';
 484                  template['width'] = 550 + (tinyMCE.isOpera ? 40 : 0);
 485                  template['height'] = 250;
 486  
 487                  template['width'] += tinyMCE.getLang('lang_theme_advanced_charmap_delta_width', 0);
 488                  template['height'] += tinyMCE.getLang('lang_theme_advanced_charmap_delta_height', 0);
 489  
 490                  tinyMCE.openWindow(template, {editor_id : editor_id, inline : "yes"});
 491                  return true;
 492  
 493              case "mceInsertAnchor":
 494                  var template = new Array();
 495  
 496                  template['file'] = 'anchor.htm';
 497                  template['width'] = 320;
 498                  template['height'] = 90 + (tinyMCE.isNS7 ? 30 : 0);
 499  
 500                  template['width'] += tinyMCE.getLang('lang_theme_advanced_anchor_delta_width', 0);
 501                  template['height'] += tinyMCE.getLang('lang_theme_advanced_anchor_delta_height', 0);
 502  
 503                  tinyMCE.openWindow(template, {editor_id : editor_id, inline : "yes"});
 504                  return true;
 505  
 506              case "mceNewDocument":
 507                  if (confirm(tinyMCE.getLang('lang_newdocument')))
 508                      tinyMCE.execInstanceCommand(editor_id, 'mceSetContent', false, ' ');
 509  
 510                  return true;
 511          }
 512  
 513          return false;
 514      },
 515  
 516      /**
 517       * Editor instance template function.
 518       */
 519      getEditorTemplate : function(settings, editorId) {
 520  		function removeFromArray(in_array, remove_array) {
 521              var outArray = new Array(), skip;
 522              
 523              for (var i=0; i<in_array.length; i++) {
 524                  skip = false;
 525  
 526                  for (var j=0; j<remove_array.length; j++) {
 527                      if (in_array[i] == remove_array[j]) {
 528                          skip = true;
 529                      }
 530                  }
 531  
 532                  if (!skip) {
 533                      outArray[outArray.length] = in_array[i];
 534                  }
 535              }
 536  
 537              return outArray;
 538          }
 539  
 540  		function addToArray(in_array, add_array) {
 541              for (var i=0; i<add_array.length; i++) {
 542                  in_array[in_array.length] = add_array[i];
 543              }
 544  
 545              return in_array;
 546          }
 547  
 548          var template = new Array();
 549          var deltaHeight = 0;
 550          var resizing = tinyMCE.getParam("theme_advanced_resizing", false);
 551          var path = tinyMCE.getParam("theme_advanced_path", true);
 552          var statusbarHTML = '<div id="{$editor_id}_path" class="mceStatusbarPathText" style="display: ' + (path ? "block" : "none") + '">&#160;</div><div id="{$editor_id}_resize" class="mceStatusbarResize" style="display: ' + (resizing ? "block" : "none") + '" onmousedown="tinyMCE.themes.advanced._setResizing(event,\'{$editor_id}\',true);"></div><br style="clear: both" />';
 553          var layoutManager = tinyMCE.getParam("theme_advanced_layout_manager", "SimpleLayout");
 554  
 555          // Setup style select options -- MOVED UP FOR EXTERNAL TOOLBAR COMPATABILITY!
 556          var styleSelectHTML = '<option value="">{$lang_theme_style_select}</option>';
 557          if (settings['theme_advanced_styles']) {
 558              var stylesAr = settings['theme_advanced_styles'].split(';');
 559              
 560              for (var i=0; i<stylesAr.length; i++) {
 561                  var key, value;
 562  
 563                  key = stylesAr[i].split('=')[0];
 564                  value = stylesAr[i].split('=')[1];
 565  
 566                  styleSelectHTML += '<option value="' + value + '">' + key + '</option>';
 567              }
 568  
 569              TinyMCE_AdvancedTheme._autoImportCSSClasses = false;
 570          }
 571  
 572          switch(layoutManager) {
 573              case "SimpleLayout" : //the default TinyMCE Layout (for backwards compatibility)...
 574                  var toolbarHTML = "";
 575                  var toolbarLocation = tinyMCE.getParam("theme_advanced_toolbar_location", "bottom");
 576                  var toolbarAlign = tinyMCE.getParam("theme_advanced_toolbar_align", "center");
 577                  var pathLocation = tinyMCE.getParam("theme_advanced_path_location", "none"); // Compatiblity
 578                  var statusbarLocation = tinyMCE.getParam("theme_advanced_statusbar_location", pathLocation);
 579                  var defVals = {
 580                      theme_advanced_buttons1 : "bold,italic,underline,strikethrough,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,styleselect,formatselect",
 581                      theme_advanced_buttons2 : "bullist,numlist,separator,outdent,indent,separator,undo,redo,separator,link,unlink,anchor,image,cleanup,help,code",
 582                      theme_advanced_buttons3 : "hr,removeformat,visualaid,separator,sub,sup,separator,charmap"
 583                  };
 584  
 585                  // Add accessibility control
 586                  toolbarHTML += '<a href="#" accesskey="q" title="' + tinyMCE.getLang("lang_toolbar_focus") + '"';
 587  
 588                  if (!tinyMCE.getParam("accessibility_focus"))
 589                      toolbarHTML += ' onfocus="tinyMCE.getInstanceById(\'' + editorId + '\').getWin().focus();"';
 590  
 591                  toolbarHTML += '></a>';
 592  
 593                  // Render rows
 594                  for (var i=1; i<100; i++) {
 595                      var def = defVals["theme_advanced_buttons" + i];
 596  
 597                      var buttons = tinyMCE.getParam("theme_advanced_buttons" + i, def == null ? '' : def, true, ',');
 598                      if (buttons.length == 0)
 599                          break;
 600  
 601                      buttons = removeFromArray(buttons, tinyMCE.getParam("theme_advanced_disable", "", true, ','));
 602                      buttons = addToArray(buttons, tinyMCE.getParam("theme_advanced_buttons" + i + "_add", "", true, ','));
 603                      buttons = addToArray(tinyMCE.getParam("theme_advanced_buttons" + i + "_add_before", "", true, ','), buttons);
 604  
 605                      for (var b=0; b<buttons.length; b++)
 606                          toolbarHTML += tinyMCE.getControlHTML(buttons[b]);
 607  
 608                      if (buttons.length > 0) {
 609                          toolbarHTML += "<br />";
 610                          deltaHeight -= 23;
 611                      }
 612                  }
 613  
 614                  // Add accessibility control
 615                  toolbarHTML += '<a href="#" accesskey="z" onfocus="tinyMCE.getInstanceById(\'' + editorId + '\').getWin().focus();"></a>';
 616  
 617                  // Setup template html
 618                  template['html'] = '<table class="mceEditor" border="0" cellpadding="0" cellspacing="0" width="{$width}" height="{$height}" style="width:{$width_style};height:{$height_style}"><tbody>';
 619  
 620                  if (toolbarLocation == "top")
 621                      template['html'] += '<tr><td dir="ltr" class="mceToolbarTop" align="' + toolbarAlign + '" height="1" nowrap="nowrap"><span id="' + editorId + '_toolbar" class="mceToolbarContainer">' + toolbarHTML + '</span></td></tr>';
 622  
 623                  if (statusbarLocation == "top") {
 624                      template['html'] += '<tr><td class="mceStatusbarTop" height="1">' + statusbarHTML + '</td></tr>';
 625                      deltaHeight -= 23;
 626                  }
 627  
 628                  template['html'] += '<tr><td align="center"><span id="{$editor_id}"></span></td></tr>';
 629  
 630                  if (toolbarLocation == "bottom")
 631                      template['html'] += '<tr><td dir="ltr" class="mceToolbarBottom" align="' + toolbarAlign + '" height="1"><span id="' + editorId + '_toolbar" class="mceToolbarContainer">' + toolbarHTML + '</span></td></tr>';
 632  
 633                  // External toolbar changes
 634                  if (toolbarLocation == "external") {
 635                      var bod = document.body;
 636                      var elm = document.createElement ("div");
 637  
 638                      toolbarHTML = tinyMCE.replaceVar(toolbarHTML, 'style_select_options', styleSelectHTML);
 639                      toolbarHTML = tinyMCE.applyTemplate(toolbarHTML, {editor_id : editorId});
 640  
 641                      elm.className = "mceToolbarExternal";
 642                      elm.id = editorId+"_toolbar";
 643                      elm.innerHTML = '<table width="100%" border="0" align="center"><tr><td align="center">'+toolbarHTML+'</td></tr></table>';
 644                      bod.appendChild (elm);
 645                      // bod.style.marginTop = elm.offsetHeight + "px";
 646  
 647                      deltaHeight = 0;
 648                      tinyMCE.getInstanceById(editorId).toolbarElement = elm;
 649  
 650                      //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"];
 651                  } else {
 652                      tinyMCE.getInstanceById(editorId).toolbarElement = null;
 653                  }
 654  
 655                  if (statusbarLocation == "bottom") {
 656                      template['html'] += '<tr><td class="mceStatusbarBottom" height="1">' + statusbarHTML + '</td></tr>';
 657                      deltaHeight -= 23;
 658                  }
 659  
 660                  template['html'] += '</tbody></table>';
 661                  //"SimpleLayout"
 662              break;
 663  
 664              case "RowLayout" : //Container Layout - containers defined in "theme_advanced_containers" are rendered from top to bottom.
 665                  template['html'] = '<table class="mceEditor" border="0" cellpadding="0" cellspacing="0" width="{$width}" height="{$height}" style="width:{$width}px;height:{$height}px"><tbody>';
 666  
 667                  var containers = tinyMCE.getParam("theme_advanced_containers", "", true, ",");
 668                  var defaultContainerCSS = tinyMCE.getParam("theme_advanced_containers_default_class", "container");
 669                  var defaultContainerAlign = tinyMCE.getParam("theme_advanced_containers_default_align", "center");
 670  
 671                  //Render Containers:
 672                  for (var i = 0; i < containers.length; i++)
 673                  {
 674                      if (containers[i] == "mceEditor") //Exceptions for mceEditor and ...
 675                          template['html'] += '<tr><td align="center" class="mceEditor_border"><span id="{$editor_id}"></span></td></tr>';
 676                      else if (containers[i] == "mceElementpath" || containers[i] == "mceStatusbar") // ... mceElementpath:
 677                      {
 678                          var pathClass = "mceStatusbar";
 679  
 680                          if (i == containers.length-1)
 681                          {
 682                              pathClass = "mceStatusbarBottom";
 683                          }
 684                          else if (i == 0)
 685                          {
 686                              pathClass = "mceStatusbar";
 687                          }
 688                          else
 689                          {
 690                              deltaHeight-=2;
 691                          }
 692  
 693                          template['html'] += '<tr><td class="' + pathClass + '" height="1">' + statusbarHTML + '</td></tr>';
 694                          deltaHeight -= 22;
 695                      } else { // Render normal Container
 696                          var curContainer = tinyMCE.getParam("theme_advanced_container_"+containers[i], "", true, ',');
 697                          var curContainerHTML = "";
 698                          var curAlign = tinyMCE.getParam("theme_advanced_container_"+containers[i]+"_align", defaultContainerAlign);
 699                          var curCSS = tinyMCE.getParam("theme_advanced_container_"+containers[i]+"_class", defaultContainerCSS);
 700  
 701                          curContainer = removeFromArray(curContainer, tinyMCE.getParam("theme_advanced_disable", "", true, ','));
 702  
 703                          for (var j=0; j<curContainer.length; j++)
 704                              curContainerHTML += tinyMCE.getControlHTML(curContainer[j]);
 705  
 706                          if (curContainer.length > 0) {
 707                              curContainerHTML += "<br />";
 708                              deltaHeight -= 23;
 709                          }
 710  
 711                          template['html'] += '<tr><td class="' + curCSS + '" align="' + curAlign + '" height="1">' + curContainerHTML + '</td></tr>';
 712                      }
 713                  }
 714  
 715                  template['html'] += '</tbody></table>';
 716                  //RowLayout
 717              break;
 718  
 719              case "CustomLayout" : //User defined layout callback...
 720                  var customLayout = tinyMCE.getParam("theme_advanced_custom_layout","");
 721  
 722                  if (customLayout != "" && eval("typeof(" + customLayout + ")") != "undefined") {
 723                      template = eval(customLayout + "(template);");
 724                  }
 725              break;
 726          }
 727  
 728          if (resizing)
 729              template['html'] += '<span id="{$editor_id}_resize_box" class="mceResizeBox"></span>';
 730  
 731          template['html'] = tinyMCE.replaceVar(template['html'], 'style_select_options', styleSelectHTML);
 732  
 733          // Set to default values
 734          if (!template['delta_width'])
 735              template['delta_width'] = 0;
 736  
 737          if (!template['delta_height'])
 738              template['delta_height'] = deltaHeight;
 739  
 740          return template;
 741      },
 742  
 743      initInstance : function(inst) {
 744          if (tinyMCE.getParam("theme_advanced_resizing", false)) {
 745              if (tinyMCE.getParam("theme_advanced_resizing_use_cookie", true)) {
 746                  var w = TinyMCE_AdvancedTheme._getCookie("TinyMCE_" + inst.editorId + "_width");
 747                  var h = TinyMCE_AdvancedTheme._getCookie("TinyMCE_" + inst.editorId + "_height");
 748  
 749                  TinyMCE_AdvancedTheme._resizeTo(inst, w, h, tinyMCE.getParam("theme_advanced_resize_horizontal", true));
 750              }
 751          }
 752  
 753          inst.addShortcut('ctrl', 'k', 'lang_link_desc', 'mceLink');
 754      },
 755  
 756      removeInstance : function(inst) {
 757          new TinyMCE_Layer(inst.editorId + '_fcMenu').remove();
 758          new TinyMCE_Layer(inst.editorId + '_bcMenu').remove();
 759      },
 760  
 761      hideInstance : function(inst) {
 762          TinyMCE_AdvancedTheme._hideMenus(inst.editorId);
 763      },
 764  
 765      _handleMenuEvent : function(e) {
 766          var te = tinyMCE.isMSIE ? window.event.srcElement : e.target;
 767          tinyMCE._menuButtonEvent(e.type == "mouseover" ? "over" : "out", document.getElementById(te._switchId));
 768  
 769          if (e.type == "click")
 770              tinyMCE.execInstanceCommand(te._editor_id, te._command);
 771      },
 772  
 773      _hideMenus : function(id) {
 774          var fcml = new TinyMCE_Layer(id + '_fcMenu'), bcml = new TinyMCE_Layer(id + '_bcMenu');
 775  
 776          if (fcml.exists() && fcml.isVisible()) {
 777              tinyMCE.switchClass(id + '_forecolor', 'mceMenuButton');
 778              fcml.hide();
 779          }
 780  
 781          if (bcml.exists() && bcml.isVisible()) {
 782              tinyMCE.switchClass(id + '_backcolor', 'mceMenuButton');
 783              bcml.hide();
 784          }
 785      },
 786  
 787      /**
 788       * Node change handler.
 789       */
 790      handleNodeChange : function(editor_id, node, undo_index, undo_levels, visual_aid, any_selection, setup_content) {
 791          var alignNode, breakOut, classNode;
 792  
 793  		function selectByValue(select_elm, value, first_index) {
 794              first_index = typeof(first_index) == "undefined" ? false : true;
 795  
 796              if (select_elm) {
 797                  for (var i=0; i<select_elm.options.length; i++) {
 798                      var ov = "" + select_elm.options[i].value;
 799  
 800                      if (first_index && ov.toLowerCase().indexOf(value.toLowerCase()) == 0) {
 801                          select_elm.selectedIndex = i;
 802                          return true;
 803                      }
 804  
 805                      if (ov == value) {
 806                          select_elm.selectedIndex = i;
 807                          return true;
 808                      }
 809                  }
 810              }
 811  
 812              return false;
 813          };
 814  
 815          // No node provided
 816          if (node == null)
 817              return;
 818  
 819          // Update path
 820          var pathElm = document.getElementById(editor_id + "_path");
 821          var inst = tinyMCE.getInstanceById(editor_id);
 822          var doc = inst.getDoc();
 823          TinyMCE_AdvancedTheme._hideMenus(editor_id);
 824  
 825          if (pathElm) {
 826              // Get node path
 827              var parentNode = node;
 828              var path = new Array();
 829              
 830              while (parentNode != null) {
 831                  if (parentNode.nodeName.toUpperCase() == "BODY") {
 832                      break;
 833                  }
 834  
 835                  // Only append element nodes to path
 836                  if (parentNode.nodeType == 1 && tinyMCE.getAttrib(parentNode, "class").indexOf('mceItemHidden') == -1) {
 837                      path[path.length] = parentNode;
 838                  }
 839  
 840                  parentNode = parentNode.parentNode;
 841              }
 842  
 843              // Setup HTML
 844              var html = "";
 845              for (var i=path.length-1; i>=0; i--) {
 846                  var nodeName = path[i].nodeName.toLowerCase();
 847                  var nodeData = "";
 848  
 849                  if (nodeName.indexOf("html:") == 0)
 850                      nodeName = nodeName.substring(5);
 851  
 852                  if (nodeName == "b") {
 853                      nodeName = "strong";
 854                  }
 855  
 856                  if (nodeName == "i") {
 857                      nodeName = "em";
 858                  }
 859  
 860                  if (nodeName == "span") {
 861                      var cn = tinyMCE.getAttrib(path[i], "class");
 862                      if (cn != "" && cn.indexOf('mceItem') == -1)
 863                          nodeData += "class: " + cn + " ";
 864  
 865                      var st = tinyMCE.getAttrib(path[i], "style");
 866                      if (st != "") {
 867                          st = tinyMCE.serializeStyle(tinyMCE.parseStyle(st));
 868                          nodeData += "style: " + tinyMCE.xmlEncode(st) + " ";
 869                      }
 870                  }
 871  
 872                  if (nodeName == "font") {
 873                      if (tinyMCE.getParam("convert_fonts_to_spans"))
 874                          nodeName = "span";
 875  
 876                      var face = tinyMCE.getAttrib(path[i], "face");
 877                      if (face != "")
 878                          nodeData += "font: " + tinyMCE.xmlEncode(face) + " ";
 879  
 880                      var size = tinyMCE.getAttrib(path[i], "size");
 881                      if (size != "")
 882                          nodeData += "size: " + tinyMCE.xmlEncode(size) + " ";
 883  
 884                      var color = tinyMCE.getAttrib(path[i], "color");
 885                      if (color != "")
 886                          nodeData += "color: " + tinyMCE.xmlEncode(color) + " ";
 887                  }
 888  
 889                  if (tinyMCE.getAttrib(path[i], 'id') != "") {
 890                      nodeData += "id: " + path[i].getAttribute('id') + " ";
 891                  }
 892  
 893                  var className = tinyMCE.getVisualAidClass(tinyMCE.getAttrib(path[i], "class"), false);
 894                  if (className != "" && className.indexOf('mceItem') == -1)
 895                      nodeData += "class: " + className + " ";
 896  
 897                  if (tinyMCE.getAttrib(path[i], 'src') != "") {
 898                      var src = tinyMCE.getAttrib(path[i], "mce_src");
 899  
 900                      if (src == "")
 901                           src = tinyMCE.getAttrib(path[i], "src");
 902  
 903                      nodeData += "src: " + tinyMCE.xmlEncode(src) + " ";
 904                  }
 905  
 906                  if (path[i].nodeName == 'A' && tinyMCE.getAttrib(path[i], 'href') != "") {
 907                      var href = tinyMCE.getAttrib(path[i], "mce_href");
 908  
 909                      if (href == "")
 910                           href = tinyMCE.getAttrib(path[i], "href");
 911  
 912                      nodeData += "href: " + tinyMCE.xmlEncode(href) + " ";
 913                  }
 914  
 915                  className = tinyMCE.getAttrib(path[i], "class");
 916                  if ((nodeName == "img" || nodeName == "span") && className.indexOf('mceItem') != -1) {
 917                      nodeName = className.replace(/mceItem([a-z]+)/gi, '$1').toLowerCase();
 918                      nodeData = path[i].getAttribute('title');
 919                  }
 920  
 921                  if (nodeName == "a" && (anchor = tinyMCE.getAttrib(path[i], "name")) != "") {
 922                      nodeName = "a";
 923                      nodeName += "#" + tinyMCE.xmlEncode(anchor);
 924                      nodeData = "";
 925                  }
 926  
 927                  if (tinyMCE.getAttrib(path[i], 'name').indexOf("mce_") != 0) {
 928                      var className = tinyMCE.getVisualAidClass(tinyMCE.getAttrib(path[i], "class"), false);
 929                      if (className != "" && className.indexOf('mceItem') == -1) {
 930                          nodeName += "." + className;
 931                      }
 932                  }
 933  
 934