using tags from compiler

src/js/content-kit-editor/commands/bold.js

@@ -1,12 +1,13 @@
 import TextFormatCommand from './text-format';
-import { inherit } from '../../content-kit-utils/object-utils';
-import { Tags, RegEx } from '../constants';
+import { RegEx } from '../constants';
 import { getSelectionBlockTagName } from '../utils/selection-utils';
+import { inherit } from '../../content-kit-utils/object-utils';
+import Type from '../../content-kit-compiler/types/type';
 
 function BoldCommand() {
   TextFormatCommand.call(this, {
     name: 'bold',
-    tag: Tags.BOLD,
+    tag: Type.BOLD.tag,
     button: '<i class="ck-icon-bold"></i>'
   });
 }

src/js/content-kit-editor/commands/format-block.js

@@ -1,7 +1,7 @@
 import TextFormatCommand from './text-format';
-import { Tags } from '../constants';
-import { inherit } from '../../content-kit-utils/object-utils';
 import { getSelectionBlockElement, selectNode } from '../utils/selection-utils';
+import { inherit } from '../../content-kit-utils/object-utils';
+import Type from '../../content-kit-compiler/types/type';
 
 function FormatBlockCommand(options) {
   options.action = 'formatBlock';
@@ -14,12 +14,13 @@ FormatBlockCommand.prototype.exec = function() {
   // Brackets neccessary for certain browsers
   var value =  '<' + tag + '>';
   var blockElement = getSelectionBlockElement();
-  // Allow block commands to be toggled back to a paragraph
-  if(tag === blockElement.tagName) {
-    value = Tags.PARAGRAPH;
+  // Allow block commands to be toggled back to a text block
+  if(tag === blockElement.tagName.toLowerCase()) {
+    value = Type.TEXT.tag;
   } else {
     // Flattens the selection before applying the block format.
     // Otherwise, undesirable nested blocks can occur.
+    // TODO: would love to be able to remove this
     var flatNode = document.createTextNode(blockElement.textContent);
     blockElement.parentNode.insertBefore(flatNode, blockElement);
     blockElement.parentNode.removeChild(blockElement);

src/js/content-kit-editor/commands/heading.js

@@ -1,11 +1,11 @@
 import FormatBlockCommand from './format-block';
-import { Tags } from '../constants';
 import { inherit } from '../../content-kit-utils/object-utils';
+import Type from '../../content-kit-compiler/types/type';
 
 function HeadingCommand() {
   FormatBlockCommand.call(this, {
     name: 'heading',
-    tag: Tags.HEADING,
+    tag: Type.HEADING.tag,
     button: '<i class="ck-icon-heading"></i>1'
   });
 }

src/js/content-kit-editor/commands/italic.js

@@ -1,11 +1,11 @@
 import TextFormatCommand from './text-format';
-import { Tags } from '../constants';
 import { inherit } from '../../content-kit-utils/object-utils';
+import Type from '../../content-kit-compiler/types/type';
 
 function ItalicCommand() {
   TextFormatCommand.call(this, {
     name: 'italic',
-    tag: Tags.ITALIC,
+    tag: Type.ITALIC.tag,
     button: '<i class="ck-icon-italic"></i>'
   });
 }

src/js/content-kit-editor/commands/link.js

@@ -1,13 +1,14 @@
 import TextFormatCommand from './text-format';
 import Prompt from '../views/prompt';
-import { Tags, RegEx } from '../constants';
-import { inherit } from '../../content-kit-utils/object-utils';
+import { RegEx } from '../constants';
 import { getSelectionTagName } from '../utils/selection-utils';
+import { inherit } from '../../content-kit-utils/object-utils';
+import Type from '../../content-kit-compiler/types/type';
 
 function LinkCommand() {
   TextFormatCommand.call(this, {
     name: 'link',
-    tag: Tags.LINK,
+    tag: Type.LINK.tag,
     action: 'createLink',
     removeAction: 'unlink',
     button: '<i class="ck-icon-link"></i>',

src/js/content-kit-editor/commands/ordered-list.js

@@ -1,11 +1,11 @@
 import ListCommand from './list';
-import { Tags } from '../constants';
 import { inherit } from '../../content-kit-utils/object-utils';
+import Type from '../../content-kit-compiler/types/type';
 
 function OrderedListCommand() {
   ListCommand.call(this, {
     name: 'ordered list',
-    tag: Tags.ORDERED_LIST,
+    tag: Type.ORDERED_LIST.tag,
     action: 'insertOrderedList'
   });
 }

src/js/content-kit-editor/commands/quote.js

@@ -1,11 +1,11 @@
 import FormatBlockCommand from './format-block';
-import { Tags } from '../constants';
 import { inherit } from '../../content-kit-utils/object-utils';
+import Type from '../../content-kit-compiler/types/type';
 
 function QuoteCommand() {
   FormatBlockCommand.call(this, {
     name: 'quote',
-    tag: Tags.QUOTE,
+    tag: Type.QUOTE.tag,
     button: '<i class="ck-icon-quote"></i>'
   });
 }

src/js/content-kit-editor/commands/subheading.js

@@ -1,11 +1,11 @@
 import FormatBlockCommand from './format-block';
-import { Tags } from '../constants';
 import { inherit } from '../../content-kit-utils/object-utils';
+import Type from '../../content-kit-compiler/types/type';
 
 function SubheadingCommand() {
   FormatBlockCommand.call(this, {
     name: 'subheading',
-    tag: Tags.SUBHEADING,
+    tag: Type.SUBHEADING.tag,
     button: '<i class="ck-icon-heading"></i>2'
   });
 }

src/js/content-kit-editor/commands/text-format.js

@@ -3,7 +3,7 @@ import { inherit } from '../../content-kit-utils/object-utils';
 
 function TextFormatCommand(options) {
   Command.call(this, options);
-  this.tag = options.tag.toUpperCase();
+  this.tag = options.tag;
   this.action = options.action || this.name;
   this.removeAction = options.removeAction || this.action;
 }

src/js/content-kit-editor/commands/unordered-list.js

@@ -1,11 +1,11 @@
 import ListCommand from './list';
-import { Tags } from '../constants';
 import { inherit } from '../../content-kit-utils/object-utils';
+import Type from '../../content-kit-compiler/types/type';
 
 function UnorderedListCommand() {
   ListCommand.call(this, {
     name: 'list',
-    tag: Tags.LIST,
+    tag: Type.LIST.tag,
     action: 'insertUnorderedList'
   });
 }

src/js/content-kit-editor/constants.js

@@ -1,3 +1,5 @@
+import Type from '../content-kit-compiler/types/type';
+
 var Keycodes = {
   BKSP  : 8,
   ENTER : 13,
@@ -24,20 +26,13 @@ var ToolbarDirection = {
   RIGHT : 2
 };
 
-var Tags = {
-  PARAGRAPH    : 'P',
-  HEADING      : 'H2',
-  SUBHEADING   : 'H3',
-  QUOTE        : 'BLOCKQUOTE',
-  FIGURE       : 'FIGURE',
-  LIST         : 'UL',
-  ORDERED_LIST : 'OL',
-  LIST_ITEM    : 'LI',
-  LINK         : 'A',
-  BOLD         : 'B',
-  ITALIC       : 'I'
-};
-
-var RootTags = [ Tags.PARAGRAPH, Tags.HEADING, Tags.SUBHEADING, Tags.QUOTE, Tags.FIGURE, Tags.LIST, Tags.ORDERED_LIST ];
+var RootTags = [
+  Type.TEXT.tag,
+  Type.HEADING.tag,
+  Type.SUBHEADING.tag,
+  Type.QUOTE.tag,
+  Type.LIST.tag,
+  Type.ORDERED_LIST.tag
+];
 
-export { Keycodes, RegEx, SelectionDirection, ToolbarDirection, Tags, RootTags };
+export { Keycodes, RegEx, SelectionDirection, ToolbarDirection, RootTags };

src/js/content-kit-editor/editor/editor-factory.js

@@ -1,10 +1,8 @@
 import Editor from './editor';
 import { TextFormatCommands, EmbedCommands } from '../commands/commands';
-import { Tags } from '../constants';
 import { merge } from '../../content-kit-utils/object-utils';
 
 var defaults = {
-  defaultFormatter: Tags.PARAGRAPH,
   placeholder: 'Write here...',
   spellcheck: true,
   autofocus: true,

src/js/content-kit-editor/editor/editor.js

@@ -5,7 +5,7 @@ import EmbedIntent from '../views/embed-intent';
 import UnorderedListCommand from '../commands/unordered-list';
 import OrderedListCommand from '../commands/ordered-list';
 import TextFormatCommand from '../commands/text-format';
-import { Tags, RootTags, Keycodes, RegEx } from '../constants';
+import { RootTags, Keycodes, RegEx } from '../constants';
 import { moveCursorToBeginningOfSelection, getSelectionTagName, getSelectionBlockElement, getSelectionBlockTagName } from '../utils/selection-utils';
 import { cleanPastedContent } from '../utils/paste-utils';
 import Compiler from '../../content-kit-compiler/compiler';
@@ -24,8 +24,8 @@ function bindTypingEvents(editor) {
   // Breaks out of blockquotes when pressing enter.
   editorEl.addEventListener('keyup', function(e) {
     if(!e.shiftKey && e.which === Keycodes.ENTER) {
-      if(Tags.QUOTE === getSelectionBlockTagName()) {
-        document.execCommand('formatBlock', false, editor.defaultFormatter);
+      if(Type.QUOTE.tag === getSelectionBlockTagName()) {
+        document.execCommand('formatBlock', false, Type.TEXT.tag);
         e.stopPropagation();
       }
     }
@@ -40,7 +40,7 @@ function bindTypingEvents(editor) {
     var selectedText = selectionNode.textContent;
     var command, replaceRegex;
 
-    if (Tags.LIST_ITEM !== getSelectionTagName()) {
+    if (Type.LIST_ITEM.tag !== getSelectionTagName()) {
       if (RegEx.UL_START.test(selectedText)) {
         command = new UnorderedListCommand();
         replaceRegex = RegEx.UL_START;
@@ -63,7 +63,7 @@ function bindTypingEvents(editor) {
   // Assure there is always a supported root tag, and not empty text nodes or divs.
   editorEl.addEventListener('keyup', function() {
     if (this.innerHTML.length && RootTags.indexOf(getSelectionBlockTagName()) === -1) {
-      document.execCommand('formatBlock', false, editor.defaultFormatter);
+      document.execCommand('formatBlock', false, Type.TEXT.tag);
     }
   });
 
@@ -111,15 +111,15 @@ function Editor(element, options) {
 
     bindTypingEvents(editor);
     editor.element.addEventListener('paste', function(e) {
-      var cleanedContent = cleanPastedContent(e, editor.defaultFormatter);
+      var cleanedContent = cleanPastedContent(e, Type.TEXT.tag);
       if (cleanedContent) {
         document.execCommand('insertHTML', false, cleanedContent);
         editor.syncModel();  // TODO: can optimize to just sync to index range
       }
     });
 
     editor.textFormatToolbar = new TextFormatToolbar({ rootElement: element, editor: editor, commands: editor.textFormatCommands });
-    var linkTooltips = new Tooltip({ rootElement: element, showForTag: Tags.LINK });
+    var linkTooltips = new Tooltip({ rootElement: element, showForTag: Type.LINK.tag });
 
     if(editor.embedCommands) {
       // NOTE: must come after bindTypingEvents so those keyup handlers are executed first.

src/js/content-kit-editor/utils/selection-utils.js

@@ -21,23 +21,23 @@ function getSelectionElement(selection) {
 function getSelectionBlockElement(selection) {
   selection = selection || window.getSelection();
   var element = getSelectionElement();
-  var tag = element && element.tagName;
+  var tag = element && element.tagName.toLowerCase();
   while (tag && RootTags.indexOf(tag) === -1) {
     if (element.contentEditable === 'true') { break; } // Stop traversing up dom when hitting an editor element
     element = element.parentNode;
-    tag = element.tagName;
+    tag = element.tagName.toLowerCase();
   }
   return element;
 }
 
 function getSelectionTagName() {
   var element = getSelectionElement();
-  return element ? element.tagName : null;
+  return element ? element.tagName.toLowerCase() : null;
 }
 
 function getSelectionBlockTagName() {
   var element = getSelectionBlockElement();
-  return element ? element.tagName : null;
+  return element ? element.tagName.toLowerCase() : null;
 }
 
 function tagsInSelection(selection) {
@@ -47,7 +47,7 @@ function tagsInSelection(selection) {
     while(element) {
       if (element.contentEditable === 'true') { break; } // Stop traversing up dom when hitting an editor element
       if (element.tagName) {
-        tags.push(element.tagName);
+        tags.push(element.tagName.toLowerCase());
       }
       element = element.parentNode;
     }