Move Section model to MarkupSection, use across codebase

Also unify the types for posts and markup sections

src/js/models/section.js → src/js/models/markup-section.js

@@ -2,13 +2,13 @@ export const DEFAULT_TAG_NAME = 'p';
 export const SECTION_TAG_NAMES = [
   'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'div'
 ];
-const SECTION_TYPE = 'section';
+export const MARKUP_SECTION_TYPE = 'markup-section';
 
-const Section = class Section {
-  constructor(tagName=DEFAULT_TAG_NAME, markers=[]) {
-    this.markers = [];
-    this.tagName = tagName;
-    this.type = SECTION_TYPE;
+export default class Section {
+  constructor(tagName, markers=[]) {
+    this.markers = markers;
+    this.tagName = tagName || DEFAULT_TAG_NAME;
+    this.type = MARKUP_SECTION_TYPE;
 
     markers.forEach(m => this.appendMarker(m));
   }
@@ -39,8 +39,8 @@ const Section = class Section {
     right.push(rightMiddle);
 
     return [
-      new Section(this.tagName, left),
-      new Section(this.tagName, right)
+      new this.constructor(this.tagName, left),
+      new this.constructor(this.tagName, right)
     ];
   }
 
@@ -64,6 +64,4 @@ const Section = class Section {
     }
     return this.markers[i-1];
   }
-};
-
-export default Section;
+}

src/js/models/post.js

@@ -1,7 +1,9 @@
+export const POST_TYPE = 'post';
+
 // FIXME: making sections a linked-list would greatly improve this
 export default class Post {
   constructor() {
-    this.type = 'post';
+    this.type = POST_TYPE;
     this.sections = [];
   }
   appendSection(section) {

src/js/parsers/dom.js

@@ -143,7 +143,7 @@ NewHTMLParser.prototype = {
       var tagName = sectionElement.tagName;
       // <p> <h2>, etc
       if (MARKUP_SECTION_TAG_NAMES.indexOf(tagName) !== -1) {
-        section = postBuilder.generateSection(tagName, readAttributes(sectionElement));
+        section = postBuilder.generateMarkupSection(tagName, readAttributes(sectionElement));
         var node = sectionElement.firstChild;
         while (node) {
           parseMarkers(section, postBuilder, node);
@@ -154,7 +154,7 @@ NewHTMLParser.prototype = {
         if (previousSection && previousSection.isGenerated) {
           section = previousSection;
         } else {
-          section = postBuilder.generateSection('P', {}, true);
+          section = postBuilder.generateMarkupSection('P', {}, true);
         }
         parseMarkers(section, postBuilder, sectionElement);
       }
@@ -163,7 +163,7 @@ NewHTMLParser.prototype = {
       if (previousSection && previousSection.isGenerated) {
         section = previousSection;
       } else {
-        section = postBuilder.generateSection('P', {}, true);
+        section = postBuilder.generateMarkupSection('P', {}, true);
       }
       parseMarkers(section, postBuilder, sectionElement);
       break;

src/js/parsers/mobiledoc.js

@@ -66,7 +66,7 @@ export default class MobiledocParser {
   parseMarkupSection([type, tagName, markers], post) {
     const attributes = null;
     const isGenerated = false;
-    const section = this.builder.generateSection(tagName, attributes, isGenerated);
+    const section = this.builder.generateMarkupSection(tagName, attributes, isGenerated);
 
     post.appendSection(section);
     this.parseMarkers(markers, section);

src/js/parsers/section.js

@@ -1,7 +1,7 @@
 const TEXT_NODE = 3;
 const ELEMENT_NODE = 1;
 
-import Section from 'content-kit-editor/models/section';
+import MarkupSection from 'content-kit-editor/models/markup-section';
 import {
   DEFAULT_TAG_NAME,
   SECTION_TAG_NAMES
@@ -25,7 +25,7 @@ export default {
     }
 
     const tagName = this.sectionTagNameFromElement(element);
-    const section = new Section(tagName);
+    const section = new MarkupSection(tagName);
     const state = {section, markups:[], text:''};
 
     forEach(element.childNodes, (el) => {

src/js/renderers/editor-dom.js

@@ -1,6 +1,8 @@
 import RenderNode from "content-kit-editor/models/render-node";
 import CardNode from "content-kit-editor/models/card-node";
 import { detect } from 'content-kit-editor/utils/array-utils';
+import { POST_TYPE } from "../models/post";
+import { MARKUP_SECTION_TYPE } from "../models/section";
 
 function createElementFromMarkerType(doc, markerType) {
   var element = doc.createElement(markerType.tagName);
@@ -52,15 +54,15 @@ class Visitor {
     this.options = options;
   }
 
-  post(renderNode, post, visit) {
+  [POST_TYPE](renderNode, post, visit) {
     if (!renderNode.element) {
       let element = document.createElement('div');
       renderNode.element = element;
     }
     visit(renderNode, post.sections);
   }
 
-  markupSection(renderNode, section) {
+  [MARKUP_SECTION_TYPE](renderNode, section) {
     if (!renderNode.element) {
       let element = renderMarkupSection(window.document, section, section.markers);
       if (renderNode.previousSibling) {
@@ -123,10 +125,10 @@ class Visitor {
 }
 
 let destroyHooks = {
-  post(/*renderNode, post*/) {
+  [POST_TYPE](/*renderNode, post*/) {
     throw new Error('post destruction is not supported by the renderer');
   },
-  markupSection(renderNode, section) {
+  [MARKUP_SECTION_TYPE](renderNode, section) {
     let post = renderNode.parentNode.postNode;
     post.removeSection(section);
     // Some formatting commands remove the element from the DOM during

src/js/renderers/mobiledoc.js

@@ -1,15 +1,13 @@
 import {visit, visitArray, compile} from "../utils/compiler";
+import { POST_TYPE } from "../models/post";
+import { SECTION_TYPE } from "../models/section";
 
 let visitor = {
-  post(node, opcodes) {
+  [POST_TYPE](node, opcodes) {
     opcodes.push(['openPost']);
     visitArray(visitor, node.sections, opcodes);
   },
-  section(node, opcodes) {
-    opcodes.push(['openMarkupSection', node.tagName]);
-    visitArray(visitor, node.markers, opcodes);
-  },
-  markupSection(node, opcodes) {
+  [SECTION_TYPE](node, opcodes) {
     opcodes.push(['openMarkupSection', node.tagName]);
     visitArray(visitor, node.markers, opcodes);
   },

src/js/utils/post-builder.js

@@ -1,19 +1,13 @@
 import Post from "../models/post";
+import MarkupSection from "../models/markup-section";
 import ImageSection from "../models/image";
 
 var builder = {
   generatePost() {
     return new Post();
   },
-  generateSection(tagName, attributes, isGenerated) {
-    var section = {
-      type: 'markupSection',
-      tagName: tagName,
-      markers: []
-    };
-    if (attributes && attributes.length) {
-      section.attributes = attributes;
-    }
+  generateMarkupSection(tagName, attributes, isGenerated) {
+    let section = new MarkupSection(tagName);
     if (isGenerated) {
       section.isGenerated = !!isGenerated;
     }