Mambo API

[Summary view] [Print] [Text view]

   1  /**

   2   * $Id: editor_template_src.js 520 2008-01-07 16:30:32Z spocke $

   3   *

   4   * This file is meant to showcase how to create a simple theme. The advanced

   5   * theme is more suitable for production use.

   6   *

   7   * @author Moxiecode

   8   * @copyright Copyright © 2004-2008, Moxiecode Systems AB, All rights reserved.

   9   */
  10  
  11  (function() {
  12      var DOM = tinymce.DOM;
  13  
  14      // Tell it to load theme specific language pack(s)

  15      tinymce.ThemeManager.requireLangPack('simple');
  16  
  17      tinymce.create('tinymce.themes.SimpleTheme', {
  18          init : function(ed, url) {
  19              var t = this, states = ['Bold', 'Italic', 'Underline', 'Strikethrough', 'InsertUnorderedList', 'InsertOrderedList'], s = ed.settings;
  20  
  21              t.editor = ed;
  22  
  23              ed.onInit.add(function() {
  24                  ed.onNodeChange.add(function(ed, cm) {
  25                      tinymce.each(states, function(c) {
  26                          cm.get(c.toLowerCase()).setActive(ed.queryCommandState(c));
  27                      });
  28                  });
  29  
  30                  ed.dom.loadCSS(url + "/skins/" + s.skin + "/content.css");
  31              });
  32  
  33              DOM.loadCSS(url + "/skins/" + s.skin + "/ui.css");
  34          },
  35  
  36          renderUI : function(o) {
  37              var t = this, n = o.targetNode, ic, tb, ed = t.editor, cf = ed.controlManager, sc;
  38  
  39              n = DOM.insertAfter(DOM.create('div', {id : ed.id + '_container', 'class' : 'mceEditor ' + ed.settings.skin + 'SimpleSkin'}), n);
  40              n = sc = DOM.add(n, 'table', {cellPadding : 0, cellSpacing : 0, 'class' : 'mceLayout'});
  41              n = tb = DOM.add(n, 'tbody');
  42  
  43              // Create iframe container

  44              n = DOM.add(tb, 'tr');
  45              n = ic = DOM.add(DOM.add(n, 'td'), 'div', {'class' : 'mceIframeContainer'});
  46  
  47              // Create toolbar container

  48              n = DOM.add(DOM.add(tb, 'tr', {'class' : 'last'}), 'td', {'class' : 'mceToolbar last', align : 'center'});
  49  
  50              // Create toolbar

  51              tb = t.toolbar = cf.createToolbar("tools1");
  52              tb.add(cf.createButton('bold', {title : 'simple.bold_desc', cmd : 'Bold'}));
  53              tb.add(cf.createButton('italic', {title : 'simple.italic_desc', cmd : 'Italic'}));
  54              tb.add(cf.createButton('underline', {title : 'simple.underline_desc', cmd : 'Underline'}));
  55              tb.add(cf.createButton('strikethrough', {title : 'simple.striketrough_desc', cmd : 'Strikethrough'}));
  56              tb.add(cf.createSeparator());
  57              tb.add(cf.createButton('undo', {title : 'simple.undo_desc', cmd : 'Undo'}));
  58              tb.add(cf.createButton('redo', {title : 'simple.redo_desc', cmd : 'Redo'}));
  59              tb.add(cf.createSeparator());
  60              tb.add(cf.createButton('cleanup', {title : 'simple.cleanup_desc', cmd : 'mceCleanup'}));
  61              tb.add(cf.createSeparator());
  62              tb.add(cf.createButton('insertunorderedlist', {title : 'simple.bullist_desc', cmd : 'InsertUnorderedList'}));
  63              tb.add(cf.createButton('insertorderedlist', {title : 'simple.numlist_desc', cmd : 'InsertOrderedList'}));
  64              tb.renderTo(n);
  65  
  66              return {
  67                  iframeContainer : ic,
  68                  editorContainer : ed.id + '_container',
  69                  sizeContainer : sc,
  70                  deltaHeight : -20
  71              };
  72          },
  73  
  74          getInfo : function() {
  75              return {
  76                  longname : 'Simple theme',
  77                  author : 'Moxiecode Systems AB',
  78                  authorurl : 'http://tinymce.moxiecode.com',
  79                  version : tinymce.majorVersion + "." + tinymce.minorVersion
  80              }
  81          }
  82      });
  83  
  84      tinymce.ThemeManager.add('simple', tinymce.themes.SimpleTheme);
  85  })();