2 Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.
\r
3 For licensing, see LICENSE.html or http://ckeditor.com/license
\r
8 CKEDITOR.plugins.add( 'enterkey',
\r
10 requires : [ 'keystrokes', 'indent' ],
\r
12 init : function( editor )
\r
14 editor.addCommand( 'enter', {
\r
15 modes : { wysiwyg:1 },
\r
16 editorFocus : false,
\r
17 exec : function( editor ){ enter( editor ); }
\r
20 editor.addCommand( 'shiftEnter', {
\r
21 modes : { wysiwyg:1 },
\r
22 editorFocus : false,
\r
23 exec : function( editor ){ shiftEnter( editor ); }
\r
26 var keystrokes = editor.keystrokeHandler.keystrokes;
\r
27 keystrokes[ 13 ] = 'enter';
\r
28 keystrokes[ CKEDITOR.SHIFT + 13 ] = 'shiftEnter';
\r
32 CKEDITOR.plugins.enterkey =
\r
34 enterBlock : function( editor, mode, range, forceMode )
\r
36 // Get the range for the current selection.
\r
37 range = range || getRange( editor );
\r
39 // We may not have valid ranges to work on, like when inside a
\r
40 // contenteditable=false element.
\r
44 var doc = range.document;
\r
46 var atBlockStart = range.checkStartOfBlock(),
\r
47 atBlockEnd = range.checkEndOfBlock(),
\r
48 path = new CKEDITOR.dom.elementPath( range.startContainer ),
\r
51 // Exit the list when we're inside an empty list item block. (#5376)
\r
52 if ( atBlockStart && atBlockEnd )
\r
54 if ( block && ( block.is( 'li' ) || block.getParent().is( 'li' ) ) )
\r
56 editor.execCommand( 'outdent' );
\r
60 // Don't split <pre> if we're in the middle of it, act as shift enter key.
\r
61 else if ( block && block.is( 'pre' ) )
\r
65 enterBr( editor, mode, range, forceMode );
\r
69 // Don't split caption blocks. (#7944)
\r
70 else if ( block && CKEDITOR.dtd.$captionBlock[ block.getName() ] )
\r
72 enterBr( editor, mode, range, forceMode );
\r
76 // Determine the block element to be used.
\r
77 var blockTag = ( mode == CKEDITOR.ENTER_DIV ? 'div' : 'p' );
\r
80 var splitInfo = range.splitBlock( blockTag );
\r
85 // Get the current blocks.
\r
86 var previousBlock = splitInfo.previousBlock,
\r
87 nextBlock = splitInfo.nextBlock;
\r
89 var isStartOfBlock = splitInfo.wasStartOfBlock,
\r
90 isEndOfBlock = splitInfo.wasEndOfBlock;
\r
94 // If this is a block under a list item, split it as well. (#1647)
\r
97 node = nextBlock.getParent();
\r
98 if ( node.is( 'li' ) )
\r
100 nextBlock.breakParent( node );
\r
101 nextBlock.move( nextBlock.getNext(), 1 );
\r
104 else if ( previousBlock && ( node = previousBlock.getParent() ) && node.is( 'li' ) )
\r
106 previousBlock.breakParent( node );
\r
107 node = previousBlock.getNext();
\r
108 range.moveToElementEditStart( node );
\r
109 previousBlock.move( previousBlock.getPrevious() );
\r
112 // If we have both the previous and next blocks, it means that the
\r
113 // boundaries were on separated blocks, or none of them where on the
\r
114 // block limits (start/end).
\r
115 if ( !isStartOfBlock && !isEndOfBlock )
\r
117 // If the next block is an <li> with another list tree as the first
\r
118 // child, we'll need to append a filler (<br>/NBSP) or the list item
\r
119 // wouldn't be editable. (#1420)
\r
120 if ( nextBlock.is( 'li' )
\r
121 && ( node = nextBlock.getFirst( CKEDITOR.dom.walker.invisible( true ) ) )
\r
122 && node.is && node.is( 'ul', 'ol' ) )
\r
123 ( CKEDITOR.env.ie ? doc.createText( '\xa0' ) : doc.createElement( 'br' ) ).insertBefore( node );
\r
125 // Move the selection to the end block.
\r
127 range.moveToElementEditStart( nextBlock );
\r
134 if ( previousBlock )
\r
136 // Do not enter this block if it's a header tag, or we are in
\r
137 // a Shift+Enter (#77). Create a new block element instead
\r
138 // (later in the code).
\r
139 if ( previousBlock.is( 'li' ) ||
\r
140 ! ( headerTagRegex.test( previousBlock.getName() ) || previousBlock.is( 'pre' ) ) )
\r
142 // Otherwise, duplicate the previous block.
\r
143 newBlock = previousBlock.clone();
\r
146 else if ( nextBlock )
\r
147 newBlock = nextBlock.clone();
\r
151 // We have already created a new list item. (#6849)
\r
152 if ( node && node.is( 'li' ) )
\r
156 newBlock = doc.createElement( blockTag );
\r
157 if ( previousBlock && ( newBlockDir = previousBlock.getDirection() ) )
\r
158 newBlock.setAttribute( 'dir', newBlockDir );
\r
161 // Force the enter block unless we're talking of a list item.
\r
162 else if ( forceMode && !newBlock.is( 'li' ) )
\r
163 newBlock.renameNode( blockTag );
\r
165 // Recreate the inline elements tree, which was available
\r
166 // before hitting enter, so the same styles will be available in
\r
168 var elementPath = splitInfo.elementPath;
\r
171 for ( var i = 0, len = elementPath.elements.length ; i < len ; i++ )
\r
173 var element = elementPath.elements[ i ];
\r
175 if ( element.equals( elementPath.block ) || element.equals( elementPath.blockLimit ) )
\r
178 if ( CKEDITOR.dtd.$removeEmpty[ element.getName() ] )
\r
180 element = element.clone();
\r
181 newBlock.moveChildren( element );
\r
182 newBlock.append( element );
\r
187 if ( !CKEDITOR.env.ie )
\r
188 newBlock.appendBogus();
\r
190 if ( !newBlock.getParent() )
\r
191 range.insertNode( newBlock );
\r
193 // list item start number should not be duplicated (#7330), but we need
\r
194 // to remove the attribute after it's onto the DOM tree because of old IEs (#7581).
\r
195 newBlock.is( 'li' ) && newBlock.removeAttribute( 'value' );
\r
197 // This is tricky, but to make the new block visible correctly
\r
198 // we must select it.
\r
199 // The previousBlock check has been included because it may be
\r
200 // empty if we have fixed a block-less space (like ENTER into an
\r
201 // empty table cell).
\r
202 if ( CKEDITOR.env.ie && isStartOfBlock && ( !isEndOfBlock || !previousBlock.getChildCount() ) )
\r
204 // Move the selection to the new block.
\r
205 range.moveToElementEditStart( isEndOfBlock ? previousBlock : newBlock );
\r
209 // Move the selection to the new block.
\r
210 range.moveToElementEditStart( isStartOfBlock && !isEndOfBlock ? nextBlock : newBlock );
\r
213 if ( !CKEDITOR.env.ie )
\r
217 // If we have split the block, adds a temporary span at the
\r
218 // range position and scroll relatively to it.
\r
219 var tmpNode = doc.createElement( 'span' );
\r
221 // We need some content for Safari.
\r
222 tmpNode.setHtml( ' ' );
\r
224 range.insertNode( tmpNode );
\r
225 tmpNode.scrollIntoView();
\r
226 range.deleteContents();
\r
230 // We may use the above scroll logic for the new block case
\r
231 // too, but it gives some weird result with Opera.
\r
232 newBlock.scrollIntoView();
\r
239 enterBr : function( editor, mode, range, forceMode )
\r
241 // Get the range for the current selection.
\r
242 range = range || getRange( editor );
\r
244 // We may not have valid ranges to work on, like when inside a
\r
245 // contenteditable=false element.
\r
249 var doc = range.document;
\r
251 // Determine the block element to be used.
\r
252 var blockTag = ( mode == CKEDITOR.ENTER_DIV ? 'div' : 'p' );
\r
254 var isEndOfBlock = range.checkEndOfBlock();
\r
256 var elementPath = new CKEDITOR.dom.elementPath( editor.getSelection().getStartElement() );
\r
258 var startBlock = elementPath.block,
\r
259 startBlockTag = startBlock && elementPath.block.getName();
\r
263 if ( !forceMode && startBlockTag == 'li' )
\r
265 enterBlock( editor, mode, range, forceMode );
\r
269 // If we are at the end of a header block.
\r
270 if ( !forceMode && isEndOfBlock && headerTagRegex.test( startBlockTag ) )
\r
275 if ( ( newBlockDir = startBlock.getDirection() ) )
\r
277 newBlock = doc.createElement( 'div' );
\r
278 newBlock.setAttribute( 'dir', newBlockDir );
\r
279 newBlock.insertAfter( startBlock );
\r
280 range.setStart( newBlock, 0 );
\r
284 // Insert a <br> after the current paragraph.
\r
285 doc.createElement( 'br' ).insertAfter( startBlock );
\r
287 // A text node is required by Gecko only to make the cursor blink.
\r
288 if ( CKEDITOR.env.gecko )
\r
289 doc.createText( '' ).insertAfter( startBlock );
\r
291 // IE has different behaviors regarding position.
\r
292 range.setStartAt( startBlock.getNext(), CKEDITOR.env.ie ? CKEDITOR.POSITION_BEFORE_START : CKEDITOR.POSITION_AFTER_START );
\r
299 isPre = ( startBlockTag == 'pre' );
\r
301 // Gecko prefers <br> as line-break inside <pre> (#4711).
\r
302 if ( isPre && !CKEDITOR.env.gecko )
\r
303 lineBreak = doc.createText( CKEDITOR.env.ie ? '\r' : '\n' );
\r
305 lineBreak = doc.createElement( 'br' );
\r
307 range.deleteContents();
\r
308 range.insertNode( lineBreak );
\r
310 // IE has different behavior regarding position.
\r
311 if ( CKEDITOR.env.ie )
\r
312 range.setStartAt( lineBreak, CKEDITOR.POSITION_AFTER_END );
\r
315 // A text node is required by Gecko only to make the cursor blink.
\r
316 // We need some text inside of it, so the bogus <br> is properly
\r
318 doc.createText( '\ufeff' ).insertAfter( lineBreak );
\r
320 // If we are at the end of a block, we must be sure the bogus node is available in that block.
\r
321 if ( isEndOfBlock )
\r
322 lineBreak.getParent().appendBogus();
\r
324 // Now we can remove the text node contents, so the caret doesn't
\r
326 lineBreak.getNext().$.nodeValue = '';
\r
328 range.setStartAt( lineBreak.getNext(), CKEDITOR.POSITION_AFTER_START );
\r
330 // Scroll into view, for non IE.
\r
333 // BR is not positioned in Opera and Webkit.
\r
334 if ( !CKEDITOR.env.gecko )
\r
336 dummy = doc.createElement( 'span' );
\r
337 // We need have some contents for Webkit to position it
\r
338 // under parent node. ( #3681)
\r
339 dummy.setHtml(' ');
\r
342 dummy = doc.createElement( 'br' );
\r
344 dummy.insertBefore( lineBreak.getNext() );
\r
345 dummy.scrollIntoView();
\r
350 // This collapse guarantees the cursor will be blinking.
\r
351 range.collapse( true );
\r
353 range.select( isPre );
\r
357 var plugin = CKEDITOR.plugins.enterkey,
\r
358 enterBr = plugin.enterBr,
\r
359 enterBlock = plugin.enterBlock,
\r
360 headerTagRegex = /^h[1-6]$/;
\r
362 function shiftEnter( editor )
\r
364 // Only effective within document.
\r
365 if ( editor.mode != 'wysiwyg' )
\r
369 // 1. We want to enforce the mode to be respected, instead
\r
370 // of cloning the current block. (#77)
\r
371 return enter( editor, editor.config.shiftEnterMode, 1 );
\r
374 function enter( editor, mode, forceMode )
\r
376 forceMode = editor.config.forceEnterMode || forceMode;
\r
378 // Only effective within document.
\r
379 if ( editor.mode != 'wysiwyg' )
\r
383 mode = editor.config.enterMode;
\r
385 // Use setTimout so the keys get cancelled immediatelly.
\r
386 setTimeout( function()
\r
388 editor.fire( 'saveSnapshot' ); // Save undo step.
\r
389 if ( mode == CKEDITOR.ENTER_BR )
\r
390 enterBr( editor, mode, null, forceMode );
\r
392 enterBlock( editor, mode, null, forceMode );
\r
399 function getRange( editor )
\r
401 // Get the selection ranges.
\r
402 var ranges = editor.getSelection().getRanges( true );
\r
404 // Delete the contents of all ranges except the first one.
\r
405 for ( var i = ranges.length - 1 ; i > 0 ; i-- )
\r
407 ranges[ i ].deleteContents();
\r
410 // Return the first range.
\r
411 return ranges[ 0 ];
\r