handle live update special cases (enter, backspace)

bustle · Aug 31, 2014 · f6b5d9d · f6b5d9d
1 parent 6f0a1de
commit f6b5d9d
Show file tree

Hide file tree

Showing 5 changed files with 64 additions and 14 deletions.
diff --git a/dist/content-kit-editor.js b/dist/content-kit-editor.js
@@ -243,7 +243,7 @@ define("content-kit-utils/node-utils",
     /**
      * Extracts attributes of a `Node` to a hash of key/value pairs
      */
-    function attributesForNode(node /*,blacklist*/) {
+    function attributesForNode(node, blacklist) {
       var attrs = node.attributes;
       var len = attrs && attrs.length;
       var i, attr, name, hash;
@@ -252,7 +252,7 @@ define("content-kit-utils/node-utils",
         attr = attrs[i];
         name = attr.name;
         if (attr.specified && attr.value) {
-          //if (blacklist && name in blacklist)) { continue; }
+          if (blacklist && (name in blacklist)) { continue; }
           hash = hash || {};
           hash[name] = attr.value;
         }
@@ -982,7 +982,7 @@ define("content-kit-compiler/parsers/html-parser",
             type_name  : this.includeTypeNames && type.name,
             start      : startIndex,
             end        : endIndex,
-            attributes : attributesForNode(node)
+            attributes : attributesForNode(node, { style: 1 }) // filter out inline styles
           });
         }
       }
@@ -1310,13 +1310,17 @@ define("content-kit-compiler/types/type-set",
        * Returns type info for a given Node
        */
       findByNode: function(node) {
-        return this.findByTag(node.tagName);
+        if (node) {
+          return this.findByTag(node.tagName);
+        }
       },
       /**
        * Returns type info for a given tag
        */
       findByTag: function(tag) {
-        return this.tagLookup[tag.toLowerCase()];
+        if (tag) {
+          return this.tagLookup[tag.toLowerCase()];
+        }
       },
       /**
        * Returns type info for a given id
@@ -2022,9 +2026,22 @@ define("content-kit-editor/editor/editor",
     }
 
     function bindLiveUpdate(editor) {
-      editor.element.addEventListener('input', function() {
+      editor.element.addEventListener('input', function(e) {
         editor.syncModelAtSelection();
       });
+
+      // Handle special cases
+      editor.element.addEventListener('keyup', function(e) {
+        // When pressing enter: parse block before cursor too
+        if(!e.shiftKey && e.which === Keycodes.ENTER) {
+          editor.syncModelAt(editor.getCurrentBlockIndex()-1);
+        }
+        // When pressing backspace/del: parse block after cursor too
+        else if(e.which === Keycodes.BKSP || e.which === Keycodes.DEL) {
+          editor.syncModelAt(editor.getCurrentBlockIndex()+1);
+        }
+
+      });
     }
 
     function initEmbedCommands(editor) {
@@ -2100,7 +2117,11 @@ define("content-kit-editor/editor/editor",
       if (index > -1) {
         var blockElements = toArray(this.element.children);
         var parsedBlockModel = this.compiler.parser.parseBlock(blockElements[index]);
-        this.model[index] = parsedBlockModel;
+        if (parsedBlockModel) {
+          this.model[index] = parsedBlockModel;
+        } else {
+          this.model.splice(index, 1);
+        }
         this.trigger('update', { index: index });
       }
     };
@@ -2149,6 +2170,10 @@ define("content-kit-editor/editor/editor",
       this.textFormatToolbar.addCommand(command);
     };
 
+    Editor.prototype.text = function() {
+      getCursorIndexInSelectionBlockElement();
+    }
+
     __exports__["default"] = Editor;
   });
 define("content-kit-editor/utils/element-utils",

diff --git a/src/js/content-kit-compiler/parsers/html-parser.js b/src/js/content-kit-compiler/parsers/html-parser.js
@@ -163,7 +163,7 @@ HTMLParser.prototype.parseElementMarkup = function(node, startIndex) {
         type_name  : this.includeTypeNames && type.name,
         start      : startIndex,
         end        : endIndex,
-        attributes : attributesForNode(node)
+        attributes : attributesForNode(node, { style: 1 }) // filter out inline styles
       });
     }
   }

diff --git a/src/js/content-kit-compiler/types/type-set.js b/src/js/content-kit-compiler/types/type-set.js
@@ -40,13 +40,17 @@ TypeSet.prototype = {
    * Returns type info for a given Node
    */
   findByNode: function(node) {
-    return this.findByTag(node.tagName);
+    if (node) {
+      return this.findByTag(node.tagName);
+    }
   },
   /**
    * Returns type info for a given tag
    */
   findByTag: function(tag) {
-    return this.tagLookup[tag.toLowerCase()];
+    if (tag) {
+      return this.tagLookup[tag.toLowerCase()];
+    }
   },
   /**
    * Returns type info for a given id

diff --git a/src/js/content-kit-editor/editor/editor.js b/src/js/content-kit-editor/editor/editor.js
@@ -99,9 +99,22 @@ function bindAutoTypingListeners(editor) {
 }
 
 function bindLiveUpdate(editor) {
-  editor.element.addEventListener('input', function() {
+  editor.element.addEventListener('input', function(e) {
     editor.syncModelAtSelection();
   });
+
+  // Handle special cases
+  editor.element.addEventListener('keyup', function(e) {
+    // When pressing enter: parse block before cursor too
+    if(!e.shiftKey && e.which === Keycodes.ENTER) {
+      editor.syncModelAt(editor.getCurrentBlockIndex()-1);
+    }
+    // When pressing backspace/del: parse block after cursor too
+    else if(e.which === Keycodes.BKSP || e.which === Keycodes.DEL) {
+      editor.syncModelAt(editor.getCurrentBlockIndex()+1);
+    }
+
+  });
 }
 
 function initEmbedCommands(editor) {
@@ -177,7 +190,11 @@ Editor.prototype.syncModelAt = function(index) {
   if (index > -1) {
     var blockElements = toArray(this.element.children);
     var parsedBlockModel = this.compiler.parser.parseBlock(blockElements[index]);
-    this.model[index] = parsedBlockModel;
+    if (parsedBlockModel) {
+      this.model[index] = parsedBlockModel;
+    } else {
+      this.model.splice(index, 1);
+    }
     this.trigger('update', { index: index });
   }
 };
@@ -226,4 +243,8 @@ Editor.prototype.addTextFormat = function(opts) {
   this.textFormatToolbar.addCommand(command);
 };
 
+Editor.prototype.text = function() {
+  getCursorIndexInSelectionBlockElement();
+}
+
 export default Editor;
diff --git a/src/js/content-kit-utils/node-utils.js b/src/js/content-kit-utils/node-utils.js
@@ -50,7 +50,7 @@ function unwrapNode(node) {
 /**
  * Extracts attributes of a `Node` to a hash of key/value pairs
  */
-function attributesForNode(node /*,blacklist*/) {
+function attributesForNode(node, blacklist) {
   var attrs = node.attributes;
   var len = attrs && attrs.length;
   var i, attr, name, hash;
@@ -59,7 +59,7 @@ function attributesForNode(node /*,blacklist*/) {
     attr = attrs[i];
     name = attr.name;
     if (attr.specified && attr.value) {
-      //if (blacklist && name in blacklist)) { continue; }
+      if (blacklist && (name in blacklist)) { continue; }
       hash = hash || {};
       hash[name] = attr.value;
     }