highmark-markdown 0.0.379 → 0.0.382

package/src/example/view/xmp.js

@@ -7,11 +7,7 @@ import { Element } from "easy";
 import { EMPTY_STRING } from "../constants";
 
 class XMP extends Element {
-  update(htmls) {
-    htmls = htmls.join(EMPTY_STRING);
-
-    const html = `${htmls}`;
-
+  update(html) {
     this.html(html);
   }
 

package/src/example/view.js

@@ -16,6 +16,9 @@ import RightSizeableDiv from "./view/div/sizeable/right";
 import MarkdownContainerDiv from "./view/div/container/markdown";
 import MarkdownStyleContainerDiv from "./view/div/container/markdownStyle";
 
+import { postprocess } from "../utilities/markdown";
+import { LINES_PER_PAGE, CHARACTERS_PER_LINE, INTRODUCTION_CLASS_NAME } from "./constants";
+
 const markdownLexer = MarkdownLexer.fromNothing(),
       markdownParser = MarkdownParser.fromNothing(),
       markdownStyleLexer = MarkdownStyleLexer.fromNothing(),
@@ -26,6 +29,12 @@ class View extends Element {
     this.markdownStyle();
   }
 
+  pageUpdateCustomHandler = (event, element, index) => {
+    this.clearPage();
+
+    this.updatePage(index);
+  }
+
   markdownCustomHandler = (event, element) => {
     this.markdown();
   }
@@ -63,66 +72,75 @@ class View extends Element {
           lexer = markdownLexer,  ///
           parser =  markdownParser, ///
           content = markdown, ///
-          tokens = lexer.tokenise(content),
-          startRule = parser.getStartRule(),
           startOfContent = true,
+          startRule = parser.getStartRule(),
+          tokens = lexer.tokenise(content),
           node = parser.parse(tokens, startRule, startOfContent);
 
+    this.setTokens(tokens);
+
     if (node !== null) {
-      const pageNumber = 1,
-            divisionMarkdownNode = node,  ///
-            divisionMarkdownNodes = [
-              divisionMarkdownNode
-            ],
+      const divisionClassName = INTRODUCTION_CLASS_NAME,
+            divisionMarkdownNode = node;  ///
+
+      divisionMarkdownNode.setDivisionClassName(divisionClassName);
+
+      const linesPerPage = LINES_PER_PAGE,
+            charactersPerLine = CHARACTERS_PER_LINE,
             context = {
               tokens,
               importer,
-              pageNumber,
-              divisionMarkdownNodes
-            };
+              linesPerPage,
+              charactersPerLine
+            },
+            divisionMarkdownNodes = postprocess(divisionMarkdownNode, context);
 
-      divisionMarkdownNode.resolveIncludes(context);
+      this.setDivisionMarkdownNodes(divisionMarkdownNodes);
 
-      divisionMarkdownNodes.forEach((divisionMarkdownNode) => {
-        divisionMarkdownNode.resolveEmbeddings(context);
+      const index = 0,
+            length = divisionMarkdownNodes.length,
+            parseTree = divisionMarkdownNode.asParseTree(tokens);
 
-        divisionMarkdownNode.createFootnotes(context);
-      });
+      this.updatePage(index);
 
-      divisionMarkdownNodes.some((divisionMarkdownNode) => {
-        const contentsCreated = divisionMarkdownNode.createContents(context);
+      this.updatePageButtonsDiv(length);
 
-        if (contentsCreated) {
-          return true;
-        }
-      });
+      this.updateMarkdownParseTreeTextarea(parseTree);
+    } else {
+      this.clearPage();
 
-      const htmls = [],
-            domElements = [];
+      this.clearPageButtonsDiv();
 
-      divisionMarkdownNodes.forEach((divisionMarkdownNode) => {
-        const html = divisionMarkdownNode.asHTML(context),
-              domElement = divisionMarkdownNode.createDOMElement(context);
+      this.clearMarkdownParseTreeTextarea();
 
-        htmls.push(html);
+      const divisionMarkdownNodes = null;
 
-        domElements.push(domElement);
-      });
+      this.setDivisionMarkdownNodes(divisionMarkdownNodes);
+    }
+  }
 
-      this.updateXMP(htmls);
+  updatePage(index) {
+    const divisionMarkdownNodes = this.getDivisionMarkdownNodes(),
+          divisionMarkdownNode = divisionMarkdownNodes[index],
+          tokens = this.getTokens(),
+          context = {
+            tokens
+          },
+          length = null,
+          html = divisionMarkdownNode.asHTML(context),
+          domElement = divisionMarkdownNode.createDOMElement(context);
 
-      this.updatePreviewDiv(domElements);
+    this.updateXMP(html);
 
-      const parseTree = node.asParseTree(tokens);
+    this.updatePreviewDiv(domElement);
 
-      this.updateMarkdownParseTreeTextarea(parseTree);
-    } else {
-      this.clearXMP();
+    this.updatePageButtonsDiv(length, index);
+  }
 
-      this.clearPreviewDiv();
+  clearPage() {
+    this.clearXMP();
 
-      this.clearMarkdownParseTreeTextarea();
-    }
+    this.clearPreviewDiv();
   }
 
   markdownStyle() {
@@ -140,6 +158,40 @@ class View extends Element {
     this.updateMarkdownStyle();
   }
 
+  getTokens() {
+    const { tokens } = this.getState();
+
+    return tokens;
+  }
+
+  setTokens(tokens) {
+    this.updateState({
+      tokens
+    });
+  }
+
+  getDivisionMarkdownNodes() {
+    const { divisionMarkdownNodes } = this.getState();
+
+    return divisionMarkdownNodes;
+  }
+
+  setDivisionMarkdownNodes(divisionMarkdownNodes) {
+    this.updateState({
+      divisionMarkdownNodes
+    });
+  }
+
+  setInitialState() {
+    const tokens = null,
+          divisionMarkdownNodes = null;
+
+    this.setState({
+      tokens,
+      divisionMarkdownNodes
+    });
+  }
+
   childElements() {
     return (
 
@@ -168,7 +220,7 @@ class View extends Element {
                 <SubHeading>
                   Preview
                 </SubHeading>
-                <PreviewDiv/>
+                <PreviewDiv onCustomPageUpdate={this.pageUpdateCustomHandler} />
               </RowsDiv>
             </RowDiv>
           </RowsDiv>
@@ -181,6 +233,8 @@ class View extends Element {
   initialise() {
     this.assignContext();
 
+    this.setInitialState();
+
     const { initialMarkdown, initialMarkdownStyle } = this.constructor,
           markdownStyle = initialMarkdownStyle, ///
           markdown = initialMarkdown; ///
@@ -192,17 +246,6 @@ class View extends Element {
     this.update();
   }
 
-  static initialMarkdownStyle = `pageNumber {
-  colour: red;
-}
-`;
-
-  static initialMarkdown = `* Occam [^occam].
-
-[^occam]: Occam.
-
-`;
-
   static tagName = "div";
 
   static ignoredProperties = [
@@ -212,6 +255,29 @@ class View extends Element {
   static defaultProperties = {
     className: "view"
   };
+
+  static initialMarkdown = `
+
+Occam [^occam].
+   
+A paragraph to trigger the pagination.
+
+Occam and Florence [^occam] [^florence].
+
+[^occam]: Occam footnote.
+
+[^florence]: Florence footnote.
+
+@footnotes
+
+@pageNumber
+`;
+
+  static initialMarkdownStyle = `width: 100%;
+position: absolute;
+min-height: 100%;  
+padding-top: 5rem;  
+`;
 }
 
 export default withStyle(View)`
@@ -221,7 +287,7 @@ export default withStyle(View)`
 `;
 
 function importer(filePath, context) {
-  const content = `# Primary heading
+  const content = `#Introuction
 `,
         startOfContent = true,
         startRule = markdownParser.getStartRule(),

package/src/example.js

@@ -9,13 +9,13 @@ import { mediaTypeNames, MarkdownStyleElement, DefaultMarkdownStyleElement } fro
 
 import View from "./example/view";
 
-import { PREVIEW_DIV_DIVS_SELECTORS_STRING } from "./example/constants";
+import { INTRODUCTION_DIV_SELECTORS_STRING } from "./example/constants";
 
 const { renderStyles } = withStyle,
       { PREVIEW_MEDIA_TYPE_NAME } = mediaTypeNames;
 
 const mediaTypeName = PREVIEW_MEDIA_TYPE_NAME,
-      selectorsString = PREVIEW_DIV_DIVS_SELECTORS_STRING;
+      selectorsString = INTRODUCTION_DIV_SELECTORS_STRING;
 
 DefaultMarkdownStyleElement.fromMediaTypeNameAndSelectorsString(mediaTypeName, selectorsString);
 

package/src/index.js

@@ -1,17 +1,20 @@
 "use strict";
 
+export { default as MarkdownLexer } from "./markdown/lexer";
+export { default as MarkdownParser } from "./markdown/parser";
+export { default as MarkdownStyleLexer } from "./markdownStyle/lexer";
+export { default as MarkdownStyleParser } from "./markdownStyle/parser";
+
+export { default as cssUtilities } from "./utilities/css";
+export { default as queryUtilities } from "./utilities/query";
+export { default as markdownUtilities } from "./utilities/markdown";
+
 export { default as nodeMap } from "./nodeMap";
 export { default as ruleNames } from "./ruleNames";
 export { default as tokenTypes } from "./tokenTypes";
 export { default as elementMap } from "./elementMap";
-export { default as cssUtilities } from "./utilities/css";
 export { default as MarkdownNode } from "./node/markdown";
-export { default as MarkdownLexer } from "./markdown/lexer";
 export { default as mediaTypeNames } from "./mediaTypeNames";
-export { default as MarkdownParser } from "./markdown/parser";
-export { default as queryUtilities } from "./utilities/query";
-export { default as MarkdownStyleLexer } from "./markdownStyle/lexer";
-export { default as MarkdownStyleParser } from "./markdownStyle/parser";
 export { default as MarkdownStyleElement } from "./styleElement/markdown";
 export { default as defaultMarkdownStyle } from "./defaultMarkdownStyle";
 export { default as DefaultMarkdownStyleElement } from "./styleElement/markdown/default";

package/src/markdown/bnf.js

@@ -41,28 +41,26 @@ const bnf = `
                               ;
 
 
-    directives              ::=  ( pageNumber 
-    
-                                 | embedDirective 
-    
-                                 | ignoreDirective 
-    
-                                 | includeDirective 
-    
-                                 | contentsDirective 
-    
-                                 | footnotesDirective ) ( endOfLine ( pageNumber 
-    
-                                                                    | embedDirective 
-    
-                                                                    | ignoreDirective 
-                                        
-                                                                    | includeDirective 
-                                        
-                                                                    | contentsDirective 
-                                        
-                                                                    | footnotesDirective ) )* ;
-
+    directives              ::=  pageNumber 
+    
+                               | ignoreDirective 
+  
+                               | contentsDirective 
+  
+                               | footnotesDirective
+                               
+                               | (
+                               
+                                   ( embedDirective 
+                                   
+                                   | includeDirective ) ( endOfLine ( embedDirective 
+                                   
+                                                                    | includeDirective ) )* 
+                               
+                                 )
+                               
+                               ; 
+  
 
     primaryHeading.         ::=  "#" line ;
 
@@ -244,7 +242,7 @@ const bnf = `
                               ;
     
 
-    anchor.                 ::=  [identifier] ;
+    anchor.                 ::=  ε ;
     
 
     reference.              ::=  [reference] ;

package/src/mixins/node.js

@@ -1,8 +1,25 @@
 "use strict";
 
-function removeChildNode(childNode) {
+import { arrayUtilities } from "necessary";
+
+const { first, last } = arrayUtilities;
+
+function removeChildNodes(removedChildNodes) {
+  const childNodes = this.getChildNodes(),
+        firstRemovedChildNode = first(removedChildNodes),
+        lastRemovedChildNode = last(removedChildNodes),
+        firstIndex = childNodes.indexOf(firstRemovedChildNode), ///
+        lastIndex = childNodes.indexOf(lastRemovedChildNode), ///
+        start = firstIndex,  ///
+        end = lastIndex + 1,
+        deleteCount = end - start;
+
+  childNodes.splice(start, deleteCount);
+}
+
+function removeChildNode(removedChildNode) {
   const childNodes = this.getChildNodes(),
-        index = childNodes.indexOf(childNode),
+        index = childNodes.indexOf(removedChildNode),
         start = index,  ///
         deleteCount = 1;
 
@@ -51,6 +68,7 @@ function getDescendantNodes(descendantNodes = []) {
 }
 
 const nodeMixins = {
+  removeChildNodes,
   removeChildNode,
   appendChildNode,
   prependChildNode,

package/src/node/markdown/anchor.js

@@ -1,5 +1,7 @@
 "use strict";
 
+import { EpsilonNode } from "occam-parsers";
+
 import MarkdownNode from "../../node/markdown";
 
 import { EMPTY_STRING } from "../../constants";
@@ -47,8 +49,11 @@ export default class AnchorMarkdownNode extends MarkdownNode {
   clone() { return super.clone(this.identifier); }
 
   static fromIdentifier(identifier) {
-    const ruleName = ANCHOR_RULE_NAME,
-          childNodes = [],
+    const epsilonNode = EpsilonNode.fromNothing(),
+          ruleName = ANCHOR_RULE_NAME,
+          childNodes = [
+            epsilonNode
+          ],
           opacity = null,
           anchorMarkdownNode = MarkdownNode.fromRuleNameChildNodesAndOpacity(AnchorMarkdownNode, ruleName, childNodes, opacity, identifier);
 

package/src/node/markdown/blockLine.js

@@ -3,6 +3,7 @@
 import MarkdownNode from "../../node/markdown";
 
 import { contentFromNode } from "../../utilities/content";
+import { leadingIndexFromNodeAndTokens } from "../../utilities/node";
 
 export default class BlockLineMarkdownNode extends MarkdownNode {
   content(context) {
@@ -13,9 +14,8 @@ export default class BlockLineMarkdownNode extends MarkdownNode {
 
     content = contentFromNode(node, context);
 
-    const firstSignificantToken = this.getFirstSignificantToken(),
-          firstSignificantTokenIndex = tokens.indexOf(firstSignificantToken),
-          previousTokenIndex = firstSignificantTokenIndex - 1,
+    const leadingIndex = leadingIndexFromNodeAndTokens(node, tokens),
+          previousTokenIndex = leadingIndex - 1,
           previousToken = tokens[previousTokenIndex],
           previousTokenWhitespaceToken = previousToken.isWhitespaceToken();
 

package/src/node/markdown/contentsLink.js

@@ -2,8 +2,8 @@
 
 import { arrayUtilities } from "necessary";
 
+import Replacement from "../../replacement";
 import MarkdownNode from "../../node/markdown";
-import ReplacementNodeAndTokens from "../../replacementNodeAndTokens";
 
 import { HREF_ATTRIBUTE_NAME } from "../../attributeNames";
 import { CONTENTS_LINK_RULE_NAME } from "../../ruleNames";
@@ -61,13 +61,13 @@ export default class ContentsLinkMarkdownNode extends MarkdownNode {
       const lineMarkdownNode = headingMarkdownNode.getLineMarkdownNode(),
             childNode = lineMarkdownNode, ///
             node = childNode, ///
-            replacementNodeAndTokens = ReplacementNodeAndTokens.fromNode(node, context),
+            replacement = Replacement.fromNode(node, context),
             ruleName = CONTENTS_LINK_RULE_NAME,
             childNodes = [
               childNode
             ],
             opacity = null,
-            tokens = replacementNodeAndTokens.getTokens(),
+            tokens = replacement.getTokens(),
             identifier = headingMarkdownNode.identifier(context);
 
       contentsLinkMarkdownNode = MarkdownNode.fromRuleNameChildNodesAndOpacity(ContentsLinkMarkdownNode, ruleName, childNodes, opacity, tokens, identifier);

package/src/node/markdown/directive/contents.js

@@ -1,7 +1,7 @@
 "use strict";
 
-import MarkdownNode from "../../../node/markdown";
+import DirectiveMarkdownNode from "../../../node/markdown/directive";
 
-export default class ContentsDirectiveMarkdownNode extends MarkdownNode {
-  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return MarkdownNode.fromRuleNameChildNodesAndOpacity(ContentsDirectiveMarkdownNode, ruleName, childNodes, opacity); }
+export default class ContentsDirectiveMarkdownNode extends DirectiveMarkdownNode {
+  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return DirectiveMarkdownNode.fromRuleNameChildNodesAndOpacity(ContentsDirectiveMarkdownNode, ruleName, childNodes, opacity); }
 }

package/src/node/markdown/directive/embee.js

@@ -2,14 +2,14 @@
 
 import { arrayUtilities } from "necessary";
 
-import MarkdownNode from "../../../node/markdown";
-import ReplacementNodeAndTokens from "../../../replacementNodeAndTokens";
+import Replacement from "../../../replacement";
+import DirectiveMarkdownNode from "../../../node/markdown/directive";
 
 const { last } = arrayUtilities;
 
-export default class EmbedDirectiveMarkdownNode extends MarkdownNode {
-  replacementNodeAndTokens(context) {
-    let replacementNodeAndTokens = null;
+export default class EmbedDirectiveMarkdownNode extends DirectiveMarkdownNode {
+  replacement(context) {
+    let replacement = null;
 
     const { importer = null } = context;
 
@@ -29,11 +29,11 @@ export default class EmbedDirectiveMarkdownNode extends MarkdownNode {
         const node = importedNode,  ///
               tokens = importedTokens;  ///
 
-        replacementNodeAndTokens = ReplacementNodeAndTokens.fromNodeAndTokens(node, tokens);
+        replacement = Replacement.fromNodeAndTokens(node, tokens);
       }
     }
 
-    return replacementNodeAndTokens;
+    return replacement;
   }
 
   filePath(context) {
@@ -46,5 +46,5 @@ export default class EmbedDirectiveMarkdownNode extends MarkdownNode {
     return filePath;
   }
 
-  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return MarkdownNode.fromRuleNameChildNodesAndOpacity(EmbedDirectiveMarkdownNode, ruleName, childNodes, opacity); }
+  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return DirectiveMarkdownNode.fromRuleNameChildNodesAndOpacity(EmbedDirectiveMarkdownNode, ruleName, childNodes, opacity); }
 }

package/src/node/markdown/directive/footnotes.js

@@ -1,7 +1,7 @@
 "use strict";
 
-import MarkdownNode from "../../../node/markdown";
+import DirectiveMarkdownNode from "../../../node/markdown/directive";
 
-export default class FootnotesDirectiveMarkdownNode extends MarkdownNode {
-  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return MarkdownNode.fromRuleNameChildNodesAndOpacity(FootnotesDirectiveMarkdownNode, ruleName, childNodes, opacity); }
+export default class FootnotesDirectiveMarkdownNode extends DirectiveMarkdownNode {
+  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return DirectiveMarkdownNode.fromRuleNameChildNodesAndOpacity(FootnotesDirectiveMarkdownNode, ruleName, childNodes, opacity); }
 }

package/src/node/markdown/directive/ignore.js

@@ -1,7 +1,7 @@
 "use strict";
 
-import MarkdownNode from "../../../node/markdown";
+import DirectiveMarkdownNode from "../../../node/markdown/directive";
 
-export default class IgnoreDirectiveMarkdownNode extends MarkdownNode {
-  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return MarkdownNode.fromRuleNameChildNodesAndOpacity(IgnoreDirectiveMarkdownNode, ruleName, childNodes, opacity); }
+export default class IgnoreDirectiveMarkdownNode extends DirectiveMarkdownNode {
+  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return DirectiveMarkdownNode.fromRuleNameChildNodesAndOpacity(IgnoreDirectiveMarkdownNode, ruleName, childNodes, opacity); }
 }

package/src/node/markdown/directive/include.js

@@ -2,11 +2,11 @@
 
 import { arrayUtilities } from "necessary";
 
-import MarkdownNode from "../../../node/markdown";
+import DirectiveMarkdownNode from "../../../node/markdown/directive";
 
 const { push, last } = arrayUtilities;
 
-export default class IncludeDirectiveMarkdownNode extends MarkdownNode {
+export default class IncludeDirectiveMarkdownNode extends DirectiveMarkdownNode {
   resolveIncludes(context) {
     let html = null;
 
@@ -56,5 +56,5 @@ export default class IncludeDirectiveMarkdownNode extends MarkdownNode {
     return filePath;
   }
 
-  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return MarkdownNode.fromRuleNameChildNodesAndOpacity(IncludeDirectiveMarkdownNode, ruleName, childNodes, opacity); }
+  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return DirectiveMarkdownNode.fromRuleNameChildNodesAndOpacity(IncludeDirectiveMarkdownNode, ruleName, childNodes, opacity); }
 }

package/src/node/markdown/directive/pageNumber.js

@@ -1,15 +1,56 @@
 "use strict";
 
-import MarkdownNode from "../../../node/markdown";
+import DirectiveMarkdownNode from "../../../node/markdown/directive";
+
+export default class PageNumberDirectiveMarkdownNode extends DirectiveMarkdownNode {
+  constructor(ruleName, childNodes, precedence, opacity, domElement, pageNumber) {
+    super(ruleName, childNodes, precedence, opacity, domElement);
+
+    this.pageNumber = pageNumber;
+  }
+
+  getPageNumber() {
+    return this.pageNumber;
+  }
+
+  setPageNumber(pageNumber) {
+    this.pageNumber = pageNumber;
+  }
 
-export default class PageNumberDirectiveMarkdownNode extends MarkdownNode {
   content(context) {
-    const { pageNumber } = context,
-          content = pageNumber;
+    const content = this.pageNumber;
 
     return content;
   }
 
+  asHTML(indent, context) {
+    indent = this.adjustIndent(indent);
+
+    const childNodesHTML = this.childNodesAsHTML(indent, context),
+          startingTag = this.startingTag(context),
+          closingTag = this.closingTag(context),
+          html = `${indent}${startingTag}${childNodesHTML}${closingTag}
+`;
+
+    return html;
+  }
+
+  createDOMElement(context) {
+    const tagName = this.tagName(context),
+          className = this.className(context),
+          domElement = document.createElement(tagName);
+
+    Object.assign(domElement, {
+      className
+    });
+
+    this.setDOMElement(domElement);
+
+    this.createChildNodeDOMElements(context);
+
+    return domElement;
+  }
+
   childNodesAsHTML(indent, context) {
     const content = this.content(context),
           childNodesHTML = content; ///
@@ -25,5 +66,12 @@ export default class PageNumberDirectiveMarkdownNode extends MarkdownNode {
     this.addDOMElement(domElement);
   }
 
-  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) { return MarkdownNode.fromRuleNameChildNodesAndOpacity(PageNumberDirectiveMarkdownNode, ruleName, childNodes, opacity); }
+  clone() { return super.clone(this.number); }
+
+  static fromRuleNameChildNodesAndOpacity(ruleName, childNodes, opacity) {
+    const pageNumber = null,
+          pageNumberDirectiveMarkdownNode = DirectiveMarkdownNode.fromRuleNameChildNodesAndOpacity(PageNumberDirectiveMarkdownNode, ruleName, childNodes, opacity, pageNumber);
+
+    return pageNumberDirectiveMarkdownNode;
+  }
 }

package/src/node/markdown/directive.js

@@ -0,0 +1,13 @@
+"use strict";
+
+import MarkdownNode from "../../node/markdown";
+
+export default class DirectiveMarkdownNode extends MarkdownNode {
+  lines(context) {
+    const lines = 0;
+
+    return lines;
+  }
+
+  static fromRuleNameChildNodesAndOpacity(Class, ruleName, childNodes, opacity) { return MarkdownNode.fromRuleNameChildNodesAndOpacity(Class, ruleName, childNodes, opacity); }
+}