Add new parameter to the console client to override the svg configuration in sequence diagrams

Author: jjmr

dist/mermaid.full.js

@@ -23,6 +23,7 @@ function cli(options) {
         , svg: 's'
         , verbose: 'v'
         , phantomPath: 'e'
+        , sequenceConfig: 'c'
       }
     , 'boolean': ['help', 'png', 'svg']
     , 'string': ['outputDir']
@@ -37,13 +38,14 @@ function cli(options) {
     , "file    The mermaid description file to be rendered"
     , ""
     , "Options:"
-    , "  -s --svg          Output SVG instead of PNG (experimental)"
-    , "  -p --png          If SVG was selected, and you also want PNG, set this flag"
-    , "  -o --outputDir    Directory to save files, will be created automatically, defaults to `cwd`"
-    , "  -e --phantomPath  Specify the path to the phantomjs executable"
-    , "  -h --help         Show this message"
-    , "  -v --verbose      Show logging"
-    , "  --version         Print version and quit"
+    , "  -s --svg             Output SVG instead of PNG (experimental)"
+    , "  -p --png             If SVG was selected, and you also want PNG, set this flag"
+    , "  -o --outputDir       Directory to save files, will be created automatically, defaults to `cwd`"
+    , "  -e --phantomPath     Specify the path to the phantomjs executable"
+    , "  -c --sequenceConfig  Specify the path to the file with the configuration to be applied in the sequence diagram"
+    , "  -h --help            Show this message"
+    , "  -v --verbose         Show logging"
+    , "  --version            Print version and quit"
   ]
 
   return this
@@ -70,7 +72,7 @@ cli.prototype.parse = function(argv, next) {
     }
 
     // ensure that parameter-expecting options have parameters
-    ;['outputDir', 'phantomPath'].forEach(function(i) {
+    ;['outputDir', 'phantomPath', 'sequenceConfig'].forEach(function(i) {
       if(typeof options[i] !== 'undefined') {
         if (typeof options[i] !== 'string' || options[i].length < 1) {
           this.errors.push(new Error(i + " expects a value."))
@@ -86,6 +88,10 @@ cli.prototype.parse = function(argv, next) {
       options.png = true
     }
 
+    if (options.sequenceConfig) {
+      options.sequenceConfig = checkConfig(options.sequenceConfig)
+    }
+
     this.checkPhantom = createCheckPhantom(options.phantomPath)
 
     this.checkPhantom(function(err, path) {
@@ -102,6 +108,16 @@ cli.prototype.parse = function(argv, next) {
   }
 }
 
+function checkConfig(configPath) {
+  try {
+    var text = fs.readFileSync(configPath, 'utf8')
+    JSON.parse(text)
+    return text
+  } catch (e) {
+    return null;
+  }
+}
+
 function createCheckPhantom(_phantomPath) {
   var phantomPath = _phantomPath
     , phantomVersion
@@ -128,7 +144,7 @@ function createCheckPhantom(_phantomPath) {
                 , "details."
               ].join('\n')
             )
-            
+
             next(err)
             return
           }

dist/mermaid.full.min.js

@@ -18,6 +18,7 @@ function processMermaid(files, _options, _next) {
         , outputDir
         , options.png
         , options.svg
+        , options.sequenceConfig
         , options.verbose
       ]
 

dist/mermaid.slim.js

@@ -29,12 +29,13 @@ var system = require('system')
   , webpage = require('webpage')
 
 var page = webpage.create()
-  , files = phantom.args.slice(4, phantom.args.length)
+  , files = phantom.args.slice(5, phantom.args.length)
   , options = {
         outputDir: phantom.args[0]
       , png: phantom.args[1] === 'true' ? true : false
       , svg: phantom.args[2] === 'true' ? true : false
-      , verbose: phantom.args[3] === 'true' ? true : false
+      , sequenceConfig: phantom.args[3]
+      , verbose: phantom.args[4] === 'true' ? true : false
     }
   , log = logger(options.verbose)
 
@@ -51,7 +52,9 @@ page.content = [
 ].join('\n')
 
 page.injectJs('../dist/mermaid.full.js')
-
+page.onConsoleMessage = function(msg, lineNum, sourceId) {
+    console.log('CONSOLE: ' + msg + ' (from line #' + lineNum + ' in "' + sourceId + '")');
+};
 files.forEach(function(file) {
   var contents = fs.read(file)
     , filename = file.split(fs.separator).slice(-1)
@@ -63,7 +66,10 @@ files.forEach(function(file) {
   // this JS is executed in this statement is sandboxed, even though it doesn't
   // look like it. we need to serialize then unserialize the svgContent that's
   // taken from the DOM
-  svgContent = page.evaluate(executeInPage, contents)
+  svgContent = page.evaluate(executeInPage, {
+    contents: contents,
+    sequenceConfig: options.sequenceConfig
+  })
   oDOM = oParser.parseFromString(svgContent, "text/xml")
 
   resolveSVGElement(oDOM.firstChild)
@@ -182,8 +188,10 @@ function resolveForeignObjects(element) {
 }
 
 // The sandboxed function that's executed in-page by phantom
-function executeInPage(contents) {
+function executeInPage(data) {
   var xmlSerializer = new XMLSerializer()
+    , contents = data.contents
+    , sequenceConfig = data.sequenceConfig
     , toRemove
     , el
     , elContent
@@ -204,7 +212,7 @@ function executeInPage(contents) {
 
   document.body.appendChild(el)
 
-  mermaid.init()
+  mermaid.init(sequenceConfig)
 
   svg = document.querySelector('svg')
   svgValue = xmlSerializer.serializeToString(svg)

dist/mermaid.slim.min.js

@@ -18,10 +18,14 @@ var he = require('he');
  *  c-->|No |d(Transform);
  * ```
  */
-var init = function () {
+var init = function (sequenceConfig) {
     var arr = document.querySelectorAll('.mermaid');
     var i;
 
+    if (sequenceConfig) {
+      seq.setConf(JSON.parse(sequenceConfig));
+    }
+
     var cnt = 0;
     for (i = 0; i < arr.length; i++) {
         var element = arr[i];
@@ -51,18 +55,18 @@ var init = function () {
         var classes = {};
 
         switch(graphType){
-            case 'graph': 
+            case 'graph':
                 classes = flowRenderer.getClasses(txt, false);
                 flowRenderer.draw(txt, id, false);
                 utils.cloneCssStyles(element.firstChild, classes);
                 graph.bindFunctions();
                 break;
-            case 'dotGraph': 
+            case 'dotGraph':
                 classes = flowRenderer.getClasses(txt, true);
                 flowRenderer.draw(txt, id, true);
                 utils.cloneCssStyles(element.firstChild, classes);
                 break;
-            case 'sequenceDiagram': 
+            case 'sequenceDiagram':
                 seq.draw(txt,id);
                 // TODO - Get styles for sequence diagram
                 utils.cloneCssStyles(element.firstChild, []);
@@ -94,8 +98,8 @@ var equals = function (val, variable){
 
 global.mermaid = {
     startOnLoad:true,
-    init:function(){
-        init();
+    init:function(sequenceConfig){
+        init(sequenceConfig);
     },
     version:function(){
         return exports.version();