Added option for whether or not to cloneCssStyles as mentioned in issue #157.

This commit is contained in:
knsv 2015-05-30 17:20:24 +02:00
parent 173a2b12aa
commit 45f34d871b
12 changed files with 740 additions and 153 deletions

View File

@ -19337,8 +19337,6 @@ module.exports.draw = function (text, id) {
// Set height based on number of tasks
var h = taskArray.length * (conf.barHeight + conf.barGap) + 2 * conf.topPadding;
//elem.style.height = h + 'px';
//elem.setAttribute('height', h);
elem.setAttribute('height', "100%");
// Set viewBox
elem.setAttribute('viewBox','0 0 '+w+' '+h);
@ -21505,6 +21503,7 @@ module.exports.drawActors = function(diagram, actors, actorKeys,verticalPos){
module.exports.setConf = function(cnf){
console.log('Got conf:',JSON.stringify(cnf));
var keys = Object.keys(cnf);
keys.forEach(function(key){
@ -21913,6 +21912,8 @@ var init = function () {
var i;
console.log('Found ',nodes.length,' nodes');
console.log('Hooo hooo');
mermaidAPI.initialize(mermaid_config);
var insertSvg = function(svgCode){
element.innerHTML = svgCode;
};
@ -21934,6 +21935,7 @@ var init = function () {
txt = txt.replace(/</g,'&lt;');
txt = he.decode(txt).trim();
mermaidAPI.render(id,txt,insertSvg);
}
@ -22040,6 +22042,71 @@ var ganttDb = require('./diagrams/gantt/ganttDb');
var d3 = require('./d3');
var nextId = 0;
// Default options, can be overridden at initialization time
var config = {
mermaid:{
cloneCssStyles: true
},
flowchart:{
// Default is to not set width
// width: 1200
},
sequenceDiagram:{
diagramMarginX:50,
diagramMarginY:10,
// Margin between actors
actorMargin:50,
// Width of actor moxes
width:150,
// Height of actor boxes
height:65,
// Margin around loop boxes
boxMargin:10,
boxTextMargin:5,
noteMargin:10,
// Space between messages
messageMargin:35,
//mirror actors under diagram
mirrorActors:true,
// Depending on css styling this might need adjustment
// Prolongs the edge of the diagram downwards
bottomMarginAdj:1
},
gantt:{
titleTopMargin: 25,
barHeight: 20,
barGap: 4,
topPadding: 50,
sidePadding: 75,
gridLineStartPadding: 35,
fontSize: 11,
fontFamily: '"Open-Sans", "sans-serif"',
numberSectionStyles:3,
axisFormatter: [
// Within a day
["%I:%M", function (d) {
return d.getHours();
}],
// Monday a week
["w. %U", function (d) {
return d.getDay() == 1;
}],
// Day within a week (not monday)
["%a %d", function (d) {
return d.getDay() && d.getDate() != 1;
}],
// within a month
["%b %d", function (d) {
return d.getDate() != 1;
}],
// Month
["%m-%y", function (d) {
return d.getMonth();
}]
] }
}
/**
* Function that parses a mermaid diagram defintion. If parsing fails the parseError callback is called and an error is
* thrown and
@ -22107,38 +22174,47 @@ var render = function(id, txt,cb){
var classes = {};
switch(graphType){
case 'graph':
classes = flowRenderer.getClasses(txt, false);
if(typeof mermaid.flowchartConfig === 'object'){
flowRenderer.setConf(mermaid.flowchartConfig);
flowRenderer.setConf(config.flowchart);
}
flowRenderer.draw(txt, id, false);
utils.cloneCssStyles(element.firstChild, classes);
if(config.mermaid.cloneCssStyles){
classes = flowRenderer.getClasses(txt, false);
utils.cloneCssStyles(element.firstChild, classes);
}
graph.bindFunctions();
break;
case 'dotGraph':
classes = flowRenderer.getClasses(txt, true);
flowRenderer.draw(txt, id, true);
utils.cloneCssStyles(element.firstChild, classes);
if(config.mermaid.cloneCssStyles) {
classes = flowRenderer.getClasses(txt, true);
utils.cloneCssStyles(element.firstChild, classes);
}
break;
case 'sequenceDiagram':
if(typeof mermaid.sequenceConfig === 'object'){
seq.setConf(mermaid.sequenceConfig);
}
//if(typeof mermaid.sequenceConfig === 'object'){
seq.setConf(config.sequenceDiagram);
//}
seq.draw(txt,id);
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
case 'gantt':
if(typeof mermaid.ganttConfig === 'object'){
gantt.setConf(mermaid.ganttConfig);
gantt.setConf(config.gantt);
}
gantt.draw(txt,id);
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
case 'info':
info.draw(txt,id,exports.version());
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
}
//console.log(document.body.innerHTML);
@ -22197,12 +22273,36 @@ if(typeof document === 'undefined'){
}
};
global.api = {
render : exports.render,
detectType: utils.detectType
var setConf = function(cnf){
// Top level initially mermaid, gflow, sequenceDiagram and gantt
var lvl1Keys = Object.keys(cnf);
var i;
for(i=0;i<lvl1Keys.length;i++){
var lvl2Keys = Object.keys(cnf[lvl1Keys[i]]);
var j;
for(j=0;j<lvl2Keys.length;j++) {
console.log('Setting conf ',lvl1Keys[i],'-',lvl2Keys[j])
config[lvl1Keys[i]][lvl2Keys[j]] = cnf[lvl1Keys[i]][lvl2Keys[j]];
}
}
};
exports.initialize = function(options){
// Update default config with options supplied at initialization
console.log('In init:'+typeof options,JSON.stringify(options))
if(typeof options === 'object'){
setConf(options);
}
console.log('Done init:'+typeof options,JSON.stringify(config))
};
console.log('APA');
global.mermaidAPI = {
render : exports.render,
initialize : exports.initialize,
detectType: utils.detectType
};
//var getBBox = function(selector){
// var xmin, xmax, ymin, ymax,p;

View File

@ -1,6 +1,7 @@
/* Flowchart variables */
/* Sequence Diagram variables */
/* Gantt chart variables */
.mermaid .label {
font-family: 'trebuchet ms', verdana, arial;
color: #333333;

141
dist/mermaid.js vendored
View File

@ -31093,6 +31093,8 @@ var init = function () {
var i;
console.log('Found ',nodes.length,' nodes');
console.log('Hooo hooo');
mermaidAPI.initialize(mermaid_config);
var insertSvg = function(svgCode){
element.innerHTML = svgCode;
};
@ -31114,6 +31116,7 @@ var init = function () {
txt = txt.replace(/</g,'&lt;');
txt = he.decode(txt).trim();
mermaidAPI.render(id,txt,insertSvg);
}
@ -31220,6 +31223,71 @@ var ganttDb = require('./diagrams/gantt/ganttDb');
var d3 = require('./d3');
var nextId = 0;
// Default options, can be overridden at initialization time
var config = {
mermaid:{
cloneCssStyles: true
},
flowchart:{
// Default is to not set width
// width: 1200
},
sequenceDiagram:{
diagramMarginX:50,
diagramMarginY:10,
// Margin between actors
actorMargin:50,
// Width of actor moxes
width:150,
// Height of actor boxes
height:65,
// Margin around loop boxes
boxMargin:10,
boxTextMargin:5,
noteMargin:10,
// Space between messages
messageMargin:35,
//mirror actors under diagram
mirrorActors:true,
// Depending on css styling this might need adjustment
// Prolongs the edge of the diagram downwards
bottomMarginAdj:1
},
gantt:{
titleTopMargin: 25,
barHeight: 20,
barGap: 4,
topPadding: 50,
sidePadding: 75,
gridLineStartPadding: 35,
fontSize: 11,
fontFamily: '"Open-Sans", "sans-serif"',
numberSectionStyles:3,
axisFormatter: [
// Within a day
["%I:%M", function (d) {
return d.getHours();
}],
// Monday a week
["w. %U", function (d) {
return d.getDay() == 1;
}],
// Day within a week (not monday)
["%a %d", function (d) {
return d.getDay() && d.getDate() != 1;
}],
// within a month
["%b %d", function (d) {
return d.getDate() != 1;
}],
// Month
["%m-%y", function (d) {
return d.getMonth();
}]
] }
}
/**
* Function that parses a mermaid diagram defintion. If parsing fails the parseError callback is called and an error is
* thrown and
@ -31287,38 +31355,43 @@ var render = function(id, txt,cb){
var classes = {};
switch(graphType){
case 'graph':
classes = flowRenderer.getClasses(txt, false);
if(typeof mermaid.flowchartConfig === 'object'){
flowRenderer.setConf(mermaid.flowchartConfig);
}
flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, false);
utils.cloneCssStyles(element.firstChild, classes);
if(config.mermaid.cloneCssStyles){
classes = flowRenderer.getClasses(txt, false);
utils.cloneCssStyles(element.firstChild, classes);
}
graph.bindFunctions();
break;
case 'dotGraph':
classes = flowRenderer.getClasses(txt, true);
flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, true);
utils.cloneCssStyles(element.firstChild, classes);
if(config.mermaid.cloneCssStyles) {
classes = flowRenderer.getClasses(txt, true);
utils.cloneCssStyles(element.firstChild, classes);
}
break;
case 'sequenceDiagram':
if(typeof mermaid.sequenceConfig === 'object'){
seq.setConf(mermaid.sequenceConfig);
}
//if(typeof mermaid.sequenceConfig === 'object'){
seq.setConf(config.sequenceDiagram);
//}
seq.draw(txt,id);
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
case 'gantt':
if(typeof mermaid.ganttConfig === 'object'){
gantt.setConf(mermaid.ganttConfig);
}
gantt.setConf(config.gantt);
gantt.draw(txt,id);
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
case 'info':
info.draw(txt,id,exports.version());
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
}
//console.log(document.body.innerHTML);
@ -31377,12 +31450,36 @@ if(typeof document === 'undefined'){
}
};
global.api = {
render : exports.render,
detectType: utils.detectType
var setConf = function(cnf){
// Top level initially mermaid, gflow, sequenceDiagram and gantt
var lvl1Keys = Object.keys(cnf);
var i;
for(i=0;i<lvl1Keys.length;i++){
var lvl2Keys = Object.keys(cnf[lvl1Keys[i]]);
var j;
for(j=0;j<lvl2Keys.length;j++) {
console.log('Setting conf ',lvl1Keys[i],'-',lvl2Keys[j])
config[lvl1Keys[i]][lvl2Keys[j]] = cnf[lvl1Keys[i]][lvl2Keys[j]];
}
}
};
exports.initialize = function(options){
// Update default config with options supplied at initialization
console.log('In init:'+typeof options,JSON.stringify(options))
if(typeof options === 'object'){
setConf(options);
}
console.log('Done init:'+typeof options,JSON.stringify(config))
};
console.log('APA');
global.mermaidAPI = {
render : exports.render,
initialize : exports.initialize,
detectType: utils.detectType
};
//var getBBox = function(selector){
// var xmin, xmax, ymin, ymax,p;

24
dist/mermaid.min.js vendored

File diff suppressed because one or more lines are too long

141
dist/mermaid.slim.js vendored
View File

@ -21877,6 +21877,8 @@ var init = function () {
var i;
console.log('Found ',nodes.length,' nodes');
console.log('Hooo hooo');
mermaidAPI.initialize(mermaid_config);
var insertSvg = function(svgCode){
element.innerHTML = svgCode;
};
@ -21898,6 +21900,7 @@ var init = function () {
txt = txt.replace(/</g,'&lt;');
txt = he.decode(txt).trim();
mermaidAPI.render(id,txt,insertSvg);
}
@ -22004,6 +22007,71 @@ var ganttDb = require('./diagrams/gantt/ganttDb');
var d3 = require('./d3');
var nextId = 0;
// Default options, can be overridden at initialization time
var config = {
mermaid:{
cloneCssStyles: true
},
flowchart:{
// Default is to not set width
// width: 1200
},
sequenceDiagram:{
diagramMarginX:50,
diagramMarginY:10,
// Margin between actors
actorMargin:50,
// Width of actor moxes
width:150,
// Height of actor boxes
height:65,
// Margin around loop boxes
boxMargin:10,
boxTextMargin:5,
noteMargin:10,
// Space between messages
messageMargin:35,
//mirror actors under diagram
mirrorActors:true,
// Depending on css styling this might need adjustment
// Prolongs the edge of the diagram downwards
bottomMarginAdj:1
},
gantt:{
titleTopMargin: 25,
barHeight: 20,
barGap: 4,
topPadding: 50,
sidePadding: 75,
gridLineStartPadding: 35,
fontSize: 11,
fontFamily: '"Open-Sans", "sans-serif"',
numberSectionStyles:3,
axisFormatter: [
// Within a day
["%I:%M", function (d) {
return d.getHours();
}],
// Monday a week
["w. %U", function (d) {
return d.getDay() == 1;
}],
// Day within a week (not monday)
["%a %d", function (d) {
return d.getDay() && d.getDate() != 1;
}],
// within a month
["%b %d", function (d) {
return d.getDate() != 1;
}],
// Month
["%m-%y", function (d) {
return d.getMonth();
}]
] }
}
/**
* Function that parses a mermaid diagram defintion. If parsing fails the parseError callback is called and an error is
* thrown and
@ -22071,38 +22139,43 @@ var render = function(id, txt,cb){
var classes = {};
switch(graphType){
case 'graph':
classes = flowRenderer.getClasses(txt, false);
if(typeof mermaid.flowchartConfig === 'object'){
flowRenderer.setConf(mermaid.flowchartConfig);
}
flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, false);
utils.cloneCssStyles(element.firstChild, classes);
if(config.mermaid.cloneCssStyles){
classes = flowRenderer.getClasses(txt, false);
utils.cloneCssStyles(element.firstChild, classes);
}
graph.bindFunctions();
break;
case 'dotGraph':
classes = flowRenderer.getClasses(txt, true);
flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, true);
utils.cloneCssStyles(element.firstChild, classes);
if(config.mermaid.cloneCssStyles) {
classes = flowRenderer.getClasses(txt, true);
utils.cloneCssStyles(element.firstChild, classes);
}
break;
case 'sequenceDiagram':
if(typeof mermaid.sequenceConfig === 'object'){
seq.setConf(mermaid.sequenceConfig);
}
//if(typeof mermaid.sequenceConfig === 'object'){
seq.setConf(config.sequenceDiagram);
//}
seq.draw(txt,id);
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
case 'gantt':
if(typeof mermaid.ganttConfig === 'object'){
gantt.setConf(mermaid.ganttConfig);
}
gantt.setConf(config.gantt);
gantt.draw(txt,id);
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
case 'info':
info.draw(txt,id,exports.version());
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
}
//console.log(document.body.innerHTML);
@ -22161,12 +22234,36 @@ if(typeof document === 'undefined'){
}
};
global.api = {
render : exports.render,
detectType: utils.detectType
var setConf = function(cnf){
// Top level initially mermaid, gflow, sequenceDiagram and gantt
var lvl1Keys = Object.keys(cnf);
var i;
for(i=0;i<lvl1Keys.length;i++){
var lvl2Keys = Object.keys(cnf[lvl1Keys[i]]);
var j;
for(j=0;j<lvl2Keys.length;j++) {
console.log('Setting conf ',lvl1Keys[i],'-',lvl2Keys[j])
config[lvl1Keys[i]][lvl2Keys[j]] = cnf[lvl1Keys[i]][lvl2Keys[j]];
}
}
};
exports.initialize = function(options){
// Update default config with options supplied at initialization
console.log('In init:'+typeof options,JSON.stringify(options))
if(typeof options === 'object'){
setConf(options);
}
console.log('Done init:'+typeof options,JSON.stringify(config))
};
console.log('APA');
global.mermaidAPI = {
render : exports.render,
initialize : exports.initialize,
detectType: utils.detectType
};
//var getBBox = function(selector){
// var xmin, xmax, ymin, ymax,p;

File diff suppressed because one or more lines are too long

138
dist/mermaidAPI.js vendored
View File

@ -30728,6 +30728,71 @@ var ganttDb = require('./diagrams/gantt/ganttDb');
var d3 = require('./d3');
var nextId = 0;
// Default options, can be overridden at initialization time
var config = {
mermaid:{
cloneCssStyles: true
},
flowchart:{
// Default is to not set width
// width: 1200
},
sequenceDiagram:{
diagramMarginX:50,
diagramMarginY:10,
// Margin between actors
actorMargin:50,
// Width of actor moxes
width:150,
// Height of actor boxes
height:65,
// Margin around loop boxes
boxMargin:10,
boxTextMargin:5,
noteMargin:10,
// Space between messages
messageMargin:35,
//mirror actors under diagram
mirrorActors:true,
// Depending on css styling this might need adjustment
// Prolongs the edge of the diagram downwards
bottomMarginAdj:1
},
gantt:{
titleTopMargin: 25,
barHeight: 20,
barGap: 4,
topPadding: 50,
sidePadding: 75,
gridLineStartPadding: 35,
fontSize: 11,
fontFamily: '"Open-Sans", "sans-serif"',
numberSectionStyles:3,
axisFormatter: [
// Within a day
["%I:%M", function (d) {
return d.getHours();
}],
// Monday a week
["w. %U", function (d) {
return d.getDay() == 1;
}],
// Day within a week (not monday)
["%a %d", function (d) {
return d.getDay() && d.getDate() != 1;
}],
// within a month
["%b %d", function (d) {
return d.getDate() != 1;
}],
// Month
["%m-%y", function (d) {
return d.getMonth();
}]
] }
}
/**
* Function that parses a mermaid diagram defintion. If parsing fails the parseError callback is called and an error is
* thrown and
@ -30795,38 +30860,43 @@ var render = function(id, txt,cb){
var classes = {};
switch(graphType){
case 'graph':
classes = flowRenderer.getClasses(txt, false);
if(typeof mermaid.flowchartConfig === 'object'){
flowRenderer.setConf(mermaid.flowchartConfig);
}
flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, false);
utils.cloneCssStyles(element.firstChild, classes);
if(config.mermaid.cloneCssStyles){
classes = flowRenderer.getClasses(txt, false);
utils.cloneCssStyles(element.firstChild, classes);
}
graph.bindFunctions();
break;
case 'dotGraph':
classes = flowRenderer.getClasses(txt, true);
flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, true);
utils.cloneCssStyles(element.firstChild, classes);
if(config.mermaid.cloneCssStyles) {
classes = flowRenderer.getClasses(txt, true);
utils.cloneCssStyles(element.firstChild, classes);
}
break;
case 'sequenceDiagram':
if(typeof mermaid.sequenceConfig === 'object'){
seq.setConf(mermaid.sequenceConfig);
}
//if(typeof mermaid.sequenceConfig === 'object'){
seq.setConf(config.sequenceDiagram);
//}
seq.draw(txt,id);
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
case 'gantt':
if(typeof mermaid.ganttConfig === 'object'){
gantt.setConf(mermaid.ganttConfig);
}
gantt.setConf(config.gantt);
gantt.draw(txt,id);
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
case 'info':
info.draw(txt,id,exports.version());
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
}
//console.log(document.body.innerHTML);
@ -30885,12 +30955,36 @@ if(typeof document === 'undefined'){
}
};
global.api = {
render : exports.render,
detectType: utils.detectType
var setConf = function(cnf){
// Top level initially mermaid, gflow, sequenceDiagram and gantt
var lvl1Keys = Object.keys(cnf);
var i;
for(i=0;i<lvl1Keys.length;i++){
var lvl2Keys = Object.keys(cnf[lvl1Keys[i]]);
var j;
for(j=0;j<lvl2Keys.length;j++) {
console.log('Setting conf ',lvl1Keys[i],'-',lvl2Keys[j])
config[lvl1Keys[i]][lvl2Keys[j]] = cnf[lvl1Keys[i]][lvl2Keys[j]];
}
}
};
exports.initialize = function(options){
// Update default config with options supplied at initialization
console.log('In init:'+typeof options,JSON.stringify(options))
if(typeof options === 'object'){
setConf(options);
}
console.log('Done init:'+typeof options,JSON.stringify(config))
};
console.log('APA');
global.mermaidAPI = {
render : exports.render,
initialize : exports.initialize,
detectType: utils.detectType
};
//var getBBox = function(selector){
// var xmin, xmax, ymin, ymax,p;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -48,6 +48,8 @@ var init = function () {
var i;
console.log('Found ',nodes.length,' nodes');
console.log('Hooo hooo');
mermaidAPI.initialize(mermaid_config);
var insertSvg = function(svgCode){
element.innerHTML = svgCode;
};
@ -69,6 +71,7 @@ var init = function () {
txt = txt.replace(/</g,'&lt;');
txt = he.decode(txt).trim();
mermaidAPI.render(id,txt,insertSvg);
}

View File

@ -16,6 +16,71 @@ var ganttDb = require('./diagrams/gantt/ganttDb');
var d3 = require('./d3');
var nextId = 0;
// Default options, can be overridden at initialization time
var config = {
mermaid:{
cloneCssStyles: true
},
flowchart:{
// Default is to not set width
// width: 1200
},
sequenceDiagram:{
diagramMarginX:50,
diagramMarginY:10,
// Margin between actors
actorMargin:50,
// Width of actor moxes
width:150,
// Height of actor boxes
height:65,
// Margin around loop boxes
boxMargin:10,
boxTextMargin:5,
noteMargin:10,
// Space between messages
messageMargin:35,
//mirror actors under diagram
mirrorActors:true,
// Depending on css styling this might need adjustment
// Prolongs the edge of the diagram downwards
bottomMarginAdj:1
},
gantt:{
titleTopMargin: 25,
barHeight: 20,
barGap: 4,
topPadding: 50,
sidePadding: 75,
gridLineStartPadding: 35,
fontSize: 11,
fontFamily: '"Open-Sans", "sans-serif"',
numberSectionStyles:3,
axisFormatter: [
// Within a day
["%I:%M", function (d) {
return d.getHours();
}],
// Monday a week
["w. %U", function (d) {
return d.getDay() == 1;
}],
// Day within a week (not monday)
["%a %d", function (d) {
return d.getDay() && d.getDate() != 1;
}],
// within a month
["%b %d", function (d) {
return d.getDate() != 1;
}],
// Month
["%m-%y", function (d) {
return d.getMonth();
}]
] }
}
/**
* Function that parses a mermaid diagram defintion. If parsing fails the parseError callback is called and an error is
* thrown and
@ -83,38 +148,43 @@ var render = function(id, txt,cb){
var classes = {};
switch(graphType){
case 'graph':
classes = flowRenderer.getClasses(txt, false);
if(typeof mermaid.flowchartConfig === 'object'){
flowRenderer.setConf(mermaid.flowchartConfig);
}
flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, false);
utils.cloneCssStyles(element.firstChild, classes);
if(config.mermaid.cloneCssStyles){
classes = flowRenderer.getClasses(txt, false);
utils.cloneCssStyles(element.firstChild, classes);
}
graph.bindFunctions();
break;
case 'dotGraph':
classes = flowRenderer.getClasses(txt, true);
flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, true);
utils.cloneCssStyles(element.firstChild, classes);
if(config.mermaid.cloneCssStyles) {
classes = flowRenderer.getClasses(txt, true);
utils.cloneCssStyles(element.firstChild, classes);
}
break;
case 'sequenceDiagram':
if(typeof mermaid.sequenceConfig === 'object'){
seq.setConf(mermaid.sequenceConfig);
}
//if(typeof mermaid.sequenceConfig === 'object'){
seq.setConf(config.sequenceDiagram);
//}
seq.draw(txt,id);
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
case 'gantt':
if(typeof mermaid.ganttConfig === 'object'){
gantt.setConf(mermaid.ganttConfig);
}
gantt.setConf(config.gantt);
gantt.draw(txt,id);
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
case 'info':
info.draw(txt,id,exports.version());
utils.cloneCssStyles(element.firstChild, []);
if(config.mermaid.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []);
}
break;
}
//console.log(document.body.innerHTML);
@ -173,12 +243,36 @@ if(typeof document === 'undefined'){
}
};
global.api = {
render : exports.render,
detectType: utils.detectType
var setConf = function(cnf){
// Top level initially mermaid, gflow, sequenceDiagram and gantt
var lvl1Keys = Object.keys(cnf);
var i;
for(i=0;i<lvl1Keys.length;i++){
var lvl2Keys = Object.keys(cnf[lvl1Keys[i]]);
var j;
for(j=0;j<lvl2Keys.length;j++) {
console.log('Setting conf ',lvl1Keys[i],'-',lvl2Keys[j])
config[lvl1Keys[i]][lvl2Keys[j]] = cnf[lvl1Keys[i]][lvl2Keys[j]];
}
}
};
exports.initialize = function(options){
// Update default config with options supplied at initialization
console.log('In init:'+typeof options,JSON.stringify(options))
if(typeof options === 'object'){
setConf(options);
}
console.log('Done init:'+typeof options,JSON.stringify(config))
};
console.log('APA');
global.mermaidAPI = {
render : exports.render,
initialize : exports.initialize,
detectType: utils.detectType
};
//var getBBox = function(selector){
// var xmin, xmax, ymin, ymax,p;

View File

@ -3,13 +3,20 @@
<head>
<meta charset="UTF-8">
<script src="../dist/mermaid.full.js"></script>
<script src="../dist/mermaid.js"></script>
<link rel="stylesheet" href="seq.css"/>
<script>
var mermaid_config = {
startOnLoad:true
startOnLoad:true,
mermaid:{
cloneCssStyles: false
},
sequenceDiagram:{
mirrorActors:true
}
}
mermaid.sequenceConfig = '{"diagramMarginX":50,"diagramMarginY":10,"actorMargin":50,"width":150,"height":45,"boxMargin":10,"boxTextMargin":5,"noteMargin":10,"messageMargin":35, "mirrorActors":true}';
//mermaid.sequenceConfig = '{"diagramMarginX":50,"diagramMarginY":10,"actorMargin":50,"width":150,"height":45,"boxMargin":10,"boxTextMargin":5,"noteMargin":10,"messageMargin":35, "mirrorActors":true}';
//mermaid.sequenceConfig = JSON.parse('{"diagramMarginX":50,"diagramMarginY":10,"actorMargin":50,"width":150,"height":165,"boxMargin":10,"boxTextMargin":5,"noteMargin":10,"messageMargin":35}');
</script>