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 default editing block plugin, which holds the editing area 8 * and source view. 9 */ 10 11 (function() 12 { 13 var getMode = function( editor, mode ) 14 { 15 return editor._.modes && editor._.modes[ mode || editor.mode ]; 16 }; 17 18 // This is a semaphore used to avoid recursive calls between 19 // the following data handling functions. 20 var isHandlingData; 21 22 CKEDITOR.plugins.add( 'editingblock', 23 { 24 init : function( editor ) 25 { 26 if ( !editor.config.editingBlock ) 27 return; 28 29 editor.on( 'themeSpace', function( event ) 30 { 31 if ( event.data.space == 'contents' ) 32 event.data.html += '<br>'; 33 }); 34 35 editor.on( 'themeLoaded', function() 36 { 37 editor.fireOnce( 'editingBlockReady' ); 38 }); 39 40 editor.on( 'uiReady', function() 41 { 42 editor.setMode( editor.config.startupMode ); 43 }); 44 45 editor.on( 'afterSetData', function() 46 { 47 if ( !isHandlingData ) 48 { 49 function setData() 50 { 51 isHandlingData = true; 52 getMode( editor ).loadData( editor.getData() ); 53 isHandlingData = false; 54 } 55 56 if ( editor.mode ) 57 setData(); 58 else 59 { 60 editor.on( 'mode', function() 61 { 62 setData(); 63 editor.removeListener( 'mode', arguments.callee ); 64 }); 65 } 66 } 67 }); 68 69 editor.on( 'beforeGetData', function() 70 { 71 if ( !isHandlingData && editor.mode ) 72 { 73 isHandlingData = true; 74 editor.setData( getMode( editor ).getData() ); 75 isHandlingData = false; 76 } 77 }); 78 79 editor.on( 'getSnapshot', function( event ) 80 { 81 if ( editor.mode ) 82 event.data = getMode( editor ).getSnapshotData(); 83 }); 84 85 editor.on( 'loadSnapshot', function( event ) 86 { 87 if ( editor.mode ) 88 getMode( editor ).loadSnapshotData( event.data ); 89 }); 90 91 // For the first "mode" call, we'll also fire the "instanceReady" 92 // event. 93 editor.on( 'mode', function( event ) 94 { 95 // Do that once only. 96 event.removeListener(); 97 98 // Grab editor focus if the editor container is focused. (#3104) 99 var focusGrabber = editor.container; 100 101 // Safari 3 can't handle tabindex in all elements, so we do 102 // a trick to make it move the focus to the editor on TAB. 103 if ( CKEDITOR.env.webkit && CKEDITOR.env.version < 528 ) 104 { 105 var tabIndex = editor.config.tabIndex || editor.element.getAttribute( 'tabindex' ) || 0; 106 focusGrabber = focusGrabber.append( CKEDITOR.dom.element.createFromHtml( 107 '<input' + 108 ' tabindex="' + tabIndex + '"' + 109 ' style="position:absolute; left:-10000">' ) ); 110 } 111 112 focusGrabber.on( 'focus', function() 113 { 114 editor.focus(); 115 }); 116 117 if ( editor.config.startupFocus ) 118 editor.focus(); 119 120 // Fire instanceReady for both the editor and CKEDITOR, but 121 // defer this until the whole execution has completed 122 // to guarantee the editor is fully responsible. 123 setTimeout( function(){ 124 editor.fireOnce( 'instanceReady' ); 125 CKEDITOR.fire( 'instanceReady', null, editor ); 126 } ); 127 }); 128 } 129 }); 130 131 /** 132 * The current editing mode. An editing mode is basically a viewport for 133 * editing or content viewing. By default the possible values for this 134 * property are "wysiwyg" and "source". 135 * @type String 136 * @example 137 * alert( CKEDITOR.instances.editor1.mode ); // "wysiwyg" (e.g.) 138 */ 139 CKEDITOR.editor.prototype.mode = ''; 140 141 /** 142 * Registers an editing mode. This function is to be used mainly by plugins. 143 * @param {String} mode The mode name. 144 * @param {Object} modeEditor The mode editor definition. 145 * @example 146 */ 147 CKEDITOR.editor.prototype.addMode = function( mode, modeEditor ) 148 { 149 modeEditor.name = mode; 150 ( this._.modes || ( this._.modes = {} ) )[ mode ] = modeEditor; 151 }; 152 153 /** 154 * Sets the current editing mode in this editor instance. 155 * @param {String} mode A registered mode name. 156 * @example 157 * // Switch to "source" view. 158 * CKEDITOR.instances.editor1.setMode( 'source' ); 159 */ 160 CKEDITOR.editor.prototype.setMode = function( mode ) 161 { 162 var data, 163 holderElement = this.getThemeSpace( 'contents' ), 164 isDirty = this.checkDirty(); 165 166 // Unload the previous mode. 167 if ( this.mode ) 168 { 169 if ( mode == this.mode ) 170 return; 171 172 var currentMode = getMode( this ); 173 data = currentMode.getData(); 174 currentMode.unload( holderElement ); 175 this.mode = ''; 176 } 177 178 holderElement.setHtml( '' ); 179 180 // Load required mode. 181 var modeEditor = getMode( this, mode ); 182 if ( !modeEditor ) 183 throw '[CKEDITOR.editor.setMode] Unknown mode "' + mode + '".'; 184 185 if ( !isDirty ) 186 { 187 this.on( 'mode', function() 188 { 189 this.resetDirty(); 190 this.removeListener( 'mode', arguments.callee ); 191 }); 192 } 193 194 modeEditor.load( holderElement, ( typeof data ) != 'string' ? this.getData() : data); 195 }; 196 197 /** 198 * Moves the selection focus to the editing are space in the editor. 199 */ 200 CKEDITOR.editor.prototype.focus = function() 201 { 202 var mode = getMode( this ); 203 if ( mode ) 204 mode.focus(); 205 }; 206 })(); 207 208 /** 209 * The mode to load at the editor startup. It depends on the plugins 210 * loaded. By default, the "wysiwyg" and "source" modes are available. 211 * @type String 212 * @default 'wysiwyg' 213 * @example 214 * config.toolbarLocation = 'source'; 215 */ 216 CKEDITOR.config.startupMode = 'wysiwyg'; 217 218 /** 219 * Sets whether the editor should have the focus when the page loads. 220 * @type Boolean 221 * @default false 222 */ 223 CKEDITOR.config.startupFocus = false; 224 225 CKEDITOR.config.editingBlock = true; 226