Changeset 1335 for trunk/modules/Gecko

Timestamp:

02/03/18 07:37:27 (23 months ago)

Author:

gogo

Message:

#1226 - Gecko problems with paraHandlerBest

I actually checked the existing paraHandlerBest in FF 58 to see if I could reproduce the problem still and I couldn't so maybe FF fixed it anyway in the 7 years since it was first reported.

But despite that I'm committing the paraHandlerBest.js contributed by ejucovy and douglas, since it seems to work just as well and they probably actually use Firefox, so, yeah.

File:

• trunk/modules/Gecko/paraHandlerBest.js (modified) (12 diffs)

trunk/modules/Gecko/paraHandlerBest.js

@@ -30 +30 @@
 // "constants"
 
+// Set up the node type constants for browsers that don't support them.
+var ELEMENT_NODE = ELEMENT_NODE || 1;
+var ATTRIBUTE_NODE = ATTRIBUTE_NODE || 2;
+var TEXT_NODE = TEXT_NODE || 3;
+var COMMENT_NODE = COMMENT_NODE || 8;
+var DOCUMENT_NODE = DOCUMENT_NODE || 9;
 /**
 * Whitespace Regex
@@ -47 +53 @@
 
 EnterParagraphs.prototype._pContainers = /^(body|del|div|fieldset|form|ins|map|noscript|object|td|th)$/i;
+EnterParagraphs.prototype._pWrapper = /^(body|d[ltd]|table|[uo]l|div|p|h[1-6]|li|t[hrd]|del|fieldset|ins|form|map|noscript|object|address|blockquote|pre)$/i;
 
 /**
@@ -67 +74 @@
 
 /**
-* Elements which should get a new P, before or after, when enter is pressed at either end
+* When the cursor is at the inside edge of one of these elements, we will move the cursor just outside the element, and insert a P element there.
 */
 
@@ -74 +81 @@
 
 /**
-* Elements which should get a new P, before or after a close parent, when enter is pressed at either end
+* When the cursor is at the inside edge of one of these elements, and this element's outside edge is just at the inside edge of its immediate parent,
+* we will move the cursor to the outside edge of the immediate parent, and insert a P element there.
 */
 
@@ -430 +438 @@
 {
   
-  var next = function(element, search_direction)
-        {
+  var next = function(element, search_direction) {
     return ( search_direction == "left" ? element.previousSibling : element.nextSibling );
-        };
+  };
   
   var node = search_direction == "left" ? rng.startContainer : rng.endContainer;
@@ -442 +449 @@
   // be on the exclusion list and we wouldn't know until it was too late
   
-  while ( start.nodeType == 1 && !this._permEmpty.test(start.nodeName) )
-  {
+  while ( start.nodeType == 1 && !this._permEmpty.test(start.nodeName) ) {
     start = ( offset ? start.lastChild : start.firstChild );
   }
@@ -458 +464 @@
   // sometimes this loop finds a blank text node, sometimes it doesn't.
   
-  while ( roam = roam ? ( next(roam,search_direction) ? next(roam,search_direction) : roam.parentNode ) : start )
-  {
-    
+  roam = roam ? ( next(roam,search_direction) ? next(roam,search_direction) : roam.parentNode ) : start;
+  while (roam) {
+
     // next() is an inline function defined above that returns the next node depending
     // on the direction we're searching.
-    
-    if ( next(roam,search_direction) )
-    {
-      
+
+    if ( next(roam,search_direction) ) {
+
       // If the next sibling's on the exclusion list, stop before it
-      
-      if ( this._pExclusions.test(next(roam,search_direction).nodeName) )
-      {
-        
+
+      if ( this._pExclusions.test(next(roam,search_direction).nodeName) ) {
+
         return this.processRng(rng, search_direction, roam, next(roam,search_direction), (search_direction == "left"?'AfterEnd':'BeforeBegin'), true, false);
       }
-    }
-    else
-    {
-      
+    } else {
+
       // If our parent's on the container list, stop inside it
-      
-      if (this._pContainers.test(roam.parentNode.nodeName))
-      {
-        
+
+      if (this._pContainers.test(roam.parentNode.nodeName)) {
+
         return this.processRng(rng, search_direction, roam, roam.parentNode, (search_direction == "left"?'AfterBegin':'BeforeEnd'), true, false);
-      }
-      else if (this._pExclusions.test(roam.parentNode.nodeName))
-      {
-        
+      } else if (this._pExclusions.test(roam.parentNode.nodeName)) {
+
         // chop without wrapping
-        
-        if (this._pBreak.test(roam.parentNode.nodeName))
-        {
-          
+
+        if (this._pBreak.test(roam.parentNode.nodeName)) {
+
           return this.processRng(rng, search_direction, roam, roam.parentNode,
             (search_direction == "left"?'AfterBegin':'BeforeEnd'), false, (search_direction == "left" ?true:false));
-        }
-        else
-        {
-          
+        } else {
+
           // the next(roam,search_direction) in this call is redundant since we know it's false
           // because of the "if next(roam,search_direction)" above.
@@ -504 +500 @@
           // the final false prevents this range from being wrapped in <p>'s most likely
           // because it's already wrapped.
-          
+
           return this.processRng(rng,
             search_direction,
@@ -515 +511 @@
       }
     }
+    roam = roam ? ( next(roam,search_direction) ? next(roam,search_direction) : roam.parentNode ) : start;
   }
   
@@ -781 +778 @@
   if (ev.keyCode == 13 && !ev.shiftKey && this.editor._iframe.contentWindow.getSelection)
   {
-    return this.handleEnter(ev);
+    return this.breakLine(ev, this.editor._doc);
   }
   
@@ -789 +786 @@
 
 /**
+* Helper function to find the index of the given node with its parent's
+* childNodes array.  If there is any problem with the lookup, we'll return
+* NULL.
+*/
+
+EnterParagraphs.prototype.indexInParent = function (el)
+{
+  if (!el.parentNode || !el.parentNode.childNodes)
+  {
+    // The element is at the root of the tree, or it's a broken node.
+    return null;
+  }
+
+  for (var index=0; index<el.parentNode.childNodes.length; ++index)
+  {
+    if (el == el.parentNode.childNodes[index])
+    {
+      return index;
+    }
+  }
+
+  // This will only happen if the DOM node is broken...
+  return null;
+}
+
+/*
+* Determine if a cursor points to the end of it's containing node.
+*/
+EnterParagraphs.prototype.cursorAtEnd = function (cursorNode, cursorOffset)
+{
+  if (cursorNode.nodeType == TEXT_NODE)
+  {
+    if (cursorOffset == cursorNode.nodeValue.length)
+    {
+      return true;
+    }
+    // We're in the middle of a text node.  If the node is a whitespace node,
+    // we'll ignore it and treat it as if the cursor were after the node, and
+    // not in it.
+    if (/\S/.test(cursorNode.nodeValue))
+    {
+      return false;
+    }
+    cursorOffset = this.indexInParent(cursorNode) + 1;
+    cursorNode = cursorNode.parentNode;
+    
+    // We need to make sure we there wasn't an error in indexInParent
+    if (cursorOffset === null)
+    {
+      return false;
+    }
+  }
+  // The easy case, it's after the last node...
+  if (cursorOffset == cursorNode.childNodes.length)
+  {
+    return true;
+  }
+  // At this point, if the pointed to node is a whitespace node, and all of
+  // it's nextSiblings are also whitespace node, then the cursor is at the end
+  // of the node.
+  for (var node = cursorNode.childNodes[cursorOffset]; node; node = node.nextSibling)
+  {
+    if ((node.nodeType != TEXT_NODE) || (/\S/.test(node.nodeValue)))
+    {
+      return false;
+    }
+  }
+  return true;
+}
+/*
+* Test suite for this, because it's really tough to get right.
+*/
+EnterParagraphs.RunTests = function(xinha, debug)
+{
+  var test = function(message, before, cursorBefore, after, cursorAfter, cursorAfter2) {
+    console.group('Test: ', message);
+    if (before !== null) {
+      xinha.setHTML(before);
+    }
+    // Do something
+    var cAnchor, cOffset;
+
+    var mockEvent = {
+      preventDefault: function() {if (debug) console.log("Preventing default.");},
+      stopPropagation: function() {if (debug) console.log("Stopping propagation.");},
+    }
+    function setCursor(commands) {
+      cAnchor = xinha._doc.body;
+      cOffset = 0;
+      try {
+        for (var index=0; index<commands.length; ++index) {
+          var command = commands[index];
+          if ('id' == command[0]) {
+              cAnchor = xinha._doc.getElementById(command[1]);
+          } else if ('firsttag' == command[0]) {
+              cAnchor = xinha._doc.getElementsByTagName(command[1])[0];
+          } else if ('child' == command[0]) {
+              cAnchor = cAnchor.childNodes[command[1]];
+          } else if ('next' == command[0]) {
+            for (var next=command[1]; next > 0 && cAnchor.nextSibling; --next) {
+              cAnchor = cAnchor.nextSibling;
+            }
+          } else if ('previous' == command[0]) {
+            for (var previous=command[1]; previous > 0 && cAnchor.previousSibling; --previous) {
+              cAnchor = cAnchor.previousSibling;
+            }
+          } else if ('offset' == command[0]) {
+            if (command[1] == 'length') {
+              if (TEXT_NODE == cAnchor.nodeType) {
+                cOffset = cAnchor.nodeValue.length;
+              } else {
+                cOffset = cAnchor.childNodes.length;
+              }
+            } else if (command[1] < 0) {
+              if (TEXT_NODE == cAnchor.nodeType) {
+                cOffset = cAnchor.nodeValue.length + command[1];
+              } else {
+                cOffset = cAnchor.childNodes.length + command[1];
+              }
+            } else {
+              cOffset = command[1];
+            }
+          }
+        }
+      } catch(e) {
+        cAnchor = null;
+        cOffset = null;
+      }
+    }
+
+    setCursor(cursorBefore);
+
+    var selection = xinha.getSelection();
+    var range = xinha.createRange(selection);
+
+    range.setStart(cAnchor, cOffset);
+    range.setEnd(cAnchor, cOffset);
+    selection.removeAllRanges();
+    selection.addRange(range);
+
+    // Breakline
+    try {
+      xinha.plugins['EnterParagraphs'].instance.breakLine(mockEvent, xinha._doc);
+    } catch (e) {
+      console.error('Breakline threw exception ', e);
+      console.groupEnd();
+      return;
+    }
+
+    var selection = xinha.getSelection();
+    var range = xinha.createRange(selection);
+
+    setCursor(cursorAfter);
+
+    if ((selection.anchorNode != cAnchor) || (selection.anchorOffset != cOffset)) {
+      // Sometimes there are multiple equivalent selection, let's see if we received alternatives.
+      if (typeof cursorAfter2 != 'undefined') {
+        setCursor(cursorAfter2);
+        if ((selection.anchorNode != cAnchor) || (selection.anchorOffset != cOffset)) {
+          console.error('Actual anchor: ' + selection.anchorNode +
+                       '\nActual offset: ' + selection.anchorOffset +
+                       '\nExpected anchor: ' + cAnchor +
+                       '\nExpected offset: ' + cOffset);
+        }
+      } else {
+        console.error('Actual anchor: ' + selection.anchorNode +
+                     '\nActual offset: ' + selection.anchorOffset +
+                     '\nExpected anchor: ' + cAnchor +
+                     '\nExpected offset: ' + cOffset);
+      }
+    }
+
+    result = xinha.getInnerHTML();
+    if (result.trim() == after.trim()) {
+      console.info('Success!');
+    } else {
+      console.error('Was: \n`' + before +
+                   '`\nExpected: \n`' + after +
+                   '`\nGot: \n`' + result + '`');
+    }
+    console.groupEnd();
+  }
+  contentBackup = xinha.getInnerHTML();
+xinha.setHTML("");
+  console.group('Running tests:');
+  /*
+     The initial content on browser load seems to be:
+     <body><br />\n</body>
+     That's a break tag and a whitespace text node containing a newline character.
+    */
+  test('Initial Xinha Content',
+       null, [],
+       '<p>&nbsp;</p><p><br></p>\n', [['child', 1]]);  // Mozilla kicks off a trailing newline.  Do I care about this?
+  test('Initial Xinha Content: Recreated',
+       '<br>\n', [],
+       '<p>&nbsp;</p><p><br></p>\n', [['child', 1]]);  // Mozilla kicks off a trailing newline.  Do I care about this?
+
+  test('Empty Body',
+       '', [],
+       '<p>&nbsp;</p><p><br></p>', [['child', 1]],
+                                   [['child', 1], ['child', 0]]);
+
+  test('Text node in body: text node',
+       'Hi', [], // Point to text node
+       '<p>&nbsp;</p><p>Hi</p>', [['child', 1]],
+                                 [['child', 1], ['child', 0]]);
+  test('Text node in body: first char',
+       'Hi', [['child', 0]], // Point to 'H'
+       '<p>&nbsp;</p><p>Hi</p>', [['child', 1]],
+                                 [['child', 1], ['child', 0]]);
+  test('Text node in body: split text',
+       'Hi', [['child', 0], ['offset', 1]], // Point to 'i'
+       '<p>H</p><p>i</p>', [['child', 1]],
+                           [['child', 1], ['child', 0]]);
+  test('Text node in body: after text',
+       'Hi', [['child', 0], ['offset', 'length']], // Point after 'i'
+       '<p>Hi</p><p>&nbsp;</p>', [['child', 1]],
+                                 [['child', 1], ['child', 0]]);
+  test('Text node in body: after text node',
+       'Hi', [['offset', 'length']], // Point after text node
+       'Hi<p>&nbsp;</p>', [['child', 1]],  // This is not ideal output, but the line breaker never sees the text node and
+                          [['child', 1], ['child', 0]]); // so can't do anything about it.
+
+  // For the next two tests, Douglas thinks the ideal output would be (either of):
+  //     [['child', 1], ['child', 0]],
+  //     [['child', 1], ['child', 0], ['child', 0]]);
+  // That is, with the cursor inside the <em> node.
+  // I (ejucovy) think that the output [['child', 1]], inside the second <p>
+  // but outside the <em>, is better.  It's also what we're actually getting back
+  // from the browser, so let's go with that and leave this here for posterity..
+  test('Body with inline tag: em node',
+       '<em>hi</em>', [], // Point to document body
+       '<p>&nbsp;</p><p><em>hi</em></p>', [['child', 1]]);
+  test('Body with inline em: inside em node',
+       '<em>hi</em>', [['child', 0]], // Point to beginning of em node (before h)
+       '<p>&nbsp;</p><p><em>hi</em></p>', [['child', 1]]);
+
+  test('Body with inline tag: text node',
+       '<em>hi</em>', [['child', 0]],
+       '<p>&nbsp;</p><p><em>hi</em></p>', [['child', 1], ['child', 0]],
+                                          [['child', 1], ['child', 0], ['child', 0]]);
+  test('Body with inline tag: first char',
+       '<em>hi</em>', [['child', 0], ['child', 0]],
+       '<p>&nbsp;</p><p><em>hi</em></p>', [['child', 1], ['child', 0]],
+                                          [['child', 1], ['child', 0], ['child', 0]]);
+  test('Body with inline tag: split text',
+       '<em>hi</em>', [['child', 0], ['child', 0], ['offset', 1]],
+       '<p><em>h</em></p><p><em>i</em></p>', [['child', 1], ['child', 0]],
+                                             [['child', 1], ['child', 0], ['child', 0]]);
+  test('Body with inline tag: after text',
+       '<em>hi</em>', [['child', 0], ['child', 0], ['offset', 'length']],
+       '<p><em>hi</em></p><p>&nbsp;</p>', [['child', 1], ['child', 0]],
+                                          [['child', 1], ['child', 0], ['child', 0]]);
+  // I hate that this is expected behavior, but the split code doesn't see the em tag in these two cases.
+  test('Body with inline tag: after text node',
+       '<em>hi</em>', [['child', 0], ['offset', 'length']],
+       '<em>hi</em><p>&nbsp;</p>', [['child', 1], ['child', 0]],
+                                          [['child', 1], ['child', 0], ['child', 0]]);
+  test('Body with inline tag: after em node',
+       '<em>hi</em>', [['offset', 'length']],
+       '<em>hi</em><p>&nbsp;</p>', [['child', 1], ['child', 0]],
+                                          [['child', 1], ['child', 0], ['child', 0]]);
+
+  /***************  Repeat the header block for each header level once the tests are passing *********************/
+  test('Split header 1: h1 node',
+       '<h1>hi</h1>', [],
+       '<p>&nbsp;</p><h1>hi</h1>', [['child', 1]],
+                                   [['child', 1], ['child', 0]]);
+  test('Split header 1: text node',
+       '<h1>hi</h1>', [['child', 0]],
+       '<p>&nbsp;</p><h1>hi</h1>', [['child', 1]],
+                                   [['child', 1], ['child', 0]]);
+  test('Split header 1: first char',
+       '<h1>hi</h1>', [['child', 0], ['child', 0]],
+       '<p>&nbsp;</p><h1>hi</h1>', [['child', 1]],
+                                   [['child', 1], ['child', 0]]);
+  test('Split header 1: split text',
+       '<h1>hi</h1>', [['child', 0], ['child', 0], ['offset', 1]],
+       '<h1>h</h1><h1>i</h1>', [['child', 1]],
+                               [['child', 1], ['child', 0]]);
+  test('Split header 1: after text',
+       '<h1>hi</h1>', [['child', 0], ['child', 0], ['offset', 'length']],
+       '<h1>hi</h1><p>&nbsp;</p>', [['child', 1]],
+                                   [['child', 1], ['child', 0]]);
+  test('Split header 1: after text node',
+       '<h1>hi</h1>', [['child', 0], ['offset', 'length']],
+       '<h1>hi</h1><p>&nbsp;</p>', [['child', 1]],
+                                   [['child', 1], ['child', 0]]);
+  test('Split header 1: after h1 node',
+       '<h1>hi</h1>', [['offset', 'length']],
+       '<h1>hi</h1><p>&nbsp;</p>', [['child', 1]],
+                                   [['child', 1], ['child', 0]]);
+
+  console.groupEnd();
+  xinha.setHTML(contentBackup);
+  // EnterParagraphs.RunTests(xinha_editors['myTextArea'])
+}
+/*
+* Determine if a cursor points to the end of it's containing node.
+*/
+EnterParagraphs.prototype.cursorAtBeginning = function (cursorNode, cursorOffset)
+{
+  if (cursorOffset == 0)
+  {
+    return true;
+  }
+  if (cursorNode.nodeType == TEXT_NODE)
+  {
+    // We're in the middle of a text node.  If the node is a whitespace node,
+    // we'll ignore it and treat it as if the cursor were at the beginning of
+    // the node, and not in it.
+    if (/\S/.test(cursorNode.nodeValue))
+    {
+      return false;
+    }
+    cursorOffset = this.indexInParent(cursorNode);
+    cursorNode = cursorNode.parentNode;
+    
+    // We need to make sure we there wasn't an error in indexInParent
+    if (cursorOffset === null)
+    {
+      return false;
+    }
+
+    // We have to check the new offset for the easy case.
+    if (cursorOffset == 0)
+    {
+      return true;
+    }
+  }
+  // At this point, if all of the nodes before the cursor are white space
+  // nodes, then the cursor is at the beginning of the node.
+  for (var node = cursorNode.childNodes[cursorOffset-1]; node; node = node.previousSibling)
+  {
+    if ((node.nodeType != TEXT_NODE) || (/\S/.test(node.nodeValue)))
+    {
+      return false;
+    }
+  }
+  return true;
+}
+/**
 * Handles the pressing of an unshifted enter for Gecko
 */
+
+EnterParagraphs.prototype.breakLine = function(ev, doc)
+{
+  // Helper function that copies a DOM element and its attributes (except the
+  // id) without any of the contents.
+  var safeShallowCopy = function(node, doc)
+  {
+    var copy = doc.createElement(node.nodeName);
+    for (var index=0; index < node.attributes.length; ++index)
+    {
+      var attr = node.attributes[index];
+      if ('id' != attr.name.toLowerCase())
+      {
+        copy.setAttribute(attr.name, attr.value);
+      }
+    }
+    return copy;
+  }
+
+  // Helper function that will get the node immediately following the current
+  // node, but without descending into children nodes.  When looking at the
+  // markup of the document, this means that if a node to the right of this
+  // node in the text is at a lower depth in the DOM tree, than we will return
+  // it's first parent that is at our depth our higher in the tree.
+  var nextRootNode = function(node)
+  {
+    if (node.nextSibling)
+    {
+      return node.nextSibling;
+    }
+    for (var nextRoot = node.parentNode;nextRoot;nextRoot = nextRoot.parentNode)
+    {
+      if (nextRoot.nextSibling)
+      {
+        return nextRoot.nextSibling;
+      }
+    }
+  }
+
+  // A cursor is specified by a node and an offset, so we will split at that
+  // location.  It should be noted that if splitNode is a text node,
+  // splitOffset is an offset into the text contents.  If not, it is an index
+  // into the childNodes array.
+  var splitTree = function(root, splitNode, splitOffset, doc)
+  {
+    // Split root into two.
+    var breaker = safeShallowCopy(root, doc);
+    if (root.nextSibling)
+    {
+      breaker = root.parentNode.insertBefore(breaker,root.nextSibling);
+    }
+    else
+    {
+      breaker = root.parentNode.appendChild(breaker);
+    }
+
+    var insertNode = breaker;
+    // XXX TODO don't use a closure to access this, pass it in...
+    for (;recreateStack.length>0;)
+    {
+      var stackEl = safeShallowCopy(recreateStack.pop(), doc)
+      insertNode.appendChild(stackEl);
+      // Move content here
+      insertNode = stackEl;
+    }
+
+    // We need to keep track of the new cursor location.  When our cursor is in
+    // the middle of a text node, the new cursor will be at the beginning of
+    // the text node we create to contain the text to the right of the cursor.
+    // Otherwise, the cursor will point to a node, and the new cursor needs to
+    // point to that node in it's new location.
+    var newCursorNode = null;
+
+    var sourceNode = splitNode;
+    var sourceOffset = splitOffset;
+    if (TEXT_NODE == sourceNode.nodeType)
+    {
+      var textNode = doc.createTextNode(sourceNode.nodeValue.substring(splitOffset,sourceNode.nodeValue.length));
+      newCursorNode = textNode = insertNode.appendChild(textNode);
+      sourceNode.nodeValue = sourceNode.nodeValue.substring(0,splitOffset);
+    }
+
+    // When splitting a tree, we need to take any nodes that are after the
+    // split and move them into their location in the new tree.  We can have
+    // siblings at each level of the tree, so we need to walk from the inside
+    // of the source outwards, and move the offending nodes to the equivalent
+    // position on the newly duplicated tree.
+
+    // Move insertNode from the inside outwards towards the root, moving any
+    // content nodes as we go.  We'll make sure that we can do the same with
+    // sourceNode
+    while (insertNode != root.parentNode)
+    {
+      for (var moveNode=sourceNode.childNodes[sourceOffset];moveNode;)
+      {
+        // We have to take a reference to the next sibling before cutting out
+        // of the tree, or we will lose our place.
+
+        // nextNode can potentially be null.  This is not a problem.
+        var nextNode = moveNode.nextSibling;
+        var cutNode = moveNode.parentNode.removeChild(moveNode);
+        insertNode.appendChild(cutNode);
+        moveNode = nextNode;
+      }
+
+      // Move both of our node pointers one step closer to the root node.
+      sourceOffset = EnterParagraphs.prototype.indexInParent(sourceNode);
+      sourceNode = sourceNode.parentNode;
+      insertNode = insertNode.parentNode;
+    }
+
+    // Below code needs to check for element node with empty text node.
+    // An empty node is an text node of zero length or an element node with no
+    // children, or whose only children are zero-length text nodes.
+    var emptyNode = function(node)
+    {
+      if ((TEXT_NODE == node.nodeType) && (0 == node.nodeValue.length))
+      {
+        // Text nodes are empty if there is no text.
+        return true;
+      }
+
+      if (ELEMENT_NODE == node.nodeType)
+      {
+        for (var child = node.firstChild; child; child = child.nextSibling)
+        {
+          if ((ELEMENT_NODE == child.nodeType) || (0 != child.nodeValue.length))
+          {
+            // If there are any element children, or text nodes with text in
+            // them, this node is not empty.
+            return false;
+          }
+        }
+
+        // node has no childNodes that are elements and no childNodes that are
+        // text nodes with text in them.
+        return true;
+      }
+
+      return false;
+    }
+
+    var stuffEmptyNode = function(node, doc)
+    {
+      if (!emptyNode(node))
+      {
+        return;
+      }
+
+      if (TEXT_NODE == node.nodeType)
+      {
+        // Unicode equivalent of non breaking whitespace.
+        node.nodeValue = '\u00a0';
+      }
+      else if (0 == node.childNodes.length)
+      {
+        // Unicode equivalent of non breaking whitespace.
+        node.appendChild(doc.createTextNode('\u00a0'));
+      }
+      else
+      {
+        // Unicode equivalent of non breaking whitespace. The node is empty,
+        // but it has child nodes, so firstChild is guaranteed to be an empty
+        // text node.
+        node.firstChild.nodeValue = '\u00a0';
+      }
+    }
+
+    // If the cursor node wasn't created by the split (it was moved), then that
+    // means we need to point to the inside of our brand new tree.
+    if (!newCursorNode)
+    {
+      newCursorNode = breaker.childNodes[0];
+    }
+
+    // Make sure when we split the tree that we don't leave any empty nodes, as
+    // that would have visual glitches.
+    stuffEmptyNode(splitNode, doc);
+    stuffEmptyNode(newCursorNode, doc);
+
+    // So that we can correctly set the selection, we'll return a reference to
+    // the inserted subtree.
+    return newCursorNode;
+  }
+  var insertLineBreak = function(cursorParent, cursorOffset, useNewline, doc)
+  {
+    if (TEXT_NODE == cursorParent.nodeType)
+    {
+      // The cursor points inside of a text node, we insert the newline
+      // directly into the text.
+      var splitNode = cursorParent;
+      var splitOffset = cursorOffset;
+      if (useNewline)
+      {
+        splitNode.nodeValue = splitNode.nodeValue.substring(0,splitOffset) + '\n' + splitNode.nodeValue.substring(splitOffset,splitNode.nodeValue.length);
+      }
+      else
+      {
+        var newTextNode = doc.createTextNode(splitNode.nodeValue.substring(splitOffset,splitNode.nodeValue.length));
+        var newBreakNode = doc.createElement('br');
+        splitNode.nodeValue = splitNode.nodeValue.substring(0,splitOffset);
+
+        var appendIndex = EnterParagraphs.prototype.indexInParent(cursorParent);
+        if (appendIndex == cursorParent.parentNode.length-1)
+        {
+          newBreakNode = cursorParent.appendChild(newBreakNode);
+          newTextNode = cursorParent.appendChild(newTextNode);
+        }
+        else
+        {
+          newTextNode = cursorParent.insertBefore(newTextNode, cursorParent.parentNode.childNodes[appendIndex+1]);
+          newBreakNode = cursorParent.insertBefore(newBreakNode, newTextNode);
+        }
+        return newBreakNode;
+      }
+    }
+    else if (0 == cursorParent.childNodes.length)
+    {
+      // The cursor is inside an empty element or document node, so we insert a txt node or break element as necessary.
+      if (useNewline)
+      {
+        var breakingNode = doc.createTextNode('\n');
+        cursorParent.appendChild(breakingNode);
+      }
+      else
+      {
+        var breakingNode = doc.createElement('br');
+        return cursorParent.appendChild(breakingNode);
+      }
+    }
+    else if ((cursorOffset == cursorParent.childNodes.length) && (TEXT_NODE == cursorParent.childNodes[cursorOffset-1].nodeType))
+    {
+      // The cursor is at the after the last node, and the previous node is a
+      // text node where we can insert the newline.
+      if (useNewline)
+      {
+        var lastTextNode = cursorParent.childNodes[cursorOffset-1];
+        lastTextNode.nodeValue = lastTextNode.nodeValue + '\n';
+      }
+      else
+      {
+        var breakingNode = doc.createElement('br');
+        return cursorParent.appendChild(breakingNode);
+      }
+    }
+    else if (cursorOffset == cursorParent.childNodes.length)
+    {
+      // The cursor is at the after the last node, and the previous node is an
+      // not text, so we must insert a text node.
+      if (useNewline)
+      {
+        var breakingNode = doc.createTextNode('\n');
+        cursorParent.appendChild(breakingNode);
+      }
+      else
+      {
+        var breakingNode = doc.createElement('br');
+        return cursorParent.appendChild(breakingNode);
+      }
+    }
+    else if (TEXT_NODE == cursorParent.childNodes[cursorOffset].nodeType)
+    {
+      // The cursor points to a text node, insert our newline there.
+      if (useNewline)
+      {
+        var splitNode = cursorParent.childNodes[cursorOffset];
+        splitNode.nodeValue = '\n' + splitNode.nodeValue;
+      }
+      else
+      {
+        var breakingNode = doc.createElement('br');
+        return cursorParent.insertBefore(breakingNode, cursorParent[cursorOffset]);
+      }
+    }
+    else if (TEXT_NODE == cursorParent.childNodes[cursorOffset-1].nodeType)
+    {
+      // The cursor points to an non-text node, but there is a text node just
+      // before where we can insert a newline.
+      if (useNewline)
+      {
+        var splitNode = cursorParent.childNodes[cursorOffset-1];
+        splitNode.nodeValue = splitNode.nodeValue + '\n';
+      }
+      else
+      {
+        var breakingNode = doc.createElement('br');
+        return cursorParent.insertBefore(breakingNode, cursorParent[cursorOffset]);
+      }
+    }
+    else
+    {
+      // The cursor points between two non-text nodes, so we must insert a text
+      // node.
+      if (useNewline)
+      {
+        var breakingNode = doc.createTextNode('\n');
+        cursorParent.insertBefore(breakingNode, cursorParent.childNodes[cursorOffset]);
+      }
+      else
+      {
+        var breakingNode = doc.createElement('br');
+        return cursorParent.insertBefore(breakingNode, cursorParent.childNodes[cursorOffset]);
+      }
+    }
+  }
+
+  /* ***********************************************************************
+                                 CODE
+     *********************************************************************** */
+  // In the case of the user pressing enter, we have to break the line somehow.
+  // If there is anything already selected, we interpret that the user wishes
+  // for the content to be deleted.
+  
+  var selection = this.editor.getSelection();
+  var range = this.editor.createRange(selection);
+  
+  selection.collapseToStart();
+  range.deleteContents();
+
+  // We do some magic manipulation to help with user intent.
+  this.moveCursorOnEdge(selection);
+
+  // Take a reference to the cursor.
+  var cursorParent = selection.anchorNode;
+  var cursorOffset = selection.anchorOffset;
+
+  // Now that we have an empty selection, the process of breaking the line is a
+  // bit simpler.  Our strategy for breaking the line is as follows:
+
+  // We will modify the cursor position in an attempt to guess the user's
+  // intent.  When the cursor is at the inside edge of certain elements, we
+  // work under the assumption that the user wished to select just outside of
+  // that element. As such, we will move the cursor to just outside the
+  // element, and then continue.
+
+  // Next, we find the first non-inline element that contains our cursor.
+  // These can be broken into four types:
+  // 1) Definition lists and their elements (dl, dt, dd)
+  // 2) Other lists (ul, ol)
+  // 3) Other containers (body, div, tr, pre, etc.)
+  // 4) Other block elements (p, h3, li, th, td, etc.)
+  //
+  // If we are inside a definition (1) list, we try to guess the users intent
+  //   as to whether they want to insert* a new term or a new definition.
+  // If we are inside any other list (2) element, we will insert* an li element.
+  // If we are in any other container (3), we will insert* a p element.
+  // If we are in any other block (4) element, we split the block into two
+  //   pieces and move* anything after the cursor to the second block.
+  //
+  // *When inserting or moving content, we must be sure to look at any
+  // inline elements that wrap the cursor, properly close them off, and create
+  // the same group of wrapping inline elements in the inserted/moved
+  // element. This logic is incorporated into splitTree.
+
+  // Find the first wrapping non-inline element. (1-5 above)
+  if (ELEMENT_NODE == cursorParent.nodeType)
+  {
+      // When the cursor is on an element node, it's before that element in the
+      // document, and so we only want to consider its parent for deciding what
+      // to do. The same is true when the cursor points to just before a text
+      // node, so we only need to check the cursorParent.
+      var wrapNode = cursorParent;
+  }
+  else if (TEXT_NODE == cursorParent.nodeType)
+  {
+      // Since we know that a text node is not the wrapper, we'll start with
+      // its parent.
+      var wrapNode = cursorParent.parentNode;
+  }
+  else
+  {
+      // We are dealing with an XML document.  This should be expanded to
+      // handle these cases.
+      // http://www.w3schools.com/Dom/dom_nodetype.asp
+      alert('You have selected a node from an XML document, type ' +
+            cursorParent.nodeType + '.\nXML documents are not ' +
+            'yet supported.');
+      // Let the browser deal with it.
+      return true;
+  }
+
+  // This is an array used as a stack for recreating the current 'state' of
+  // the cursor.  (eg. If the cursor is inside of an em tag inside of a p,
+  // we'll add the em to the stack so that we can recreate it while splitting
+  // the p.)
+  var recreateStack = [];
+
+  while (!EnterParagraphs.prototype._pWrapper.test(wrapNode.nodeName))
+  {
+    recreateStack.push(wrapNode);
+    wrapNode = wrapNode.parentNode;
+
+    if (!wrapNode)
+    {
+      // Broken DOM, let the browser handle it.
+      return true;
+    }
+  }
+
+  if (wrapNode.nodeName.toLowerCase() in {pre:''})
+  {
+    insertLineBreak(cursorParent, cursorOffset, true, doc);
+    this.editor.updateToolbar();
+    
+    Xinha._stopEvent(ev);
+    
+    range.setStart(cursorParent, cursorOffset+1);
+    range.setEnd(cursorParent, cursorOffset+1);
+    selection.removeAllRanges();
+    selection.addRange(range);
+    return false;
+  }
+  else if (wrapNode.nodeName.toLowerCase() in {body:'',div:'',fieldset:'',form:'',map:'',noscript:'','object':'',blockquote:''})
+  {
+    // We know that the there are no block elements between the cursor and the
+    // wrapNode, but there may be inline elements.  What we'll do is take
+    // everything in the tree below wrapNode, embed it into a P element, and
+    // then split the whole thing.
+
+    // The cursor might be at the ending edge of the wrapNode.
+    // 0. Pointing inside a completely empty element <body></body>
+    // 1. Pointing to a text node <body>^This is text</body>
+    // 2. Pointing to an inline node that is the child of the wrapNode.<body>^<em>text</em></body>
+    // 3. Pointing to an inline node that is a non-direct descendant of the wrapNode.<body><q>^<em>text</em></q></body>
+    // 4. Pointing to an inline node that is a non-direct descendant of the wrapNode.<body><q><em>text</em> this^</q></body>
+    // 5. Pointing to the end of the wrapNode.<body>Here is some text.^</body>
+    // 6. Pointing to a block node that is just inside of the wrapNode.<body>^<p>text</p></body>
+
+    // In the special case of a completely empty node, the cursor is still
+    // visible, and the user expects to have two lines after hitting the enter
+    // key.  We'll add two paragraphs to any of these nodes if they are empty.
+    if (!wrapNode.firstChild) {
+      var embedNode1 = doc.createElement('p');
+      var embedNode2 = doc.createElement('p');
+      embedNode1 = wrapNode.appendChild(embedNode1);
+      embedNode2 = wrapNode.appendChild(embedNode2);
+      // The unicode character below is a representation of a non-breaking
+      // space we use to prevent the paragraph from having visual glitches.
+      var emptyTextNode1 = doc.createTextNode('\u00a0');
+      var emptyTextNode2 = doc.createTextNode('\u00a0');
+      emptyTextNode1 = embedNode1.appendChild(emptyTextNode1);
+      emptyTextNode2 = embedNode2.appendChild(emptyTextNode2);
+
+      Xinha._stopEvent(ev);
+
+      range.setStart(emptyTextNode2, 0);
+      range.setEnd(emptyTextNode2, 0);
+      selection.removeAllRanges();
+      selection.addRange(range);
+
+      return false;
+    }
+
+    var startNode = cursorParent;
+    for (;(startNode != wrapNode) && (startNode.parentNode != wrapNode);)
+    {
+      startNode = startNode.parentNode;
+    }
+
+    if (TEXT_NODE == cursorParent.nodeType)
+    {
+      var treeRoot = cursorParent;
+    }
+    else if (cursorOffset == cursorParent.childNodes.length)
+    {
+      var embedNode = doc.createElement('p');
+      embedNode = wrapNode.appendChild(embedNode);
+      // The unicode character below is a representation of a non-breaking
+      // space we use to prevent the paragraph from having visual glitches.
+      var emptyTextNode = doc.createTextNode('\u00a0');
+      emptyTextNode = embedNode.appendChild(emptyTextNode);
+
+      Xinha._stopEvent(ev);
+
+      range.setStart(emptyTextNode, 0);
+      range.setEnd(emptyTextNode, 0);
+      selection.removeAllRanges();
+      selection.addRange(range);
+
+      return false;
+    }
+    else
+    {
+      var treeRoot = cursorParent.childNodes[cursorOffset];
+    }
+
+    for (;wrapNode != treeRoot.parentNode;)
+    {
+      treeRoot = treeRoot.parentNode;
+    }
+
+    // At this point, treeRoot points to the root of the subtree inside
+    // wrapNode that containes our cursor.  If this happens to be a block level
+    // element, we'll just insert a P node here.  Otherwise, we'll replace this
+    // node with an empty P node, and then embed it into that P node.
+
+    if (EnterParagraphs.prototype._pWrapper.test(treeRoot.nodeName))
+    {
+      var embedNode = doc.createElement('p');
+      embedNode = wrapNode.insertBefore(embedNode, treeRoot);
+      // The unicode character below is a representation of a non-breaking
+      // space we use to prevent the paragraph from having visual glitches.
+      var emptyTextNode = doc.createTextNode('\u00a0');
+      emptyTextNode = embedNode.appendChild(emptyTextNode);
+
+      Xinha._stopEvent(ev);
+
+      range.setStart(treeRoot, 0);
+      range.setEnd(treeRoot, 0);
+      selection.removeAllRanges();
+      selection.addRange(range);
+
+      return false;
+    }
+    var embedNode = doc.createElement('p');
+
+    treeRoot = wrapNode.replaceChild(embedNode, treeRoot);
+
+    treeRoot = embedNode.appendChild(treeRoot);
+    
+    if ((TEXT_NODE == treeRoot.nodeType) && !/\S/.test(treeRoot.nodeValue))
+    {
+      var newCursor = treeRoot;
+    }
+    else if (TEXT_NODE == treeRoot.nodeType)
+    {
+      var newCursor = splitTree(embedNode, treeRoot, cursorOffset, doc);
+    }
+    else
+    {
+      var parentOffset = this.indexInParent(treeRoot);
+      if (null === parentOffset)
+      {
+        // We can't do anything with this cursor, so return.
+        return;
+      }
+      var newCursor = splitTree(embedNode, treeRoot.parentNode, parentOffset, doc);
+    }
+  }
+  else if (wrapNode.nodeName.toLowerCase() in {td:'',address:''})
+  {
+    // Line breaks BR element
+    var newCursor = insertLineBreak(cursorParent, cursorOffset, false, doc);
+  }
+  else if (wrapNode.nodeName.toLowerCase() in {dl:''})
+  {
+    // Find the leftSibling of the cursorParent.  If none, insert dt (term) followed by dd (definition),
+    // otherwise insert same as cursorParent followed by same as leftSibling.
+    // Check to see if the leftSibling and rightSibling are the same and then just insert the one term.
+    // XXX TODO
+  }
+  else if (wrapNode.nodeName.toLowerCase() in {h1:'',h2:'',h3:'',h4:'',h5:'',h6:'',p:''})
+  {
+    // Split wrapNode into two.
+    var newCursor = splitTree(wrapNode, cursorParent, cursorOffset, doc);
+  }
+  else if (wrapNode.nodeName.toLowerCase() in {dt:'',dd:'',li:''})
+  {
+    // To the bane of software developers the world over, users expect to be
+    // able to hit enter twice to end a list, whether at the end or in the
+    // middle.  This means that we need to have special handling for list items
+    // to check for the second return.  We do this by testing to see if the
+    // current list item is empty, and if so, deleting it, splitting the list
+    // into two if necessary, and inserting a paragraph.
+    var newCursor = splitTree(wrapNode, cursorParent, cursorOffset, doc);
+  }
+  else if (wrapNode.nodeName.toLowerCase() in {ol:'',ul:''})
+  {
+    // Insert li
+    var breaker = doc.createElement('li');
+    if (TEXT_NODE == cursorParent.nodeType)
+    {
+      var newCursor = wrapNode.insertBefore(breaker,cursorParent);
+    }
+    else
+    {
+      var newCursor = wrapNode.insertBefore(breaker,cursorParent.childNodes[cursorOffset]);
+    }
+  }
+
+  this.editor.updateToolbar();
+  
+  Xinha._stopEvent(ev);
+  
+  // We turn the newCursor node into a cursor and offset into the parent.
+  var newOffset = 0;
+  while (newCursor.parentNode.childNodes[newOffset] != newCursor)
+  {
+    newOffset++;
+  }
+  newCursor = newCursor.parentNode;
+
+  // Monkey the new cursor position into somewhere the user should actually be
+  // typing.
+  
+  
+  Xinha._stopEvent(ev);
+  range.setStart(newCursor, newOffset);
+  range.setEnd(newCursor, newOffset);
+  selection.removeAllRanges();
+  selection.addRange(range);
+  return false;
+}
+
+/**
+* If the cursor is on the edge of certain elements, we reposition it so that we
+* can break the line in a way that's more useful to the user.
+*/
+
+EnterParagraphs.prototype.moveCursorOnEdge = function(selection)
+{
+  // We'll only move the cursor if the selection is collapsed (ie. no contents)
+  if ((selection.anchorNode != selection.focusNode) ||
+      (selection.anchorOffset != selection.focusOffset))
+  {
+    return;
+  }
+
+  // We now need to filter based on the element we are inside of.  If the
+  // cursor is on a text node, we look at the parent of the node.
+  var wrapNode = selection.anchorNode;
+  if (TEXT_NODE == wrapNode.nodeType)
+  {
+    wrapNode = wrapNode.parentNode;
+  }
+  
+  // Check the wrapper against our lists of trigger nodes.
+  if (!EnterParagraphs.prototype._pifyParent.test(wrapNode.nodeName) &&
+      !EnterParagraphs.prototype._pifySibling.test(wrapNode.nodeName))
+  {
+    // We're lucky, no need to check for edges, let's just return.
+    return;
+  }
+
+  // Okay, time to perform edge checking.  If the cursor is inside of a text
+  // node, the rules for edge detection are quite specialized, so we'll deal
+  // with that first.  Since text nodes can't contain other nodes, we only have
+  // to perform this check once.  We won't actually move the cursor here, just
+  // our copy of it, because we won't know where it belongs until we're dealing
+  // with the nodes themselves, rather than the text.
+
+  var cursorParent = selection.anchorNode;
+  var cursorOffset = selection.anchorOffset;
+
+  for (;this.cursorAtEnd(cursorParent, cursorOffset);)
+  {
+    if (TEXT_NODE == cursorParent.nodeType)
+    {
+      // If we're at the end and stuck inside of a text node, we move out of
+      // the text node, which is a simpler case, than continue.
+      var parentOffset = this.indexInParent(cursorParent);
+      if (null === parentOffset)
+      {
+        // We can't do anything with this cursor, so return.
+        return;
+      }
+
+      cursorParent = cursorParent.parentNode;
+      cursorOffset = parentOffset + 1;
+      continue;
+    }
+
+    var parentOffset = this.indexInParent(cursorParent);
+    if (null === parentOffset)
+    {
+      // We can't do anything with this cursor, so return.
+      return;
+    }
+
+    cursorParent = cursorParent.parentNode;
+    cursorOffset = parentOffset + 1;
+
+    // If we are no longer inside of one of our trigger nodes, we're done.
+    if (!this._pifyParent.test(cursorParent.nodeName) &&
+        !this._pifySibling.test(cursorParent.nodeName))
+    {
+      // Move the real cursor.
+      selection.removeAllRanges();
+      var range = this.editor.createRange(selection);
+      range.setStart(cursorParent, cursorOffset);
+      range.setEnd(cursorParent, cursorOffset);
+      selection.addRange(range);
+      return;
+    }
+  }
+
+  for (;this.cursorAtBeginning(cursorParent, cursorOffset);)
+  {
+    if (TEXT_NODE == cursorParent.nodeType)
+    {
+      // If we're at the beginning and stuck inside of a text node, we move out
+      // of the text node, which is a simpler case, than continue.
+      var parentOffset = this.indexInParent(cursorParent);
+      if (null === parentOffset)
+      {
+        // We can't do anything with this cursor, so return.
+        return;
+      }
+
+      cursorParent = cursorParent.parentNode;
+      cursorOffset = parentOffset;
+      continue;
+    }
+
+    var parentOffset = this.indexInParent(cursorParent);
+    if (null === parentOffset)
+    {
+      // We can't do anything with this cursor, so return.
+      return;
+    }
+
+    cursorParent = cursorParent.parentNode;
+    cursorOffset = parentOffset;
+
+    // If we are no longer inside of one of our trigger nodes, we're done.
+    if (!this._pifyParent.test(cursorParent.nodeName) &&
+        !this._pifySibling.test(cursorParent.nodeName))
+    {
+      // Move the real cursor.
+      selection.removeAllRanges();
+      var range = this.editor.createRange(selection);
+      range.setStart(cursorParent, cursorOffset);
+      range.setEnd(cursorParent, cursorOffset);
+      selection.addRange(range);
+      return;
+    }
+  }
+}
 
 EnterParagraphs.prototype.handleEnter = function(ev)
@@ -807 +1874 @@
   if ( this.isNormalListItem(rng) )
   {
-    
     return true;
   }