Application des styles comme il faut.
[ckeditor.git] / 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 } ());