2 Copyright (c) 2003-2011, 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 ( !CKEDITOR.env.isCompatible )
\r
103 if ( !jQuery.isFunction( callback ))
\r
109 config = config || {};
\r
111 this.filter( 'textarea, div, p' ).each( function()
\r
113 var $element = jQuery( this ),
\r
114 editor = $element.data( 'ckeditorInstance' ),
\r
115 instanceLock = $element.data( '_ckeditorInstanceLock' ),
\r
118 if ( editor && !instanceLock )
\r
121 callback.apply( editor, [ this ] );
\r
123 else if ( !instanceLock )
\r
125 // CREATE NEW INSTANCE
\r
127 // Handle config.autoUpdateElement inside this plugin if desired.
\r
128 if ( config.autoUpdateElement
\r
129 || ( typeof config.autoUpdateElement == 'undefined' && CKEDITOR.config.autoUpdateElement ) )
\r
131 config.autoUpdateElementJquery = true;
\r
134 // Always disable config.autoUpdateElement.
\r
135 config.autoUpdateElement = false;
\r
136 $element.data( '_ckeditorInstanceLock', true );
\r
138 // Set instance reference in element's data.
\r
139 editor = CKEDITOR.replace( element, config );
\r
140 $element.data( 'ckeditorInstance', editor );
\r
142 // Register callback.
\r
143 editor.on( 'instanceReady', function( event )
\r
145 var editor = event.editor;
\r
146 setTimeout( function()
\r
148 // Delay bit more if editor is still not ready.
\r
149 if ( !editor.element )
\r
151 setTimeout( arguments.callee, 100 );
\r
155 // Remove this listener.
\r
156 event.removeListener( 'instanceReady', this.callee );
\r
158 // Forward setData on dataReady.
\r
159 editor.on( 'dataReady', function()
\r
161 $element.trigger( 'setData' + '.ckeditor', [ editor ] );
\r
164 // Forward getData.
\r
165 editor.on( 'getData', function( event ) {
\r
166 $element.trigger( 'getData' + '.ckeditor', [ editor, event.data ] );
\r
169 // Forward destroy event.
\r
170 editor.on( 'destroy', function()
\r
172 $element.trigger( 'destroy.ckeditor', [ editor ] );
\r
175 // Integrate with form submit.
\r
176 if ( editor.config.autoUpdateElementJquery && $element.is( 'textarea' ) && $element.parents( 'form' ).length )
\r
178 var onSubmit = function()
\r
180 $element.ckeditor( function()
\r
182 editor.updateElement();
\r
186 // Bind to submit event.
\r
187 $element.parents( 'form' ).submit( onSubmit );
\r
189 // Bind to form-pre-serialize from jQuery Forms plugin.
\r
190 $element.parents( 'form' ).bind( 'form-pre-serialize', onSubmit );
\r
192 // Unbind when editor destroyed.
\r
193 $element.bind( 'destroy.ckeditor', function()
\r
195 $element.parents( 'form' ).unbind( 'submit', onSubmit );
\r
196 $element.parents( 'form' ).unbind( 'form-pre-serialize', onSubmit );
\r
200 // Garbage collect on destroy.
\r
201 editor.on( 'destroy', function()
\r
203 $element.data( 'ckeditorInstance', null );
\r
207 $element.data( '_ckeditorInstanceLock', null );
\r
209 // Fire instanceReady event.
\r
210 $element.trigger( 'instanceReady.ckeditor', [ editor ] );
\r
212 // Run given (first) code.
\r
214 callback.apply( editor, [ element ] );
\r
216 }, null, null, 9999);
\r
220 // Editor is already during creation process, bind our code to the event.
\r
221 CKEDITOR.on( 'instanceReady', function( event )
\r
223 var editor = event.editor;
\r
224 setTimeout( function()
\r
226 // Delay bit more if editor is still not ready.
\r
227 if ( !editor.element )
\r
229 setTimeout( arguments.callee, 100 );
\r
233 if ( editor.element.$ == element )
\r
237 callback.apply( editor, [ element ] );
\r
240 }, null, null, 9999);
\r
247 // New val() method for objects.
\r
248 if ( CKEDITOR.config.jqueryOverrideVal )
\r
250 jQuery.fn.val = CKEDITOR.tools.override( jQuery.fn.val, function( oldValMethod )
\r
253 * CKEditor-aware val() method.
\r
255 * Acts same as original jQuery val(), but for textareas which have CKEditor instances binded to them, method
\r
256 * returns editor's content. It also works for settings values.
\r
258 * @param oldValMethod
\r
259 * @name jQuery.fn.val
\r
261 return function( newValue, forceNative )
\r
263 var isSetter = typeof newValue != 'undefined',
\r
266 this.each( function()
\r
268 var $this = jQuery( this ),
\r
269 editor = $this.data( 'ckeditorInstance' );
\r
271 if ( !forceNative && $this.is( 'textarea' ) && editor )
\r
274 editor.setData( newValue );
\r
277 result = editor.getData();
\r
285 oldValMethod.call( $this, newValue );
\r
288 result = oldValMethod.call( $this );
\r
296 return isSetter ? this : result;
\r