2 Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.
3 For licensing, see LICENSE.html or http://ckeditor.com/license
7 * @fileOverview The "sourcearea" plugin. It registers the "source" editing
8 * mode, which displays the raw data being edited in the editor.
11 CKEDITOR.plugins.add( 'sourcearea',
13 requires : [ 'editingblock' ],
15 init : function( editor )
17 var sourcearea = CKEDITOR.plugins.sourcearea,
18 win = CKEDITOR.document.getWindow();
20 editor.on( 'editingBlockReady', function()
25 editor.addMode( 'source',
27 load : function( holderElement, data )
29 if ( CKEDITOR.env.ie && CKEDITOR.env.version < 8 )
30 holderElement.setStyle( 'position', 'relative' );
32 // Create the source area <textarea>.
33 editor.textarea = textarea = new CKEDITOR.dom.element( 'textarea' );
34 textarea.setAttributes(
37 tabIndex : CKEDITOR.env.webkit ? -1 : editor.tabIndex,
39 'aria-label' : editor.lang.editorTitle.replace( '%1', editor.name )
41 textarea.addClass( 'cke_source' );
42 textarea.addClass( 'cke_enable_context_menu' );
44 editor.readOnly && textarea.setAttribute( 'readOnly', 'readonly' );
48 // IE7 has overflow the <textarea> from wrapping table cell.
49 width : CKEDITOR.env.ie7Compat ? '99%' : '100%',
56 // Having to make <textarea> fixed sized to conque the following bugs:
57 // 1. The textarea height/width='100%' doesn't constraint to the 'td' in IE6/7.
58 // 2. Unexpected vertical-scrolling behavior happens whenever focus is moving out of editor
59 // if text content within it has overflowed. (#4762)
60 if ( CKEDITOR.env.ie )
64 // Holder rectange size is stretched by textarea,
65 // so hide it just for a moment.
67 textarea.setStyle( 'height', holderElement.$.clientHeight + 'px' );
68 textarea.setStyle( 'width', holderElement.$.clientWidth + 'px' );
69 // When we have proper holder size, show textarea again.
73 editor.on( 'resize', onResize );
74 win.on( 'resize', onResize );
75 setTimeout( onResize, 0 );
78 // Reset the holder element and append the
80 holderElement.setHtml( '' );
81 holderElement.append( textarea );
82 textarea.setStyles( styles );
84 editor.fire( 'ariaWidget', textarea );
86 textarea.on( 'blur', function()
88 editor.focusManager.blur();
91 textarea.on( 'focus', function()
93 editor.focusManager.focus();
96 // The editor data "may be dirty" after this point.
97 editor.mayBeDirty = true;
99 // Set the <textarea> value.
100 this.loadData( data );
102 var keystrokeHandler = editor.keystrokeHandler;
103 if ( keystrokeHandler )
104 keystrokeHandler.attach( textarea );
106 setTimeout( function()
108 editor.mode = 'source';
109 editor.fire( 'mode', { previousMode : editor._.previousMode } );
111 ( CKEDITOR.env.gecko || CKEDITOR.env.webkit ) ? 100 : 0 );
114 loadData : function( data )
116 textarea.setValue( data );
117 editor.fire( 'dataReady' );
122 return textarea.getValue();
125 getSnapshotData : function()
127 return textarea.getValue();
130 unload : function( holderElement )
132 textarea.clearCustomData();
133 editor.textarea = textarea = null;
137 editor.removeListener( 'resize', onResize );
138 win.removeListener( 'resize', onResize );
141 if ( CKEDITOR.env.ie && CKEDITOR.env.version < 8 )
142 holderElement.removeStyle( 'position' );
152 editor.on( 'readOnly', function()
154 if ( editor.mode == 'source' )
156 if ( editor.readOnly )
157 editor.textarea.setAttribute( 'readOnly', 'readonly' );
159 editor.textarea.removeAttribute( 'readOnly' );
163 editor.addCommand( 'source', sourcearea.commands.source );
165 if ( editor.ui.addButton )
167 editor.ui.addButton( 'Source',
169 label : editor.lang.source,
174 editor.on( 'mode', function()
176 editor.getCommand( 'source' ).setState(
177 editor.mode == 'source' ?
178 CKEDITOR.TRISTATE_ON :
179 CKEDITOR.TRISTATE_OFF );
185 * Holds the definition of commands an UI elements included with the sourcearea
189 CKEDITOR.plugins.sourcearea =
195 modes : { wysiwyg:1, source:1 },
198 exec : function( editor )
200 if ( editor.mode == 'wysiwyg' )
201 editor.fire( 'saveSnapshot' );
202 editor.getCommand( 'source' ).setState( CKEDITOR.TRISTATE_DISABLED );
203 editor.setMode( editor.mode == 'source' ? 'wysiwyg' : 'source' );