Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add the line numbers to the SVG diagram to enable real time tracking #132

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 18 additions & 12 deletions src/diagram.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ function Diagram() {
/*
* Return an existing actor with this alias, or creates a new one with alias and name.
*/
Diagram.prototype.getActor = function(alias, name) {
Diagram.prototype.getActor = function(alias, name, lineno) {
alias = alias.trim();

var i;
Expand All @@ -23,14 +23,14 @@ Diagram.prototype.getActor = function(alias, name) {
return actors[i];
}
}
i = actors.push(new Diagram.Actor(alias, (name || alias), actors.length));
i = actors.push(new Diagram.Actor(alias, (name || alias), actors.length, lineno));
return actors[ i - 1 ];
};

/*
* Parses the input as either a alias, or a "name as alias", and returns the corresponding actor.
*/
Diagram.prototype.getActorWithAlias = function(input) {
Diagram.prototype.getActorWithAlias = function(input, lineno) {
input = input.trim();

// We are lazy and do some of the parsing in javascript :(. TODO move into the .jison file.
Expand All @@ -43,41 +43,47 @@ Diagram.prototype.getActorWithAlias = function(input) {
} else {
name = alias = input;
}
return this.getActor(alias, name);
return this.getActor(alias, name, lineno);
};

Diagram.prototype.setTitle = function(title) {
this.title = title;
Diagram.prototype.setTitle = function(title, lineno) {
this.title = {
message: title,
lineno: lineno
};
};

Diagram.prototype.addSignal = function(signal) {
this.signals.push(signal);
};

Diagram.Actor = function(alias, name, index) {
this.alias = alias;
this.name = name;
this.index = index;
Diagram.Actor = function(alias, name, index, lineno) {
this.alias = alias;
this.name = name;
this.index = index;
this.lineno = lineno;
};

Diagram.Signal = function(actorA, signaltype, actorB, message) {
Diagram.Signal = function(actorA, signaltype, actorB, message, lineno) {
this.type = 'Signal';
this.actorA = actorA;
this.actorB = actorB;
this.linetype = signaltype & 3;
this.arrowtype = (signaltype >> 2) & 3;
this.message = message;
this.lineno = lineno;
};

Diagram.Signal.prototype.isSelf = function() {
return this.actorA.index == this.actorB.index;
};

Diagram.Note = function(actor, placement, message) {
Diagram.Note = function(actor, placement, message, lineno) {
this.type = 'Note';
this.actor = actor;
this.placement = placement;
this.message = message;
this.lineno = lineno;

if (this.hasManyActors() && actor[0] == actor[1]) {
throw new Error('Note should be over two different actors');
Expand Down
10 changes: 5 additions & 5 deletions src/grammar.jison
Original file line number Diff line number Diff line change
Expand Up @@ -57,12 +57,12 @@ statement
: 'participant' actor_alias { $2; }
| signal { yy.parser.yy.addSignal($1); }
| note_statement { yy.parser.yy.addSignal($1); }
| 'title' message { yy.parser.yy.setTitle($2); }
| 'title' message { yy.parser.yy.setTitle($2, yylineno); }
;

note_statement
: 'note' placement actor message { $$ = new Diagram.Note($3, $2, $4); }
| 'note' 'over' actor_pair message { $$ = new Diagram.Note($3, Diagram.PLACEMENT.OVER, $4); }
: 'note' placement actor message { $$ = new Diagram.Note($3, $2, $4, yylineno); }
| 'note' 'over' actor_pair message { $$ = new Diagram.Note($3, Diagram.PLACEMENT.OVER, $4, yylineno); }
;

actor_pair
Expand All @@ -77,15 +77,15 @@ placement

signal
: actor signaltype actor message
{ $$ = new Diagram.Signal($1, $2, $3, $4); }
{ $$ = new Diagram.Signal($1, $2, $3, $4, yylineno); }
;

actor
: ACTOR { $$ = yy.parser.yy.getActor(Diagram.unescape($1)); }
;

actor_alias
: ACTOR { $$ = yy.parser.yy.getActorWithAlias(Diagram.unescape($1)); }
: ACTOR { $$ = yy.parser.yy.getActorWithAlias(Diagram.unescape($1), yylineno); }
;

signaltype
Expand Down
26 changes: 16 additions & 10 deletions src/theme-snap.js
Original file line number Diff line number Diff line change
Expand Up @@ -155,11 +155,17 @@ if (typeof Snap != 'undefined') {
},

// Finishes the group, and returns the <group> element
finishGroup: function() {
var g = this.paper_.group.apply(this.paper_, this._stack);
this.beginGroup(); // Reset the group
return g;
},
finishGroup: function(groupName, lineno) {
var g = this.paper_.group.apply(this.paper_, this._stack);
this.beginGroup();
if (groupName) {
g.addClass(groupName);
}
if (lineno !== undefined) {
g.attr({'data-lineno': lineno + 1}); // +1 to correct jison line numbering
}
return g;
},

createText: function(text, font) {
text = _.invoke(text.split('\n'), 'trim');
Expand Down Expand Up @@ -220,31 +226,31 @@ if (typeof Snap != 'undefined') {
drawTitle: function() {
this.beginGroup();
BaseTheme.prototype.drawTitle.call(this);
return this.finishGroup().addClass('title');
return this.finishGroup('title', this.title_ ? this.title_.lineno : undefined);
},

drawActor: function(actor, offsetY, height) {
this.beginGroup();
BaseTheme.prototype.drawActor.call(this, actor, offsetY, height);
return this.finishGroup().addClass('actor');
return this.finishGroup('actor', actor.lineno);
},

drawSignal: function(signal, offsetY) {
this.beginGroup();
BaseTheme.prototype.drawSignal.call(this, signal, offsetY);
return this.finishGroup().addClass('signal');
return this.finishGroup('signal', signal.lineno);
},

drawSelfSignal: function(signal, offsetY) {
this.beginGroup();
BaseTheme.prototype.drawSelfSignal.call(this, signal, offsetY);
return this.finishGroup().addClass('signal');
return this.finishGroup('signal', signal.lineno);
},

drawNote: function(note, offsetY) {
this.beginGroup();
BaseTheme.prototype.drawNote.call(this, note, offsetY);
return this.finishGroup().addClass('note');
return this.finishGroup('note', note.lineno);
},
});

Expand Down
5 changes: 3 additions & 2 deletions src/theme.js
Original file line number Diff line number Diff line change
Expand Up @@ -185,9 +185,10 @@ _.extend(BaseTheme.prototype, {
// Setup some layout stuff
if (diagram.title) {
var title = this.title_ = {};
var bb = this.textBBox(diagram.title, font);
title.message = diagram.title.message;
title.lineno = diagram.title.lineno;
var bb = this.textBBox(title.message, font);
title.textBB = bb;
title.message = diagram.title;

title.width = bb.width + (TITLE_PADDING + TITLE_MARGIN) * 2;
title.height = bb.height + (TITLE_PADDING + TITLE_MARGIN) * 2;
Expand Down
8 changes: 4 additions & 4 deletions test/grammar-tests.js
Original file line number Diff line number Diff line change
Expand Up @@ -111,12 +111,12 @@ test('Dashed Open Arrow', function() {
});

test('Titles', function() {
equal(Diagram.parse('Title: title').title, 'title', 'Title');
equal(Diagram.parse('Title: line1\\nline2').title, 'line1\nline2', 'Multiline Title');
deepEqual(Diagram.parse('Title: title').title, {message: 'title', lineno: 0}, 'Title');
deepEqual(Diagram.parse('Title: line1\\nline2').title, {message: 'line1\nline2', lineno: 0}, 'Multiline Title');
});

test('Unicode', function() {
equal(Diagram.parse('Title: 中国').title, '中国', 'Unicode Title');
deepEqual(Diagram.parse('Title: 中国').title, {message: '中国', lineno: 0}, 'Unicode Title');
assertEmptyDocument(Diagram.parse('# 中国'));
assertSingleActor(Diagram.parse('Participant 中国'), '中国');
assertSingleActor(Diagram.parse('Participant 中国 as alias'), 'alias', '中国');
Expand Down Expand Up @@ -149,7 +149,7 @@ test('Comments', function() {
assertSingleArrow(Diagram.parse('A->B: Message # not a comment'), ARROWTYPE.FILLED,
LINETYPE.SOLID, 'A', 'B', 'Message # not a comment');

equal(Diagram.parse('Title: title # not a comment').title, 'title # not a comment');
deepEqual(Diagram.parse('Title: title # not a comment').title, {message: 'title # not a comment', lineno: 0});
assertSingleNote(Diagram.parse('note left of A: Message # not a comment'), PLACEMENT.LEFTOF, 'A',
'Message # not a comment');
});
Expand Down