1 /*
  2 Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
  3 For licensing, see LICENSE.html or http://ckeditor.com/license
  4 */
  5
  6 /**
  7  * @fileOverview The "toolbar" plugin. Renders the default toolbar interface in
  8  * the editor.
  9  */
 10
 11 (function()
 12 {
 13 	var toolbox = function()
 14 	{
 15 		this.toolbars = [];
 16 	};
 17
 18 	toolbox.prototype.focus = function()
 19 	{
 20 		for ( var t = 0, toolbar ; toolbar = this.toolbars[ t++ ] ; )
 21 		{
 22 			for ( var i = 0, item ; item = toolbar.items[ i++ ] ; )
 23 			{
 24 				if ( item.focus )
 25 				{
 26 					item.focus();
 27 					return;
 28 				}
 29 			}
 30 		}
 31 	};
 32
 33 	var commands =
 34 	{
 35 		toolbarFocus :
 36 		{
 37 			exec : function( editor )
 38 			{
 39 				if ( editor.toolbox )
 40 					editor.toolbox.focus();
 41 			}
 42 		}
 43 	};
 44
 45 	CKEDITOR.plugins.add( 'toolbar',
 46 	{
 47 		init : function( editor, pluginPath )
 48 		{
 49 			var itemKeystroke = function( item, keystroke )
 50 			{
 51 				switch ( keystroke )
 52 				{
 53 					case 39 :					// RIGHT-ARROW
 54 					case 9 :					// TAB
 55 						// Look for the next item in the toolbar.
 56 						while ( ( item = item.next || ( item.toolbar.next && item.toolbar.next.items[ 0 ] ) ) && !item.focus )
 57 						{ /*jsl:pass*/ }
 58
 59 						// If available, just focus it, otherwise focus the
 60 						// first one.
 61 						if ( item )
 62 							item.focus();
 63 						else
 64 							editor.toolbox.focus();
 65
 66 						return false;
 67
 68 					case 37 :					// LEFT-ARROW
 69 					case CKEDITOR.SHIFT + 9 :	// SHIFT + TAB
 70 						// Look for the previous item in the toolbar.
 71 						while ( ( item = item.previous || ( item.toolbar.previous && item.toolbar.previous.items[ item.toolbar.previous.items.length - 1 ] ) ) && !item.focus )
 72 						{ /*jsl:pass*/ }
 73
 74 						// If available, just focus it, otherwise focus the
 75 						// last one.
 76 						if ( item )
 77 							item.focus();
 78 						else
 79 						{
 80 							var lastToolbarItems = editor.toolbox.toolbars[ editor.toolbox.toolbars.length - 1 ].items;
 81 							lastToolbarItems[ lastToolbarItems.length - 1 ].focus();
 82 						}
 83
 84 						return false;
 85
 86 					case 27 :					// ESC
 87 						editor.focus();
 88 						return false;
 89
 90 					case 13 :					// ENTER
 91 					case 32 :					// SPACE
 92 						item.execute();
 93 						return false;
 94 				}
 95 				return true;
 96 			};
 97
 98 			editor.on( 'themeSpace', function( event )
 99 				{
100 					if ( event.data.space == editor.config.toolbarLocation )
101 					{
102 						editor.toolbox = new toolbox();
103
104 						var output = [ '<div class="cke_toolbox">' ];
105
106 						var toolbars = editor.toolbox.toolbars,
107 							toolbar = editor.config.toolbar;
108
109 						for ( var r = 0 ; r < toolbar.length ; r++ )
110 						{
111 							var row = toolbar[ r ],
112 								toolbarId = 'cke_' + CKEDITOR.tools.getNextNumber(),
113 								toolbarObj = { id : toolbarId, items : [] };
114
115 							output.push( '<div id="', toolbarId, '" class="cke_toolbar">' );
116
117 							// Add the toolbar to the "editor.toolbox.toolbars"
118 							// array.
119 							var index = toolbars.push( toolbarObj ) - 1;
120
121 							// Create the next/previous reference.
122 							if ( index > 0 )
123 							{
124 								toolbarObj.previous = toolbars[ index - 1 ];
125 								toolbarObj.previous.next = toolbarObj;
126 							}
127
128 							// Create all items defined for this toolbar.
129 							for ( var i = 0 ; i < row.length ; i++ )
130 							{
131 								var item,
132 									itemName = row[ i ];
133
134 								if ( itemName == '-' )
135 									item = CKEDITOR.ui.separator;
136 								else
137 									item = editor.ui.get( itemName );
138
139 								if ( item )
140 								{
141 									var itemObj = item.render( editor, output );
142 									index = toolbarObj.items.push( itemObj ) - 1;
143
144 									if ( index > 0 )
145 									{
146 										itemObj.previous = toolbarObj.items[ index - 1 ];
147 										itemObj.previous.next = itemObj;
148 									}
149
150 									itemObj.toolbar = toolbarObj;
151 									itemObj.onkey = itemKeystroke;
152 								}
153 							}
154
155 							output.push( '</div>' );
156 						}
157
158 						output.push( '</div>' );
159
160 						event.data.html += output.join( '' );
161 					}
162 				});
163
164 			editor.addCommand( 'toolbarFocus', commands.toolbarFocus );
165 		}
166 	});
167 })();
168
169 /**
170  * The UI element that renders a toolbar separator.
171  * @type Object
172  * @example
173  */
174 CKEDITOR.ui.separator =
175 {
176 	render : function( editor, output )
177 	{
178 		output.push( '<span class="cke_separator"></span>' );
179 		return {};
180 	}
181 };
182
183 /**
184  * The "theme space" to which rendering the toolbar. For the default theme,
185  * the recommended options are "top" and "bottom".
186  * @type String
187  * @default 'top'
188  * @see CKEDITOR.config.theme
189  * @example
190  * config.toolbarLocation = 'bottom';
191  */
192 CKEDITOR.config.toolbarLocation = 'top';
193
194 /**
195  * The toolbox (alias toolbar) definition. It is an array of toolbars (strips),
196  * each one being also an array, containing a list of UI items.
197  * @type Array
198  * @example
199  * // Defines a toolbar with only one strip containing the "Source" button, a
200  * // separator and the "Bold" and "Italic" buttons.
201  * <b>CKEDITOR.config.toolbar =
202  * [
203  *     [ 'Source', '-', 'Bold', 'Italic' ]
204  * ]</b>;
205  */
206 CKEDITOR.config.toolbar =
207 [
208 	[
209 		'Source', '-',
210 		'NewPage', '-',
211 		'Bold', 'Italic', 'Underline', 'Strike', '-',
212 		'Subscript', 'Superscript', '-',
213 		'SelectAll', 'RemoveFormat', '-',
214 		'Smiley', 'HorizontalRule', 'SpecialChar'
215 	]
216 ];
217