JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
74dd0b73094db13cc5468dfbc60b8c1f9d66cd69
[ckeditor.git] / _source / plugins / stylescombo / plugin.js
1 /*\r
2 Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.\r
3 For licensing, see LICENSE.html or http://ckeditor.com/license\r
4 */\r
5 \r
6 (function()\r
7 {\r
8         CKEDITOR.plugins.add( 'stylescombo',\r
9         {\r
10                 requires : [ 'richcombo', 'styles' ],\r
11 \r
12                 init : function( editor )\r
13                 {\r
14                         var config = editor.config,\r
15                                 lang = editor.lang.stylesCombo,\r
16                                 styles = {},\r
17                                 stylesList = [];\r
18 \r
19                         function loadStylesSet( callback )\r
20                         {\r
21                                 editor.getStylesSet( function( stylesDefinitions )\r
22                                 {\r
23                                         if ( !stylesList.length )\r
24                                         {\r
25                                                 var style,\r
26                                                         styleName;\r
27 \r
28                                                 // Put all styles into an Array.\r
29                                                 for ( var i = 0, count = stylesDefinitions.length ; i < count ; i++ )\r
30                                                 {\r
31                                                         var styleDefinition = stylesDefinitions[ i ];\r
32 \r
33                                                         styleName = styleDefinition.name;\r
34 \r
35                                                         style = styles[ styleName ] = new CKEDITOR.style( styleDefinition );\r
36                                                         style._name = styleName;\r
37                                                         style._.enterMode = config.enterMode;\r
38 \r
39                                                         stylesList.push( style );\r
40                                                 }\r
41 \r
42                                                 // Sorts the Array, so the styles get grouped by type.\r
43                                                 stylesList.sort( sortStyles );\r
44                                         }\r
45 \r
46                                         callback && callback();\r
47                                 });\r
48                         }\r
49 \r
50                         editor.ui.addRichCombo( 'Styles',\r
51                                 {\r
52                                         label : lang.label,\r
53                                         title : lang.panelTitle,\r
54                                         className : 'cke_styles',\r
55 \r
56                                         panel :\r
57                                         {\r
58                                                 css : editor.skin.editor.css.concat( config.contentsCss ),\r
59                                                 multiSelect : true,\r
60                                                 attributes : { 'aria-label' : lang.panelTitle }\r
61                                         },\r
62 \r
63                                         init : function()\r
64                                         {\r
65                                                 var combo = this;\r
66 \r
67                                                 loadStylesSet( function()\r
68                                                         {\r
69                                                                 var style,\r
70                                                                         styleName,\r
71                                                                         lastType,\r
72                                                                         type,\r
73                                                                         i,\r
74                                                                         count;\r
75 \r
76                                                                 // Loop over the Array, adding all items to the\r
77                                                                 // combo.\r
78                                                                 for ( i = 0, count = stylesList.length ; i < count ; i++ )\r
79                                                                 {\r
80                                                                         style = stylesList[ i ];\r
81                                                                         styleName = style._name;\r
82                                                                         type = style.type;\r
83 \r
84                                                                         if ( type != lastType )\r
85                                                                         {\r
86                                                                                 combo.startGroup( lang[ 'panelTitle' + String( type ) ] );\r
87                                                                                 lastType = type;\r
88                                                                         }\r
89 \r
90                                                                         combo.add(\r
91                                                                                 styleName,\r
92                                                                                 style.type == CKEDITOR.STYLE_OBJECT ? styleName : style.buildPreview(),\r
93                                                                                 styleName );\r
94                                                                 }\r
95 \r
96                                                                 combo.commit();\r
97 \r
98                                                                 combo.onOpen();\r
99                                                         });\r
100                                         },\r
101 \r
102                                         onClick : function( value )\r
103                                         {\r
104                                                 editor.focus();\r
105                                                 editor.fire( 'saveSnapshot' );\r
106 \r
107                                                 var style = styles[ value ],\r
108                                                         selection = editor.getSelection(),\r
109                                                         elementPath = new CKEDITOR.dom.elementPath( selection.getStartElement() );\r
110 \r
111                                                 style[ style.checkActive( elementPath ) ? 'remove' : 'apply' ]( editor.document );\r
112 \r
113                                                 editor.fire( 'saveSnapshot' );\r
114                                         },\r
115 \r
116                                         onRender : function()\r
117                                         {\r
118                                                 editor.on( 'selectionChange', function( ev )\r
119                                                         {\r
120                                                                 var currentValue = this.getValue(),\r
121                                                                         elementPath = ev.data.path,\r
122                                                                         elements = elementPath.elements;\r
123 \r
124                                                                 // For each element into the elements path.\r
125                                                                 for ( var i = 0, count = elements.length, element ; i < count ; i++ )\r
126                                                                 {\r
127                                                                         element = elements[i];\r
128 \r
129                                                                         // Check if the element is removable by any of\r
130                                                                         // the styles.\r
131                                                                         for ( var value in styles )\r
132                                                                         {\r
133                                                                                 if ( styles[ value ].checkElementRemovable( element, true ) )\r
134                                                                                 {\r
135                                                                                         if ( value != currentValue )\r
136                                                                                                 this.setValue( value );\r
137                                                                                         return;\r
138                                                                                 }\r
139                                                                         }\r
140                                                                 }\r
141 \r
142                                                                 // If no styles match, just empty it.\r
143                                                                 this.setValue( '' );\r
144                                                         },\r
145                                                         this);\r
146                                         },\r
147 \r
148                                         onOpen : function()\r
149                                         {\r
150                                                 if ( CKEDITOR.env.ie || CKEDITOR.env.webkit )\r
151                                                         editor.focus();\r
152 \r
153                                                 var selection = editor.getSelection(),\r
154                                                         element = selection.getSelectedElement(),\r
155                                                         elementPath = new CKEDITOR.dom.elementPath( element || selection.getStartElement() ),\r
156                                                         counter = [ 0, 0, 0, 0 ];\r
157 \r
158                                                 this.showAll();\r
159                                                 this.unmarkAll();\r
160                                                 for ( var name in styles )\r
161                                                 {\r
162                                                         var style = styles[ name ],\r
163                                                                 type = style.type;\r
164 \r
165                                                         if ( style.checkActive( elementPath ) )\r
166                                                                 this.mark( name );\r
167                                                         else if ( type == CKEDITOR.STYLE_OBJECT && !style.checkApplicable( elementPath ) )\r
168                                                         {\r
169                                                                 this.hideItem( name );\r
170                                                                 counter[ type ]--;\r
171                                                         }\r
172 \r
173                                                         counter[ type ]++;\r
174                                                 }\r
175 \r
176                                                 if ( !counter[ CKEDITOR.STYLE_BLOCK ] )\r
177                                                         this.hideGroup( lang[ 'panelTitle' + String( CKEDITOR.STYLE_BLOCK ) ] );\r
178 \r
179                                                 if ( !counter[ CKEDITOR.STYLE_INLINE ] )\r
180                                                         this.hideGroup( lang[ 'panelTitle' + String( CKEDITOR.STYLE_INLINE ) ] );\r
181 \r
182                                                 if ( !counter[ CKEDITOR.STYLE_OBJECT ] )\r
183                                                         this.hideGroup( lang[ 'panelTitle' + String( CKEDITOR.STYLE_OBJECT ) ] );\r
184                                         }\r
185                                 });\r
186 \r
187                         editor.on( 'instanceReady', function() { loadStylesSet(); } );\r
188                 }\r
189         });\r
190 \r
191         function sortStyles( styleA, styleB )\r
192         {\r
193                 var typeA = styleA.type,\r
194                         typeB = styleB.type;\r
195 \r
196                 return typeA == typeB ? 0 :\r
197                         typeA == CKEDITOR.STYLE_OBJECT ? -1 :\r
198                         typeB == CKEDITOR.STYLE_OBJECT ? 1 :\r
199                         typeB == CKEDITOR.STYLE_BLOCK ? 1 :\r
200                         -1;\r
201         }\r
202 })();\r