Changeset 7439

Timestamp:

03/30/12 12:10:54 (14 months ago)

Author:

garry.yao

Message:

#8248: Fixing the del/backspace behavior in ie8.

Location:

CKEditor/trunk

Files:

• CHANGES.html (modified) (1 diff)
• _source/core/dom/range.js (modified) (2 diffs)
• _source/core/dom/walker.js (modified) (1 diff)
• _source/plugins/list/plugin.js (modified) (6 diffs)

CKEditor/trunk/CHANGES.html

@@ -85 +85 @@
                 <li><a href="http://dev.ckeditor.com/ticket/8835">#8835</a> : Removing the right margin on IE&lt;8 to avoid mouse click confusion.</li>
                 <li><a href="http://dev.ckeditor.com/ticket/8400">#8400</a> : [IE] Fix script error when closing cellProperties dialog if table cell text is selected.</li>
+                <li><a href="http://dev.ckeditor.com/ticket/8248">#8248</a> : [IE8] Fix BACKSPACE/DEL keys when working at the start/end of list items.</li>
         </ul>
         <h3>

CKEditor/trunk/_source/core/dom/range.js

@@ -381 +381 @@
         }
 
+
+        var isBogus = CKEDITOR.dom.walker.bogus();
         // Evaluator for CKEDITOR.dom.element::checkBoundaryOfElement, reject any
         // text node and non-empty elements unless it's being bookmark text.
-        function elementBoundaryEval( node )
+        function elementBoundaryEval( checkStart )
         {
-                // Reject any text node unless it's being bookmark
-                // OR it's spaces.
-                // Reject any element unless it's being invisible empty. (#3883)
-                return node.type == CKEDITOR.NODE_TEXT ?
-                           !CKEDITOR.tools.trim( node.getText() ) ||
-                           !!node.getParent().data( 'cke-bookmark' )
-                           : node.getName() in CKEDITOR.dtd.$removeEmpty;
+                return function( node )
+                {
+                        // Tolerant bogus br when checking at the end of block.
+                        // Reject any text node unless it's being bookmark
+                        // OR it's spaces.
+                        // Reject any element unless it's being invisible empty. (#3883)
+                        return !checkStart && isBogus( node ) ||
+                                        ( node.type == CKEDITOR.NODE_TEXT ?
+                                           !CKEDITOR.tools.trim( node.getText() ) || !!node.getParent().data( 'cke-bookmark' )
+                                           : node.getName() in CKEDITOR.dtd.$removeEmpty );
+                };
         }
 
@@ -1802 +1808 @@
                         // in the range.
                         var walker = new CKEDITOR.dom.walker( walkerRange );
-                        walker.evaluator = elementBoundaryEval;
+                        walker.evaluator = elementBoundaryEval( checkStart );
 
                         return walker[ checkStart ? 'checkBackward' : 'checkForward' ]();

CKEditor/trunk/_source/core/dom/walker.js

@@ -447 +447 @@
         };
 
+        CKEDITOR.dom.walker.bogus = function( type, isReject )
+        {
+                function nonEmpty( node )
+                {
+                        return !isWhitespaces( node ) && !isBookmark( node );
+                }
+
+                return function( node )
+                {
+                        var parent = node.getParent(),
+                                isBogus = !CKEDITOR.env.ie ? node.is && node.is( 'br' ) :
+                                          node.getText && tailNbspRegex.test( node.getText() );
+
+                        isBogus = isBogus && parent.isBlockBoundary() && !!parent.getLast( nonEmpty );
+
+                        return !! ( isReject ^ isBogus );
+                };
+        };
+
         var tailNbspRegex = /^[\t\r\n ]*(?: |\xa0)$/,
                 isWhitespaces = CKEDITOR.dom.walker.whitespaces(),

CKEditor/trunk/_source/plugins/list/plugin.js

@@ -15 +15 @@
         var whitespaces = CKEDITOR.dom.walker.whitespaces(),
                 bookmarks = CKEDITOR.dom.walker.bookmark(),
-                nonEmpty = function( node ){ return !( whitespaces( node ) || bookmarks( node ) ); };
+                nonEmpty = function( node ){ return !( whitespaces( node ) || bookmarks( node ) );},
+                blockBogus = CKEDITOR.dom.walker.bogus();
 
         function cleanUpDirection( element )
@@ -496 +497 @@
         var elementType = CKEDITOR.dom.walker.nodeType( CKEDITOR.NODE_ELEMENT );
         // Merge list items with direction preserved. (#7448)
-        function mergeListItems( from, into, toHead )
+        function mergeListItems( from, into, refNode, toHead )
         {
                 var child, itemDir;
@@ -503 +504 @@
                         if ( ( itemDir = child.getDirection( 1 ) ) !== into.getDirection( 1 ) )
                                 child.setAttribute( 'dir', itemDir );
-                        into.append( child.remove(), toHead );
+
+                        child.remove();
+
+                        refNode ?
+                                child[ toHead ? 'insertBefore' : 'insertAfter' ]( refNode ) :
+                                into.append( child, toHead  );
                 }
         }
@@ -662 +668 @@
                                         {
                                                 // Move children order by merge direction.(#3820)
-                                                mergeListItems( listNode, sibling, !rtl );
+                                                mergeListItems( listNode, sibling, null, !rtl );
 
                                                 listNode.remove();
@@ -740 +746 @@
                 defaultListHtmlFilterRules.elements[ i ] = getExtendNestedListFilter( true );
 
+        // Check if node is block element that recieves text.
+        function isTextBlock( node )
+        {
+                return node.type == CKEDITOR.NODE_ELEMENT &&
+                           ( node.getName() in CKEDITOR.dtd.$block ||
+                                 node.getName() in CKEDITOR.dtd.$listItem ) &&
+                           CKEDITOR.dtd[ node.getName() ][ '#' ];
+        }
+
+        // Merge the visual line content at the cursor range into the block.
+        function joinNextLineToCursor( editor, cursor, nextCursor )
+        {
+                editor.fire( 'saveSnapshot' );
+
+                // Merge with previous block's content.
+                nextCursor.enlarge( CKEDITOR.ENLARGE_LIST_ITEM_CONTENTS );
+                var frag = nextCursor.extractContents();
+
+                cursor.trim( false, true );
+
+                // Kill original bogus;
+                var currentPath = new CKEDITOR.dom.elementPath( cursor.startContainer );
+                var currentLi = currentPath.lastElement.getAscendant( 'li', 1 );
+
+                var bogus = currentPath.block.getBogus();
+                bogus && bogus.remove();
+
+                // Kill the tail br in extracted.
+                var last = frag.getLast();
+                if ( last && last.type == CKEDITOR.NODE_ELEMENT && last.is( 'br' ) )
+                        last.remove();
+
+                // Insert fragment at the range position.
+                var nextNode = cursor.startContainer.getChild( cursor.startOffset );
+                if ( nextNode )
+                        frag.insertBefore( nextNode );
+                else
+                        cursor.startContainer.append( frag );
+
+                var nextPath = new CKEDITOR.dom.elementPath( nextCursor.startContainer );
+                var nextLi = nextCursor.startContainer.getAscendant( 'li', 1 );
+
+                // Move the sub list nested in the next list item.
+                if ( nextLi )
+                {
+                        var sublist = getSubList( nextLi );
+                        if ( sublist )
+                        {
+                                // If next line is in the sub list of the current list item.
+                                if ( currentLi.contains( nextLi ) )
+                                {
+                                        mergeListItems( sublist, nextLi.getParent(), nextLi );
+                                        sublist.remove();
+                                }
+                                // Migrate the sub list to current list item.
+                                else
+                                        currentLi.append( sublist );
+                        }
+                }
+
+
+                if ( nextCursor.checkStartOfBlock() &&
+                         nextCursor.checkEndOfBlock() )
+                {
+                        var nextBlock = nextPath.block,
+                                parentBlock = nextBlock.getParent();
+
+                        nextBlock.remove();
+
+                        // Remove if the path block container is now empty, e.g. li.
+                        if ( parentBlock &&
+                                 !parentBlock.getFirst( nonEmpty ) &&
+                                 !parentBlock.equals( nextPath.blockLimit ) )
+                        {
+                                parentBlock.remove();
+                        }
+                }
+
+                // Make fresh selection.
+                cursor.select();
+
+                editor.fire( 'saveSnapshot' );
+        }
+
+        function getSubList( li )
+        {
+                var last = li.getLast( nonEmpty );
+                return last && last.type == CKEDITOR.NODE_ELEMENT && last.getName() in listNodeNames ? last : null;
+        }
+
         CKEDITOR.plugins.add( 'list',
         {
@@ -763 +859 @@
                         editor.on( 'selectionChange', CKEDITOR.tools.bind( onSelectionChange, numberedListCommand ) );
                         editor.on( 'selectionChange', CKEDITOR.tools.bind( onSelectionChange, bulletedListCommand ) );
+
+                        // [IE8] Fix "backspace" after list and "del" at the end of list item. (#8248)
+                        if ( CKEDITOR.env.ie8Compat )
+                        {
+                                editor.on( 'key', function( evt )
+                                {
+                                        var key = evt.data.keyCode;
+
+                                        // DEl/BACKSPACE
+                                        if ( editor.mode == 'wysiwyg' && key in { 8 : 1, 46 : 1 } )
+                                        {
+                                                var sel = editor.getSelection(),
+                                                range = sel.getRanges()[ 0 ];
+
+                                                if ( !range.collapsed )
+                                                        return;
+
+                                                var isBackspace = key == 8;
+                                                var body = editor.document.getBody();
+                                                var walker = new CKEDITOR.dom.walker( range.clone() );
+                                                walker.evaluator = function( node ) { return nonEmpty( node ) && !blockBogus( node ); };
+
+                                                var cursor = range.clone();
+
+                                                if ( isBackspace )
+                                                {
+                                                        walker.range.setStartAt( body, CKEDITOR.POSITION_AFTER_START );
+                                                        walker.range.setEnd( range.startContainer, range.startOffset );
+
+                                                        var previous = walker.previous();
+
+                                                        // Check if cursor collapsed right behind of a list.
+                                                        if ( previous &&
+                                                                 previous.type == CKEDITOR.NODE_ELEMENT &&
+                                                                 previous.getName() in listNodeNames )
+                                                        {
+                                                                walker.range.selectNodeContents( previous );
+                                                                walker.reset();
+                                                                walker.evaluator = isTextBlock;
+
+                                                                // Place cursor at the end of previous block.
+                                                                cursor.moveToElementEditEnd( walker.lastForward() );
+                                                                joinNextLineToCursor( editor, cursor, range );
+                                                                evt.cancel();
+                                                        }
+                                                }
+                                                else
+                                                {
+                                                        var li = range.startContainer.getAscendant( 'li', 1 );
+                                                        if ( li )
+                                                        {
+                                                                walker.range.setEndAt( body, CKEDITOR.POSITION_BEFORE_END );
+
+                                                                var last = li.getLast( nonEmpty );
+                                                                var block = last && isTextBlock( last ) ? last : li;
+
+                                                                // Indicate cursor at the visual end of an list item.
+                                                                var isAtEnd = 0;
+
+                                                                var next = walker.next();
+
+                                                                // When list item contains a sub list.
+                                                                if ( next && next.type == CKEDITOR.NODE_ELEMENT &&
+                                                                         next.getName() in listNodeNames
+                                                                         && next.equals( last ) )
+                                                                {
+                                                                        isAtEnd = 1;
+
+                                                                        // Move to the first item in sub list.
+                                                                        next = walker.next();
+                                                                }
+                                                                // Right at the end of list item.
+                                                                else if ( range.checkBoundaryOfElement( block, CKEDITOR.END ) )
+                                                                        isAtEnd = 1;
+
+
+                                                                if ( isAtEnd && next )
+                                                                {
+                                                                        // Put cursor range there.
+                                                                        var nextLine = range.clone();
+                                                                        nextLine.moveToElementEditStart( next );
+
+                                                                        joinNextLineToCursor( editor, cursor, nextLine );
+                                                                        evt.cancel();
+                                                                }
+                                                        }
+                                                }
+                                        }
+                                } );
+                        }
                 },