GitHub/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-02-04 07:13:25 +08:00
Code Issues Projects Releases Wiki Activity

Fix for issues #249. Adding configuration option for when to use absolute references for arrow heads. Default is off.

Browse Source 
Jasmine tests running in browser via karma.
This commit is contained in:
knsv 2015-11-21 11:51:15 +01:00
parent 4eb38e4cfd
commit 51858c02eb
25 changed files with 585 additions and 598 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

165
dist/mermaid.js vendored
View File

@ -31035,12 +31035,13 @@ module.exports={
"live": "live-server ./test/examples", "live": "live-server ./test/examples",
"lint": "node node_modules/eslint/bin/eslint.js src", "lint": "node node_modules/eslint/bin/eslint.js src",
"jison": "gulp jison_legacy", "jison": "gulp jison_legacy",
"karma": "./node_modules/karma/bin/karma start karma.conf.js --single-run",
"watch": "source ./scripts/watch.sh", "watch": "source ./scripts/watch.sh",
"doc": "rm -r build;rm -r dist/www;gulp vartree;cp dist/www/all.html ../mermaid-pages/index.html;cp dist/mermaid.js ../mermaid-pages/javascripts/lib;cp dist/mermaid.forest.css ../mermaid-pages/stylesheets", "doc": "rm -r build;rm -r dist/www;gulp vartree;cp dist/www/all.html ../mermaid-pages/index.html;cp dist/mermaid.js ../mermaid-pages/javascripts/lib;cp dist/mermaid.forest.css ../mermaid-pages/stylesheets",
"tape": "node node_modules/.bin/tape test/cli_test-*.js", "tape": "node node_modules/.bin/tape test/cli_test-*.js",
"jasmine": "npm run jison &&node node_modules/jasmine-es6/bin/jasmine.js", "jasmine": "npm run jison &&node node_modules/jasmine-es6/bin/jasmine.js",
"posttest": "npm run jison", "pretest": "npm run jison",
"test": "npm run dist && npm run jasmine && npm run tape", "test": "npm run dist && npm run karma && npm run tape",
"dist-slim-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.slim.js -x d3 && cat dist/mermaid.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.slim.min.js", "dist-slim-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.slim.js -x d3 && cat dist/mermaid.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.slim.min.js",
"dist-slim-mermaidAPI": "node node_modules/browserify/bin/cmd.js src/mermaidAPI.js -t babelify -s mermaidAPI -o dist/mermaidAPI.slim.js -x d3 && cat dist/mermaidAPI.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaidAPI.slim.min.js", "dist-slim-mermaidAPI": "node node_modules/browserify/bin/cmd.js src/mermaidAPI.js -t babelify -s mermaidAPI -o dist/mermaidAPI.slim.js -x d3 && cat dist/mermaidAPI.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaidAPI.slim.min.js",
"dist-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.js && cat dist/mermaid.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.min.js", "dist-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.js && cat dist/mermaid.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.min.js",
@ -31068,7 +31069,6 @@ module.exports={
"devDependencies": { "devDependencies": {
"async": "^0.9.0", "async": "^0.9.0",
"babel-eslint": "^4.1.3", "babel-eslint": "^4.1.3",
"babelify": "^6.4.0", "babelify": "^6.4.0",
"browserify": "~6.2.0", "browserify": "~6.2.0",
"clone": "^0.2.0", "clone": "^0.2.0",
@ -31095,6 +31095,7 @@ module.exports={
"gulp-insert": "^0.4.0", "gulp-insert": "^0.4.0",
"gulp-istanbul": "^0.4.0", "gulp-istanbul": "^0.4.0",
"gulp-jasmine": "~2.1.0", "gulp-jasmine": "~2.1.0",
"gulp-jasmine-browser": "^0.2.3",
"gulp-jison": "~1.2.0", "gulp-jison": "~1.2.0",
"gulp-jshint": "^1.9.0", "gulp-jshint": "^1.9.0",
"gulp-less": "^3.0.1", "gulp-less": "^3.0.1",
@ -31106,6 +31107,7 @@ module.exports={
"gulp-shell": "^0.2.10", "gulp-shell": "^0.2.10",
"gulp-tag-version": "^1.2.1", "gulp-tag-version": "^1.2.1",
"gulp-uglify": "~1.0.1", "gulp-uglify": "~1.0.1",
"gulp-util": "^3.0.7",
"gulp-vartree": "^2.0.1", "gulp-vartree": "^2.0.1",
"hogan.js": "^3.0.2", "hogan.js": "^3.0.2",
"jasmine": "2.3.2", "jasmine": "2.3.2",
@ -31113,12 +31115,15 @@ module.exports={
"jison": "zaach/jison", "jison": "zaach/jison",
"jsdom": "^7.0.2", "jsdom": "^7.0.2",
"jshint-stylish": "^2.0.1", "jshint-stylish": "^2.0.1",
"karma-babel-preprocessor": "^6.0.1",
"map-stream": "0.0.6", "map-stream": "0.0.6",
"marked": "^0.3.2", "marked": "^0.3.2",
"mock-browser": "^0.91.34", "mock-browser": "^0.91.34",
"path": "^0.4.9", "path": "^0.4.9",
"phantomjs": "^1.9.18", "phantomjs": "^1.9.18",
"proxyquire": "^1.3.1", "proxyquire": "^1.7.3",
"proxyquire-universal": "^1.0.8",
"proxyquireify": "^3.0.0",
"require-dir": "^0.3.0", "require-dir": "^0.3.0",
"rewire": "^2.1.3", "rewire": "^2.1.3",
"rimraf": "^2.2.8", "rimraf": "^2.2.8",
@ -31727,7 +31732,6 @@ var getGraphId = function getGraphId(label) {
return undefined; return undefined;
}; };
window.tunk = getGraphId;
/** /**
* Setup arrow head and define the marker. The result is appended to the svg. * Setup arrow head and define the marker. The result is appended to the svg.
*/ */
@ -31778,10 +31782,12 @@ var drawEdge = function drawEdge(elem, path, relation) {
.interpolate('basis'); .interpolate('basis');
var svgPath = elem.append('path').attr('d', lineFunction(lineData)).attr('id', 'edge' + edgeCount).attr('class', 'relation'); var svgPath = elem.append('path').attr('d', lineFunction(lineData)).attr('id', 'edge' + edgeCount).attr('class', 'relation');
var url = '';
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; if (conf.arrowMarkerAbsolute) {
url = url.replace(/\(/g, '\\('); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\)/g, '\\)'); url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
//console.log(relation.relation.type1); //console.log(relation.relation.type1);
if (relation.relation.type1 !== 'none') { if (relation.relation.type1 !== 'none') {
@ -31857,31 +31863,15 @@ var drawClass = function drawClass(elem, classDef) {
.attr('x', conf.padding).attr('y', titleHeight + conf.dividerMargin + conf.textHeight).attr('fill', 'white').attr('class', 'classText'); .attr('x', conf.padding).attr('y', titleHeight + conf.dividerMargin + conf.textHeight).attr('fill', 'white').attr('class', 'classText');
var isFirst = true; var isFirst = true;
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try { classDef.members.forEach(function (member) {
for (var _iterator = classDef.members[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { addTspan(members, member, isFirst);
var member = _step.value; isFirst = false;
});
addTspan(members, member, isFirst); //for (var member of classDef.members) {
isFirst = false; // addTspan(members, member, isFirst);
} // isFirst = false;
} catch (err) { //}
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator['return']) {
_iterator['return']();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
console.warn(JSON.stringify(classDef)); console.warn(JSON.stringify(classDef));
@ -31894,31 +31884,15 @@ var drawClass = function drawClass(elem, classDef) {
.attr('x', conf.padding).attr('y', titleHeight + 2 * conf.dividerMargin + membersBox.height + conf.textHeight).attr('fill', 'white').attr('class', 'classText'); .attr('x', conf.padding).attr('y', titleHeight + 2 * conf.dividerMargin + membersBox.height + conf.textHeight).attr('fill', 'white').attr('class', 'classText');
isFirst = true; isFirst = true;
var _iteratorNormalCompletion2 = true;
var _didIteratorError2 = false;
var _iteratorError2 = undefined;
try { classDef.methods.forEach(function (method) {
for (var _iterator2 = classDef.methods[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { addTspan(methods, method, isFirst);
var method = _step2.value; isFirst = false;
});
addTspan(methods, method, isFirst); //for (var method of classDef.methods) {
isFirst = false; // addTspan(methods, method, isFirst);
} // isFirst = false;
} catch (err) { //}
_didIteratorError2 = true;
_iteratorError2 = err;
} finally {
try {
if (!_iteratorNormalCompletion2 && _iterator2['return']) {
_iterator2['return']();
}
} finally {
if (_didIteratorError2) {
throw _iteratorError2;
}
}
}
var classBox = g.node().getBBox(); var classBox = g.node().getBBox();
g.insert('rect', ':first-child').attr('x', 0).attr('y', 0).attr('width', classBox.width + 2 * conf.padding).attr('height', classBox.height + conf.padding + 0.5 * conf.dividerMargin); g.insert('rect', ':first-child').attr('x', 0).attr('y', 0).attr('width', classBox.width + 2 * conf.padding).attr('height', classBox.height + conf.padding + 0.5 * conf.dividerMargin);
@ -31993,33 +31967,16 @@ module.exports.draw = function (text, id) {
var relations = cDDb.getRelations(); var relations = cDDb.getRelations();
var i = 0; var i = 0;
var _iteratorNormalCompletion3 = true; relations.forEach(function (relation) {
var _didIteratorError3 = false; i = i + 1;
var _iteratorError3 = undefined; log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation));
g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), { relation: relation });
try { });
for (var _iterator3 = relations[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) { //for (var relation of relations) {
var relation = _step3.value; // i = i + 1;
// log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation));
i = i + 1; // g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), {relation: relation});
log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation)); //}
g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), { relation: relation });
}
} catch (err) {
_didIteratorError3 = true;
_iteratorError3 = err;
} finally {
try {
if (!_iteratorNormalCompletion3 && _iterator3['return']) {
_iterator3['return']();
}
} finally {
if (_didIteratorError3) {
throw _iteratorError3;
}
}
}
dagre.layout(g); dagre.layout(g);
g.nodes().forEach(function (v) { g.nodes().forEach(function (v) {
if (typeof v !== 'undefined') { if (typeof v !== 'undefined') {
@ -38958,9 +38915,12 @@ var drawMessage = function drawMessage(elem, startx, stopx, verticalPos, msg) {
line.attr('class', 'messageLine0'); line.attr('class', 'messageLine0');
} }
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; var url = '';
url = url.replace(/\(/g, '\\('); if (conf.arrowMarkerAbsolute) {
url = url.replace(/\)/g, '\\)'); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
line.attr('stroke-width', 2); line.attr('stroke-width', 2);
line.attr('stroke', 'black'); line.attr('stroke', 'black');
@ -39184,6 +39144,7 @@ exports.drawText = function (elem, textData, width) {
//span.attr('dy', textData.dy); //span.attr('dy', textData.dy);
span.text(nText); span.text(nText);
if (typeof textElem.textwrap !== 'undefined') { if (typeof textElem.textwrap !== 'undefined') {
textElem.textwrap({ textElem.textwrap({
x: textData.x, // bounding box is 300 pixels from the left x: textData.x, // bounding box is 300 pixels from the left
y: textData.y, // bounding box is 400 pixels from the top y: textData.y, // bounding box is 400 pixels from the top
@ -39784,6 +39745,12 @@ var config = {
*/ */
startOnLoad: true, startOnLoad: true,
/**
* **arrowMarkerAbsolute** - This options controls whether or arrow markers in html code will be absolute pats or
* an anchor, #. This matters if you are using base tag settings.
*/
arrowMarkerAbsolute: false,
/** /**
* ### flowchart * ### flowchart
* *The object containing configurations specific for flowcharts* * *The object containing configurations specific for flowcharts*
@ -39944,7 +39911,8 @@ var config = {
['%m-%y', function (d) { ['%m-%y', function (d) {
return d.getMonth(); return d.getMonth();
}]] }]]
} },
classDiagram: {}
}; };
Logger.setLogLevel(config.logLevel); Logger.setLogLevel(config.logLevel);
@ -40086,7 +40054,7 @@ var render = function render(id, txt, cb, container) {
var classes = {}; var classes = {};
switch (graphType) { switch (graphType) {
case 'graph': case 'graph':
config.flowchart.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
flowRenderer.setConf(config.flowchart); flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, false); flowRenderer.draw(txt, id, false);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -40095,6 +40063,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'dotGraph': case 'dotGraph':
config.flowchart.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
flowRenderer.setConf(config.flowchart); flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, true); flowRenderer.draw(txt, id, true);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -40103,6 +40072,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'sequenceDiagram': case 'sequenceDiagram':
config.sequenceDiagram.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
seq.setConf(config.sequenceDiagram); seq.setConf(config.sequenceDiagram);
seq.draw(txt, id); seq.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -40110,6 +40080,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'gantt': case 'gantt':
config.gantt.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
gantt.setConf(config.gantt); gantt.setConf(config.gantt);
gantt.draw(txt, id); gantt.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -40117,13 +40088,15 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'classDiagram': case 'classDiagram':
classRenderer.setConf(config.gantt); config.classDiagram.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
classRenderer.setConf(config.classDiagram);
classRenderer.draw(txt, id); classRenderer.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []); utils.cloneCssStyles(element.firstChild, []);
} }
break; break;
case 'info': case 'info':
config.info.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
info.draw(txt, id, exports.version()); info.draw(txt, id, exports.version());
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []); utils.cloneCssStyles(element.firstChild, []);
@ -40133,9 +40106,13 @@ var render = function render(id, txt, cb, container) {
d3.select('#d' + id).selectAll('foreignobject div').attr('xmlns', 'http://www.w3.org/1999/xhtml'); d3.select('#d' + id).selectAll('foreignobject div').attr('xmlns', 'http://www.w3.org/1999/xhtml');
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; var url = '';
url = url.replace(/\(/g, '\\('); if (config.arrowMarkerAbsolute) {
url = url.replace(/\)/g, '\\)'); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
// Fix for when the base tag is used // Fix for when the base tag is used
var svgCode = d3.select('#d' + id).node().innerHTML.replace(/url\(#arrowhead/g, 'url(' + url + '#arrowhead', 'g'); var svgCode = d3.select('#d' + id).node().innerHTML.replace(/url\(#arrowhead/g, 'url(' + url + '#arrowhead', 'g');
@ -40302,7 +40279,7 @@ var cloneCssStyles = function cloneCssStyles(svg, classes) {
var elems; var elems;
elems = svg.querySelectorAll(rule.selectorText); elems = svg.querySelectorAll(rule.selectorText);
if (elems.length > 0) { if (elems.length > 0) {
usedStyles += rule.selectorText + ' { ' + rule.style.cssText + ' }\n'; usedStyles += rule.selectorText + ' { ' + rule.style.cssText + '}\n';
} }
} }
} }

34
dist/mermaid.min.js vendored
View File

File diff suppressed because one or more lines are too long

165
dist/mermaid.slim.js vendored
View File

@ -21530,12 +21530,13 @@ module.exports={
"live": "live-server ./test/examples", "live": "live-server ./test/examples",
"lint": "node node_modules/eslint/bin/eslint.js src", "lint": "node node_modules/eslint/bin/eslint.js src",
"jison": "gulp jison_legacy", "jison": "gulp jison_legacy",
"karma": "./node_modules/karma/bin/karma start karma.conf.js --single-run",
"watch": "source ./scripts/watch.sh", "watch": "source ./scripts/watch.sh",
"doc": "rm -r build;rm -r dist/www;gulp vartree;cp dist/www/all.html ../mermaid-pages/index.html;cp dist/mermaid.js ../mermaid-pages/javascripts/lib;cp dist/mermaid.forest.css ../mermaid-pages/stylesheets", "doc": "rm -r build;rm -r dist/www;gulp vartree;cp dist/www/all.html ../mermaid-pages/index.html;cp dist/mermaid.js ../mermaid-pages/javascripts/lib;cp dist/mermaid.forest.css ../mermaid-pages/stylesheets",
"tape": "node node_modules/.bin/tape test/cli_test-*.js", "tape": "node node_modules/.bin/tape test/cli_test-*.js",
"jasmine": "npm run jison &&node node_modules/jasmine-es6/bin/jasmine.js", "jasmine": "npm run jison &&node node_modules/jasmine-es6/bin/jasmine.js",
"posttest": "npm run jison", "pretest": "npm run jison",
"test": "npm run dist && npm run jasmine && npm run tape", "test": "npm run dist && npm run karma && npm run tape",
"dist-slim-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.slim.js -x d3 && cat dist/mermaid.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.slim.min.js", "dist-slim-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.slim.js -x d3 && cat dist/mermaid.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.slim.min.js",
"dist-slim-mermaidAPI": "node node_modules/browserify/bin/cmd.js src/mermaidAPI.js -t babelify -s mermaidAPI -o dist/mermaidAPI.slim.js -x d3 && cat dist/mermaidAPI.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaidAPI.slim.min.js", "dist-slim-mermaidAPI": "node node_modules/browserify/bin/cmd.js src/mermaidAPI.js -t babelify -s mermaidAPI -o dist/mermaidAPI.slim.js -x d3 && cat dist/mermaidAPI.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaidAPI.slim.min.js",
"dist-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.js && cat dist/mermaid.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.min.js", "dist-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.js && cat dist/mermaid.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.min.js",
@ -21563,7 +21564,6 @@ module.exports={
"devDependencies": { "devDependencies": {
"async": "^0.9.0", "async": "^0.9.0",
"babel-eslint": "^4.1.3", "babel-eslint": "^4.1.3",
"babelify": "^6.4.0", "babelify": "^6.4.0",
"browserify": "~6.2.0", "browserify": "~6.2.0",
"clone": "^0.2.0", "clone": "^0.2.0",
@ -21590,6 +21590,7 @@ module.exports={
"gulp-insert": "^0.4.0", "gulp-insert": "^0.4.0",
"gulp-istanbul": "^0.4.0", "gulp-istanbul": "^0.4.0",
"gulp-jasmine": "~2.1.0", "gulp-jasmine": "~2.1.0",
"gulp-jasmine-browser": "^0.2.3",
"gulp-jison": "~1.2.0", "gulp-jison": "~1.2.0",
"gulp-jshint": "^1.9.0", "gulp-jshint": "^1.9.0",
"gulp-less": "^3.0.1", "gulp-less": "^3.0.1",
@ -21601,6 +21602,7 @@ module.exports={
"gulp-shell": "^0.2.10", "gulp-shell": "^0.2.10",
"gulp-tag-version": "^1.2.1", "gulp-tag-version": "^1.2.1",
"gulp-uglify": "~1.0.1", "gulp-uglify": "~1.0.1",
"gulp-util": "^3.0.7",
"gulp-vartree": "^2.0.1", "gulp-vartree": "^2.0.1",
"hogan.js": "^3.0.2", "hogan.js": "^3.0.2",
"jasmine": "2.3.2", "jasmine": "2.3.2",
@ -21608,12 +21610,15 @@ module.exports={
"jison": "zaach/jison", "jison": "zaach/jison",
"jsdom": "^7.0.2", "jsdom": "^7.0.2",
"jshint-stylish": "^2.0.1", "jshint-stylish": "^2.0.1",
"karma-babel-preprocessor": "^6.0.1",
"map-stream": "0.0.6", "map-stream": "0.0.6",
"marked": "^0.3.2", "marked": "^0.3.2",
"mock-browser": "^0.91.34", "mock-browser": "^0.91.34",
"path": "^0.4.9", "path": "^0.4.9",
"phantomjs": "^1.9.18", "phantomjs": "^1.9.18",
"proxyquire": "^1.3.1", "proxyquire": "^1.7.3",
"proxyquire-universal": "^1.0.8",
"proxyquireify": "^3.0.0",
"require-dir": "^0.3.0", "require-dir": "^0.3.0",
"rewire": "^2.1.3", "rewire": "^2.1.3",
"rimraf": "^2.2.8", "rimraf": "^2.2.8",
@ -22222,7 +22227,6 @@ var getGraphId = function getGraphId(label) {
return undefined; return undefined;
}; };
window.tunk = getGraphId;
/** /**
* Setup arrow head and define the marker. The result is appended to the svg. * Setup arrow head and define the marker. The result is appended to the svg.
*/ */
@ -22273,10 +22277,12 @@ var drawEdge = function drawEdge(elem, path, relation) {
.interpolate('basis'); .interpolate('basis');
var svgPath = elem.append('path').attr('d', lineFunction(lineData)).attr('id', 'edge' + edgeCount).attr('class', 'relation'); var svgPath = elem.append('path').attr('d', lineFunction(lineData)).attr('id', 'edge' + edgeCount).attr('class', 'relation');
var url = '';
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; if (conf.arrowMarkerAbsolute) {
url = url.replace(/\(/g, '\\('); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\)/g, '\\)'); url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
//console.log(relation.relation.type1); //console.log(relation.relation.type1);
if (relation.relation.type1 !== 'none') { if (relation.relation.type1 !== 'none') {
@ -22352,31 +22358,15 @@ var drawClass = function drawClass(elem, classDef) {
.attr('x', conf.padding).attr('y', titleHeight + conf.dividerMargin + conf.textHeight).attr('fill', 'white').attr('class', 'classText'); .attr('x', conf.padding).attr('y', titleHeight + conf.dividerMargin + conf.textHeight).attr('fill', 'white').attr('class', 'classText');
var isFirst = true; var isFirst = true;
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try { classDef.members.forEach(function (member) {
for (var _iterator = classDef.members[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { addTspan(members, member, isFirst);
var member = _step.value; isFirst = false;
});
addTspan(members, member, isFirst); //for (var member of classDef.members) {
isFirst = false; // addTspan(members, member, isFirst);
} // isFirst = false;
} catch (err) { //}
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator['return']) {
_iterator['return']();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
console.warn(JSON.stringify(classDef)); console.warn(JSON.stringify(classDef));
@ -22389,31 +22379,15 @@ var drawClass = function drawClass(elem, classDef) {
.attr('x', conf.padding).attr('y', titleHeight + 2 * conf.dividerMargin + membersBox.height + conf.textHeight).attr('fill', 'white').attr('class', 'classText'); .attr('x', conf.padding).attr('y', titleHeight + 2 * conf.dividerMargin + membersBox.height + conf.textHeight).attr('fill', 'white').attr('class', 'classText');
isFirst = true; isFirst = true;
var _iteratorNormalCompletion2 = true;
var _didIteratorError2 = false;
var _iteratorError2 = undefined;
try { classDef.methods.forEach(function (method) {
for (var _iterator2 = classDef.methods[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { addTspan(methods, method, isFirst);
var method = _step2.value; isFirst = false;
});
addTspan(methods, method, isFirst); //for (var method of classDef.methods) {
isFirst = false; // addTspan(methods, method, isFirst);
} // isFirst = false;
} catch (err) { //}
_didIteratorError2 = true;
_iteratorError2 = err;
} finally {
try {
if (!_iteratorNormalCompletion2 && _iterator2['return']) {
_iterator2['return']();
}
} finally {
if (_didIteratorError2) {
throw _iteratorError2;
}
}
}
var classBox = g.node().getBBox(); var classBox = g.node().getBBox();
g.insert('rect', ':first-child').attr('x', 0).attr('y', 0).attr('width', classBox.width + 2 * conf.padding).attr('height', classBox.height + conf.padding + 0.5 * conf.dividerMargin); g.insert('rect', ':first-child').attr('x', 0).attr('y', 0).attr('width', classBox.width + 2 * conf.padding).attr('height', classBox.height + conf.padding + 0.5 * conf.dividerMargin);
@ -22488,33 +22462,16 @@ module.exports.draw = function (text, id) {
var relations = cDDb.getRelations(); var relations = cDDb.getRelations();
var i = 0; var i = 0;
var _iteratorNormalCompletion3 = true; relations.forEach(function (relation) {
var _didIteratorError3 = false; i = i + 1;
var _iteratorError3 = undefined; log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation));
g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), { relation: relation });
try { });
for (var _iterator3 = relations[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) { //for (var relation of relations) {
var relation = _step3.value; // i = i + 1;
// log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation));
i = i + 1; // g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), {relation: relation});
log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation)); //}
g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), { relation: relation });
}
} catch (err) {
_didIteratorError3 = true;
_iteratorError3 = err;
} finally {
try {
if (!_iteratorNormalCompletion3 && _iterator3['return']) {
_iterator3['return']();
}
} finally {
if (_didIteratorError3) {
throw _iteratorError3;
}
}
}
dagre.layout(g); dagre.layout(g);
g.nodes().forEach(function (v) { g.nodes().forEach(function (v) {
if (typeof v !== 'undefined') { if (typeof v !== 'undefined') {
@ -29453,9 +29410,12 @@ var drawMessage = function drawMessage(elem, startx, stopx, verticalPos, msg) {
line.attr('class', 'messageLine0'); line.attr('class', 'messageLine0');
} }
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; var url = '';
url = url.replace(/\(/g, '\\('); if (conf.arrowMarkerAbsolute) {
url = url.replace(/\)/g, '\\)'); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
line.attr('stroke-width', 2); line.attr('stroke-width', 2);
line.attr('stroke', 'black'); line.attr('stroke', 'black');
@ -29679,6 +29639,7 @@ exports.drawText = function (elem, textData, width) {
//span.attr('dy', textData.dy); //span.attr('dy', textData.dy);
span.text(nText); span.text(nText);
if (typeof textElem.textwrap !== 'undefined') { if (typeof textElem.textwrap !== 'undefined') {
textElem.textwrap({ textElem.textwrap({
x: textData.x, // bounding box is 300 pixels from the left x: textData.x, // bounding box is 300 pixels from the left
y: textData.y, // bounding box is 400 pixels from the top y: textData.y, // bounding box is 400 pixels from the top
@ -30279,6 +30240,12 @@ var config = {
*/ */
startOnLoad: true, startOnLoad: true,
/**
* **arrowMarkerAbsolute** - This options controls whether or arrow markers in html code will be absolute pats or
* an anchor, #. This matters if you are using base tag settings.
*/
arrowMarkerAbsolute: false,
/** /**
* ### flowchart * ### flowchart
* *The object containing configurations specific for flowcharts* * *The object containing configurations specific for flowcharts*
@ -30439,7 +30406,8 @@ var config = {
['%m-%y', function (d) { ['%m-%y', function (d) {
return d.getMonth(); return d.getMonth();
}]] }]]
} },
classDiagram: {}
}; };
Logger.setLogLevel(config.logLevel); Logger.setLogLevel(config.logLevel);
@ -30581,7 +30549,7 @@ var render = function render(id, txt, cb, container) {
var classes = {}; var classes = {};
switch (graphType) { switch (graphType) {
case 'graph': case 'graph':
config.flowchart.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
flowRenderer.setConf(config.flowchart); flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, false); flowRenderer.draw(txt, id, false);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -30590,6 +30558,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'dotGraph': case 'dotGraph':
config.flowchart.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
flowRenderer.setConf(config.flowchart); flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, true); flowRenderer.draw(txt, id, true);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -30598,6 +30567,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'sequenceDiagram': case 'sequenceDiagram':
config.sequenceDiagram.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
seq.setConf(config.sequenceDiagram); seq.setConf(config.sequenceDiagram);
seq.draw(txt, id); seq.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -30605,6 +30575,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'gantt': case 'gantt':
config.gantt.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
gantt.setConf(config.gantt); gantt.setConf(config.gantt);
gantt.draw(txt, id); gantt.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -30612,13 +30583,15 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'classDiagram': case 'classDiagram':
classRenderer.setConf(config.gantt); config.classDiagram.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
classRenderer.setConf(config.classDiagram);
classRenderer.draw(txt, id); classRenderer.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []); utils.cloneCssStyles(element.firstChild, []);
} }
break; break;
case 'info': case 'info':
config.info.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
info.draw(txt, id, exports.version()); info.draw(txt, id, exports.version());
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []); utils.cloneCssStyles(element.firstChild, []);
@ -30628,9 +30601,13 @@ var render = function render(id, txt, cb, container) {
d3.select('#d' + id).selectAll('foreignobject div').attr('xmlns', 'http://www.w3.org/1999/xhtml'); d3.select('#d' + id).selectAll('foreignobject div').attr('xmlns', 'http://www.w3.org/1999/xhtml');
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; var url = '';
url = url.replace(/\(/g, '\\('); if (config.arrowMarkerAbsolute) {
url = url.replace(/\)/g, '\\)'); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
// Fix for when the base tag is used // Fix for when the base tag is used
var svgCode = d3.select('#d' + id).node().innerHTML.replace(/url\(#arrowhead/g, 'url(' + url + '#arrowhead', 'g'); var svgCode = d3.select('#d' + id).node().innerHTML.replace(/url\(#arrowhead/g, 'url(' + url + '#arrowhead', 'g');
@ -30797,7 +30774,7 @@ var cloneCssStyles = function cloneCssStyles(svg, classes) {
var elems; var elems;
elems = svg.querySelectorAll(rule.selectorText); elems = svg.querySelectorAll(rule.selectorText);
if (elems.length > 0) { if (elems.length > 0) {
usedStyles += rule.selectorText + ' { ' + rule.style.cssText + ' }\n'; usedStyles += rule.selectorText + ' { ' + rule.style.cssText + '}\n';
} }
} }
} }

15
dist/mermaid.slim.min.js vendored
View File

File diff suppressed because one or more lines are too long

165
dist/mermaidAPI.js vendored
View File

@ -30702,12 +30702,13 @@ module.exports={
"live": "live-server ./test/examples", "live": "live-server ./test/examples",
"lint": "node node_modules/eslint/bin/eslint.js src", "lint": "node node_modules/eslint/bin/eslint.js src",
"jison": "gulp jison_legacy", "jison": "gulp jison_legacy",
"karma": "./node_modules/karma/bin/karma start karma.conf.js --single-run",
"watch": "source ./scripts/watch.sh", "watch": "source ./scripts/watch.sh",
"doc": "rm -r build;rm -r dist/www;gulp vartree;cp dist/www/all.html ../mermaid-pages/index.html;cp dist/mermaid.js ../mermaid-pages/javascripts/lib;cp dist/mermaid.forest.css ../mermaid-pages/stylesheets", "doc": "rm -r build;rm -r dist/www;gulp vartree;cp dist/www/all.html ../mermaid-pages/index.html;cp dist/mermaid.js ../mermaid-pages/javascripts/lib;cp dist/mermaid.forest.css ../mermaid-pages/stylesheets",
"tape": "node node_modules/.bin/tape test/cli_test-*.js", "tape": "node node_modules/.bin/tape test/cli_test-*.js",
"jasmine": "npm run jison &&node node_modules/jasmine-es6/bin/jasmine.js", "jasmine": "npm run jison &&node node_modules/jasmine-es6/bin/jasmine.js",
"posttest": "npm run jison", "pretest": "npm run jison",
"test": "npm run dist && npm run jasmine && npm run tape", "test": "npm run dist && npm run karma && npm run tape",
"dist-slim-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.slim.js -x d3 && cat dist/mermaid.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.slim.min.js", "dist-slim-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.slim.js -x d3 && cat dist/mermaid.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.slim.min.js",
"dist-slim-mermaidAPI": "node node_modules/browserify/bin/cmd.js src/mermaidAPI.js -t babelify -s mermaidAPI -o dist/mermaidAPI.slim.js -x d3 && cat dist/mermaidAPI.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaidAPI.slim.min.js", "dist-slim-mermaidAPI": "node node_modules/browserify/bin/cmd.js src/mermaidAPI.js -t babelify -s mermaidAPI -o dist/mermaidAPI.slim.js -x d3 && cat dist/mermaidAPI.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaidAPI.slim.min.js",
"dist-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.js && cat dist/mermaid.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.min.js", "dist-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.js && cat dist/mermaid.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.min.js",
@ -30735,7 +30736,6 @@ module.exports={
"devDependencies": { "devDependencies": {
"async": "^0.9.0", "async": "^0.9.0",
"babel-eslint": "^4.1.3", "babel-eslint": "^4.1.3",
"babelify": "^6.4.0", "babelify": "^6.4.0",
"browserify": "~6.2.0", "browserify": "~6.2.0",
"clone": "^0.2.0", "clone": "^0.2.0",
@ -30762,6 +30762,7 @@ module.exports={
"gulp-insert": "^0.4.0", "gulp-insert": "^0.4.0",
"gulp-istanbul": "^0.4.0", "gulp-istanbul": "^0.4.0",
"gulp-jasmine": "~2.1.0", "gulp-jasmine": "~2.1.0",
"gulp-jasmine-browser": "^0.2.3",
"gulp-jison": "~1.2.0", "gulp-jison": "~1.2.0",
"gulp-jshint": "^1.9.0", "gulp-jshint": "^1.9.0",
"gulp-less": "^3.0.1", "gulp-less": "^3.0.1",
@ -30773,6 +30774,7 @@ module.exports={
"gulp-shell": "^0.2.10", "gulp-shell": "^0.2.10",
"gulp-tag-version": "^1.2.1", "gulp-tag-version": "^1.2.1",
"gulp-uglify": "~1.0.1", "gulp-uglify": "~1.0.1",
"gulp-util": "^3.0.7",
"gulp-vartree": "^2.0.1", "gulp-vartree": "^2.0.1",
"hogan.js": "^3.0.2", "hogan.js": "^3.0.2",
"jasmine": "2.3.2", "jasmine": "2.3.2",
@ -30780,12 +30782,15 @@ module.exports={
"jison": "zaach/jison", "jison": "zaach/jison",
"jsdom": "^7.0.2", "jsdom": "^7.0.2",
"jshint-stylish": "^2.0.1", "jshint-stylish": "^2.0.1",
"karma-babel-preprocessor": "^6.0.1",
"map-stream": "0.0.6", "map-stream": "0.0.6",
"marked": "^0.3.2", "marked": "^0.3.2",
"mock-browser": "^0.91.34", "mock-browser": "^0.91.34",
"path": "^0.4.9", "path": "^0.4.9",
"phantomjs": "^1.9.18", "phantomjs": "^1.9.18",
"proxyquire": "^1.3.1", "proxyquire": "^1.7.3",
"proxyquire-universal": "^1.0.8",
"proxyquireify": "^3.0.0",
"require-dir": "^0.3.0", "require-dir": "^0.3.0",
"rewire": "^2.1.3", "rewire": "^2.1.3",
"rimraf": "^2.2.8", "rimraf": "^2.2.8",
@ -31394,7 +31399,6 @@ var getGraphId = function getGraphId(label) {
return undefined; return undefined;
}; };
window.tunk = getGraphId;
/** /**
* Setup arrow head and define the marker. The result is appended to the svg. * Setup arrow head and define the marker. The result is appended to the svg.
*/ */
@ -31445,10 +31449,12 @@ var drawEdge = function drawEdge(elem, path, relation) {
.interpolate('basis'); .interpolate('basis');
var svgPath = elem.append('path').attr('d', lineFunction(lineData)).attr('id', 'edge' + edgeCount).attr('class', 'relation'); var svgPath = elem.append('path').attr('d', lineFunction(lineData)).attr('id', 'edge' + edgeCount).attr('class', 'relation');
var url = '';
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; if (conf.arrowMarkerAbsolute) {
url = url.replace(/\(/g, '\\('); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\)/g, '\\)'); url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
//console.log(relation.relation.type1); //console.log(relation.relation.type1);
if (relation.relation.type1 !== 'none') { if (relation.relation.type1 !== 'none') {
@ -31524,31 +31530,15 @@ var drawClass = function drawClass(elem, classDef) {
.attr('x', conf.padding).attr('y', titleHeight + conf.dividerMargin + conf.textHeight).attr('fill', 'white').attr('class', 'classText'); .attr('x', conf.padding).attr('y', titleHeight + conf.dividerMargin + conf.textHeight).attr('fill', 'white').attr('class', 'classText');
var isFirst = true; var isFirst = true;
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try { classDef.members.forEach(function (member) {
for (var _iterator = classDef.members[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { addTspan(members, member, isFirst);
var member = _step.value; isFirst = false;
});
addTspan(members, member, isFirst); //for (var member of classDef.members) {
isFirst = false; // addTspan(members, member, isFirst);
} // isFirst = false;
} catch (err) { //}
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator['return']) {
_iterator['return']();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
console.warn(JSON.stringify(classDef)); console.warn(JSON.stringify(classDef));
@ -31561,31 +31551,15 @@ var drawClass = function drawClass(elem, classDef) {
.attr('x', conf.padding).attr('y', titleHeight + 2 * conf.dividerMargin + membersBox.height + conf.textHeight).attr('fill', 'white').attr('class', 'classText'); .attr('x', conf.padding).attr('y', titleHeight + 2 * conf.dividerMargin + membersBox.height + conf.textHeight).attr('fill', 'white').attr('class', 'classText');
isFirst = true; isFirst = true;
var _iteratorNormalCompletion2 = true;
var _didIteratorError2 = false;
var _iteratorError2 = undefined;
try { classDef.methods.forEach(function (method) {
for (var _iterator2 = classDef.methods[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { addTspan(methods, method, isFirst);
var method = _step2.value; isFirst = false;
});
addTspan(methods, method, isFirst); //for (var method of classDef.methods) {
isFirst = false; // addTspan(methods, method, isFirst);
} // isFirst = false;
} catch (err) { //}
_didIteratorError2 = true;
_iteratorError2 = err;
} finally {
try {
if (!_iteratorNormalCompletion2 && _iterator2['return']) {
_iterator2['return']();
}
} finally {
if (_didIteratorError2) {
throw _iteratorError2;
}
}
}
var classBox = g.node().getBBox(); var classBox = g.node().getBBox();
g.insert('rect', ':first-child').attr('x', 0).attr('y', 0).attr('width', classBox.width + 2 * conf.padding).attr('height', classBox.height + conf.padding + 0.5 * conf.dividerMargin); g.insert('rect', ':first-child').attr('x', 0).attr('y', 0).attr('width', classBox.width + 2 * conf.padding).attr('height', classBox.height + conf.padding + 0.5 * conf.dividerMargin);
@ -31660,33 +31634,16 @@ module.exports.draw = function (text, id) {
var relations = cDDb.getRelations(); var relations = cDDb.getRelations();
var i = 0; var i = 0;
var _iteratorNormalCompletion3 = true; relations.forEach(function (relation) {
var _didIteratorError3 = false; i = i + 1;
var _iteratorError3 = undefined; log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation));
g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), { relation: relation });
try { });
for (var _iterator3 = relations[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) { //for (var relation of relations) {
var relation = _step3.value; // i = i + 1;
// log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation));
i = i + 1; // g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), {relation: relation});
log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation)); //}
g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), { relation: relation });
}
} catch (err) {
_didIteratorError3 = true;
_iteratorError3 = err;
} finally {
try {
if (!_iteratorNormalCompletion3 && _iterator3['return']) {
_iterator3['return']();
}
} finally {
if (_didIteratorError3) {
throw _iteratorError3;
}
}
}
dagre.layout(g); dagre.layout(g);
g.nodes().forEach(function (v) { g.nodes().forEach(function (v) {
if (typeof v !== 'undefined') { if (typeof v !== 'undefined') {
@ -38625,9 +38582,12 @@ var drawMessage = function drawMessage(elem, startx, stopx, verticalPos, msg) {
line.attr('class', 'messageLine0'); line.attr('class', 'messageLine0');
} }
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; var url = '';
url = url.replace(/\(/g, '\\('); if (conf.arrowMarkerAbsolute) {
url = url.replace(/\)/g, '\\)'); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
line.attr('stroke-width', 2); line.attr('stroke-width', 2);
line.attr('stroke', 'black'); line.attr('stroke', 'black');
@ -38851,6 +38811,7 @@ exports.drawText = function (elem, textData, width) {
//span.attr('dy', textData.dy); //span.attr('dy', textData.dy);
span.text(nText); span.text(nText);
if (typeof textElem.textwrap !== 'undefined') { if (typeof textElem.textwrap !== 'undefined') {
textElem.textwrap({ textElem.textwrap({
x: textData.x, // bounding box is 300 pixels from the left x: textData.x, // bounding box is 300 pixels from the left
y: textData.y, // bounding box is 400 pixels from the top y: textData.y, // bounding box is 400 pixels from the top
@ -39178,6 +39139,12 @@ var config = {
*/ */
startOnLoad: true, startOnLoad: true,
/**
* **arrowMarkerAbsolute** - This options controls whether or arrow markers in html code will be absolute pats or
* an anchor, #. This matters if you are using base tag settings.
*/
arrowMarkerAbsolute: false,
/** /**
* ### flowchart * ### flowchart
* *The object containing configurations specific for flowcharts* * *The object containing configurations specific for flowcharts*
@ -39338,7 +39305,8 @@ var config = {
['%m-%y', function (d) { ['%m-%y', function (d) {
return d.getMonth(); return d.getMonth();
}]] }]]
} },
classDiagram: {}
}; };
Logger.setLogLevel(config.logLevel); Logger.setLogLevel(config.logLevel);
@ -39480,7 +39448,7 @@ var render = function render(id, txt, cb, container) {
var classes = {}; var classes = {};
switch (graphType) { switch (graphType) {
case 'graph': case 'graph':
config.flowchart.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
flowRenderer.setConf(config.flowchart); flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, false); flowRenderer.draw(txt, id, false);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -39489,6 +39457,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'dotGraph': case 'dotGraph':
config.flowchart.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
flowRenderer.setConf(config.flowchart); flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, true); flowRenderer.draw(txt, id, true);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -39497,6 +39466,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'sequenceDiagram': case 'sequenceDiagram':
config.sequenceDiagram.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
seq.setConf(config.sequenceDiagram); seq.setConf(config.sequenceDiagram);
seq.draw(txt, id); seq.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -39504,6 +39474,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'gantt': case 'gantt':
config.gantt.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
gantt.setConf(config.gantt); gantt.setConf(config.gantt);
gantt.draw(txt, id); gantt.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -39511,13 +39482,15 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'classDiagram': case 'classDiagram':
classRenderer.setConf(config.gantt); config.classDiagram.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
classRenderer.setConf(config.classDiagram);
classRenderer.draw(txt, id); classRenderer.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []); utils.cloneCssStyles(element.firstChild, []);
} }
break; break;
case 'info': case 'info':
config.info.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
info.draw(txt, id, exports.version()); info.draw(txt, id, exports.version());
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []); utils.cloneCssStyles(element.firstChild, []);
@ -39527,9 +39500,13 @@ var render = function render(id, txt, cb, container) {
d3.select('#d' + id).selectAll('foreignobject div').attr('xmlns', 'http://www.w3.org/1999/xhtml'); d3.select('#d' + id).selectAll('foreignobject div').attr('xmlns', 'http://www.w3.org/1999/xhtml');
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; var url = '';
url = url.replace(/\(/g, '\\('); if (config.arrowMarkerAbsolute) {
url = url.replace(/\)/g, '\\)'); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
// Fix for when the base tag is used // Fix for when the base tag is used
var svgCode = d3.select('#d' + id).node().innerHTML.replace(/url\(#arrowhead/g, 'url(' + url + '#arrowhead', 'g'); var svgCode = d3.select('#d' + id).node().innerHTML.replace(/url\(#arrowhead/g, 'url(' + url + '#arrowhead', 'g');
@ -39696,7 +39673,7 @@ var cloneCssStyles = function cloneCssStyles(svg, classes) {
var elems; var elems;
elems = svg.querySelectorAll(rule.selectorText); elems = svg.querySelectorAll(rule.selectorText);
if (elems.length > 0) { if (elems.length > 0) {
usedStyles += rule.selectorText + ' { ' + rule.style.cssText + ' }\n'; usedStyles += rule.selectorText + ' { ' + rule.style.cssText + '}\n';
} }
} }
} }

15
dist/mermaidAPI.min.js vendored
View File

File diff suppressed because one or more lines are too long

165
dist/mermaidAPI.slim.js vendored
View File

@ -21197,12 +21197,13 @@ module.exports={
"live": "live-server ./test/examples", "live": "live-server ./test/examples",
"lint": "node node_modules/eslint/bin/eslint.js src", "lint": "node node_modules/eslint/bin/eslint.js src",
"jison": "gulp jison_legacy", "jison": "gulp jison_legacy",
"karma": "./node_modules/karma/bin/karma start karma.conf.js --single-run",
"watch": "source ./scripts/watch.sh", "watch": "source ./scripts/watch.sh",
"doc": "rm -r build;rm -r dist/www;gulp vartree;cp dist/www/all.html ../mermaid-pages/index.html;cp dist/mermaid.js ../mermaid-pages/javascripts/lib;cp dist/mermaid.forest.css ../mermaid-pages/stylesheets", "doc": "rm -r build;rm -r dist/www;gulp vartree;cp dist/www/all.html ../mermaid-pages/index.html;cp dist/mermaid.js ../mermaid-pages/javascripts/lib;cp dist/mermaid.forest.css ../mermaid-pages/stylesheets",
"tape": "node node_modules/.bin/tape test/cli_test-*.js", "tape": "node node_modules/.bin/tape test/cli_test-*.js",
"jasmine": "npm run jison &&node node_modules/jasmine-es6/bin/jasmine.js", "jasmine": "npm run jison &&node node_modules/jasmine-es6/bin/jasmine.js",
"posttest": "npm run jison", "pretest": "npm run jison",
"test": "npm run dist && npm run jasmine && npm run tape", "test": "npm run dist && npm run karma && npm run tape",
"dist-slim-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.slim.js -x d3 && cat dist/mermaid.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.slim.min.js", "dist-slim-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.slim.js -x d3 && cat dist/mermaid.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.slim.min.js",
"dist-slim-mermaidAPI": "node node_modules/browserify/bin/cmd.js src/mermaidAPI.js -t babelify -s mermaidAPI -o dist/mermaidAPI.slim.js -x d3 && cat dist/mermaidAPI.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaidAPI.slim.min.js", "dist-slim-mermaidAPI": "node node_modules/browserify/bin/cmd.js src/mermaidAPI.js -t babelify -s mermaidAPI -o dist/mermaidAPI.slim.js -x d3 && cat dist/mermaidAPI.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaidAPI.slim.min.js",
"dist-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.js && cat dist/mermaid.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.min.js", "dist-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.js && cat dist/mermaid.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.min.js",
@ -21230,7 +21231,6 @@ module.exports={
"devDependencies": { "devDependencies": {
"async": "^0.9.0", "async": "^0.9.0",
"babel-eslint": "^4.1.3", "babel-eslint": "^4.1.3",
"babelify": "^6.4.0", "babelify": "^6.4.0",
"browserify": "~6.2.0", "browserify": "~6.2.0",
"clone": "^0.2.0", "clone": "^0.2.0",
@ -21257,6 +21257,7 @@ module.exports={
"gulp-insert": "^0.4.0", "gulp-insert": "^0.4.0",
"gulp-istanbul": "^0.4.0", "gulp-istanbul": "^0.4.0",
"gulp-jasmine": "~2.1.0", "gulp-jasmine": "~2.1.0",
"gulp-jasmine-browser": "^0.2.3",
"gulp-jison": "~1.2.0", "gulp-jison": "~1.2.0",
"gulp-jshint": "^1.9.0", "gulp-jshint": "^1.9.0",
"gulp-less": "^3.0.1", "gulp-less": "^3.0.1",
@ -21268,6 +21269,7 @@ module.exports={
"gulp-shell": "^0.2.10", "gulp-shell": "^0.2.10",
"gulp-tag-version": "^1.2.1", "gulp-tag-version": "^1.2.1",
"gulp-uglify": "~1.0.1", "gulp-uglify": "~1.0.1",
"gulp-util": "^3.0.7",
"gulp-vartree": "^2.0.1", "gulp-vartree": "^2.0.1",
"hogan.js": "^3.0.2", "hogan.js": "^3.0.2",
"jasmine": "2.3.2", "jasmine": "2.3.2",
@ -21275,12 +21277,15 @@ module.exports={
"jison": "zaach/jison", "jison": "zaach/jison",
"jsdom": "^7.0.2", "jsdom": "^7.0.2",
"jshint-stylish": "^2.0.1", "jshint-stylish": "^2.0.1",
"karma-babel-preprocessor": "^6.0.1",
"map-stream": "0.0.6", "map-stream": "0.0.6",
"marked": "^0.3.2", "marked": "^0.3.2",
"mock-browser": "^0.91.34", "mock-browser": "^0.91.34",
"path": "^0.4.9", "path": "^0.4.9",
"phantomjs": "^1.9.18", "phantomjs": "^1.9.18",
"proxyquire": "^1.3.1", "proxyquire": "^1.7.3",
"proxyquire-universal": "^1.0.8",
"proxyquireify": "^3.0.0",
"require-dir": "^0.3.0", "require-dir": "^0.3.0",
"rewire": "^2.1.3", "rewire": "^2.1.3",
"rimraf": "^2.2.8", "rimraf": "^2.2.8",
@ -21889,7 +21894,6 @@ var getGraphId = function getGraphId(label) {
return undefined; return undefined;
}; };
window.tunk = getGraphId;
/** /**
* Setup arrow head and define the marker. The result is appended to the svg. * Setup arrow head and define the marker. The result is appended to the svg.
*/ */
@ -21940,10 +21944,12 @@ var drawEdge = function drawEdge(elem, path, relation) {
.interpolate('basis'); .interpolate('basis');
var svgPath = elem.append('path').attr('d', lineFunction(lineData)).attr('id', 'edge' + edgeCount).attr('class', 'relation'); var svgPath = elem.append('path').attr('d', lineFunction(lineData)).attr('id', 'edge' + edgeCount).attr('class', 'relation');
var url = '';
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; if (conf.arrowMarkerAbsolute) {
url = url.replace(/\(/g, '\\('); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\)/g, '\\)'); url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
//console.log(relation.relation.type1); //console.log(relation.relation.type1);
if (relation.relation.type1 !== 'none') { if (relation.relation.type1 !== 'none') {
@ -22019,31 +22025,15 @@ var drawClass = function drawClass(elem, classDef) {
.attr('x', conf.padding).attr('y', titleHeight + conf.dividerMargin + conf.textHeight).attr('fill', 'white').attr('class', 'classText'); .attr('x', conf.padding).attr('y', titleHeight + conf.dividerMargin + conf.textHeight).attr('fill', 'white').attr('class', 'classText');
var isFirst = true; var isFirst = true;
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try { classDef.members.forEach(function (member) {
for (var _iterator = classDef.members[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { addTspan(members, member, isFirst);
var member = _step.value; isFirst = false;
});
addTspan(members, member, isFirst); //for (var member of classDef.members) {
isFirst = false; // addTspan(members, member, isFirst);
} // isFirst = false;
} catch (err) { //}
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator['return']) {
_iterator['return']();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
console.warn(JSON.stringify(classDef)); console.warn(JSON.stringify(classDef));
@ -22056,31 +22046,15 @@ var drawClass = function drawClass(elem, classDef) {
.attr('x', conf.padding).attr('y', titleHeight + 2 * conf.dividerMargin + membersBox.height + conf.textHeight).attr('fill', 'white').attr('class', 'classText'); .attr('x', conf.padding).attr('y', titleHeight + 2 * conf.dividerMargin + membersBox.height + conf.textHeight).attr('fill', 'white').attr('class', 'classText');
isFirst = true; isFirst = true;
var _iteratorNormalCompletion2 = true;
var _didIteratorError2 = false;
var _iteratorError2 = undefined;
try { classDef.methods.forEach(function (method) {
for (var _iterator2 = classDef.methods[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { addTspan(methods, method, isFirst);
var method = _step2.value; isFirst = false;
});
addTspan(methods, method, isFirst); //for (var method of classDef.methods) {
isFirst = false; // addTspan(methods, method, isFirst);
} // isFirst = false;
} catch (err) { //}
_didIteratorError2 = true;
_iteratorError2 = err;
} finally {
try {
if (!_iteratorNormalCompletion2 && _iterator2['return']) {
_iterator2['return']();
}
} finally {
if (_didIteratorError2) {
throw _iteratorError2;
}
}
}
var classBox = g.node().getBBox(); var classBox = g.node().getBBox();
g.insert('rect', ':first-child').attr('x', 0).attr('y', 0).attr('width', classBox.width + 2 * conf.padding).attr('height', classBox.height + conf.padding + 0.5 * conf.dividerMargin); g.insert('rect', ':first-child').attr('x', 0).attr('y', 0).attr('width', classBox.width + 2 * conf.padding).attr('height', classBox.height + conf.padding + 0.5 * conf.dividerMargin);
@ -22155,33 +22129,16 @@ module.exports.draw = function (text, id) {
var relations = cDDb.getRelations(); var relations = cDDb.getRelations();
var i = 0; var i = 0;
var _iteratorNormalCompletion3 = true; relations.forEach(function (relation) {
var _didIteratorError3 = false; i = i + 1;
var _iteratorError3 = undefined; log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation));
g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), { relation: relation });
try { });
for (var _iterator3 = relations[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) { //for (var relation of relations) {
var relation = _step3.value; // i = i + 1;
// log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation));
i = i + 1; // g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), {relation: relation});
log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation)); //}
g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), { relation: relation });
}
} catch (err) {
_didIteratorError3 = true;
_iteratorError3 = err;
} finally {
try {
if (!_iteratorNormalCompletion3 && _iterator3['return']) {
_iterator3['return']();
}
} finally {
if (_didIteratorError3) {
throw _iteratorError3;
}
}
}
dagre.layout(g); dagre.layout(g);
g.nodes().forEach(function (v) { g.nodes().forEach(function (v) {
if (typeof v !== 'undefined') { if (typeof v !== 'undefined') {
@ -29120,9 +29077,12 @@ var drawMessage = function drawMessage(elem, startx, stopx, verticalPos, msg) {
line.attr('class', 'messageLine0'); line.attr('class', 'messageLine0');
} }
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; var url = '';
url = url.replace(/\(/g, '\\('); if (conf.arrowMarkerAbsolute) {
url = url.replace(/\)/g, '\\)'); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
line.attr('stroke-width', 2); line.attr('stroke-width', 2);
line.attr('stroke', 'black'); line.attr('stroke', 'black');
@ -29346,6 +29306,7 @@ exports.drawText = function (elem, textData, width) {
//span.attr('dy', textData.dy); //span.attr('dy', textData.dy);
span.text(nText); span.text(nText);
if (typeof textElem.textwrap !== 'undefined') { if (typeof textElem.textwrap !== 'undefined') {
textElem.textwrap({ textElem.textwrap({
x: textData.x, // bounding box is 300 pixels from the left x: textData.x, // bounding box is 300 pixels from the left
y: textData.y, // bounding box is 400 pixels from the top y: textData.y, // bounding box is 400 pixels from the top
@ -29673,6 +29634,12 @@ var config = {
*/ */
startOnLoad: true, startOnLoad: true,
/**
* **arrowMarkerAbsolute** - This options controls whether or arrow markers in html code will be absolute pats or
* an anchor, #. This matters if you are using base tag settings.
*/
arrowMarkerAbsolute: false,
/** /**
* ### flowchart * ### flowchart
* *The object containing configurations specific for flowcharts* * *The object containing configurations specific for flowcharts*
@ -29833,7 +29800,8 @@ var config = {
['%m-%y', function (d) { ['%m-%y', function (d) {
return d.getMonth(); return d.getMonth();
}]] }]]
} },
classDiagram: {}
}; };
Logger.setLogLevel(config.logLevel); Logger.setLogLevel(config.logLevel);
@ -29975,7 +29943,7 @@ var render = function render(id, txt, cb, container) {
var classes = {}; var classes = {};
switch (graphType) { switch (graphType) {
case 'graph': case 'graph':
config.flowchart.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
flowRenderer.setConf(config.flowchart); flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, false); flowRenderer.draw(txt, id, false);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -29984,6 +29952,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'dotGraph': case 'dotGraph':
config.flowchart.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
flowRenderer.setConf(config.flowchart); flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, true); flowRenderer.draw(txt, id, true);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -29992,6 +29961,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'sequenceDiagram': case 'sequenceDiagram':
config.sequenceDiagram.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
seq.setConf(config.sequenceDiagram); seq.setConf(config.sequenceDiagram);
seq.draw(txt, id); seq.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -29999,6 +29969,7 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'gantt': case 'gantt':
config.gantt.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
gantt.setConf(config.gantt); gantt.setConf(config.gantt);
gantt.draw(txt, id); gantt.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
@ -30006,13 +29977,15 @@ var render = function render(id, txt, cb, container) {
} }
break; break;
case 'classDiagram': case 'classDiagram':
classRenderer.setConf(config.gantt); config.classDiagram.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
classRenderer.setConf(config.classDiagram);
classRenderer.draw(txt, id); classRenderer.draw(txt, id);
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []); utils.cloneCssStyles(element.firstChild, []);
} }
break; break;
case 'info': case 'info':
config.info.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
info.draw(txt, id, exports.version()); info.draw(txt, id, exports.version());
if (config.cloneCssStyles) { if (config.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []); utils.cloneCssStyles(element.firstChild, []);
@ -30022,9 +29995,13 @@ var render = function render(id, txt, cb, container) {
d3.select('#d' + id).selectAll('foreignobject div').attr('xmlns', 'http://www.w3.org/1999/xhtml'); d3.select('#d' + id).selectAll('foreignobject div').attr('xmlns', 'http://www.w3.org/1999/xhtml');
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; var url = '';
url = url.replace(/\(/g, '\\('); if (config.arrowMarkerAbsolute) {
url = url.replace(/\)/g, '\\)'); url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search;
url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
// Fix for when the base tag is used // Fix for when the base tag is used
var svgCode = d3.select('#d' + id).node().innerHTML.replace(/url\(#arrowhead/g, 'url(' + url + '#arrowhead', 'g'); var svgCode = d3.select('#d' + id).node().innerHTML.replace(/url\(#arrowhead/g, 'url(' + url + '#arrowhead', 'g');
@ -30191,7 +30168,7 @@ var cloneCssStyles = function cloneCssStyles(svg, classes) {
var elems; var elems;
elems = svg.querySelectorAll(rule.selectorText); elems = svg.querySelectorAll(rule.selectorText);
if (elems.length > 0) { if (elems.length > 0) {
usedStyles += rule.selectorText + ' { ' + rule.style.cssText + ' }\n'; usedStyles += rule.selectorText + ' { ' + rule.style.cssText + '}\n';
} }
} }
} }

21
dist/mermaidAPI.slim.min.js vendored
View File

File diff suppressed because one or more lines are too long

8
gulp/tasks/test.js
View File

@ -58,3 +58,11 @@ gulp.task('usageTestsBower', function() {
return bower({cwd: 'test/usageTests'}) return bower({cwd: 'test/usageTests'})
.pipe(gulp.dest('test/usageTests/bower_components')); .pipe(gulp.dest('test/usageTests/bower_components'));
}); });
var jasmineBrowser = require('gulp-jasmine-browser');
gulp.task('jasmine2', function() {
return gulp.src(['src/**/*.js'])
.pipe(jasmineBrowser.specRunner({console: true}))
.pipe(jasmineBrowser.headless());
});

38
conf/karma.conf.js → karma.conf.js
View File

@ -5,7 +5,7 @@ module.exports = function (config) {
config.set({ config.set({
// base path that will be used to resolve all patterns (eg. files, exclude) // base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '', basePath: '.',
// frameworks to use // frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
@ -14,22 +14,31 @@ module.exports = function (config) {
// list of files / patterns to load in the browser // list of files / patterns to load in the browser
files: [ files: [
'../src/**/*.js' './src/*.spec.js',
'./src/diagrams/flowchart/**/*.spec.js',
'./src/diagrams/example/**/*.spec.js',
'./src/diagrams/sequenceDiagram/**/*.spec.js',
'./src/diagrams/classDiagram/**/*.spec.js',
'./src/diagrams/gantt/**/*.spec.js'
], ],
preprocessors: { preprocessors: {
'../src/**/*.js': [ 'babel','browserify' ] 'src/**/*.spec.js': [ 'browserify' ]
}, },
// list of files to exclude // list of files to exclude
exclude: ['../src/backup/**/*.js'], //exclude: ['src/diagrams/*.js'],
"babelPreprocessor": {
// options go here
},
browserify: { browserify: {
debug: true, debug: true,
//transform: [ 'brfs' ] //plugin: ['proxyquireify/plugin']
extensions : ['.js'],
configure: function (bundle) {
bundle.on('prebundle', function () {
bundle
.plugin('proxyquire-universal')
});
}
}, },
// preprocess matching files before serving them to the browser // preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
@ -38,7 +47,7 @@ module.exports = function (config) {
// test results reporter to use // test results reporter to use
// possible values: 'dots', 'progress' // possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter // available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'], reporters: ['dots'],
// web server port // web server port
@ -51,7 +60,7 @@ module.exports = function (config) {
// level of logging // level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_DEBUG, logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes // enable / disable watching file and executing tests whenever any file changes
@ -60,8 +69,13 @@ module.exports = function (config) {
// start these browsers // start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['Chrome'], browsers: ['PhantomJS'],
plugins: [
'karma-jasmine',
'karma-phantomjs-launcher',
'karma-browserify',
'karma-babel-preprocessor'
],
// Continuous Integration mode // Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits // if true, Karma captures browsers, runs the tests and exits
singleRun: false singleRun: false

13
package.json
View File

@ -17,12 +17,13 @@
"live": "live-server ./test/examples", "live": "live-server ./test/examples",
"lint": "node node_modules/eslint/bin/eslint.js src", "lint": "node node_modules/eslint/bin/eslint.js src",
"jison": "gulp jison_legacy", "jison": "gulp jison_legacy",
"karma": "./node_modules/karma/bin/karma start karma.conf.js --single-run",
"watch": "source ./scripts/watch.sh", "watch": "source ./scripts/watch.sh",
"doc": "rm -r build;rm -r dist/www;gulp vartree;cp dist/www/all.html ../mermaid-pages/index.html;cp dist/mermaid.js ../mermaid-pages/javascripts/lib;cp dist/mermaid.forest.css ../mermaid-pages/stylesheets", "doc": "rm -r build;rm -r dist/www;gulp vartree;cp dist/www/all.html ../mermaid-pages/index.html;cp dist/mermaid.js ../mermaid-pages/javascripts/lib;cp dist/mermaid.forest.css ../mermaid-pages/stylesheets",
"tape": "node node_modules/.bin/tape test/cli_test-*.js", "tape": "node node_modules/.bin/tape test/cli_test-*.js",
"jasmine": "npm run jison &&node node_modules/jasmine-es6/bin/jasmine.js", "jasmine": "npm run jison &&node node_modules/jasmine-es6/bin/jasmine.js",
"posttest": "npm run jison", "pretest": "npm run jison",
"test": "npm run dist && npm run jasmine && npm run tape", "test": "npm run dist && npm run karma && npm run tape",
"dist-slim-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.slim.js -x d3 && cat dist/mermaid.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.slim.min.js", "dist-slim-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.slim.js -x d3 && cat dist/mermaid.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.slim.min.js",
"dist-slim-mermaidAPI": "node node_modules/browserify/bin/cmd.js src/mermaidAPI.js -t babelify -s mermaidAPI -o dist/mermaidAPI.slim.js -x d3 && cat dist/mermaidAPI.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaidAPI.slim.min.js", "dist-slim-mermaidAPI": "node node_modules/browserify/bin/cmd.js src/mermaidAPI.js -t babelify -s mermaidAPI -o dist/mermaidAPI.slim.js -x d3 && cat dist/mermaidAPI.slim.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaidAPI.slim.min.js",
"dist-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.js && cat dist/mermaid.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.min.js", "dist-mermaid": "node node_modules/browserify/bin/cmd.js src/mermaid.js -t babelify -s mermaid -o dist/mermaid.js && cat dist/mermaid.js | node node_modules/uglifyjs/bin/uglifyjs -mc > dist/mermaid.min.js",
@ -50,7 +51,6 @@
"devDependencies": { "devDependencies": {
"async": "^0.9.0", "async": "^0.9.0",
"babel-eslint": "^4.1.3", "babel-eslint": "^4.1.3",
"babelify": "^6.4.0", "babelify": "^6.4.0",
"browserify": "~6.2.0", "browserify": "~6.2.0",
"clone": "^0.2.0", "clone": "^0.2.0",
@ -77,6 +77,7 @@
"gulp-insert": "^0.4.0", "gulp-insert": "^0.4.0",
"gulp-istanbul": "^0.4.0", "gulp-istanbul": "^0.4.0",
"gulp-jasmine": "~2.1.0", "gulp-jasmine": "~2.1.0",
"gulp-jasmine-browser": "^0.2.3",
"gulp-jison": "~1.2.0", "gulp-jison": "~1.2.0",
"gulp-jshint": "^1.9.0", "gulp-jshint": "^1.9.0",
"gulp-less": "^3.0.1", "gulp-less": "^3.0.1",
@ -88,6 +89,7 @@
"gulp-shell": "^0.2.10", "gulp-shell": "^0.2.10",
"gulp-tag-version": "^1.2.1", "gulp-tag-version": "^1.2.1",
"gulp-uglify": "~1.0.1", "gulp-uglify": "~1.0.1",
"gulp-util": "^3.0.7",
"gulp-vartree": "^2.0.1", "gulp-vartree": "^2.0.1",
"hogan.js": "^3.0.2", "hogan.js": "^3.0.2",
"jasmine": "2.3.2", "jasmine": "2.3.2",
@ -95,12 +97,15 @@
"jison": "zaach/jison", "jison": "zaach/jison",
"jsdom": "^7.0.2", "jsdom": "^7.0.2",
"jshint-stylish": "^2.0.1", "jshint-stylish": "^2.0.1",
"karma-babel-preprocessor": "^6.0.1",
"map-stream": "0.0.6", "map-stream": "0.0.6",
"marked": "^0.3.2", "marked": "^0.3.2",
"mock-browser": "^0.91.34", "mock-browser": "^0.91.34",
"path": "^0.4.9", "path": "^0.4.9",
"phantomjs": "^1.9.18", "phantomjs": "^1.9.18",
"proxyquire": "^1.3.1", "proxyquire": "^1.7.3",
"proxyquire-universal": "^1.0.8",
"proxyquireify": "^3.0.0",
"require-dir": "^0.3.0", "require-dir": "^0.3.0",
"rewire": "^2.1.3", "rewire": "^2.1.3",
"rimraf": "^2.2.8", "rimraf": "^2.2.8",

158
src/diagrams/classDiagram/classDiagram.spec.js
View File

@ -11,96 +11,96 @@ describe('class diagram, ', function () {
}); });
it('should handle relation definitions', function () { it('should handle relation definitions', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Class01 <|-- Class02 'Class01 <|-- Class02\n'+
Class03 *-- Class04 'Class03 *-- Class04\n'+
Class05 o-- Class06 'Class05 o-- Class06\n'+
Class07 .. Class08 'Class07 .. Class08\n'+
Class09 -- Class1`; 'Class09 -- Class1';
cd.parse(str); cd.parse(str);
}); });
it('should handle relation definition of different types and directions', function () { it('should handle relation definition of different types and directions', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Class11 <|.. Class12 'Class11 <|.. Class12\n'+
Class13 --> Class14 'Class13 --> Class14\n'+
Class15 ..> Class16 'Class15 ..> Class16\n'+
Class17 ..|> Class18 'Class17 ..|> Class18\n'+
Class19 <--* Class20`; 'Class19 <--* Class20';
cd.parse(str); cd.parse(str);
}); });
it('should handle cardinality and labels', function () { it('should handle cardinality and labels', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Class01 "1" *-- "many" Class02 : contains 'Class01 "1" *-- "many" Class02 : contains\n'+
Class03 o-- Class04 : aggregation 'Class03 o-- Class04 : aggregation\n'+
Class05 --> "1" Class06`; 'Class05 --> "1" Class06';
cd.parse(str); cd.parse(str);
}); });
it('should handle class definitions', function () { it('should handle class definitions', function () {
var str = `classDiagram var str = 'classDiagram\n'+
class Car 'class Car\n'+
Driver -- Car : drives > 'Driver -- Car : drives >\n'+
Car *-- Wheel : have 4 > 'Car *-- Wheel : have 4 >\n'+
Car -- Person : < owns`; 'Car -- Person : < owns';
cd.parse(str); cd.parse(str);
}); });
it('should handle method statements', function () { it('should handle method statements', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Object <|-- ArrayList 'Object <|-- ArrayList\n'+
Object : equals() 'Object : equals()\n'+
ArrayList : Object[] elementData 'ArrayList : Object[] elementData\n'+
ArrayList : size()`; 'ArrayList : size()';
cd.parse(str); cd.parse(str);
}); });
it('should handle parsing of method statements grouped by brackets', function () { it('should handle parsing of method statements grouped by brackets', function () {
var str = `classDiagram var str = 'classDiagram\n'+
class Dummy { 'class Dummy {\n'+
String data 'String data\n'+
void methods() ' void methods()\n'+
} '}\n'+
'\n'+
class Flight { 'class Flight {\n'+
flightNumber : Integer ' flightNumber : Integer\n'+
departureTime : Date ' departureTime : Date\n'+
}`; '}';
cd.parse(str); cd.parse(str);
}); });
it('should handle parsing of separators', function () { it('should handle parsing of separators', function () {
var str = `classDiagram var str = 'classDiagram\n'+
class Foo1 { 'class Foo1 {\n'+
You can use ' You can use\n'+
several lines ' several lines\n'+
.. '..\n'+
as you want 'as you want\n'+
and group 'and group\n'+
== '==\n'+
things together. 'things together.\n'+
__ '__\n'+
You can have as many groups 'You can have as many groups\n'+
as you want 'as you want\n'+
-- '--\n'+
End of class 'End of class\n'+
} '}\n'+
'\n'+
class User { 'class User {\n'+
.. Simple Getter .. '.. Simple Getter ..\n'+
+ getName() '+ getName()\n'+
+ getAddress() '+ getAddress()\n'+
.. Some setter .. '.. Some setter ..\n'+
+ setName() '+ setName()\n'+
__ private data __ '__ private data __\n'+
int age 'int age\n'+
-- encrypted -- '-- encrypted --\n'+
String password 'String password\n'+
}`; '}';
cd.parse(str); cd.parse(str);
}); });
@ -116,8 +116,8 @@ class User {
cd.yy.clear(); cd.yy.clear();
}); });
it('should handle relation definitions EXTENSION', function () { it('should handle relation definitions EXTENSION', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Class01 <|-- Class02`; 'Class01 <|-- Class02';
cd.parse(str); cd.parse(str);
@ -130,8 +130,8 @@ class User {
expect(relations[0].relation.lineType).toBe(cDDb.lineType.LINE); expect(relations[0].relation.lineType).toBe(cDDb.lineType.LINE);
}); });
it('should handle relation definitions AGGREGATION and dotted line', function () { it('should handle relation definitions AGGREGATION and dotted line', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Class01 o.. Class02`; 'Class01 o.. Class02';
cd.parse(str); cd.parse(str);
@ -144,8 +144,8 @@ class User {
expect(relations[0].relation.lineType).toBe(cDDb.lineType.DOTTED_LINE); expect(relations[0].relation.lineType).toBe(cDDb.lineType.DOTTED_LINE);
}); });
it('should handle relation definitions COMPOSITION on both sides', function () { it('should handle relation definitions COMPOSITION on both sides', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Class01 *--* Class02`; 'Class01 *--* Class02';
cd.parse(str); cd.parse(str);
@ -158,8 +158,8 @@ class User {
expect(relations[0].relation.lineType).toBe(cDDb.lineType.LINE); expect(relations[0].relation.lineType).toBe(cDDb.lineType.LINE);
}); });
it('should handle relation definitions no types', function () { it('should handle relation definitions no types', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Class01 -- Class02`; 'Class01 -- Class02';
cd.parse(str); cd.parse(str);
@ -172,8 +172,8 @@ class User {
expect(relations[0].relation.lineType).toBe(cDDb.lineType.LINE); expect(relations[0].relation.lineType).toBe(cDDb.lineType.LINE);
}); });
it('should handle relation definitions with type only on right side', function () { it('should handle relation definitions with type only on right side', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Class01 --|> Class02`; 'Class01 --|> Class02';
cd.parse(str); cd.parse(str);
@ -187,12 +187,12 @@ class User {
}); });
it('should handle multiple classes and relation definitions', function () { it('should handle multiple classes and relation definitions', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Class01 <|-- Class02 'Class01 <|-- Class02\n'+
Class03 *-- Class04 'Class03 *-- Class04\n'+
Class05 o-- Class06 'Class05 o-- Class06\n'+
Class07 .. Class08 'Class07 .. Class08\n'+
Class09 -- Class10`; 'Class09 -- Class10';
cd.parse(str); cd.parse(str);

52
src/diagrams/classDiagram/classRenderer.js
View File

@ -34,7 +34,6 @@ var getGraphId = function (label) {
return undefined; return undefined;
} }
window.tunk = getGraphId;
/** /**
* Setup arrow head and define the marker. The result is appended to the svg. * Setup arrow head and define the marker. The result is appended to the svg.
*/ */
@ -160,10 +159,12 @@ var drawEdge = function (elem, path, relation) {
.attr('d', lineFunction(lineData)) .attr('d', lineFunction(lineData))
.attr('id', 'edge' + edgeCount) .attr('id', 'edge' + edgeCount)
.attr('class', 'relation'); .attr('class', 'relation');
var url = '';
var url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search; if(conf.arrowMarkerAbsolute){
url = url.replace(/\(/g, '\\('); url = window.location.protocol+'//'+window.location.host+window.location.pathname +window.location.search;
url = url.replace(/\)/g, '\\)'); url = url.replace(/\(/g,'\\(');
url = url.replace(/\)/g,'\\)');
}
//console.log(relation.relation.type1); //console.log(relation.relation.type1);
if (relation.relation.type1 !== 'none') { if (relation.relation.type1 !== 'none') {
@ -265,10 +266,15 @@ var drawClass = function (elem, classDef) {
.attr('class', 'classText'); .attr('class', 'classText');
var isFirst = true; var isFirst = true;
for (var member of classDef.members) {
addTspan(members, member, isFirst); classDef.members.forEach(function(member){
isFirst = false; addTspan(members, member, isFirst);
} isFirst = false;
});
//for (var member of classDef.members) {
// addTspan(members, member, isFirst);
// isFirst = false;
//}
console.warn(JSON.stringify(classDef)); console.warn(JSON.stringify(classDef));
@ -287,10 +293,15 @@ var drawClass = function (elem, classDef) {
.attr('class', 'classText'); .attr('class', 'classText');
isFirst = true; isFirst = true;
for (var method of classDef.methods) {
addTspan(methods, method, isFirst); classDef.methods.forEach(function(method){
isFirst = false; addTspan(methods, method, isFirst);
} isFirst = false;
});
//for (var method of classDef.methods) {
// addTspan(methods, method, isFirst);
// isFirst = false;
//}
var classBox = g.node().getBBox(); var classBox = g.node().getBBox();
g.insert('rect', ':first-child') g.insert('rect', ':first-child')
@ -373,11 +384,16 @@ module.exports.draw = function (text, id) {
var relations = cDDb.getRelations(); var relations = cDDb.getRelations();
var i = 0; var i = 0;
for (var relation of relations) { relations.forEach(function(relation){
i = i + 1; i = i + 1;
log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation)); log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation));
g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), {relation: relation}); g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), {relation: relation});
} });
//for (var relation of relations) {
// i = i + 1;
// log.info('tjoho' + getGraphId(relation.id1) + getGraphId(relation.id2) + JSON.stringify(relation));
// g.setEdge(getGraphId(relation.id1), getGraphId(relation.id2), {relation: relation});
//}
dagre.layout(g); dagre.layout(g);
g.nodes().forEach(function (v) { g.nodes().forEach(function (v) {
if(typeof v !== 'undefined'){ if(typeof v !== 'undefined'){

6
src/diagrams/classDiagram/classRenderer.spec.js
View File

@ -14,7 +14,7 @@
//}; //};
//var classRenderer = proxyquire('./classRenderer', { '../../d3': d3 }); //var classRenderer = proxyquire('./classRenderer', { '../../d3': d3 });
var testDom = require('testdom')('<html><body><div id="tst"></div></body></html>'); //var testDom = require('testdom')('<html><body><div id="tst"></div></body></html>');
var classRenderer = require('./classRenderer'); var classRenderer = require('./classRenderer');
var parser = require('./parser/classDiagram').parser; var parser = require('./parser/classDiagram').parser;
@ -101,8 +101,8 @@ describe('class diagram, ', function () {
}); });
}); });
it('it should handle one actor', function () { it('it should handle one actor', function () {
var str = `classDiagram var str = 'classDiagram\n'+
Class01 --|> Class02`; 'Class01 --|> Class02';
//classRenderer.draw(str,'tst'); //classRenderer.draw(str,'tst');

21
src/diagrams/sequenceDiagram/sequenceDiagram.spec.js
View File

@ -1,7 +1,8 @@
var proxyquire = require('proxyquire');
/** /**
* Created by knut on 14-11-18. * Created by knut on 14-11-18.
*/ */
var proxyquire = require('proxyquire'); //var proxyquire = require('proxyquire');
//var log = require('../../logger').create(); //var log = require('../../logger').create();
var sq = require('./parser/sequenceDiagram').parser; var sq = require('./parser/sequenceDiagram').parser;
@ -18,6 +19,10 @@ var d3 = {
//var sd = proxyquire('./sequenceRenderer', { './d3': d3 }); //var sd = proxyquire('./sequenceRenderer', { './d3': d3 });
var sd = proxyquire('./sequenceRenderer', { '../../d3': d3 }); var sd = proxyquire('./sequenceRenderer', { '../../d3': d3 });
//
//
//var sd = require('./sequenceRenderer');
var str; var str;
describe('when parsing a sequenceDiagram',function() { describe('when parsing a sequenceDiagram',function() {
beforeEach(function () { beforeEach(function () {
@ -574,14 +579,14 @@ describe('when rendering a sequenceDiagram',function() {
sq.yy = require('./sequenceDb'); sq.yy = require('./sequenceDb');
sq.yy.clear(); sq.yy.clear();
var MockBrowser = require('mock-browser').mocks.MockBrowser; //var MockBrowser = require('mock-browser').mocks.MockBrowser;
var mock = new MockBrowser(); //var mock = new MockBrowser();
delete global.mermaid_config; delete global.mermaid_config;
// and in the run-code inside some object // and in the run-code inside some object
global.document = mock.getDocument(); //global.document = mock.getDocument();
global.window = mock.getWindow(); //global.window = mock.getWindow();
//parseError = function(err, hash) { //parseError = function(err, hash) {
// log.debug('Syntax error:' + err); // log.debug('Syntax error:' + err);
@ -632,6 +637,12 @@ describe('when rendering a sequenceDiagram',function() {
noteMargin:25 noteMargin:25
}; };
sd.setConf(conf); sd.setConf(conf);
//document.body.innerHTML = '<div id="tst"></div>';
//document.body.innerHTML = '<svg height="30" width="200"><text id="tst" x="0" y="15" fill="red">I love SVG!</text></svg>';
//document.body.innerHTML = '<svg height="30" width="200"><text x="0" y="15" fill="red"><tspan x="46" id="tst">Alice thinks</tspan></text></svg>';
//console.log('document.body');
//console.log(document.querySelector('#tst').getBBox());
}); });
it('it should handle one actor', function () { it('it should handle one actor', function () {
sd.bounds.init(); sd.bounds.init();

9
src/diagrams/sequenceDiagram/sequenceRenderer.js
View File

@ -225,9 +225,12 @@ var drawMessage = function(elem, startx, stopx, verticalPos, msg){
line.attr('class', 'messageLine0'); line.attr('class', 'messageLine0');
} }
var url = window.location.protocol+'//'+window.location.host+window.location.pathname +window.location.search; var url = '';
url = url.replace(/\(/g,'\\('); if(conf.arrowMarkerAbsolute){
url = url.replace(/\)/g,'\\)'); url = window.location.protocol+'//'+window.location.host+window.location.pathname +window.location.search;
url = url.replace(/\(/g,'\\(');
url = url.replace(/\)/g,'\\)');
}
line.attr('stroke-width', 2); line.attr('stroke-width', 2);
line.attr('stroke', 'black'); line.attr('stroke', 'black');

1
src/diagrams/sequenceDiagram/svgDraw.js
View File

@ -46,6 +46,7 @@ exports.drawText = function(elem, textData, width) {
//span.attr('dy', textData.dy); //span.attr('dy', textData.dy);
span.text(nText); span.text(nText);
if(typeof textElem.textwrap !== 'undefined'){ if(typeof textElem.textwrap !== 'undefined'){
textElem.textwrap({ textElem.textwrap({
x: textData.x, // bounding box is 300 pixels from the left x: textData.x, // bounding box is 300 pixels from the left
y: textData.y, // bounding box is 400 pixels from the top y: textData.y, // bounding box is 400 pixels from the top

36
src/mermaid.spec.js
View File

@ -4,7 +4,7 @@
/** /**
* Created by knut on 14-11-23. * Created by knut on 14-11-23.
*/ */
var rewire = require('rewire'); //var rewire = require('rewire');
var mermaid = require('./mermaid'); var mermaid = require('./mermaid');
//var log = require('./logger').create(); //var log = require('./logger').create();
@ -14,19 +14,19 @@ describe('when using mermaid and ',function() {
//var document; //var document;
//var window; //var window;
beforeEach(function () { beforeEach(function () {
var MockBrowser = require('mock-browser').mocks.MockBrowser; //var MockBrowser = require('mock-browser').mocks.MockBrowser;
var mock = new MockBrowser(); //var mock = new MockBrowser();
//
delete global.mermaid_config; //delete global.mermaid_config;
//
// and in the run-code inside some object //// and in the run-code inside some object
global.document = mock.getDocument(); //global.document = mock.getDocument();
global.window = mock.getWindow(); //global.window = mock.getWindow();
}); });
it('should not start rendering with mermaid_config.startOnLoad set to false', function () { it('should not start rendering with mermaid_config.startOnLoad set to false', function () {
mermaid = rewire('./mermaid'); //mermaid = rewire('./mermaid');
global.mermaid_config ={startOnLoad : false}; global.mermaid_config ={startOnLoad : false};
document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>'; document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>';
@ -37,7 +37,7 @@ describe('when using mermaid and ',function() {
}); });
it('should not start rendering with mermaid.startOnLoad set to false', function () { it('should not start rendering with mermaid.startOnLoad set to false', function () {
mermaid = rewire('./mermaid'); //mermaid = rewire('./mermaid');
global.mermaid.startOnLoad = false; global.mermaid.startOnLoad = false;
global.mermaid_config ={startOnLoad : true}; global.mermaid_config ={startOnLoad : true};
@ -48,7 +48,7 @@ describe('when using mermaid and ',function() {
}); });
it('should start rendering with both startOnLoad set', function () { it('should start rendering with both startOnLoad set', function () {
mermaid = rewire('./mermaid'); //mermaid = rewire('./mermaid');
global.mermaid.startOnLoad = true; global.mermaid.startOnLoad = true;
global.mermaid_config ={startOnLoad : true}; global.mermaid_config ={startOnLoad : true};
document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>'; document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>';
@ -58,7 +58,7 @@ describe('when using mermaid and ',function() {
}); });
it('should start rendering with mermaid.startOnLoad set and no mermaid_config defined', function () { it('should start rendering with mermaid.startOnLoad set and no mermaid_config defined', function () {
mermaid = rewire('./mermaid'); //mermaid = rewire('./mermaid');
global.mermaid.startOnLoad = true; global.mermaid.startOnLoad = true;
document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>'; document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>';
spyOn(global.mermaid,'init'); spyOn(global.mermaid,'init');
@ -67,7 +67,7 @@ describe('when using mermaid and ',function() {
}); });
it('should start rendering as a default with no changes performed', function () { it('should start rendering as a default with no changes performed', function () {
mermaid = rewire('./mermaid'); //mermaid = rewire('./mermaid');
document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>'; document.body.innerHTML = '<div class="mermaid">graph TD;\na;</div>';
spyOn(global.mermaid,'init'); spyOn(global.mermaid,'init');
mermaid.contentLoaded(); mermaid.contentLoaded();
@ -83,12 +83,12 @@ describe('when using mermaid and ',function() {
beforeEach(function () { beforeEach(function () {
global.mermaid_config ={startOnLoad : false}; global.mermaid_config ={startOnLoad : false};
var MockBrowser = require('mock-browser').mocks.MockBrowser; //var MockBrowser = require('mock-browser').mocks.MockBrowser;
var mock = new MockBrowser(); //var mock = new MockBrowser();
flow.parser.yy =graph; flow.parser.yy =graph;
graph.clear(); graph.clear();
global.document = mock.getDocument(); //global.document = mock.getDocument();
mermaid = rewire('./mermaid'); //mermaid = rewire('./mermaid');
}); });
it('it should handle edges with text', function () { it('it should handle edges with text', function () {
flow.parser.parse('graph TD;A-->|text ex|B;'); flow.parser.parse('graph TD;A-->|text ex|B;');

27
src/mermaidAPI.js
View File

@ -64,6 +64,12 @@ var config = {
*/ */
startOnLoad: true, startOnLoad: true,
/**
* **arrowMarkerAbsolute** - This options controls whether or arrow markers in html code will be absolute pats or
* an anchor, #. This matters if you are using base tag settings.
*/
arrowMarkerAbsolute: false,
/** /**
* ### flowchart * ### flowchart
* *The object containing configurations specific for flowcharts* * *The object containing configurations specific for flowcharts*
@ -225,7 +231,8 @@ var config = {
return d.getMonth(); return d.getMonth();
}] }]
] ]
} },
classDiagram:{}
}; };
Logger.setLogLevel(config.logLevel); Logger.setLogLevel(config.logLevel);
@ -385,7 +392,7 @@ var render = function(id, txt, cb, container){
var classes = {}; var classes = {};
switch(graphType){ switch(graphType){
case 'graph': case 'graph':
config.flowchart.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
flowRenderer.setConf(config.flowchart); flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, false); flowRenderer.draw(txt, id, false);
if(config.cloneCssStyles){ if(config.cloneCssStyles){
@ -394,6 +401,7 @@ var render = function(id, txt, cb, container){
} }
break; break;
case 'dotGraph': case 'dotGraph':
config.flowchart.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
flowRenderer.setConf(config.flowchart); flowRenderer.setConf(config.flowchart);
flowRenderer.draw(txt, id, true); flowRenderer.draw(txt, id, true);
if(config.cloneCssStyles) { if(config.cloneCssStyles) {
@ -402,6 +410,7 @@ var render = function(id, txt, cb, container){
} }
break; break;
case 'sequenceDiagram': case 'sequenceDiagram':
config.sequenceDiagram.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
seq.setConf(config.sequenceDiagram); seq.setConf(config.sequenceDiagram);
seq.draw(txt,id); seq.draw(txt,id);
if(config.cloneCssStyles) { if(config.cloneCssStyles) {
@ -409,6 +418,7 @@ var render = function(id, txt, cb, container){
} }
break; break;
case 'gantt': case 'gantt':
config.gantt.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
gantt.setConf(config.gantt); gantt.setConf(config.gantt);
gantt.draw(txt,id); gantt.draw(txt,id);
if(config.cloneCssStyles) { if(config.cloneCssStyles) {
@ -416,13 +426,15 @@ var render = function(id, txt, cb, container){
} }
break; break;
case 'classDiagram': case 'classDiagram':
classRenderer.setConf(config.gantt); config.classDiagram.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
classRenderer.setConf(config.classDiagram);
classRenderer.draw(txt,id); classRenderer.draw(txt,id);
if(config.cloneCssStyles) { if(config.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []); utils.cloneCssStyles(element.firstChild, []);
} }
break; break;
case 'info': case 'info':
config.info.arrowMarkerAbsolute = config.arrowMarkerAbsolute;
info.draw(txt,id,exports.version()); info.draw(txt,id,exports.version());
if(config.cloneCssStyles) { if(config.cloneCssStyles) {
utils.cloneCssStyles(element.firstChild, []); utils.cloneCssStyles(element.firstChild, []);
@ -432,10 +444,13 @@ var render = function(id, txt, cb, container){
d3.select('#d'+id).selectAll('foreignobject div').attr('xmlns','http://www.w3.org/1999/xhtml'); d3.select('#d'+id).selectAll('foreignobject div').attr('xmlns','http://www.w3.org/1999/xhtml');
var url = '';
if(config.arrowMarkerAbsolute){
url = window.location.protocol+'//'+window.location.host+window.location.pathname +window.location.search;
url = url.replace(/\(/g,'\\(');
url = url.replace(/\)/g,'\\)');
}
var url = window.location.protocol+'//'+window.location.host+window.location.pathname +window.location.search;
url = url.replace(/\(/g,'\\(');
url = url.replace(/\)/g,'\\)');
// Fix for when the base tag is used // Fix for when the base tag is used
var svgCode = d3.select('#d'+id).node().innerHTML.replace(/url\(#arrowhead/g,'url('+url +'#arrowhead','g'); var svgCode = d3.select('#d'+id).node().innerHTML.replace(/url\(#arrowhead/g,'url('+url +'#arrowhead','g');

12
src/mermaidAPI.spec.js
View File

@ -13,14 +13,15 @@ describe('when using mermaidAPI and ',function() {
//var document; //var document;
//var window; //var window;
beforeEach(function () { beforeEach(function () {
var MockBrowser = require('mock-browser').mocks.MockBrowser; //var MockBrowser = require('mock-browser').mocks.MockBrowser;
var mock = new MockBrowser(); //var mock = new MockBrowser();
delete global.mermaid_config; delete global.mermaid_config;
// and in the run-code inside some object // and in the run-code inside some object
global.document = mock.getDocument(); //global.document = mock.getDocument();
global.window = mock.getWindow(); //global.window = mock.getWindow();
document.body.innerHTML = '';
}); });
it('should copy a literal into the configuration', function () { it('should copy a literal into the configuration', function () {
@ -55,6 +56,7 @@ describe('when using mermaidAPI and ',function() {
}); });
describe('checking validity of input ', function(){ describe('checking validity of input ', function(){
it('it should return false for an invalid definiton',function(){ it('it should return false for an invalid definiton',function(){
global.mermaidAPI.parseError= function(){};
spyOn(global.mermaidAPI,'parseError'); spyOn(global.mermaidAPI,'parseError');
var res = api.parse('this is not a mermaid diagram definition'); var res = api.parse('this is not a mermaid diagram definition');
@ -63,7 +65,7 @@ describe('when using mermaidAPI and ',function() {
}); });
it('it should return true for a valid definiton',function(){ it('it should return true for a valid definiton',function(){
spyOn(global.mermaidAPI,'parseError'); spyOn(global.mermaidAPI,'parseError');
var res = global.mermaid.parse('graph TD;A--x|text including URL space|B;'); var res = api.parse('graph TD;A--x|text including URL space|B;');
expect(res).toBe(true); expect(res).toBe(true);
expect(global.mermaidAPI.parseError).not.toHaveBeenCalled(); expect(global.mermaidAPI.parseError).not.toHaveBeenCalled();

2
src/utils.js
View File

@ -74,7 +74,7 @@ var cloneCssStyles = function(svg, classes){
var elems; var elems;
elems = svg.querySelectorAll(rule.selectorText); elems = svg.querySelectorAll(rule.selectorText);
if (elems.length > 0) { if (elems.length > 0) {
usedStyles += rule.selectorText + ' { ' + rule.style.cssText + ' }\n'; usedStyles += rule.selectorText + ' { ' + rule.style.cssText + '}\n';
} }
} }
} }

41
src/utils.spec.js
View File

@ -35,13 +35,13 @@ describe('when cloning CSS ', function () {
beforeEach(function () { beforeEach(function () {
var MockBrowser = require('mock-browser').mocks.MockBrowser; //var MockBrowser = require('mock-browser').mocks.MockBrowser;
var mock = new MockBrowser(); //var mock = new MockBrowser();
// and in the run-code inside some object // and in the run-code inside some object
global.document = mock.getDocument(); //global.document = mock.getDocument();
//document.body.innerHTML = ''; document.body.innerHTML = '';
//document.body.innerHTML = '';
}); });
function stylesToArray(svg) { function stylesToArray(svg) {
@ -62,6 +62,7 @@ describe('when cloning CSS ', function () {
styleArrTrim.splice(i, 1); styleArrTrim.splice(i, 1);
i--; i--;
} }
styleArrTrim[i] = styleArrTrim[i].trim();
} }
return styleArrTrim; return styleArrTrim;
@ -69,13 +70,13 @@ describe('when cloning CSS ', function () {
function addStyleToDocument() { function addStyleToDocument() {
var s = document.createElement('style'); var s = document.createElement('style');
s.innerHTML = '.node { stroke:#eee; }\n.node-square { stroke:#bbb; }\n'; s.innerHTML = '.node { stroke:#eeeeee; }\n.node-square { stroke:#bbbbbb; }\n';
document.body.appendChild(s); document.body.appendChild(s);
} }
function addSecondStyleToDocument() { function addSecondStyleToDocument() {
var s = document.createElement('style'); var s = document.createElement('style');
s.innerHTML = '.node2 { stroke:#eee; }\n.node-square { stroke:#beb; }\n'; s.innerHTML = '.node2 { stroke:#eeeeee; }\n.node-square { stroke:#beb; }\n';
document.body.appendChild(s); document.body.appendChild(s);
} }
@ -151,7 +152,7 @@ describe('when cloning CSS ', function () {
var svg = generateSVG(); var svg = generateSVG();
addStyleToDocument(); addStyleToDocument();
utils.cloneCssStyles(svg, {}); utils.cloneCssStyles(svg, {});
expect(stylesToArray(svg)).toEqual(['.node { stroke: #eee; }', '.node-square { stroke: #bbb; }']); expect(stylesToArray(svg)).toEqual(['.node { stroke: #eeeeee; }', '.node-square { stroke: #bbbbbb; }']);
}); });
it('should handle multiple stylesheets in document with classes in SVG', function () { it('should handle multiple stylesheets in document with classes in SVG', function () {
@ -159,7 +160,7 @@ describe('when cloning CSS ', function () {
addStyleToDocument(); addStyleToDocument();
addSecondStyleToDocument(); addSecondStyleToDocument();
utils.cloneCssStyles(svg, {}); utils.cloneCssStyles(svg, {});
expect(stylesToArray(svg)).toEqual(['.node { stroke: #eee; }', '.node-square { stroke: #bbb; }', '.node-square { stroke: #beb; }']); expect(stylesToArray(svg)).toEqual(['.node { stroke: #eeeeee; }', '.node-square { stroke: #bbbbbb; }', '.node-square { stroke: #bbeebb; }']);
}); });
it('should handle multiple stylesheets + ignore styles in other mermaid SVG', function () { it('should handle multiple stylesheets + ignore styles in other mermaid SVG', function () {
@ -168,29 +169,29 @@ describe('when cloning CSS ', function () {
addSecondStyleToDocument(); addSecondStyleToDocument();
addMermaidSVGwithStyleToDocument(); addMermaidSVGwithStyleToDocument();
utils.cloneCssStyles(svg, {}); utils.cloneCssStyles(svg, {});
expect(stylesToArray(svg)).toEqual(['.node { stroke: #eee; }', '.node-square { stroke: #bbb; }', '.node-square { stroke: #beb; }']); expect(stylesToArray(svg)).toEqual(['.node { stroke: #eeeeee; }', '.node-square { stroke: #bbbbbb; }', '.node-square { stroke: #bbeebb; }']);
}); });
it('should handle a default class together with stylesheet in document with classes in SVG', function () { it('should handle a default class together with stylesheet in document with classes in SVG', function () {
var svg = generateSVG(); var svg = generateSVG();
addStyleToDocument(); addStyleToDocument();
utils.cloneCssStyles(svg, {'default': {'styles': ['stroke:#fff', 'stroke-width:1.5px']}}); utils.cloneCssStyles(svg, {'default': {'styles': ['stroke:#ffffff', 'stroke-width:1.5px']}});
expect(stylesToArray(svg)).toEqual(['#mermaid-01 .node>rect { stroke:#fff; stroke-width:1.5px; }', '.node { stroke: #eee; }', '.node-square { stroke: #bbb; }']); expect(stylesToArray(svg)).toEqual(['#mermaid-01 .node>rect { stroke:#ffffff; stroke-width:1.5px; }', '.node { stroke: #eeeeee; }', '.node-square { stroke: #bbbbbb; }']);
}); });
it('should handle a default class together with stylesheet in document and classDefs', function () { it('should handle a default class together with stylesheet in document and classDefs', function () {
var svg = generateSVG(); var svg = generateSVG();
addStyleToDocument(); addStyleToDocument();
utils.cloneCssStyles(svg, { utils.cloneCssStyles(svg, {
'default': {'styles': ['stroke:#fff', 'stroke-width:1.5px']}, 'default': {'styles': ['stroke:#ffffff', 'stroke-width:1.5px']},
'node-square': {'styles': ['fill:#eee', 'stroke:#aaa']}, 'node-square': {'styles': ['fill:#eeeeee', 'stroke:#aaaaaa']},
'node-circle': {'styles': ['fill:#444', 'stroke:#111']} 'node-circle': {'styles': ['fill:#444444', 'stroke:#111111']}
}); });
expect(stylesToArray(svg)).toEqual(['#mermaid-01 .node>rect { stroke:#fff; stroke-width:1.5px; }', expect(stylesToArray(svg)).toEqual(['#mermaid-01 .node>rect { stroke:#ffffff; stroke-width:1.5px; }',
'.node { stroke: #eee; }', '.node { stroke: #eeeeee; }',
'.node-square { stroke: #bbb; }', '.node-square { stroke: #bbbbbb; }',
'#mermaid-01 .node-square>rect { fill:#eee; stroke:#aaa; }', '#mermaid-01 .node-square>rect { fill:#eeeeee; stroke:#aaaaaa; }',
'#mermaid-01 .node-circle>rect { fill:#444; stroke:#111; }' '#mermaid-01 .node-circle>rect { fill:#444444; stroke:#111111; }'
]); ]);
}); });
}); });

5
test/examples/advancedBasteTag(.html
View File

@ -8,8 +8,9 @@
<script src="../../dist/mermaid.js"></script> <script src="../../dist/mermaid.js"></script>
</head><body> </head><body>
<script> <script>
mermaid.startOnLoad=true; mermaid.initialize({
//mermaid.initialize(); arrowMarkerAbsolute:true
});
</script> </script>
<div class="mermaid"> <div class="mermaid">
graph LR; graph LR;

2
test/seq.html → test/examples/seq.html
View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<script src="../dist/mermaid.js"></script> <script src="./dist/mermaid.js"></script>
<link rel="stylesheet" href="seq.css"/> <link rel="stylesheet" href="seq.css"/>
<script> <script>
mermaid.initialize({ mermaid.initialize({

7
test/examples/simpleBasteTag.html
View File

@ -8,8 +8,11 @@
<script src="../../dist/mermaid.js"></script> <script src="../../dist/mermaid.js"></script>
</head><body> </head><body>
<script> <script>
mermaid.startOnLoad=true; var config = {
//mermaid.initialize(); startOnLoad:true,
arrowMarkerAbsolute:true
};
mermaid.initialize(config);
</script> </script>
<div class="mermaid"> <div class="mermaid">
graph LR; graph LR;