2 Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.
\r
3 For licensing, see LICENSE.html or http://ckeditor.com/license
\r
7 * @fileOverview jQuery adapter provides easy use of basic CKEditor functions
\r
8 * and access to internal API. It also integrates some aspects of CKEditor with
\r
11 * Every TEXTAREA, DIV and P elements can be converted to working editor.
\r
13 * Plugin exposes some of editor's event to jQuery event system. All of those are namespaces inside
\r
14 * ".ckeditor" namespace and can be binded/listened on supported textarea, div and p nodes.
\r
16 * Available jQuery events:
\r
17 * - instanceReady.ckeditor( editor, rootNode )
\r
18 * Triggered when new instance is ready.
\r
19 * - destroy.ckeditor( editor )
\r
20 * Triggered when instance is destroyed.
\r
21 * - getData.ckeditor( editor, eventData )
\r
22 * Triggered when getData event is fired inside editor. It can change returned data using eventData reference.
\r
23 * - setData.ckeditor( editor )
\r
24 * Triggered when getData event is fired inside editor.
\r
27 * <script src="jquery.js"></script>
\r
28 * <script src="ckeditor.js"></script>
\r
29 * <script src="adapters/jquery/adapter.js"></script>
\r
35 * Allow CKEditor to override jQuery.fn.val(). This results in ability to use val()
\r
36 * function on textareas as usual and having those calls synchronized with CKEditor
\r
37 * Rich Text Editor component.
\r
39 * This config option is global and executed during plugin load.
\r
40 * Can't be customized across editor instances.
\r
44 * $( 'textarea' ).ckeditor();
\r
46 * $( 'textarea' ).val( 'New content' );
\r
48 CKEDITOR.config.jqueryOverrideVal = typeof CKEDITOR.config.jqueryOverrideVal == 'undefined'
\r
49 ? true : CKEDITOR.config.jqueryOverrideVal;
\r
51 var jQuery = window.jQuery;
\r
53 if ( typeof jQuery == 'undefined' )
\r
56 // jQuery object methods.
\r
57 jQuery.extend( jQuery.fn,
\r
58 /** @lends jQuery.fn */
\r
61 * Return existing CKEditor instance for first matched element.
\r
62 * Allows to easily use internal API. Doesn't return jQuery object.
\r
64 * Raised exception if editor doesn't exist or isn't ready yet.
\r
66 * @name jQuery.ckeditorGet
\r
67 * @return CKEDITOR.editor
\r
68 * @see CKEDITOR.editor
\r
70 ckeditorGet: function()
\r
72 var instance = this.eq( 0 ).data( 'ckeditorInstance' );
\r
74 throw "CKEditor not yet initialized, use ckeditor() with callback.";
\r
78 * Triggers creation of CKEditor in all matched elements (reduced to DIV, P and TEXTAREAs).
\r
79 * Binds callback to instanceReady event of all instances. If editor is already created, than
\r
80 * callback is fired right away.
\r
82 * Mixed parameter order allowed.
\r
84 * @param callback Function to be run on editor instance. Passed parameters: [ textarea ].
\r
85 * Callback is fiered in "this" scope being ckeditor instance and having source textarea as first param.
\r
87 * @param config Configuration options for new instance(s) if not already created.
\r
91 * $( 'textarea' ).ckeditor( function( textarea ) {
\r
92 * $( textarea ).val( this.getData() )
\r
95 * @name jQuery.fn.ckeditor
\r
98 ckeditor: function( callback, config )
\r
100 if ( !jQuery.isFunction( callback ))
\r
106 config = config || {};
\r
108 this.filter( 'textarea, div, p' ).each( function()
\r
110 var $element = jQuery( this ),
\r
111 editor = $element.data( 'ckeditorInstance' ),
\r
112 instanceLock = $element.data( '_ckeditorInstanceLock' ),
\r
115 if ( editor && !instanceLock )
\r
118 callback.apply( editor, [ this ] );
\r
120 else if ( !instanceLock )
\r
122 // CREATE NEW INSTANCE
\r
124 // Handle config.autoUpdateElement inside this plugin if desired.
\r
125 if ( config.autoUpdateElement
\r
126 || ( typeof config.autoUpdateElement == 'undefined' && CKEDITOR.config.autoUpdateElement ) )
\r
128 config.autoUpdateElementJquery = true;
\r
131 // Always disable config.autoUpdateElement.
\r
132 config.autoUpdateElement = false;
\r
133 $element.data( '_ckeditorInstanceLock', true );
\r
135 // Set instance reference in element's data.
\r
136 editor = CKEDITOR.replace( element, config );
\r
137 $element.data( 'ckeditorInstance', editor );
\r
139 // Register callback.
\r
140 editor.on( 'instanceReady', function( event )
\r
142 var editor = event.editor;
\r
143 setTimeout( function()
\r
145 // Delay bit more if editor is still not ready.
\r
146 if ( !editor.element )
\r
148 setTimeout( arguments.callee, 100 );
\r
152 // Remove this listener.
\r
153 event.removeListener( 'instanceReady', this.callee );
\r
155 // Forward setData on dataReady.
\r
156 editor.on( 'dataReady', function()
\r
158 $element.trigger( 'setData' + '.ckeditor', [ editor ] );
\r
161 // Forward getData.
\r
162 editor.on( 'getData', function( event ) {
\r
163 $element.trigger( 'getData' + '.ckeditor', [ editor, event.data ] );
\r
166 // Forward destroy event.
\r
167 editor.on( 'destroy', function()
\r
169 $element.trigger( 'destroy.ckeditor', [ editor ] );
\r
172 // Integrate with form submit.
\r
173 if ( editor.config.autoUpdateElementJquery && $element.is( 'textarea' ) && $element.parents( 'form' ).length )
\r
175 var onSubmit = function()
\r
177 $element.ckeditor( function()
\r
179 editor.updateElement();
\r
183 // Bind to submit event.
\r
184 $element.parents( 'form' ).submit( onSubmit );
\r
186 // Bind to form-pre-serialize from jQuery Forms plugin.
\r
187 $element.parents( 'form' ).bind( 'form-pre-serialize', onSubmit );
\r
189 // Unbind when editor destroyed.
\r
190 $element.bind( 'destroy.ckeditor', function()
\r
192 $element.parents( 'form' ).unbind( 'submit', onSubmit );
\r
193 $element.parents( 'form' ).unbind( 'form-pre-serialize', onSubmit );
\r
197 // Garbage collect on destroy.
\r
198 editor.on( 'destroy', function()
\r
200 $element.data( 'ckeditorInstance', null );
\r
204 $element.data( '_ckeditorInstanceLock', null );
\r
206 // Fire instanceReady event.
\r
207 $element.trigger( 'instanceReady.ckeditor', [ editor ] );
\r
209 // Run given (first) code.
\r
211 callback.apply( editor, [ element ] );
\r
213 }, null, null, 9999);
\r
217 // Editor is already during creation process, bind our code to the event.
\r
218 CKEDITOR.on( 'instanceReady', function( event )
\r
220 var editor = event.editor;
\r
221 setTimeout( function()
\r
223 // Delay bit more if editor is still not ready.
\r
224 if ( !editor.element )
\r
226 setTimeout( arguments.callee, 100 );
\r
230 if ( editor.element.$ == element )
\r
234 callback.apply( editor, [ element ] );
\r
237 }, null, null, 9999);
\r
244 // New val() method for objects.
\r
245 if ( CKEDITOR.config.jqueryOverrideVal )
\r
247 jQuery.fn.val = CKEDITOR.tools.override( jQuery.fn.val, function( oldValMethod )
\r
250 * CKEditor-aware val() method.
\r
252 * Acts same as original jQuery val(), but for textareas which have CKEditor instances binded to them, method
\r
253 * returns editor's content. It also works for settings values.
\r
255 * @param oldValMethod
\r
256 * @name jQuery.fn.val
\r
258 return function( newValue, forceNative )
\r
260 var isSetter = typeof newValue != 'undefined',
\r
263 this.each( function()
\r
265 var $this = jQuery( this ),
\r
266 editor = $this.data( 'ckeditorInstance' );
\r
268 if ( !forceNative && $this.is( 'textarea' ) && editor )
\r
271 editor.setData( newValue );
\r
274 result = editor.getData();
\r
282 oldValMethod.call( $this, newValue );
\r
285 result = oldValMethod.call( $this );
\r
293 return isSetter ? this : result;
\r