JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
e626aada71776c345d8966eebe1b60ef62a627c9
[ckeditor.git] / _source / plugins / wysiwygarea / plugin.js
1 /*\r
2 Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.\r
3 For licensing, see LICENSE.html or http://ckeditor.com/license\r
4 */\r
5 \r
6 /**\r
7  * @fileOverview The "wysiwygarea" plugin. It registers the "wysiwyg" editing\r
8  *              mode, which handles the main editing area space.\r
9  */\r
10 \r
11 (function()\r
12 {\r
13         // List of elements in which has no way to move editing focus outside.\r
14         var nonExitableElementNames = { table:1,pre:1 };\r
15 \r
16         // Matching an empty paragraph at the end of document.\r
17         var emptyParagraphRegexp = /\s*<(p|div|address|h\d|center)[^>]*>\s*(?:<br[^>]*>|&nbsp;|\u00A0|&#160;)?\s*(:?<\/\1>)?(?=\s*$|<\/body>)/gi;\r
18 \r
19         var notWhitespaceEval = CKEDITOR.dom.walker.whitespaces( true );\r
20 \r
21         function checkReadOnly( selection )\r
22         {\r
23                 if ( selection.getType() == CKEDITOR.SELECTION_ELEMENT )\r
24                         return selection.getSelectedElement().isReadOnly();\r
25                 else\r
26                         return selection.getCommonAncestor().isReadOnly();\r
27         }\r
28 \r
29         function onInsertHtml( evt )\r
30         {\r
31                 if ( this.mode == 'wysiwyg' )\r
32                 {\r
33                         this.focus();\r
34 \r
35                         var selection = this.getSelection();\r
36                         if ( checkReadOnly( selection ) )\r
37                                 return;\r
38 \r
39                         var data = evt.data;\r
40                         this.fire( 'saveSnapshot' );\r
41 \r
42                         if ( this.dataProcessor )\r
43                                 data = this.dataProcessor.toHtml( data );\r
44 \r
45                         if ( CKEDITOR.env.ie )\r
46                         {\r
47                                 var selIsLocked = selection.isLocked;\r
48 \r
49                                 if ( selIsLocked )\r
50                                         selection.unlock();\r
51 \r
52                                 var $sel = selection.getNative();\r
53 \r
54                                 // Delete control selections to avoid IE bugs on pasteHTML.\r
55                                 if ( $sel.type == 'Control' )\r
56                                         $sel.clear();\r
57                                 else if  ( selection.getType() == CKEDITOR.SELECTION_TEXT )\r
58                                 {\r
59                                         // Due to IE bugs on handling contenteditable=false blocks\r
60                                         // (#6005), we need to make some checks and eventually\r
61                                         // delete the selection first.\r
62 \r
63                                         var range = selection.getRanges()[0],\r
64                                                 endContainer = range && range.endContainer;\r
65 \r
66                                         if ( endContainer &&\r
67                                                  endContainer.type == CKEDITOR.NODE_ELEMENT &&\r
68                                                  endContainer.getAttribute( 'contenteditable' ) == 'false' &&\r
69                                                  range.checkBoundaryOfElement( endContainer, CKEDITOR.END ) )\r
70                                         {\r
71                                                 range.setEndAfter( range.endContainer );\r
72                                                 range.deleteContents();\r
73                                         }\r
74                                 }\r
75 \r
76                                 try\r
77                                 {\r
78                                         $sel.createRange().pasteHTML( data );\r
79                                 }\r
80                                 catch (e) {}\r
81 \r
82                                 if ( selIsLocked )\r
83                                         this.getSelection().lock();\r
84                         }\r
85                         else\r
86                                 this.document.$.execCommand( 'inserthtml', false, data );\r
87 \r
88                         // Webkit does not scroll to the cursor position after pasting (#5558)\r
89                         if ( CKEDITOR.env.webkit )\r
90                         {\r
91                                 this.document.$.execCommand( 'inserthtml', false, '<span id="cke_paste_marker" cke_temp="1"></span>' );\r
92                                 var marker = this.document.getById( 'cke_paste_marker' );\r
93                                 marker.scrollIntoView();\r
94                                 marker.remove();\r
95                         }\r
96 \r
97                         CKEDITOR.tools.setTimeout( function()\r
98                                 {\r
99                                         this.fire( 'saveSnapshot' );\r
100                                 }, 0, this );\r
101                 }\r
102         }\r
103 \r
104         function onInsertElement( evt )\r
105         {\r
106                 if ( this.mode == 'wysiwyg' )\r
107                 {\r
108                         this.focus();\r
109 \r
110                         var selection = this.getSelection();\r
111                         if ( checkReadOnly( selection ) )\r
112                                 return;\r
113 \r
114                         this.fire( 'saveSnapshot' );\r
115 \r
116                         var ranges = selection.getRanges(),\r
117                                 element = evt.data,\r
118                                 elementName = element.getName(),\r
119                                 isBlock = CKEDITOR.dtd.$block[ elementName ];\r
120 \r
121                         var selIsLocked = selection.isLocked;\r
122 \r
123                         if ( selIsLocked )\r
124                                 selection.unlock();\r
125 \r
126                         var range, clone, lastElement, bookmark;\r
127 \r
128                         for ( var i = ranges.length - 1 ; i >= 0 ; i-- )\r
129                         {\r
130                                 range = ranges[ i ];\r
131 \r
132                                 // Remove the original contents.\r
133                                 range.deleteContents();\r
134 \r
135                                 clone = !i && element || element.clone( true );\r
136 \r
137                                 // If we're inserting a block at dtd-violated position, split\r
138                                 // the parent blocks until we reach blockLimit.\r
139                                 var current, dtd;\r
140                                 if ( isBlock )\r
141                                 {\r
142                                         while ( ( current = range.getCommonAncestor( false, true ) )\r
143                                                         && ( dtd = CKEDITOR.dtd[ current.getName() ] )\r
144                                                         && !( dtd && dtd [ elementName ] ) )\r
145                                         {\r
146                                                 // Split up inline elements.\r
147                                                 if ( current.getName() in CKEDITOR.dtd.span )\r
148                                                         range.splitElement( current );\r
149                                                 // If we're in an empty block which indicate a new paragraph,\r
150                                                 // simply replace it with the inserting block.(#3664)\r
151                                                 else if ( range.checkStartOfBlock()\r
152                                                          && range.checkEndOfBlock() )\r
153                                                 {\r
154                                                         range.setStartBefore( current );\r
155                                                         range.collapse( true );\r
156                                                         current.remove();\r
157                                                 }\r
158                                                 else\r
159                                                         range.splitBlock();\r
160                                         }\r
161                                 }\r
162 \r
163                                 // Insert the new node.\r
164                                 range.insertNode( clone );\r
165 \r
166                                 // Save the last element reference so we can make the\r
167                                 // selection later.\r
168                                 if ( !lastElement )\r
169                                         lastElement = clone;\r
170                         }\r
171 \r
172                         range.moveToPosition( lastElement, CKEDITOR.POSITION_AFTER_END );\r
173 \r
174                         // If we're inserting a block element immediatelly followed by\r
175                         // another block element, the selection must move there. (#3100,#5436)\r
176                         if ( isBlock )\r
177                         {\r
178                                 var next = lastElement.getNext( notWhitespaceEval ),\r
179                                         nextName = next && next.type == CKEDITOR.NODE_ELEMENT && next.getName();\r
180 \r
181                                 // Check if it's a block element that accepts text.\r
182                                 if ( nextName && CKEDITOR.dtd.$block[ nextName ] && CKEDITOR.dtd[ nextName ]['#'] )\r
183                                         range.moveToElementEditStart( next );\r
184                         }\r
185 \r
186                         selection.selectRanges( [ range ] );\r
187 \r
188                         if ( selIsLocked )\r
189                                 this.getSelection().lock();\r
190 \r
191                         // Save snaps after the whole execution completed.\r
192                         // This's a workaround for make DOM modification's happened after\r
193                         // 'insertElement' to be included either, e.g. Form-based dialogs' 'commitContents'\r
194                         // call.\r
195                         CKEDITOR.tools.setTimeout( function(){\r
196                                 this.fire( 'saveSnapshot' );\r
197                         }, 0, this );\r
198                 }\r
199         }\r
200 \r
201         // DOM modification here should not bother dirty flag.(#4385)\r
202         function restoreDirty( editor )\r
203         {\r
204                 if ( !editor.checkDirty() )\r
205                         setTimeout( function(){ editor.resetDirty(); }, 0 );\r
206         }\r
207 \r
208         var isNotWhitespace = CKEDITOR.dom.walker.whitespaces( true ),\r
209                 isNotBookmark = CKEDITOR.dom.walker.bookmark( false, true );\r
210 \r
211         function isNotEmpty( node )\r
212         {\r
213                 return isNotWhitespace( node ) && isNotBookmark( node );\r
214         }\r
215 \r
216         function isNbsp( node )\r
217         {\r
218                 return node.type == CKEDITOR.NODE_TEXT\r
219                            && CKEDITOR.tools.trim( node.getText() ).match( /^(?:&nbsp;|\xa0)$/ );\r
220         }\r
221 \r
222         function restoreSelection( selection )\r
223         {\r
224                 if ( selection.isLocked )\r
225                 {\r
226                         selection.unlock();\r
227                         setTimeout( function() { selection.lock(); }, 0 );\r
228                 }\r
229         }\r
230 \r
231         function isBlankParagraph( block )\r
232         {\r
233                 return block.getOuterHtml().match( emptyParagraphRegexp );\r
234         }\r
235 \r
236         isNotWhitespace = CKEDITOR.dom.walker.whitespaces( true );\r
237 \r
238         // Gecko need a key event to 'wake up' the editing\r
239         // ability when document is empty.(#3864, #5781)\r
240         function activateEditing( editor )\r
241         {\r
242                 var win = editor.window,\r
243                         doc = editor.document,\r
244                         body = editor.document.getBody(),\r
245                         bodyChildsNum = body.getChildren().count();\r
246 \r
247                 if ( !bodyChildsNum || ( bodyChildsNum == 1&& body.getFirst().hasAttribute( '_moz_editor_bogus_node' ) ) )\r
248                 {\r
249                         restoreDirty( editor );\r
250 \r
251                         // Memorize scroll position to restore it later (#4472).\r
252                         var hostDocument = editor.element.getDocument();\r
253                         var hostDocumentElement = hostDocument.getDocumentElement();\r
254                         var scrollTop = hostDocumentElement.$.scrollTop;\r
255                         var scrollLeft = hostDocumentElement.$.scrollLeft;\r
256 \r
257                         // Simulating keyboard character input by dispatching a keydown of white-space text.\r
258                         var keyEventSimulate = doc.$.createEvent( "KeyEvents" );\r
259                         keyEventSimulate.initKeyEvent( 'keypress', true, true, win.$, false,\r
260                                 false, false, false, 0, 32 );\r
261                         doc.$.dispatchEvent( keyEventSimulate );\r
262 \r
263                         if ( scrollTop != hostDocumentElement.$.scrollTop || scrollLeft != hostDocumentElement.$.scrollLeft )\r
264                                 hostDocument.getWindow().$.scrollTo( scrollLeft, scrollTop );\r
265 \r
266                         // Restore the original document status by placing the cursor before a bogus br created (#5021).\r
267                         bodyChildsNum && body.getFirst().remove();\r
268                         doc.getBody().appendBogus();\r
269                         var nativeRange = new CKEDITOR.dom.range( doc );\r
270                         nativeRange.setStartAt( body , CKEDITOR.POSITION_AFTER_START );\r
271                         nativeRange.select();\r
272                 }\r
273         }\r
274 \r
275         /**\r
276          *  Auto-fixing block-less content by wrapping paragraph (#3190), prevent\r
277          *  non-exitable-block by padding extra br.(#3189)\r
278          */\r
279         function onSelectionChangeFixBody( evt )\r
280         {\r
281                 var editor = evt.editor,\r
282                         path = evt.data.path,\r
283                         blockLimit = path.blockLimit,\r
284                         selection = evt.data.selection,\r
285                         range = selection.getRanges()[0],\r
286                         body = editor.document.getBody(),\r
287                         enterMode = editor.config.enterMode;\r
288 \r
289                 CKEDITOR.env.gecko && activateEditing( editor );\r
290 \r
291                 // When enterMode set to block, we'll establing new paragraph only if we're\r
292                 // selecting inline contents right under body. (#3657)\r
293                 if ( enterMode != CKEDITOR.ENTER_BR\r
294                      && range.collapsed\r
295                          && blockLimit.getName() == 'body'\r
296                          && !path.block )\r
297                 {\r
298                         editor.fire( 'updateSnapshot' );\r
299                         restoreDirty( editor );\r
300                         CKEDITOR.env.ie && restoreSelection( selection );\r
301 \r
302                         var fixedBlock = range.fixBlock( true,\r
303                                         editor.config.enterMode == CKEDITOR.ENTER_DIV ? 'div' : 'p'  );\r
304 \r
305                         // For IE, we should remove any filler node which was introduced before.\r
306                         if ( CKEDITOR.env.ie )\r
307                         {\r
308                                 var first = fixedBlock.getFirst( isNotEmpty );\r
309                                 first && isNbsp( first ) && first.remove();\r
310                         }\r
311 \r
312                         // If the fixed block is actually blank and is already followed by an exitable blank\r
313                         // block, we should revert the fix and move into the existed one. (#3684)\r
314                         if ( isBlankParagraph( fixedBlock ) )\r
315                         {\r
316                                 var element = fixedBlock.getNext( isNotWhitespace );\r
317                                 if ( element &&\r
318                                          element.type == CKEDITOR.NODE_ELEMENT &&\r
319                                          !nonExitableElementNames[ element.getName() ] )\r
320                                 {\r
321                                         range.moveToElementEditStart( element );\r
322                                         fixedBlock.remove();\r
323                                 }\r
324                                 else\r
325                                 {\r
326                                         element = fixedBlock.getPrevious( isNotWhitespace );\r
327                                         if ( element &&\r
328                                                  element.type == CKEDITOR.NODE_ELEMENT &&\r
329                                                  !nonExitableElementNames[ element.getName() ] )\r
330                                         {\r
331                                                 range.moveToElementEditEnd( element );\r
332                                                 fixedBlock.remove();\r
333                                         }\r
334                                 }\r
335                         }\r
336 \r
337                         range.select();\r
338                         // Notify non-IE that selection has changed.\r
339                         if ( !CKEDITOR.env.ie )\r
340                                 editor.selectionChange();\r
341                 }\r
342 \r
343                 // All browsers are incapable to moving cursor out of certain non-exitable\r
344                 // blocks (e.g. table, list, pre) at the end of document, make this happen by\r
345                 // place a bogus node there, which would be later removed by dataprocessor.\r
346                 var walkerRange = new CKEDITOR.dom.range( editor.document ),\r
347                         walker = new CKEDITOR.dom.walker( walkerRange );\r
348                 walkerRange.selectNodeContents( body );\r
349                 walker.evaluator = function( node )\r
350                 {\r
351                         return node.type == CKEDITOR.NODE_ELEMENT && ( node.getName() in nonExitableElementNames );\r
352                 };\r
353                 walker.guard = function( node, isMoveout )\r
354                 {\r
355                         return !( ( node.type == CKEDITOR.NODE_TEXT && isNotWhitespace( node ) ) || isMoveout );\r
356                 };\r
357 \r
358                 if ( walker.previous() )\r
359                 {\r
360                         editor.fire( 'updateSnapshot' );\r
361                         restoreDirty( editor );\r
362                         CKEDITOR.env.ie && restoreSelection( selection );\r
363 \r
364                         var paddingBlock;\r
365                         if ( enterMode != CKEDITOR.ENTER_BR )\r
366                                 paddingBlock = body.append( new CKEDITOR.dom.element( enterMode == CKEDITOR.ENTER_P ? 'p' : 'div' ) );\r
367                         else\r
368                                 paddingBlock = body;\r
369 \r
370                         if ( !CKEDITOR.env.ie )\r
371                                 paddingBlock.appendBogus();\r
372                 }\r
373         }\r
374 \r
375         CKEDITOR.plugins.add( 'wysiwygarea',\r
376         {\r
377                 requires : [ 'editingblock' ],\r
378 \r
379                 init : function( editor )\r
380                 {\r
381                         var fixForBody = ( editor.config.enterMode != CKEDITOR.ENTER_BR )\r
382                                 ? editor.config.enterMode == CKEDITOR.ENTER_DIV ? 'div' : 'p' : false;\r
383 \r
384                         var frameLabel = editor.lang.editorTitle.replace( '%1', editor.name );\r
385 \r
386                         var contentDomReadyHandler;\r
387                         editor.on( 'editingBlockReady', function()\r
388                                 {\r
389                                         var mainElement,\r
390                                                 iframe,\r
391                                                 isLoadingData,\r
392                                                 isPendingFocus,\r
393                                                 frameLoaded,\r
394                                                 fireMode;\r
395 \r
396 \r
397                                         // Support for custom document.domain in IE.\r
398                                         var isCustomDomain = CKEDITOR.env.isCustomDomain();\r
399 \r
400                                         // Creates the iframe that holds the editable document.\r
401                                         var createIFrame = function( data )\r
402                                         {\r
403                                                 if ( iframe )\r
404                                                         iframe.remove();\r
405 \r
406 \r
407                                                 var srcScript =\r
408                                                         'document.open();' +\r
409 \r
410                                                         // The document domain must be set any time we\r
411                                                         // call document.open().\r
412                                                         ( isCustomDomain ? ( 'document.domain="' + document.domain + '";' ) : '' ) +\r
413 \r
414                                                         'document.close();';\r
415 \r
416                                                 iframe = CKEDITOR.dom.element.createFromHtml( '<iframe' +\r
417                                                         ' style="width:100%;height:100%"' +\r
418                                                         ' frameBorder="0"' +\r
419                                                         ' title="' + frameLabel + '"' +\r
420                                                         // With IE, the custom domain has to be taken care at first,\r
421                                                         // for other browers, the 'src' attribute should be left empty to\r
422                                                         // trigger iframe's 'load' event.\r
423                                                         ' src="' + ( CKEDITOR.env.ie ? 'javascript:void(function(){' + encodeURIComponent( srcScript ) + '}())' : '' ) + '"' +\r
424                                                         ' tabIndex="' + ( CKEDITOR.env.webkit? -1 : editor.tabIndex ) + '"' +\r
425                                                         ' allowTransparency="true"' +\r
426                                                         '></iframe>' );\r
427 \r
428                                                 // Running inside of Firefox chrome the load event doesn't bubble like in a normal page (#5689)\r
429                                                 if ( document.location.protocol == 'chrome:' )\r
430                                                         CKEDITOR.event.useCapture = true;\r
431 \r
432                                                 // With FF, it's better to load the data on iframe.load. (#3894,#4058)\r
433                                                 iframe.on( 'load', function( ev )\r
434                                                         {\r
435                                                                 frameLoaded = 1;\r
436                                                                 ev.removeListener();\r
437 \r
438                                                                 var doc = iframe.getFrameDocument().$;\r
439 \r
440                                                                 // Don't leave any history log in IE. (#5657)\r
441                                                                 doc.open( "text/html","replace" );\r
442                                                                 doc.write( data );\r
443                                                                 doc.close();\r
444                                                         });\r
445 \r
446                                                 // Reset adjustment back to default (#5689)\r
447                                                 if ( document.location.protocol == 'chrome:' )\r
448                                                         CKEDITOR.event.useCapture = false;\r
449 \r
450                                                 // The container must be visible when creating the iframe in FF (#5956)\r
451                                                 var element = editor.element,\r
452                                                         isHidden = CKEDITOR.env.gecko && !element.isVisible(),\r
453                                                         previousStyles = {};\r
454                                                 if ( isHidden )\r
455                                                 {\r
456                                                         element.show();\r
457                                                         previousStyles = {\r
458                                                                 position : element.getStyle( 'position' ),\r
459                                                                 top : element.getStyle( 'top' )\r
460                                                         };\r
461                                                         element.setStyles( { position : 'absolute', top : '-3000px' } );\r
462                                                 }\r
463 \r
464                                                 mainElement.append( iframe );\r
465 \r
466                                                 if ( isHidden )\r
467                                                 {\r
468                                                         setTimeout( function()\r
469                                                         {\r
470                                                                 element.hide();\r
471                                                                 element.setStyles( previousStyles );\r
472                                                         }, 1000 );\r
473                                                 }\r
474                                         };\r
475 \r
476                                         // The script that launches the bootstrap logic on 'domReady', so the document\r
477                                         // is fully editable even before the editing iframe is fully loaded (#4455).\r
478                                         contentDomReadyHandler = CKEDITOR.tools.addFunction( contentDomReady );\r
479                                         var activationScript =\r
480                                                 '<script id="cke_actscrpt" type="text/javascript" cke_temp="1">' +\r
481                                                         ( isCustomDomain ? ( 'document.domain="' + document.domain + '";' ) : '' ) +\r
482                                                         'window.parent.CKEDITOR.tools.callFunction( ' + contentDomReadyHandler + ', window );' +\r
483                                                 '</script>';\r
484 \r
485                                         // Editing area bootstrap code.\r
486                                         function contentDomReady( domWindow )\r
487                                         {\r
488                                                 if ( !frameLoaded )\r
489                                                         return;\r
490                                                 frameLoaded = 0;\r
491 \r
492                                                 editor.fire( 'ariaWidget', iframe );\r
493 \r
494                                                 var domDocument = domWindow.document,\r
495                                                         body = domDocument.body;\r
496 \r
497                                                 // Remove this script from the DOM.\r
498                                                 var script = domDocument.getElementById( "cke_actscrpt" );\r
499                                                 script.parentNode.removeChild( script );\r
500 \r
501                                                 body.spellcheck = !editor.config.disableNativeSpellChecker;\r
502 \r
503                                                 if ( CKEDITOR.env.ie )\r
504                                                 {\r
505                                                         // Don't display the focus border.\r
506                                                         body.hideFocus = true;\r
507 \r
508                                                         // Disable and re-enable the body to avoid IE from\r
509                                                         // taking the editing focus at startup. (#141 / #523)\r
510                                                         body.disabled = true;\r
511                                                         body.contentEditable = true;\r
512                                                         body.removeAttribute( 'disabled' );\r
513                                                 }\r
514                                                 else\r
515                                                 {\r
516                                                         // Avoid opening design mode in a frame window thread,\r
517                                                         // which will cause host page scrolling.(#4397)\r
518                                                         setTimeout( function()\r
519                                                         {\r
520                                                                 // Prefer 'contentEditable' instead of 'designMode'. (#3593)\r
521                                                                 if ( CKEDITOR.env.gecko && CKEDITOR.env.version >= 10900\r
522                                                                                 || CKEDITOR.env.opera )\r
523                                                                         domDocument.$.body.contentEditable = true;\r
524                                                                 else if ( CKEDITOR.env.webkit )\r
525                                                                         domDocument.$.body.parentNode.contentEditable = true;\r
526                                                                 else\r
527                                                                         domDocument.$.designMode = 'on';\r
528                                                         }, 0 );\r
529                                                 }\r
530 \r
531                                                 CKEDITOR.env.gecko && CKEDITOR.tools.setTimeout( activateEditing, 0, null, editor );\r
532 \r
533                                                 domWindow       = editor.window         = new CKEDITOR.dom.window( domWindow );\r
534                                                 domDocument     = editor.document       = new CKEDITOR.dom.document( domDocument );\r
535 \r
536                                                 domDocument.on( 'dblclick', function( evt )\r
537                                                 {\r
538                                                         var element = evt.data.getTarget(),\r
539                                                                 data = { element : element, dialog : '' };\r
540                                                         editor.fire( 'doubleclick', data );\r
541                                                         data.dialog && editor.openDialog( data.dialog );\r
542                                                 });\r
543 \r
544                                                 // Gecko/Webkit need some help when selecting control type elements. (#3448)\r
545                                                 if ( !( CKEDITOR.env.ie || CKEDITOR.env.opera) )\r
546                                                 {\r
547                                                         domDocument.on( 'mousedown', function( ev )\r
548                                                         {\r
549                                                                 var control = ev.data.getTarget();\r
550                                                                 if ( control.is( 'img', 'hr', 'input', 'textarea', 'select' ) )\r
551                                                                         editor.getSelection().selectElement( control );\r
552                                                         } );\r
553                                                 }\r
554 \r
555                                                 if ( CKEDITOR.env.gecko )\r
556                                                 {\r
557                                                         domDocument.on( 'mouseup', function( ev )\r
558                                                         {\r
559                                                                 if ( ev.data.$.button == 2 )\r
560                                                                 {\r
561                                                                         var target = ev.data.getTarget();\r
562 \r
563                                                                         // Prevent right click from selecting an empty block even\r
564                                                                         // when selection is anchored inside it. (#5845)\r
565                                                                         if ( !target.getOuterHtml().replace( emptyParagraphRegexp, '' ) )\r
566                                                                         {\r
567                                                                                 var range = new CKEDITOR.dom.range( domDocument );\r
568                                                                                 range.moveToElementEditStart( target );\r
569                                                                                 range.select( true );\r
570                                                                         }\r
571                                                                 }\r
572                                                         } );\r
573                                                 }\r
574 \r
575                                                 // Prevent the browser opening links in read-only blocks. (#6032)\r
576                                                 domDocument.on( 'click', function( ev )\r
577                                                         {\r
578                                                                 ev = ev.data;\r
579                                                                 if ( ev.getTarget().is( 'a' ) && ev.$.button != 2 )\r
580                                                                         ev.preventDefault();\r
581                                                         });\r
582 \r
583                                                 // Webkit: avoid from editing form control elements content.\r
584                                                 if ( CKEDITOR.env.webkit )\r
585                                                 {\r
586                                                         // Prevent from tick checkbox/radiobox/select\r
587                                                         domDocument.on( 'click', function( ev )\r
588                                                         {\r
589                                                                 if ( ev.data.getTarget().is( 'input', 'select' ) )\r
590                                                                         ev.data.preventDefault();\r
591                                                         } );\r
592 \r
593                                                         // Prevent from editig textfield/textarea value.\r
594                                                         domDocument.on( 'mouseup', function( ev )\r
595                                                         {\r
596                                                                 if ( ev.data.getTarget().is( 'input', 'textarea' ) )\r
597                                                                         ev.data.preventDefault();\r
598                                                         } );\r
599                                                 }\r
600 \r
601                                                 // IE standard compliant in editing frame doesn't focus the editor when\r
602                                                 // clicking outside actual content, manually apply the focus. (#1659)\r
603                                                 if ( CKEDITOR.env.ie\r
604                                                         && domDocument.$.compatMode == 'CSS1Compat'\r
605                                                                 || CKEDITOR.env.gecko\r
606                                                                 || CKEDITOR.env.opera )\r
607                                                 {\r
608                                                         var htmlElement = domDocument.getDocumentElement();\r
609                                                         htmlElement.on( 'mousedown', function( evt )\r
610                                                         {\r
611                                                                 // Setting focus directly on editor doesn't work, we\r
612                                                                 // have to use here a temporary element to 'redirect'\r
613                                                                 // the focus.\r
614                                                                 if ( evt.data.getTarget().equals( htmlElement ) )\r
615                                                                 {\r
616                                                                         if ( CKEDITOR.env.gecko && CKEDITOR.env.version >= 10900 )\r
617                                                                                 blinkCursor();\r
618                                                                         focusGrabber.focus();\r
619                                                                 }\r
620                                                         } );\r
621                                                 }\r
622 \r
623                                                 domWindow.on( 'blur', function()\r
624                                                         {\r
625                                                                 editor.focusManager.blur();\r
626                                                         });\r
627 \r
628                                                 domWindow.on( 'focus', function()\r
629                                                         {\r
630                                                                 var doc = editor.document;\r
631 \r
632                                                                 if ( CKEDITOR.env.gecko && CKEDITOR.env.version >= 10900 )\r
633                                                                         blinkCursor();\r
634                                                                 else if ( CKEDITOR.env.opera )\r
635                                                                         doc.getBody().focus();\r
636 \r
637                                                                 editor.focusManager.focus();\r
638                                                         });\r
639 \r
640                                                 var keystrokeHandler = editor.keystrokeHandler;\r
641                                                 if ( keystrokeHandler )\r
642                                                         keystrokeHandler.attach( domDocument );\r
643 \r
644                                                 if ( CKEDITOR.env.ie )\r
645                                                 {\r
646                                                         domDocument.getDocumentElement().addClass( domDocument.$.compatMode );\r
647                                                         // Override keystrokes which should have deletion behavior\r
648                                                         //  on control types in IE . (#4047)\r
649                                                         domDocument.on( 'keydown', function( evt )\r
650                                                         {\r
651                                                                 var keyCode = evt.data.getKeystroke();\r
652 \r
653                                                                 // Backspace OR Delete.\r
654                                                                 if ( keyCode in { 8 : 1, 46 : 1 } )\r
655                                                                 {\r
656                                                                         var sel = editor.getSelection(),\r
657                                                                                 control = sel.getSelectedElement();\r
658 \r
659                                                                         if ( control )\r
660                                                                         {\r
661                                                                                 // Make undo snapshot.\r
662                                                                                 editor.fire( 'saveSnapshot' );\r
663 \r
664                                                                                 // Delete any element that 'hasLayout' (e.g. hr,table) in IE8 will\r
665                                                                                 // break up the selection, safely manage it here. (#4795)\r
666                                                                                 var bookmark = sel.getRanges()[ 0 ].createBookmark();\r
667                                                                                 // Remove the control manually.\r
668                                                                                 control.remove();\r
669                                                                                 sel.selectBookmarks( [ bookmark ] );\r
670 \r
671                                                                                 editor.fire( 'saveSnapshot' );\r
672 \r
673                                                                                 evt.data.preventDefault();\r
674                                                                         }\r
675                                                                 }\r
676                                                         } );\r
677 \r
678                                                         // PageUp/PageDown scrolling is broken in document\r
679                                                         // with standard doctype, manually fix it. (#4736)\r
680                                                         if ( domDocument.$.compatMode == 'CSS1Compat' )\r
681                                                         {\r
682                                                                 var pageUpDownKeys = { 33 : 1, 34 : 1 };\r
683                                                                 domDocument.on( 'keydown', function( evt )\r
684                                                                 {\r
685                                                                         if ( evt.data.getKeystroke() in pageUpDownKeys )\r
686                                                                         {\r
687                                                                                 setTimeout( function ()\r
688                                                                                 {\r
689                                                                                         editor.getSelection().scrollIntoView();\r
690                                                                                 }, 0 );\r
691                                                                         }\r
692                                                                 } );\r
693                                                         }\r
694                                                 }\r
695 \r
696                                                 // Adds the document body as a context menu target.\r
697                                                 if ( editor.contextMenu )\r
698                                                         editor.contextMenu.addTarget( domDocument, editor.config.browserContextMenuOnCtrl !== false );\r
699 \r
700                                                 setTimeout( function()\r
701                                                         {\r
702                                                                 editor.fire( 'contentDom' );\r
703 \r
704                                                                 if ( fireMode )\r
705                                                                 {\r
706                                                                         editor.mode = 'wysiwyg';\r
707                                                                         editor.fire( 'mode' );\r
708                                                                         fireMode = false;\r
709                                                                 }\r
710 \r
711                                                                 isLoadingData = false;\r
712 \r
713                                                                 if ( isPendingFocus )\r
714                                                                 {\r
715                                                                         editor.focus();\r
716                                                                         isPendingFocus = false;\r
717                                                                 }\r
718                                                                 setTimeout( function()\r
719                                                                 {\r
720                                                                         editor.fire( 'dataReady' );\r
721                                                                 }, 0 );\r
722 \r
723                                                                 // IE, Opera and Safari may not support it and throw errors.\r
724                                                                 try { editor.document.$.execCommand( 'enableObjectResizing', false, !editor.config.disableObjectResizing ) ; } catch(e) {}\r
725                                                                 try { editor.document.$.execCommand( 'enableInlineTableEditing', false, !editor.config.disableNativeTableHandles ) ; } catch(e) {}\r
726 \r
727                                                                 /*\r
728                                                                  * IE BUG: IE might have rendered the iframe with invisible contents.\r
729                                                                  * (#3623). Push some inconsequential CSS style changes to force IE to\r
730                                                                  * refresh it.\r
731                                                                  *\r
732                                                                  * Also, for some unknown reasons, short timeouts (e.g. 100ms) do not\r
733                                                                  * fix the problem. :(\r
734                                                                  */\r
735                                                                 if ( CKEDITOR.env.ie )\r
736                                                                 {\r
737                                                                         setTimeout( function()\r
738                                                                                 {\r
739                                                                                         if ( editor.document )\r
740                                                                                         {\r
741                                                                                                 var $body = editor.document.$.body;\r
742                                                                                                 $body.runtimeStyle.marginBottom = '0px';\r
743                                                                                                 $body.runtimeStyle.marginBottom = '';\r
744                                                                                         }\r
745                                                                                 }, 1000 );\r
746                                                                 }\r
747                                                         },\r
748                                                         0 );\r
749                                         }\r
750 \r
751                                         editor.addMode( 'wysiwyg',\r
752                                                 {\r
753                                                         load : function( holderElement, data, isSnapshot )\r
754                                                         {\r
755                                                                 mainElement = holderElement;\r
756 \r
757                                                                 if ( CKEDITOR.env.ie && CKEDITOR.env.quirks )\r
758                                                                         holderElement.setStyle( 'position', 'relative' );\r
759 \r
760                                                                 // The editor data "may be dirty" after this\r
761                                                                 // point.\r
762                                                                 editor.mayBeDirty = true;\r
763 \r
764                                                                 fireMode = true;\r
765 \r
766                                                                 if ( isSnapshot )\r
767                                                                         this.loadSnapshotData( data );\r
768                                                                 else\r
769                                                                         this.loadData( data );\r
770                                                         },\r
771 \r
772                                                         loadData : function( data )\r
773                                                         {\r
774                                                                 isLoadingData = true;\r
775 \r
776                                                                 var config = editor.config,\r
777                                                                         fullPage = config.fullPage,\r
778                                                                         docType = config.docType;\r
779 \r
780                                                                 // Build the additional stuff to be included into <head>.\r
781                                                                 var headExtra =\r
782                                                                         '<style type="text/css" cke_temp="1">' +\r
783                                                                                 editor._.styles.join( '\n' ) +\r
784                                                                         '</style>';\r
785 \r
786                                                                 !fullPage && ( headExtra =\r
787                                                                         CKEDITOR.tools.buildStyleHtml( editor.config.contentsCss ) +\r
788                                                                         headExtra );\r
789 \r
790                                                                 var baseTag = config.baseHref ? '<base href="' + config.baseHref + '" cke_temp="1" />' : '';\r
791 \r
792                                                                 if ( fullPage )\r
793                                                                 {\r
794                                                                         // Search and sweep out the doctype declaration.\r
795                                                                         data = data.replace( /<!DOCTYPE[^>]*>/i, function( match )\r
796                                                                                 {\r
797                                                                                         editor.docType = docType = match;\r
798                                                                                         return '';\r
799                                                                                 });\r
800                                                                 }\r
801 \r
802                                                                 // Get the HTML version of the data.\r
803                                                                 if ( editor.dataProcessor )\r
804                                                                         data = editor.dataProcessor.toHtml( data, fixForBody );\r
805 \r
806                                                                 if ( fullPage )\r
807                                                                 {\r
808                                                                         // Check if the <body> tag is available.\r
809                                                                         if ( !(/<body[\s|>]/).test( data ) )\r
810                                                                                 data = '<body>' + data;\r
811 \r
812                                                                         // Check if the <html> tag is available.\r
813                                                                         if ( !(/<html[\s|>]/).test( data ) )\r
814                                                                                 data = '<html>' + data + '</html>';\r
815 \r
816                                                                         // Check if the <head> tag is available.\r
817                                                                         if ( !(/<head[\s|>]/).test( data ) )\r
818                                                                                 data = data.replace( /<html[^>]*>/, '$&<head><title></title></head>' ) ;\r
819                                                                         else if ( !(/<title[\s|>]/).test( data ) )\r
820                                                                                 data = data.replace( /<head[^>]*>/, '$&<title></title>' ) ;\r
821 \r
822                                                                         // The base must be the first tag in the HEAD, e.g. to get relative\r
823                                                                         // links on styles.\r
824                                                                         baseTag && ( data = data.replace( /<head>/, '$&' + baseTag ) );\r
825 \r
826                                                                         // Inject the extra stuff into <head>.\r
827                                                                         // Attention: do not change it before testing it well. (V2)\r
828                                                                         // This is tricky... if the head ends with <meta ... content type>,\r
829                                                                         // Firefox will break. But, it works if we place our extra stuff as\r
830                                                                         // the last elements in the HEAD.\r
831                                                                         data = data.replace( /<\/head\s*>/, headExtra + '$&' );\r
832 \r
833                                                                         // Add the DOCTYPE back to it.\r
834                                                                         data = docType + data;\r
835                                                                 }\r
836                                                                 else\r
837                                                                 {\r
838                                                                         data =\r
839                                                                                 config.docType +\r
840                                                                                 '<html dir="' + config.contentsLangDirection + '"' +\r
841                                                                                         ' lang="' + ( config.contentsLanguage || editor.langCode ) + '">' +\r
842                                                                                 '<head>' +\r
843                                                                                         '<title>' + frameLabel + '</title>' +\r
844                                                                                         baseTag +\r
845                                                                                         headExtra +\r
846                                                                                 '</head>' +\r
847                                                                                 '<body' + ( config.bodyId ? ' id="' + config.bodyId + '"' : '' ) +\r
848                                                                                                   ( config.bodyClass ? ' class="' + config.bodyClass + '"' : '' ) +\r
849                                                                                                   '>' +\r
850                                                                                         data +\r
851                                                                                 '</html>';\r
852                                                                 }\r
853 \r
854                                                                 data += activationScript;\r
855 \r
856 \r
857                                                                 // The iframe is recreated on each call of setData, so we need to clear DOM objects\r
858                                                                 this.onDispose();\r
859                                                                 createIFrame( data );\r
860                                                         },\r
861 \r
862                                                         getData : function()\r
863                                                         {\r
864                                                                 var config = editor.config,\r
865                                                                         fullPage = config.fullPage,\r
866                                                                         docType = fullPage && editor.docType,\r
867                                                                         doc = iframe.getFrameDocument();\r
868 \r
869                                                                 var data = fullPage\r
870                                                                         ? doc.getDocumentElement().getOuterHtml()\r
871                                                                         : doc.getBody().getHtml();\r
872 \r
873                                                                 if ( editor.dataProcessor )\r
874                                                                         data = editor.dataProcessor.toDataFormat( data, fixForBody );\r
875 \r
876                                                                 // Strip the last blank paragraph within document.\r
877                                                                 if ( config.ignoreEmptyParagraph )\r
878                                                                         data = data.replace( emptyParagraphRegexp, '' );\r
879 \r
880                                                                 if ( docType )\r
881                                                                         data = docType + '\n' + data;\r
882 \r
883                                                                 return data;\r
884                                                         },\r
885 \r
886                                                         getSnapshotData : function()\r
887                                                         {\r
888                                                                 return iframe.getFrameDocument().getBody().getHtml();\r
889                                                         },\r
890 \r
891                                                         loadSnapshotData : function( data )\r
892                                                         {\r
893                                                                 iframe.getFrameDocument().getBody().setHtml( data );\r
894                                                         },\r
895 \r
896                                                         onDispose : function()\r
897                                                         {\r
898                                                                 if ( !editor.document )\r
899                                                                         return;\r
900 \r
901                                                                 editor.document.getDocumentElement().clearCustomData();\r
902                                                                 editor.document.getBody().clearCustomData();\r
903 \r
904                                                                 editor.window.clearCustomData();\r
905                                                                 editor.document.clearCustomData();\r
906 \r
907                                                                 iframe.clearCustomData();\r
908 \r
909                                                                 /*\r
910                                                                 * IE BUG: When destroying editor DOM with the selection remains inside\r
911                                                                 * editing area would break IE7/8's selection system, we have to put the editing\r
912                                                                 * iframe offline first. (#3812 and #5441)\r
913                                                                 */\r
914                                                                 iframe.remove();\r
915                                                         },\r
916 \r
917                                                         unload : function( holderElement )\r
918                                                         {\r
919                                                                 this.onDispose();\r
920 \r
921                                                                 editor.window = editor.document = iframe = mainElement = isPendingFocus = null;\r
922 \r
923                                                                 editor.fire( 'contentDomUnload' );\r
924                                                         },\r
925 \r
926                                                         focus : function()\r
927                                                         {\r
928                                                                 if ( isLoadingData )\r
929                                                                         isPendingFocus = true;\r
930                                                                 // Temporary solution caused by #6025, supposed be unified by #6154.\r
931                                                                 else if ( CKEDITOR.env.opera && editor.document )\r
932                                                                 {\r
933                                                                         editor.document.getBody().focus();\r
934 \r
935                                                                         editor.selectionChange();\r
936                                                                 }\r
937                                                                 else if ( !CKEDITOR.env.opera && editor.window )\r
938                                                                 {\r
939                                                                         editor.window.focus();\r
940 \r
941                                                                         editor.selectionChange();\r
942                                                                 }\r
943                                                         }\r
944                                                 });\r
945 \r
946                                         editor.on( 'insertHtml', onInsertHtml, null, null, 20 );\r
947                                         editor.on( 'insertElement', onInsertElement, null, null, 20 );\r
948                                         // Auto fixing on some document structure weakness to enhance usabilities. (#3190 and #3189)\r
949                                         editor.on( 'selectionChange', onSelectionChangeFixBody, null, null, 1 );\r
950                                 });\r
951 \r
952                         var titleBackup;\r
953                         // Setting voice label as window title, backup the original one\r
954                         // and restore it before running into use.\r
955                         editor.on( 'contentDom', function ()\r
956                                 {\r
957                                         var title = editor.document.getElementsByTag( 'title' ).getItem( 0 );\r
958                                         title.setAttribute( '_cke_title', editor.document.$.title );\r
959                                         editor.document.$.title = frameLabel;\r
960                                 });\r
961 \r
962                         // IE8 stricts mode doesn't have 'contentEditable' in effect\r
963                         // on element unless it has layout. (#5562)\r
964                         if ( CKEDITOR.env.ie8Compat )\r
965                         {\r
966                                 editor.addCss( 'html.CSS1Compat [contenteditable=false]{ min-height:0 !important;}' );\r
967 \r
968                                 var selectors = [];\r
969                                 for ( var tag in CKEDITOR.dtd.$removeEmpty )\r
970                                         selectors.push( 'html.CSS1Compat ' + tag + '[contenteditable=false]' );\r
971                                 editor.addCss( selectors.join( ',' ) + '{ display:inline-block;}' );\r
972                         }\r
973 \r
974                         // Switch on design mode for a short while and close it after then.\r
975                         function blinkCursor( retry )\r
976                         {\r
977                                 CKEDITOR.tools.tryThese(\r
978                                         function()\r
979                                         {\r
980                                                 editor.document.$.designMode = 'on';\r
981                                                 setTimeout( function ()\r
982                                                 {\r
983                                                         editor.document.$.designMode = 'off';\r
984                                                         editor.document.getBody().focus();\r
985                                                 }, 50 );\r
986                                         },\r
987                                         function()\r
988                                         {\r
989                                                 // The above call is known to fail when parent DOM\r
990                                                 // tree layout changes may break design mode. (#5782)\r
991                                                 // Refresh the 'contentEditable' is a cue to this.\r
992                                                 editor.document.$.designMode = 'off';\r
993                                                 var body = editor.document.getBody();\r
994                                                 body.setAttribute( 'contentEditable', false );\r
995                                                 body.setAttribute( 'contentEditable', true );\r
996                                                 // Try it again once..\r
997                                                 !retry && blinkCursor( 1 );\r
998                                         });\r
999                         }\r
1000 \r
1001                         // Create an invisible element to grab focus.\r
1002                         if ( CKEDITOR.env.gecko || CKEDITOR.env.ie || CKEDITOR.env.opera )\r
1003                         {\r
1004                                 var focusGrabber;\r
1005                                 editor.on( 'uiReady', function()\r
1006                                 {\r
1007                                         focusGrabber = editor.container.append( CKEDITOR.dom.element.createFromHtml(\r
1008                                                 // Use 'span' instead of anything else to fly under the screen-reader radar. (#5049)\r
1009                                                 '<span tabindex="-1" style="position:absolute; left:-10000" role="presentation"></span>' ) );\r
1010 \r
1011                                         focusGrabber.on( 'focus', function()\r
1012                                                 {\r
1013                                                         editor.focus();\r
1014                                                 } );\r
1015                                 } );\r
1016                                 editor.on( 'destroy', function()\r
1017                                 {\r
1018                                         CKEDITOR.tools.removeFunction( contentDomReadyHandler );\r
1019                                         focusGrabber.clearCustomData();\r
1020                                 } );\r
1021                         }\r
1022 \r
1023                         // Disable form elements editing mode provided by some browers. (#5746)\r
1024                         editor.on( 'insertElement', function ( evt )\r
1025                         {\r
1026                                 var element = evt.data;\r
1027                                 if ( element.type == CKEDITOR.NODE_ELEMENT\r
1028                                                 && ( element.is( 'input' ) || element.is( 'textarea' ) ) )\r
1029                                 {\r
1030                                         if ( !element.isReadOnly() )\r
1031                                         {\r
1032                                                 element.setAttribute( 'contentEditable', false );\r
1033                                                 // We should flag that the element was locked by our code so\r
1034                                                 // it'll be editable by the editor functions (#6046).\r
1035                                                 element.setCustomData( '_cke_notReadOnly', 1 );\r
1036                                         }\r
1037                                 }\r
1038                         });\r
1039 \r
1040                 }\r
1041         });\r
1042 \r
1043         // Fixing Firefox 'Back-Forward Cache' break design mode. (#4514)\r
1044         if ( CKEDITOR.env.gecko )\r
1045         {\r
1046                 ( function ()\r
1047                 {\r
1048                         var body = document.body;\r
1049 \r
1050                         if ( !body )\r
1051                                 window.addEventListener( 'load', arguments.callee, false );\r
1052                         else\r
1053                         {\r
1054                                 var currentHandler = body.getAttribute( 'onpageshow' );\r
1055                                 body.setAttribute( 'onpageshow', ( currentHandler ? currentHandler + ';' : '') +\r
1056                                                         'event.persisted && (function(){' +\r
1057                                                                 'var allInstances = CKEDITOR.instances, editor, doc;' +\r
1058                                                                 'for ( var i in allInstances )' +\r
1059                                                                 '{' +\r
1060                                                                 '       editor = allInstances[ i ];' +\r
1061                                                                 '       doc = editor.document;' +\r
1062                                                                 '       if ( doc )' +\r
1063                                                                 '       {' +\r
1064                                                                 '               doc.$.designMode = "off";' +\r
1065                                                                 '               doc.$.designMode = "on";' +\r
1066                                                                 '       }' +\r
1067                                                                 '}' +\r
1068                                                 '})();' );\r
1069                         }\r
1070                 } )();\r
1071 \r
1072         }\r
1073 })();\r
1074 \r
1075 /**\r
1076  * Disables the ability of resize objects (image and tables) in the editing\r
1077  * area.\r
1078  * @type Boolean\r
1079  * @default false\r
1080  * @example\r
1081  * config.disableObjectResizing = true;\r
1082  */\r
1083 CKEDITOR.config.disableObjectResizing = false;\r
1084 \r
1085 /**\r
1086  * Disables the "table tools" offered natively by the browser (currently\r
1087  * Firefox only) to make quick table editing operations, like adding or\r
1088  * deleting rows and columns.\r
1089  * @type Boolean\r
1090  * @default true\r
1091  * @example\r
1092  * config.disableNativeTableHandles = false;\r
1093  */\r
1094 CKEDITOR.config.disableNativeTableHandles = true;\r
1095 \r
1096 /**\r
1097  * Disables the built-in spell checker while typing natively available in the\r
1098  * browser (currently Firefox and Safari only).<br /><br />\r
1099  *\r
1100  * Even if word suggestions will not appear in the CKEditor context menu, this\r
1101  * feature is useful to help quickly identifying misspelled words.<br /><br />\r
1102  *\r
1103  * This setting is currently compatible with Firefox only due to limitations in\r
1104  * other browsers.\r
1105  * @type Boolean\r
1106  * @default true\r
1107  * @example\r
1108  * config.disableNativeSpellChecker = false;\r
1109  */\r
1110 CKEDITOR.config.disableNativeSpellChecker = true;\r
1111 \r
1112 /**\r
1113  * Whether the editor must output an empty value ("") if it's contents is made\r
1114  * by an empty paragraph only.\r
1115  * @type Boolean\r
1116  * @default true\r
1117  * @example\r
1118  * config.ignoreEmptyParagraph = false;\r
1119  */\r
1120 CKEDITOR.config.ignoreEmptyParagraph = true;\r
1121 \r
1122 /**\r
1123  * Fired when data is loaded and ready for retrieval in an editor instance.\r
1124  * @name CKEDITOR.editor#dataReady\r
1125  * @event\r
1126  */\r