marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-08-18 15:56:43 +02:00
Code Issues Packages Projects Releases Wiki Activity

Draft parser for gantt diagrams.

Browse Source
This commit is contained in:
knsv
2015-02-08 20:07:15 +01:00
parent 7896a7152e
commit c211434c38
16 changed files with 1593 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
gulpfile.js
View File

@@ -28,6 +28,7 @@ gulp.task('jison', shell.task([
'jison src/diagrams/flowchart/parser/dot.jison -o src/diagrams/flowchart/parser/dot.js', 'jison src/diagrams/flowchart/parser/dot.jison -o src/diagrams/flowchart/parser/dot.js',
'jison src/diagrams/sequenceDiagram/parser/sequenceDiagram.jison -o src/diagrams/sequenceDiagram/parser/sequenceDiagram.js', 'jison src/diagrams/sequenceDiagram/parser/sequenceDiagram.jison -o src/diagrams/sequenceDiagram/parser/sequenceDiagram.js',
'jison src/diagrams/example/parser/example.jison -o src/diagrams/example/parser/example.js', 'jison src/diagrams/example/parser/example.jison -o src/diagrams/example/parser/example.js',
'jison src/diagrams/gantt/parser/gantt.jison -o src/diagrams/gantt/parser/gantt.js',
//'jison src/diagrams/sequenceDiagram/parser/sequenceDiagram.jison -o src/diagrams/sequenceDiagram/parser/sequenceDiagram.js' //'jison src/diagrams/sequenceDiagram/parser/sequenceDiagram.jison -o src/diagrams/sequenceDiagram/parser/sequenceDiagram.js'
])); ]));

1
package.json
View File

@@ -22,6 +22,7 @@
"he": "^0.5.0", "he": "^0.5.0",
"minimist": "^1.1.0", "minimist": "^1.1.0",
"mkdirp": "^0.5.0", "mkdirp": "^0.5.0",
"moment": "^2.9.0",
"semver": "^4.1.1", "semver": "^4.1.1",
"which": "^1.0.8" "which": "^1.0.8"
}, },

8
src/diagrams/example/parser/example.jison
View File

@@ -1,7 +1,7 @@
/** js sequence diagrams /** mermaid
* http://bramp.github.io/js-sequence-diagrams/ * http://knsv.github.io/mermaid/
* (c) 2012-2013 Andrew Brampton (bramp.net) * (c) 2015 Knut Sveidqvist
* Simplified BSD license. * MIT license.
*/ */
%lex %lex

10
src/diagrams/flowchart/parser/flow.jison
View File

@@ -1,4 +1,8 @@
/* description: Parses end executes mathematical expressions. */ /** mermaid
* http://knsv.github.io/mermaid/
* (c) 2015 Knut Sveidqvist
* MIT license.
*/
/* lexical grammar */ /* lexical grammar */
%lex %lex
@@ -261,7 +265,9 @@ alphaNum
; ;
alphaNumStatement alphaNumStatement
: alphaNumToken : DIR
{$$=$1;}
| alphaNumToken
{$$=$1;} {$$=$1;}
| alphaNumToken MINUS alphaNumToken | alphaNumToken MINUS alphaNumToken
{$$=$1+'-'+$3;} {$$=$1+'-'+$3;}

66
src/diagrams/flowchart/parser/flow.js
View File

File diff suppressed because one or more lines are too long

13
src/diagrams/flowchart/parser/flow.spec.js
View File

@@ -424,7 +424,18 @@ describe('when parsing ',function(){
expect(edges[0].text).toBe('text including graph space'); expect(edges[0].text).toBe('text including graph space');
}); });
it('should handle keywords',function(){
var res = flow.parser.parse('graph TD;V-->a[v]');
var vert = flow.parser.yy.getVertices();
var edges = flow.parser.yy.getEdges();
expect(vert['a'].text).toBe('v');
});
it('should handle keywords',function(){
var res = flow.parser.parse('graph TD;V-->a[v]');
var vert = flow.parser.yy.getVertices();
var edges = flow.parser.yy.getEdges();
expect(vert['a'].text).toBe('v');
});
}); });
describe("it should handle new line type notation",function() { describe("it should handle new line type notation",function() {

23
src/diagrams/gantt/exGantt.md Normal file
View File

@@ -0,0 +1,23 @@
```mermaid
gantt
dateFormat yyyy-mm-dd
title Adding gantt diagram functionality to mermaid
section Design
Design jison grammar :des1, 2014-01-01, 2014-01-04
Create example text :des2, 2014-01-01, 3d
Bounce gantt example with users :des3, after des2, 5d
section Implementation
update build script :2014-01-02,1h
Implement parser and jison :after des1, 2d
Create tests for parser :3d
Create renderer :5d
Create tests for renderer :2d
Add to mermaid core :1d
section Documentation
Describe gantt syntax :a1, 2014-01-01, 3d
Add gantt diagram to demo page :after a1 , 2h
Add gantt to diagram to demo page :after a1 , 2h
```

61
src/diagrams/gantt/gant.css Normal file
View File

@@ -0,0 +1,61 @@
* {
margin: 0;
padding: 0;
}
body {
background: #fff;
font-family: 'Open-Sans',sans-serif;
}
#container{
margin: 0 auto;
position: relative;
width:800px;
overflow: visible;
}
.svg {
width:800px;
height:400px;
overflow: visible;
position:absolute;
}
.grid .tick {
stroke: lightgrey;
opacity: 0.3;
shape-rendering: crispEdges;
}
.grid path {
stroke-width: 0;
}
#tag {
color: white;
background: #FA283D;
width: 150px;
position: absolute;
display: none;
padding:3px 6px;
margin-left: -80px;
font-size: 11px;
}
#tag:before {
border: solid transparent;
content: ' ';
height: 0;
left: 50%;
margin-left: -5px;
position: absolute;
width: 0;
border-width: 10px;
border-bottom-color: #FA283D;
top: -20px;
}

46
src/diagrams/gantt/gantt.spec.js Normal file
View File

@@ -0,0 +1,46 @@
/**
* Created by knut on 14-11-18.
*/
describe('when parsing a gantt diagram it',function() {
var parseError, gantt;
beforeEach(function () {
gantt = require('./parser/gantt').parser;
gantt.yy = require('./ganttDb');
parseError = function(err, hash) {
console.log('Syntax error:' + err);
};
//ex.yy.parseError = parseError;
});
it('should handle an dateFormat definition', function () {
var str = 'gantt\ndateFormat yyyy-mm-dd';
gantt.parse(str);
});
it('should handle an dateFormat definition', function () {
var str = 'gantt\ntitle Adding gantt diagram functionality to mermaid';
gantt.parse(str);
});
it('should handle an dateFormat definition', function () {
var str = 'gantt\ntitle Adding gantt diagram functionality to mermaid';
gantt.parse(str);
});
it('should handle an dateFormat definition', function () {
var str = 'gantt\nsection Documentation';
gantt.parse(str);
});
it('should handle an dateFormat definition', function () {
var str = 'gantt\n' +
'section Documentation\n' +
//'section Documentation2\n';
//'Design jison grammar :';
'Design jison grammar:des1, 2014-01-01, 2014-01-04';
gantt.parse(str);
});
});
// Ogiltigt id i after id

174
src/diagrams/gantt/ganttDb.js Normal file
View File

@@ -0,0 +1,174 @@
/**
* Created by knut on 15-01-14.
*/
var dateFormat = '';
var title = '';
var info = false;
var sections = [];
var tasks = [];
var currentSection = '';
exports.clear = function(){
sections = [];
tasks = [];
currentSection = '';
title = '';
taskCnt = 0;
lastTask = undefined;
};
exports.setDateFormat = function(txt){
dateFormat = txt;
};
exports.getDateFormat = function(){
return dateFormat;
};
exports.setTitle = function(txt){
title = txt;
};
exports.gettitle = function(){
return title;
};
exports.addSection = function(txt){
currentSection = txt;
sections.push(txt);
};
exports.findTaskById = function(id) {
var i;
for(i=0;i<tasks.length;i++){
if(tasks[i].id === id){
return tasks[i];
}
}
};
exports.getTasks=function(){
return tasks;
};
var getStartDate = function(prevTime, dateFormat, str){
var moment = require('moment');
// Test for after
var re = /^after\s+([\d\w\-]+)/;
var afterStatement = re.exec(str.trim());
if(afterStatement!==null){
var task = exports.findTaskById(afterStatement[1]);
if(typeof task === 'undefined'){
var dt = new Date();
dt.setHours(0,0,0,0);
return dt;
}
return task.endTime;
}
// Check for actual date set
if(moment(str,dateFormat,true).isValid()){
return moment(str,dateFormat).toDate();
}
// Default date - now
return new Date();
};
var getEndDate = function(prevTime, dateFormat, str){
var moment = require('moment');
// Check for actual date
if(moment(str,dateFormat,true).isValid()){
return moment(str,dateFormat).toDate();
}
var d = moment(prevTime);
// Check for length
var re = /^([\d]+)([wdh])/;
var durationStatement = re.exec(str.trim());
if(durationStatement!== null){
switch(durationStatement[2]){
case 'h':
d.add(durationStatement[1], 'hours');
break;
case 'd':
d.add(durationStatement[1], 'days');
break;
case 'w':
d.add(durationStatement[1], 'weeks');
break;
}
return d.toDate();
}
// Default date - now
return d.toDate();
};
var taskCnt = 0;
var parseId = function(idStr){
if(typeof idStr === 'undefined'){
taskCnt = taskCnt + 1;
return 'task'+taskCnt;
}
return idStr;
};
// id, startDate, endDate
// id, startDate, length
// id, after x, endDate
// id, after x, length
// startDate, endDate
// startDate, length
// after x, endDate
// after x, length
// endDate
// length
var compileData = function(prevTask, dataStr){
var data = dataStr.split(',');
var task = {};
var df = exports.getDateFormat();
switch(data.length){
case 1:
task.id = parseId();
task.startTime = prevTask.endTime;
task.endTime = getEndDate(task.startTime, df, data[0]);
break;
case 2:
task.id = parseId();
task.startTime = getStartDate(undefined, df, data[0]);
task.endTime = getEndDate(task.startTime, df, data[1]);
break;
case 3:
task.id = parseId(data[0]);
task.startTime = getStartDate(undefined, df, data[1]);
task.endTime = getEndDate(task.startTime, df, data[2]);
break;
default:
}
return task;
};
var lastTask;
exports.addTask = function(descr,data){
var newTask = {
section:currentSection,
description:descr
};
var taskInfo = compileData(lastTask, data);
newTask.startTime = taskInfo.startTime;
newTask.endTime = taskInfo.endTime;
newTask.id = taskInfo.id;
lastTask = newTask;
tasks.push(newTask);
};
exports.parseError = function(err,hash){
mermaid.parseError(err,hash);
};

147
src/diagrams/gantt/ganttDb.spec.js Normal file
View File

@@ -0,0 +1,147 @@
/**
* Created by knut on 14-11-18.
*/
describe('when using the ganttDb',function() {
var parseError, gantt;
var moment = require('moment');
beforeEach(function () {
//gantt = require('./parser/gantt').parser;
gDb = require('./ganttDb');
gDb.clear();
parseError = function(err, hash) {
console.log('Syntax error:' + err);
};
//ex.yy.parseError = parseError;
});
it('should handle an fixed dates', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','id1,2013-01-01,2013-01-12');
var tasks = gDb.getTasks();
expect(tasks[0].startTime).toEqual(moment('2013-01-01', 'YYYY-MM-DD').toDate());
expect(tasks[0].endTime ).toEqual(moment('2013-01-12', 'YYYY-MM-DD').toDate());
expect(tasks[0].id ).toEqual('id1');
expect(tasks[0].description).toEqual('test1');
});
it('should handle duration instead of fixed date to determine end date', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','id1,2013-01-01,2d');
var tasks = gDb.getTasks();
expect(tasks[0].startTime).toEqual(moment('2013-01-01', 'YYYY-MM-DD').toDate());
expect(tasks[0].endTime ).toEqual(moment('2013-01-03', 'YYYY-MM-DD').toDate());
expect(tasks[0].id ).toEqual('id1');
expect(tasks[0].description).toEqual('test1');
});
it('should handle duration instead of fixed date to determine end date', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','id1,2013-01-01,2h');
var tasks = gDb.getTasks();
expect(tasks[0].startTime).toEqual(moment('2013-01-01', 'YYYY-MM-DD').toDate());
expect(tasks[0].endTime ).toEqual(moment('2013-01-01 2:00', 'YYYY-MM-DD hh:mm').toDate());
expect(tasks[0].id ).toEqual('id1');
expect(tasks[0].description).toEqual('test1');
});
it('should handle ', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','id1,2013-01-01,2w');
var tasks = gDb.getTasks();
expect(tasks[0].startTime).toEqual(moment('2013-01-01', 'YYYY-MM-DD').toDate());
expect(tasks[0].endTime ).toEqual(moment('2013-01-15', 'YYYY-MM-DD').toDate());
expect(tasks[0].id ).toEqual('id1');
expect(tasks[0].description).toEqual('test1');
});
it('should handle relative start date based on id', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','id1,2013-01-01,2w');
gDb.addTask('test2','id2,after id1,1d');
var tasks = gDb.getTasks();
expect(tasks[1].startTime ).toEqual(moment('2013-01-15', 'YYYY-MM-DD').toDate());
expect(tasks[1].id ).toEqual('id2');
expect(tasks[1].description).toEqual('test2');
});
it('should handle relative start date based on id when id is invalid', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','id1,2013-01-01,2w');
gDb.addTask('test2','id2,after id3,1d');
var tasks = gDb.getTasks();
expect(tasks[1].startTime).toEqual(new Date((new Date()).setHours(0,0,0,0)));
expect(tasks[1].id ).toEqual('id2');
expect(tasks[1].description).toEqual('test2');
});
it('should handle fixed dates without id', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','2013-01-01,2013-01-12');
var tasks = gDb.getTasks();
expect(tasks[0].startTime).toEqual(moment('2013-01-01', 'YYYY-MM-DD').toDate());
expect(tasks[0].endTime ).toEqual(moment('2013-01-12', 'YYYY-MM-DD').toDate());
expect(tasks[0].id ).toEqual('task1');
expect(tasks[0].description).toEqual('test1');
});
it('should handle duration instead of a fixed date to determine end date without id', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','2013-01-01,4d');
var tasks = gDb.getTasks();
expect(tasks[0].startTime).toEqual(moment('2013-01-01', 'YYYY-MM-DD').toDate());
expect(tasks[0].endTime ).toEqual(moment('2013-01-05', 'YYYY-MM-DD').toDate());
expect(tasks[0].id ).toEqual('task1');
expect(tasks[0].description).toEqual('test1');
});
it('should handle relative start date of a fixed date to determine end date without id', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','id1,2013-01-01,2w');
gDb.addTask('test2','after id1,1d');
var tasks = gDb.getTasks();
expect(tasks[1].startTime ).toEqual(moment('2013-01-15', 'YYYY-MM-DD').toDate());
expect(tasks[1].id ).toEqual('task1');
expect(tasks[1].description).toEqual('test2');
});
it('should handle a new task with only an end date as definition', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','id1,2013-01-01,2w');
gDb.addTask('test2','2013-01-26');
var tasks = gDb.getTasks();
expect(tasks[1].startTime).toEqual(moment('2013-01-15', 'YYYY-MM-DD').toDate());
expect(tasks[1].endTime ).toEqual(moment('2013-01-26', 'YYYY-MM-DD').toDate());
expect(tasks[1].id ).toEqual('task1');
expect(tasks[1].description).toEqual('test2');
});
it('should handle a new task with only an end date as definition', function () {
gDb.setDateFormat('YYYY-MM-DD');
gDb.addSection('testa1');
gDb.addTask('test1','id1,2013-01-01,2w');
gDb.addTask('test2','2d');
var tasks = gDb.getTasks();
expect(tasks[1].startTime).toEqual(moment('2013-01-15', 'YYYY-MM-DD').toDate());
expect(tasks[1].endTime ).toEqual(moment('2013-01-17', 'YYYY-MM-DD').toDate());
expect(tasks[1].id ).toEqual('task1');
expect(tasks[1].description).toEqual('test2');
});
});
// Ogiltigt id i after id

357
src/diagrams/gantt/ganttRenderer.js Normal file
View File

@@ -0,0 +1,357 @@
var w = 1600;
var h = 800;
var svg = d3.selectAll(".svg")
//.selectAll("svg")
.append("svg")
.attr("width", w)
.attr("height", h)
.attr("class", "svg");
// http://codepen.io/anon/pen/azLvWR
var taskArray = [
{
task: "conceptualize",
type: "development",
startTime: "2013-1-28", //year/month/day
endTime: "2013-2-1",
details: "This actually didn't take any conceptualization"
},
{
task: "sketch",
type: "development",
startTime: "2013-2-1",
endTime: "2013-2-6",
details: "No sketching either, really"
},
{
task: "color profiles",
type: "development",
startTime: "2013-2-6",
endTime: "2013-2-9"
},
{
task: "HTML",
type: "coding",
startTime: "2013-2-2",
endTime: "2013-2-6",
details: "all three lines of it"
},
{
task: "write the JS",
type: "coding",
startTime: "2013-2-6",
endTime: "2013-2-9"
},
{
task: "advertise",
type: "promotion",
startTime: "2013-2-9",
endTime: "2013-2-12",
details: "This counts, right?"
},
{
task: "spam links",
type: "promotion",
startTime: "2013-2-12",
endTime: "2013-2-14"
},
{
task: "eat",
type: "celebration",
startTime: "2013-2-8",
endTime: "2013-2-13",
details: "All the things"
},
{
task: "crying",
type: "development",
startTime: "2013-2-13",
endTime: "2013-2-16"
},
];
var dateFormat = d3.time.format("%Y-%m-%d");
var timeScale = d3.time.scale()
.domain([d3.min(taskArray, function(d) {return dateFormat.parse(d.startTime);}),
d3.max(taskArray, function(d) {return dateFormat.parse(d.endTime);})])
.range([0,w-150]);
var categories = [];
for (var i = 0; i < taskArray.length; i++){
categories.push(taskArray[i].type);
}
var catsUnfiltered = categories; //for vert labels
categories = checkUnique(categories);
makeGant(taskArray, w, h);
var title = svg.append("text")
.text("Gantt Chart Process")
.attr("x", w/2)
.attr("y", 25)
.attr("text-anchor", "middle")
.attr("font-size", 18)
.attr("fill", "#009FFC");
function makeGant(tasks, pageWidth, pageHeight){
var barHeight = 20;
var gap = barHeight + 4;
var topPadding = 75;
var sidePadding = 75;
var colorScale = d3.scale.linear()
.domain([0, categories.length])
.range(["#00B9FA", "#F95002"])
.interpolate(d3.interpolateHcl);
makeGrid(sidePadding, topPadding, pageWidth, pageHeight);
drawRects(tasks, gap, topPadding, sidePadding, barHeight, colorScale, pageWidth, pageHeight);
vertLabels(gap, topPadding, sidePadding, barHeight, colorScale);
}
function drawRects(theArray, theGap, theTopPad, theSidePad, theBarHeight, theColorScale, w, h){
var bigRects = svg.append("g")
.selectAll("rect")
.data(theArray)
.enter()
.append("rect")
.attr("x", 0)
.attr("y", function(d, i){
return i*theGap + theTopPad - 2;
})
.attr("width", function(d){
return w-theSidePad/2;
})
.attr("height", theGap)
.attr("stroke", "none")
.attr("fill", function(d){
for (var i = 0; i < categories.length; i++){
if (d.type == categories[i]){
return d3.rgb(theColorScale(i));
}
}
})
.attr("opacity", 0.2);
var rectangles = svg.append('g')
.selectAll("rect")
.data(theArray)
.enter();
var innerRects = rectangles.append("rect")
.attr("rx", 3)
.attr("ry", 3)
.attr("x", function(d){
return timeScale(dateFormat.parse(d.startTime)) + theSidePad;
})
.attr("y", function(d, i){
return i*theGap + theTopPad;
})
.attr("width", function(d){
return (timeScale(dateFormat.parse(d.endTime))-timeScale(dateFormat.parse(d.startTime)));
})
.attr("height", theBarHeight)
.attr("stroke", "none")
.attr("fill", function(d){
for (var i = 0; i < categories.length; i++){
if (d.type == categories[i]){
return d3.rgb(theColorScale(i));
}
}
});
var rectText = rectangles.append("text")
.text(function(d){
return d.task;
})
.attr("x", function(d){
return (timeScale(dateFormat.parse(d.endTime))-timeScale(dateFormat.parse(d.startTime)))/2 + timeScale(dateFormat.parse(d.startTime)) + theSidePad;
})
.attr("y", function(d, i){
return i*theGap + 14+ theTopPad;
})
.attr("font-size", 11)
.attr("text-anchor", "middle")
.attr("text-height", theBarHeight)
.attr("fill", "#fff");
rectText.on('mouseover', function(e) {
// console.log(this.x.animVal.getItem(this));
var tag = "";
if (typeof d3.select(this).data()[0].details !== 'undefined'){
tag = "Task: " + d3.select(this).data()[0].task + "<br/>" +
"Type: " + d3.select(this).data()[0].type + "<br/>" +
"Starts: " + d3.select(this).data()[0].startTime + "<br/>" +
"Ends: " + d3.select(this).data()[0].endTime + "<br/>" +
"Details: " + d3.select(this).data()[0].details;
} else {
tag = "Task: " + d3.select(this).data()[0].task + "<br/>" +
"Type: " + d3.select(this).data()[0].type + "<br/>" +
"Starts: " + d3.select(this).data()[0].startTime + "<br/>" +
"Ends: " + d3.select(this).data()[0].endTime;
}
var output = document.getElementById("tag");
var x = this.x.animVal.getItem(this) + "px";
var y = this.y.animVal.getItem(this) + 25 + "px";
output.innerHTML = tag;
output.style.top = y;
output.style.left = x;
output.style.display = "block";
}).on('mouseout', function() {
var output = document.getElementById("tag");
output.style.display = "none";
});
innerRects.on('mouseover', function(e) {
//console.log(this);
var tag = "";
if (typeof d3.select(this).data()[0].details !== 'undefined'){
tag = "Task: " + d3.select(this).data()[0].task + "<br/>" +
"Type: " + d3.select(this).data()[0].type + "<br/>" +
"Starts: " + d3.select(this).data()[0].startTime + "<br/>" +
"Ends: " + d3.select(this).data()[0].endTime + "<br/>" +
"Details: " + d3.select(this).data()[0].details;
} else {
tag = "Task: " + d3.select(this).data()[0].task + "<br/>" +
"Type: " + d3.select(this).data()[0].type + "<br/>" +
"Starts: " + d3.select(this).data()[0].startTime + "<br/>" +
"Ends: " + d3.select(this).data()[0].endTime;
}
var output = document.getElementById("tag");
var x = (this.x.animVal.value + this.width.animVal.value/2) + "px";
var y = this.y.animVal.value + 25 + "px";
output.innerHTML = tag;
output.style.top = y;
output.style.left = x;
output.style.display = "block";
}).on('mouseout', function() {
var output = document.getElementById("tag");
output.style.display = "none";
});
}
function makeGrid(theSidePad, theTopPad, w, h){
var xAxis = d3.svg.axis()
.scale(timeScale)
.orient('bottom')
.ticks(d3.time.weeks, 5)
.tickSize(-h+theTopPad+20, 0, 0)
.tickFormat(d3.time.format('%d %b'));
var grid = svg.append('g')
.attr('class', 'grid')
.attr('transform', 'translate(' +theSidePad + ', ' + (h - 50) + ')')
.call(xAxis)
.selectAll("text")
.style("text-anchor", "middle")
.attr("fill", "#000")
.attr("stroke", "none")
.attr("font-size", 10)
.attr("dy", "1em");
}
function vertLabels(theGap, theTopPad, theSidePad, theBarHeight, theColorScale){
var numOccurances = [];
var prevGap = 0;
for (var i = 0; i < categories.length; i++){
numOccurances[i] = [categories[i], getCount(categories[i], catsUnfiltered)];
}
var axisText = svg.append("g") //without doing this, impossible to put grid lines behind text
.selectAll("text")
.data(numOccurances)
.enter()
.append("text")
.text(function(d){
return d[0];
})
.attr("x", 10)
.attr("y", function(d, i){
if (i > 0){
for (var j = 0; j < i; j++){
prevGap += numOccurances[i-1][1];
// console.log(prevGap);
return d[1]*theGap/2 + prevGap*theGap + theTopPad;
}
} else{
return d[1]*theGap/2 + theTopPad;
}
})
.attr("font-size", 11)
.attr("text-anchor", "start")
.attr("text-height", 14)
.attr("fill", function(d){
for (var i = 0; i < categories.length; i++){
if (d[0] == categories[i]){
// console.log("true!");
return d3.rgb(theColorScale(i)).darker();
}
}
});
}
//from this stackexchange question: http://stackoverflow.com/questions/1890203/unique-for-arrays-in-javascript
function checkUnique(arr) {
var hash = {}, result = [];
for ( var i = 0, l = arr.length; i < l; ++i ) {
if ( !hash.hasOwnProperty(arr[i]) ) { //it works with objects! in FF, at least
hash[ arr[i] ] = true;
result.push(arr[i]);
}
}
return result;
}
//from this stackexchange question: http://stackoverflow.com/questions/14227981/count-how-many-strings-in-an-array-have-duplicates-in-the-same-array
function getCounts(arr) {
var i = arr.length, // var to loop over
obj = {}; // obj to store results
while (i) obj[arr[--i]] = (obj[arr[i]] || 0) + 1; // count occurrences
return obj;
}
// get specific from everything
function getCount(word, arr) {
return getCounts(arr)[word] || 0;
}

63
src/diagrams/gantt/parser/gantt.jison Normal file
View File

@@ -0,0 +1,63 @@
/** mermaid
* http://knsv.github.io/mermaid/
* (c) 2015 Knut Sveidqvist
* MIT license.
*/
%lex
%options case-insensitive
%{
// Pre-lexer code can go here
%}
%%
[\n]+ return 'NL';
\s+ /* skip whitespace */
\#[^\n]* /* skip comments */
\%%[^\n]* /* skip comments */
"gantt" return 'gantt';
"dateFormat" return 'dateFormat';
"yyyy"\-"mm"\-"dd" return 'dateFormatInst';
\d\d\d\d"-"\d\d"-"\d\d return 'date';
"title"\s[^#\n;]+ return 'title';
"section"\s[^#:\n;]+ return 'section';
[^#:\n;]+ return 'taskTxt';
":"[^#\n;]+ return 'taskData';
":" return ':';
<<EOF>> return 'EOF';
. return 'INVALID';
/lex
%left '^'
%start start
%% /* language grammar */
start
: gantt document 'EOF' { return $2; }
;
document
: /* empty */ { $$ = [] }
| document line {$1.push($2);$$ = $1}
;
line
: SPACE statement { $$ = $2 }
| statement { $$ = $1 }
| NL { $$=[];}
| EOF { $$=[];}
;
statement
: 'dateFormat' dateFormatInst {yy.setDateFormat($2);$$=$2;}
| title {yy.setTitle($1.substr(6));$$=$1.substr(6);}
| section {yy.addSection($1.substr(8));$$=$1.substr(8);}
| taskTxt taskData
;
%%

649
src/diagrams/gantt/parser/gantt.js Normal file
View File

@@ -0,0 +1,649 @@
/* parser generated by jison 0.4.15 */
/*
Returns a Parser object of the following structure:
Parser: {
yy: {}
}
Parser.prototype: {
yy: {},
trace: function(),
symbols_: {associative list: name ==> number},
terminals_: {associative list: number ==> name},
productions_: [...],
performAction: function anonymous(yytext, yyleng, yylineno, yy, yystate, $$, _$),
table: [...],
defaultActions: {...},
parseError: function(str, hash),
parse: function(input),
lexer: {
EOF: 1,
parseError: function(str, hash),
setInput: function(input),
input: function(),
unput: function(str),
more: function(),
less: function(n),
pastInput: function(),
upcomingInput: function(),
showPosition: function(),
test_match: function(regex_match_array, rule_index),
next: function(),
lex: function(),
begin: function(condition),
popState: function(),
_currentRules: function(),
topState: function(),
pushState: function(condition),
options: {
ranges: boolean (optional: true ==> token location info will include a .range[] member)
flex: boolean (optional: true ==> flex-like lexing behaviour where the rules are tested exhaustively to find the longest match)
backtrack_lexer: boolean (optional: true ==> lexer regexes are tested in order and for each matching regex the action code is invoked; the lexer terminates the scan when a token is returned by the action code)
},
performAction: function(yy, yy_, $avoiding_name_collisions, YY_START),
rules: [...],
conditions: {associative list: name ==> set},
}
}
token location info (@$, _$, etc.): {
first_line: n,
last_line: n,
first_column: n,
last_column: n,
range: [start_number, end_number] (where the numbers are indexes into the input string, regular zero-based)
}
the parseError function receives a 'hash' object with these members for lexer and parser errors: {
text: (matched text)
token: (the produced terminal token, if any)
line: (yylineno)
}
while parser (grammar) errors will also provide these members, i.e. parser errors deliver a superset of attributes: {
loc: (yylloc)
expected: (string describing the set of expected tokens)
recoverable: (boolean: TRUE when the parser has a error recovery rule available for this particular error)
}
*/
var parser = (function(){
var o=function(k,v,o,l){for(o=o||{},l=k.length;l--;o[k[l]]=v);return o},$V0=[6,8,10,11,13,14,15],$V1=[1,9],$V2=[1,10],$V3=[1,11],$V4=[1,12];
var parser = {trace: function trace() { },
yy: {},
symbols_: {"error":2,"start":3,"gantt":4,"document":5,"EOF":6,"line":7,"SPACE":8,"statement":9,"NL":10,"dateFormat":11,"dateFormatInst":12,"title":13,"section":14,"taskTxt":15,"taskData":16,"$accept":0,"$end":1},
terminals_: {2:"error",4:"gantt",6:"EOF",8:"SPACE",10:"NL",11:"dateFormat",12:"dateFormatInst",13:"title",14:"section",15:"taskTxt",16:"taskData"},
productions_: [0,[3,3],[5,0],[5,2],[7,2],[7,1],[7,1],[7,1],[9,2],[9,1],[9,1],[9,2]],
performAction: function anonymous(yytext, yyleng, yylineno, yy, yystate /* action[1] */, $$ /* vstack */, _$ /* lstack */) {
/* this == yyval */
var $0 = $$.length - 1;
switch (yystate) {
case 1:
return $$[$0-1];
break;
case 2:
this.$ = []
break;
case 3:
$$[$0-1].push($$[$0]);this.$ = $$[$0-1]
break;
case 4: case 5:
this.$ = $$[$0]
break;
case 6: case 7:
this.$=[];
break;
case 8:
yy.setDateFormat($$[$0]);this.$=$$[$0];
break;
case 9:
yy.setTitle($$[$0].substr(6));this.$=$$[$0].substr(6);
break;
case 10:
yy.addSection($$[$0].substr(8));this.$=$$[$0].substr(8);
break;
}
},
table: [{3:1,4:[1,2]},{1:[3]},o($V0,[2,2],{5:3}),{6:[1,4],7:5,8:[1,6],9:7,10:[1,8],11:$V1,13:$V2,14:$V3,15:$V4},o($V0,[2,7],{1:[2,1]}),o($V0,[2,3]),{9:13,11:$V1,13:$V2,14:$V3,15:$V4},o($V0,[2,5]),o($V0,[2,6]),{12:[1,14]},o($V0,[2,9]),o($V0,[2,10]),{16:[1,15]},o($V0,[2,4]),o($V0,[2,8]),o($V0,[2,11])],
defaultActions: {},
parseError: function parseError(str, hash) {
if (hash.recoverable) {
this.trace(str);
} else {
throw new Error(str);
}
},
parse: function parse(input) {
var self = this, stack = [0], tstack = [], vstack = [null], lstack = [], table = this.table, yytext = '', yylineno = 0, yyleng = 0, recovering = 0, TERROR = 2, EOF = 1;
var args = lstack.slice.call(arguments, 1);
var lexer = Object.create(this.lexer);
var sharedState = { yy: {} };
for (var k in this.yy) {
if (Object.prototype.hasOwnProperty.call(this.yy, k)) {
sharedState.yy[k] = this.yy[k];
}
}
lexer.setInput(input, sharedState.yy);
sharedState.yy.lexer = lexer;
sharedState.yy.parser = this;
if (typeof lexer.yylloc == 'undefined') {
lexer.yylloc = {};
}
var yyloc = lexer.yylloc;
lstack.push(yyloc);
var ranges = lexer.options && lexer.options.ranges;
if (typeof sharedState.yy.parseError === 'function') {
this.parseError = sharedState.yy.parseError;
} else {
this.parseError = Object.getPrototypeOf(this).parseError;
}
function popStack(n) {
stack.length = stack.length - 2 * n;
vstack.length = vstack.length - n;
lstack.length = lstack.length - n;
}
_token_stack:
function lex() {
var token;
token = lexer.lex() || EOF;
if (typeof token !== 'number') {
token = self.symbols_[token] || token;
}
return token;
}
var symbol, preErrorSymbol, state, action, a, r, yyval = {}, p, len, newState, expected;
while (true) {
state = stack[stack.length - 1];
if (this.defaultActions[state]) {
action = this.defaultActions[state];
} else {
if (symbol === null || typeof symbol == 'undefined') {
symbol = lex();
}
action = table[state] && table[state][symbol];
}
if (typeof action === 'undefined' || !action.length || !action[0]) {
var errStr = '';
expected = [];
for (p in table[state]) {
if (this.terminals_[p] && p > TERROR) {
expected.push('\'' + this.terminals_[p] + '\'');
}
}
if (lexer.showPosition) {
errStr = 'Parse error on line ' + (yylineno + 1) + ':\n' + lexer.showPosition() + '\nExpecting ' + expected.join(', ') + ', got \'' + (this.terminals_[symbol] || symbol) + '\'';
} else {
errStr = 'Parse error on line ' + (yylineno + 1) + ': Unexpected ' + (symbol == EOF ? 'end of input' : '\'' + (this.terminals_[symbol] || symbol) + '\'');
}
this.parseError(errStr, {
text: lexer.match,
token: this.terminals_[symbol] || symbol,
line: lexer.yylineno,
loc: yyloc,
expected: expected
});
}
if (action[0] instanceof Array && action.length > 1) {
throw new Error('Parse Error: multiple actions possible at state: ' + state + ', token: ' + symbol);
}
switch (action[0]) {
case 1:
stack.push(symbol);
vstack.push(lexer.yytext);
lstack.push(lexer.yylloc);
stack.push(action[1]);
symbol = null;
if (!preErrorSymbol) {
yyleng = lexer.yyleng;
yytext = lexer.yytext;
yylineno = lexer.yylineno;
yyloc = lexer.yylloc;
if (recovering > 0) {
recovering--;
}
} else {
symbol = preErrorSymbol;
preErrorSymbol = null;
}
break;
case 2:
len = this.productions_[action[1]][1];
yyval.$ = vstack[vstack.length - len];
yyval._$ = {
first_line: lstack[lstack.length - (len || 1)].first_line,
last_line: lstack[lstack.length - 1].last_line,
first_column: lstack[lstack.length - (len || 1)].first_column,
last_column: lstack[lstack.length - 1].last_column
};
if (ranges) {
yyval._$.range = [
lstack[lstack.length - (len || 1)].range[0],
lstack[lstack.length - 1].range[1]
];
}
r = this.performAction.apply(yyval, [
yytext,
yyleng,
yylineno,
sharedState.yy,
action[1],
vstack,
lstack
].concat(args));
if (typeof r !== 'undefined') {
return r;
}
if (len) {
stack = stack.slice(0, -1 * len * 2);
vstack = vstack.slice(0, -1 * len);
lstack = lstack.slice(0, -1 * len);
}
stack.push(this.productions_[action[1]][0]);
vstack.push(yyval.$);
lstack.push(yyval._$);
newState = table[stack[stack.length - 2]][stack[stack.length - 1]];
stack.push(newState);
break;
case 3:
return true;
}
}
return true;
}};
/* generated by jison-lex 0.3.4 */
var lexer = (function(){
var lexer = ({
EOF:1,
parseError:function parseError(str, hash) {
if (this.yy.parser) {
this.yy.parser.parseError(str, hash);
} else {
throw new Error(str);
}
},
// resets the lexer, sets new input
setInput:function (input, yy) {
this.yy = yy || this.yy || {};
this._input = input;
this._more = this._backtrack = this.done = false;
this.yylineno = this.yyleng = 0;
this.yytext = this.matched = this.match = '';
this.conditionStack = ['INITIAL'];
this.yylloc = {
first_line: 1,
first_column: 0,
last_line: 1,
last_column: 0
};
if (this.options.ranges) {
this.yylloc.range = [0,0];
}
this.offset = 0;
return this;
},
// consumes and returns one char from the input
input:function () {
var ch = this._input[0];
this.yytext += ch;
this.yyleng++;
this.offset++;
this.match += ch;
this.matched += ch;
var lines = ch.match(/(?:\r\n?|\n).*/g);
if (lines) {
this.yylineno++;
this.yylloc.last_line++;
} else {
this.yylloc.last_column++;
}
if (this.options.ranges) {
this.yylloc.range[1]++;
}
this._input = this._input.slice(1);
return ch;
},
// unshifts one char (or a string) into the input
unput:function (ch) {
var len = ch.length;
var lines = ch.split(/(?:\r\n?|\n)/g);
this._input = ch + this._input;
this.yytext = this.yytext.substr(0, this.yytext.length - len);
//this.yyleng -= len;
this.offset -= len;
var oldLines = this.match.split(/(?:\r\n?|\n)/g);
this.match = this.match.substr(0, this.match.length - 1);
this.matched = this.matched.substr(0, this.matched.length - 1);
if (lines.length - 1) {
this.yylineno -= lines.length - 1;
}
var r = this.yylloc.range;
this.yylloc = {
first_line: this.yylloc.first_line,
last_line: this.yylineno + 1,
first_column: this.yylloc.first_column,
last_column: lines ?
(lines.length === oldLines.length ? this.yylloc.first_column : 0)
+ oldLines[oldLines.length - lines.length].length - lines[0].length :
this.yylloc.first_column - len
};
if (this.options.ranges) {
this.yylloc.range = [r[0], r[0] + this.yyleng - len];
}
this.yyleng = this.yytext.length;
return this;
},
// When called from action, caches matched text and appends it on next action
more:function () {
this._more = true;
return this;
},
// When called from action, signals the lexer that this rule fails to match the input, so the next matching rule (regex) should be tested instead.
reject:function () {
if (this.options.backtrack_lexer) {
this._backtrack = true;
} else {
return this.parseError('Lexical error on line ' + (this.yylineno + 1) + '. You can only invoke reject() in the lexer when the lexer is of the backtracking persuasion (options.backtrack_lexer = true).\n' + this.showPosition(), {
text: "",
token: null,
line: this.yylineno
});
}
return this;
},
// retain first n characters of the match
less:function (n) {
this.unput(this.match.slice(n));
},
// displays already matched input, i.e. for error messages
pastInput:function () {
var past = this.matched.substr(0, this.matched.length - this.match.length);
return (past.length > 20 ? '...':'') + past.substr(-20).replace(/\n/g, "");
},
// displays upcoming input, i.e. for error messages
upcomingInput:function () {
var next = this.match;
if (next.length < 20) {
next += this._input.substr(0, 20-next.length);
}
return (next.substr(0,20) + (next.length > 20 ? '...' : '')).replace(/\n/g, "");
},
// displays the character position where the lexing error occurred, i.e. for error messages
showPosition:function () {
var pre = this.pastInput();
var c = new Array(pre.length + 1).join("-");
return pre + this.upcomingInput() + "\n" + c + "^";
},
// test the lexed token: return FALSE when not a match, otherwise return token
test_match:function (match, indexed_rule) {
var token,
lines,
backup;
if (this.options.backtrack_lexer) {
// save context
backup = {
yylineno: this.yylineno,
yylloc: {
first_line: this.yylloc.first_line,
last_line: this.last_line,
first_column: this.yylloc.first_column,
last_column: this.yylloc.last_column
},
yytext: this.yytext,
match: this.match,
matches: this.matches,
matched: this.matched,
yyleng: this.yyleng,
offset: this.offset,
_more: this._more,
_input: this._input,
yy: this.yy,
conditionStack: this.conditionStack.slice(0),
done: this.done
};
if (this.options.ranges) {
backup.yylloc.range = this.yylloc.range.slice(0);
}
}
lines = match[0].match(/(?:\r\n?|\n).*/g);
if (lines) {
this.yylineno += lines.length;
}
this.yylloc = {
first_line: this.yylloc.last_line,
last_line: this.yylineno + 1,
first_column: this.yylloc.last_column,
last_column: lines ?
lines[lines.length - 1].length - lines[lines.length - 1].match(/\r?\n?/)[0].length :
this.yylloc.last_column + match[0].length
};
this.yytext += match[0];
this.match += match[0];
this.matches = match;
this.yyleng = this.yytext.length;
if (this.options.ranges) {
this.yylloc.range = [this.offset, this.offset += this.yyleng];
}
this._more = false;
this._backtrack = false;
this._input = this._input.slice(match[0].length);
this.matched += match[0];
token = this.performAction.call(this, this.yy, this, indexed_rule, this.conditionStack[this.conditionStack.length - 1]);
if (this.done && this._input) {
this.done = false;
}
if (token) {
return token;
} else if (this._backtrack) {
// recover context
for (var k in backup) {
this[k] = backup[k];
}
return false; // rule action called reject() implying the next rule should be tested instead.
}
return false;
},
// return next match in input
next:function () {
if (this.done) {
return this.EOF;
}
if (!this._input) {
this.done = true;
}
var token,
match,
tempMatch,
index;
if (!this._more) {
this.yytext = '';
this.match = '';
}
var rules = this._currentRules();
for (var i = 0; i < rules.length; i++) {
tempMatch = this._input.match(this.rules[rules[i]]);
if (tempMatch && (!match || tempMatch[0].length > match[0].length)) {
match = tempMatch;
index = i;
if (this.options.backtrack_lexer) {
token = this.test_match(tempMatch, rules[i]);
if (token !== false) {
return token;
} else if (this._backtrack) {
match = false;
continue; // rule action called reject() implying a rule MISmatch.
} else {
// else: this is a lexer rule which consumes input without producing a token (e.g. whitespace)
return false;
}
} else if (!this.options.flex) {
break;
}
}
}
if (match) {
token = this.test_match(match, rules[index]);
if (token !== false) {
return token;
}
// else: this is a lexer rule which consumes input without producing a token (e.g. whitespace)
return false;
}
if (this._input === "") {
return this.EOF;
} else {
return this.parseError('Lexical error on line ' + (this.yylineno + 1) + '. Unrecognized text.\n' + this.showPosition(), {
text: "",
token: null,
line: this.yylineno
});
}
},
// return next match that has a token
lex:function lex() {
var r = this.next();
if (r) {
return r;
} else {
return this.lex();
}
},
// activates a new lexer condition state (pushes the new lexer condition state onto the condition stack)
begin:function begin(condition) {
this.conditionStack.push(condition);
},
// pop the previously active lexer condition state off the condition stack
popState:function popState() {
var n = this.conditionStack.length - 1;
if (n > 0) {
return this.conditionStack.pop();
} else {
return this.conditionStack[0];
}
},
// produce the lexer rule set which is active for the currently active lexer condition state
_currentRules:function _currentRules() {
if (this.conditionStack.length && this.conditionStack[this.conditionStack.length - 1]) {
return this.conditions[this.conditionStack[this.conditionStack.length - 1]].rules;
} else {
return this.conditions["INITIAL"].rules;
}
},
// return the currently active lexer condition state; when an index argument is provided it produces the N-th previous condition state, if available
topState:function topState(n) {
n = this.conditionStack.length - 1 - Math.abs(n || 0);
if (n >= 0) {
return this.conditionStack[n];
} else {
return "INITIAL";
}
},
// alias for begin(condition)
pushState:function pushState(condition) {
this.begin(condition);
},
// return the number of states currently on the stack
stateStackSize:function stateStackSize() {
return this.conditionStack.length;
},
options: {"case-insensitive":true},
performAction: function anonymous(yy,yy_,$avoiding_name_collisions,YY_START) {
// Pre-lexer code can go here
var YYSTATE=YY_START;
switch($avoiding_name_collisions) {
case 0:return 10;
break;
case 1:/* skip whitespace */
break;
case 2:/* skip comments */
break;
case 3:/* skip comments */
break;
case 4:return 4;
break;
case 5:return 11;
break;
case 6:return 12;
break;
case 7:return 'date';
break;
case 8:return 13;
break;
case 9:return 14;
break;
case 10:return 15;
break;
case 11:return 16;
break;
case 12:return ':';
break;
case 13:return 6;
break;
case 14:return 'INVALID';
break;
}
},
rules: [/^(?:[\n]+)/i,/^(?:\s+)/i,/^(?:#[^\n]*)/i,/^(?:%[^\n]*)/i,/^(?:gantt\b)/i,/^(?:dateFormat\b)/i,/^(?:yyyy-mm-dd\b)/i,/^(?:\d\d\d\d-\d\d-\d\d\b)/i,/^(?:title\s[^#\n;]+)/i,/^(?:section\s[^#:\n;]+)/i,/^(?:[^#:\n;]+)/i,/^(?::[^#\n;]+)/i,/^(?::)/i,/^(?:$)/i,/^(?:.)/i],
conditions: {"INITIAL":{"rules":[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14],"inclusive":true}}
});
return lexer;
})();
parser.lexer = lexer;
function Parser () {
this.yy = {};
}
Parser.prototype = parser;parser.Parser = Parser;
return new Parser;
})();
if (typeof require !== 'undefined' && typeof exports !== 'undefined') {
exports.parser = parser;
exports.Parser = parser.Parser;
exports.parse = function () { return parser.parse.apply(parser, arguments); };
exports.main = function commonjsMain(args) {
if (!args[1]) {
console.log('Usage: '+args[0]+' FILE');
process.exit(1);
}
var source = require('fs').readFileSync(require('path').normalize(args[1]), "utf8");
return exports.parser.parse(source);
};
if (typeof module !== 'undefined' && require.main === module) {
exports.main(process.argv.slice(1));
}
}

7
src/diagrams/sequenceDiagram/parser/sequenceDiagram.jison
View File

@@ -1,4 +1,9 @@
/** js sequence diagrams /** mermaid
* http://knsv.github.io/mermaid/
* (c) 2014-2015 Knut Sveidqvist
* MIT license.
*
* Based on js sequence diagrams jison grammr
* http://bramp.github.io/js-sequence-diagrams/ * http://bramp.github.io/js-sequence-diagrams/
* (c) 2012-2013 Andrew Brampton (bramp.net) * (c) 2012-2013 Andrew Brampton (bramp.net)
* Simplified BSD license. * Simplified BSD license.

8
test/web.html
View File

@@ -27,6 +27,14 @@
<link rel="stylesheet" href="seq.css"/> <link rel="stylesheet" href="seq.css"/>
</head> </head>
<body> <body>
<h1>Issue 2</h1>
<div class="mermaid">
graph LR
A[Square Rect] -- Link text --> B((Circle))
A --> C(Round Rect)
B --> D{Rhombus}
C --> D
</div>
<h1>Issue </h1> <h1>Issue </h1>
<div class="mermaid"> <div class="mermaid">
graph TD graph TD