skins/ckeditor/plugins/plinn_styles/plugin.js

   1 ( function() {
   2
   3 var PlinnStylesCombo = function(editor) {
   4         this.editor = editor;
   5         this.label = 'Styles';
   6         this.title = 'CSS Styles';
   7         this.toolbar = 'styles,10';
   8         this.panel = {
   9                 css : [CKEDITOR.skin.getPath( 'editor' )].concat(editor.config.contentsCss),
  10                 multiSelect : true,
  11                 attributes : {'aria-label': this.title}
  12         };
  13         this.styles = [];
  14 };
  15
  16 PlinnStylesCombo.prototype.loadStyle = function(definition) {
  17         this.styles.push(definition);
  18         this.styles[definition.name] = definition;
  19 };
  20
  21 PlinnStylesCombo.prototype.init = function() {
  22         var i, style;
  23         for (i=0 ; i < this.styles.length ; i++) {
  24                 style = this.styles[i];
  25                 this.add(style.name,
  26                                  '<div class="' + style.className + '">' +
  27                                         style.name +
  28                                  '</div>',
  29                                  style.name
  30                                 );
  31         }
  32 };
  33
  34 PlinnStylesCombo.prototype.onClick = function(value) {
  35         this.editor.focus();
  36         this.editor.fire( 'saveSnapshot' );
  37         var style = this.styles[value]
  38         var className = style.className;
  39         var element = this.editor.elementPath().lastElement;
  40         if (element.hasClass(className)) {
  41                 element.removeClass(className);
  42         }
  43         else {
  44                 element.addClass(className);
  45         }
  46         this.editor.fire( 'saveSnapshot' );
  47 };
  48
  49 var PlinnStylePlugin = function() {
  50         this.requires = 'richcombo';
  51         this.combo = undefined;
  52 };
  53
  54 PlinnStylePlugin.prototype.init = function(editor) {
  55         this.combo = new PlinnStylesCombo(editor);
  56         editor.ui.addRichCombo('PlinnStyles', this.combo);
  57         var self = this;
  58         editor.on('stylesSet', function(evt){self.onStylesSet(evt)});
  59 };
  60
  61 PlinnStylePlugin.prototype.onStylesSet = function(evt) {
  62         var stylesDefinitions = evt.data.styles;
  63         if (!stylesDefinitions) { return; }
  64         var i;
  65         for(i=0 ; i < stylesDefinitions.length ; i++) {
  66                 this.combo.loadStyle(stylesDefinitions[i]);
  67         }
  68
  69 };
  70
  71
  72 // main
  73 CKEDITOR.plugins.add( 'plinn_styles', new PlinnStylePlugin());
  74
  75 } ());