#945 Support for notes, better width and handling of +/-
This commit is contained in:
parent
1cb52a602a
commit
4f1186a610
|
@ -31,10 +31,10 @@ describe('State diagram', () => {
|
|||
imgSnapshotTest(
|
||||
`
|
||||
stateDiagram
|
||||
State1: The state with a note
|
||||
State1: The state with a note with minus - and plus + in it
|
||||
note left of State1
|
||||
Important information! You can write
|
||||
notes.
|
||||
notes with . and in them.
|
||||
end note
|
||||
`,
|
||||
{ logLevel: 0 }
|
||||
|
@ -45,12 +45,13 @@ describe('State diagram', () => {
|
|||
imgSnapshotTest(
|
||||
`
|
||||
stateDiagram
|
||||
State1: The state with a note
|
||||
State1: The state with a note +,-
|
||||
note right of State1
|
||||
Important information! You can write
|
||||
Important information! You can write +,-
|
||||
notes.
|
||||
end note
|
||||
State1 --> State2
|
||||
State1 --> State2 : With +,-
|
||||
note left of State2 : This is the note +,-<br/>
|
||||
`,
|
||||
{ logLevel: 0 }
|
||||
);
|
||||
|
|
|
@ -65,14 +65,15 @@
|
|||
<FLOATING_NOTE>[^"]* { console.log('Floating note text: ', yytext);return "NOTE_TEXT";}
|
||||
<FLOATING_NOTE_ID>[^\n]* {this.popState();console.log('Floating note ID', yytext);return "ID";}
|
||||
<NOTE_ID>\s*[^:\n\s\-]+ { this.popState();this.pushState('NOTE_TEXT');console.log('Got ID for note', yytext);return 'ID';}
|
||||
<NOTE_TEXT>\s*":"[^\+\-:\n,;]+ { this.popState();console.log('Got NOTE_TEXT for note',yytext);return 'NOTE_TEXT';}
|
||||
<NOTE_TEXT>\s*[^\+\-:,;]+"end note" { this.popState();console.log('Got NOTE_TEXT for note',yytext);yytext = yytext.slice(0,-8).trim();return 'NOTE_TEXT';}
|
||||
<NOTE_TEXT>\s*":"[^:\n;]+ { this.popState();console.log('Got NOTE_TEXT for note',yytext);yytext = yytext.substr(2).trim();return 'NOTE_TEXT';}
|
||||
<NOTE_TEXT>\s*[^:;]+"end note" { this.popState();console.log('Got NOTE_TEXT for note',yytext);yytext = yytext.slice(0,-8).trim();return 'NOTE_TEXT';}
|
||||
|
||||
"stateDiagram"\s+ { console.log('Got state diagram', yytext,'#');return 'SD'; }
|
||||
"hide empty description" { console.log('HIDE_EMPTY', yytext,'#');return 'HIDE_EMPTY'; }
|
||||
<INITIAL,struct>"[*]" { console.log('EDGE_STATE=',yytext); return 'EDGE_STATE';}
|
||||
<INITIAL,struct>[^:\n\s\-\{]+ { console.log('=>ID=',yytext); return 'ID';}
|
||||
<INITIAL,struct>\s*":"[^\+\->:\n,;]+ { yytext = yytext.trim(); console.log('Descr = ', yytext); return 'DESCR'; }
|
||||
// <INITIAL,struct>\s*":"[^\+\->:\n;]+ { yytext = yytext.trim(); console.log('Descr = ', yytext); return 'DESCR'; }
|
||||
<INITIAL,struct>\s*":"[^:\n;]+ { yytext = yytext.trim(); console.log('Descr = ', yytext); return 'DESCR'; }
|
||||
<INITIAL,struct>"-->" return '-->';
|
||||
<struct>"--" return 'CONCURRENT';
|
||||
<<EOF>> return 'NL';
|
||||
|
|
|
@ -205,16 +205,15 @@ const _drawLongText = (_text, x, y, g) => {
|
|||
|
||||
if (txt.length > 0) {
|
||||
const span = textElem.append('tspan');
|
||||
span.text(txt);
|
||||
const textBounds = span.node().getBBox();
|
||||
textHeight += textBounds.height;
|
||||
span.attr('x', x + conf.noteMargin);
|
||||
span.attr('y', y + textHeight + 1.75 * conf.noteMargin);
|
||||
span.text(txt);
|
||||
|
||||
textWidth = Math.max(textBounds.width, textWidth);
|
||||
span.attr('y', y + textHeight + 1.25* conf.noteMargin);
|
||||
// textWidth = Math.max(textBounds.width, textWidth);
|
||||
}
|
||||
}
|
||||
return { textWidth, textHeight };
|
||||
return { textWidth: textElem.node().getBBox().width, textHeight };
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -226,6 +225,7 @@ const _drawLongText = (_text, x, y, g) => {
|
|||
|
||||
export const drawNote = (text, g) => {
|
||||
g.attr('class', 'note');
|
||||
console.warn('Text of note', text);
|
||||
const note = g
|
||||
.append('rect')
|
||||
.attr('x', 0)
|
||||
|
@ -233,7 +233,7 @@ export const drawNote = (text, g) => {
|
|||
const rectElem = g.append('g');
|
||||
|
||||
const { textWidth, textHeight } = _drawLongText(text, 0, 0, rectElem);
|
||||
|
||||
console.warn('Text of note', text, textWidth);
|
||||
note.attr('height', textHeight + 2 * conf.noteMargin);
|
||||
note.attr('width', textWidth + conf.noteMargin * 2);
|
||||
|
||||
|
|
|
@ -8,7 +8,7 @@ describe('state diagram, ', function() {
|
|||
parser.yy = stateDb;
|
||||
});
|
||||
|
||||
fit('super simple', function() {
|
||||
it('super simple', function() {
|
||||
const str = `
|
||||
stateDiagram
|
||||
[*] --> State1
|
||||
|
@ -58,7 +58,7 @@ describe('state diagram, ', function() {
|
|||
scale 350 width
|
||||
[*] --> State1
|
||||
State1 --> [*]
|
||||
State1 : this is a string
|
||||
State1 : this is a string with - in it
|
||||
State1 : this is another string
|
||||
|
||||
State1 --> State2
|
||||
|
@ -71,7 +71,16 @@ describe('state diagram, ', function() {
|
|||
it('description after second state', function() {
|
||||
const str = `stateDiagram\n
|
||||
scale 350 width
|
||||
[*] --> State1 : This is the description
|
||||
[*] --> State1 : This is the description with - in it
|
||||
State1 --> [*]
|
||||
`;
|
||||
|
||||
parser.parse(str);
|
||||
});
|
||||
it('shall handle descriptions inkluding minus signs', function() {
|
||||
const str = `stateDiagram\n
|
||||
scale 350 width
|
||||
[*] --> State1 : This is the description +-!
|
||||
State1 --> [*]
|
||||
`;
|
||||
|
||||
|
|
Loading…
Reference in New Issue