Inline PUML

docs/userGuide/puml.md

@@ -34,12 +34,15 @@ Name | Type | Default | Description
 --- | --- | --- | ---
 alt | `string` | | **This must be specified.**<br>The alternative text of the diagram.
 height | `string` | | The height of the diagram in pixels.
-src | `string` | | **This must be specified.**<br>The URL of the diagram.<br>The URL can be specified as absolute or relative references. More info in: _[Intra-Site Links]({{baseUrl}}/userGuide/formattingContents.html#intraSiteLinks)_
+src | `string` | | <br>The URL of the diagram if your PUML input is in another file.<br>The URL can be specified as absolute or relative references. More info in: _[Intra-Site Links]({{baseUrl}}/userGuide/formattingContents.html#intraSiteLinks)_
+name | `string` | | The name of the output file.
 width | `string` | | The width of the diagram in pixels.<br>If both width and height are specified, width takes priority over height. It is to maintain the diagram's aspect ratio.
 
 
 ### Example
 
+You could have your PUML be written in a separate file or inline.
+
 <include src="outputBox.md" boilerplate>
 <span id="code">
 
@@ -57,17 +60,33 @@ return success
 @enduml
 ```
 
-_Markbind page_:
+_Markbind page separate file_:
 ```
 <puml src="diagrams/sequence.puml" width=300/>
 ```
 
+_Markbind page inline_:
+`````
+<puml width=300/>
+
+```puml
+@startuml
+alice -> bob ++ : hello
+bob -> bob ++ : self call
+bob -> bib ++  #005500 : hello
+bob -> george ** : create
+return done
+return rc
+bob -> george !! : delete
+return success
+@enduml
+```
+`````
 </span>
 
 <span id="output">
 <pic src="diagrams/sequence.png" width="300" />
 </span>
-
 </include>
 
 <box type="info">

package.json

@@ -26,6 +26,7 @@
     "cheerio": "^0.22.0",
     "chokidar": "^3.3.0",
     "commander": "^3.0.2",
+    "crypto-js": "^3.1.0",
     "fastmatter": "^2.1.1",
     "figlet": "^1.2.4",
     "find-up": "^4.1.0",

src/Page.js

@@ -761,6 +761,7 @@ class Page {
       rootPath: this.rootPath,
       userDefinedVariablesMap: this.userDefinedVariablesMap,
       headerIdMap: this.headerIdMap,
+      resultPath: this.resultPath,
     };
     return new Promise((resolve, reject) => {
       markbinder.includeFile(this.sourcePath, fileConfig)

src/lib/markbind/src/constants.js

@@ -2,6 +2,7 @@ module.exports = {
   // src/lib/markbind/src/parser.js
   ATTRIB_INCLUDE_PATH: 'include-path',
   ATTRIB_CWF: 'cwf',
+  ATTRIB_RESULT_PATH: 'resultPath',
 
   BOILERPLATE_FOLDER_NAME: '_markbind/boilerplates',
 

src/lib/markbind/src/lib/markdown-it/index.js

@@ -42,6 +42,31 @@ markdownIt.renderer.rules.table_close = (tokens, idx) => {
   return '</table></div>';
 };
 
+// rewritten markdown-it renderer.js rule to add a div containing the language of the code block 
+markdownIt.renderer.rules.fence = (tokens, idx, options, env, slf) => {
+  var token = tokens[idx],
+    info = token.info ? markdownIt.utils.unescapeAll(token.info).trim() : '',
+    langName = '',
+    highlighted;
+
+  if (info) {
+    langName = info.split(/\s+/g)[0];
+  }
+
+  const widgetHandler = env[langName];
+  if (widgetHandler !== undefined) {
+    return widgetHandler(token.content);
+  }
+
+  if (options.highlight) {
+    highlighted = options.highlight(token.content, langName) || escapeHtml(token.content);
+  } else {
+    highlighted = escapeHtml(token.content);
+  }
+
+  return  highlighted + '\n';
+}
+
 // highlight inline code
 markdownIt.renderer.rules.code_inline = (tokens, idx, options, env, slf) => {
   const token = tokens[idx];

src/lib/markbind/src/parser.js

@@ -8,6 +8,7 @@ const url = require('url');
 const pathIsInside = require('path-is-inside');
 const slugify = require('@sindresorhus/slugify');
 const componentParser = require('./parsers/componentParser');
+const widget = require('../../../widgets/widgets');
 
 const _ = {};
 _.clone = require('lodash/clone');
@@ -383,6 +384,10 @@ class Parser {
         element.children = element.children.map(e => self._preprocess(e, context, config));
       }
     }
+
+
+    widget.preprocessWidget(config, context, element);
+
     return element;
   }
 
@@ -512,6 +517,8 @@ class Parser {
       break;
     }
 
+    widget.parseWidget(config, context, element);
+
     componentParser.parseComponents(element, this._onError);
 
     if (element.children) {
@@ -568,6 +575,7 @@ class Parser {
           }
           return processed;
         });
+
         resolve(cheerio.html(nodes));
       });
 

src/lib/markbind/src/utils.js

@@ -1,5 +1,6 @@
 const fs = require('fs');
 const path = require('path');
+const cheerio = require('cheerio');
 
 const { markdownFileExts } = require('./constants');
 
@@ -100,4 +101,21 @@ module.exports = {
 
     return text.join('').trim();
   },
+
+  extractCodeElement(element, codeLanguage = '') {
+    let codeBlockElement = cheerio.parseHTML('<div></div>', true)[0];
+
+    element.children.forEach((child) => {
+      if (child.name === 'pre' && child.children.length >= 1) {
+        const [nestedChild] = child.children;
+        if (nestedChild.name !== 'code') {
+          return;
+        }
+        [codeBlockElement] = nestedChild.children;
+        codeBlockElement.data = `\`\`\`${codeLanguage}\n${codeBlockElement.data}\n\`\`\``;
+      }
+    });
+
+    return codeBlockElement;
+  },
 };