From dce09586cd61547b7c30887e24531fe468aed0c6 Mon Sep 17 00:00:00 2001
From: Knut Sveidqvist <knsv@sveido.com>
Date: Sun, 6 Oct 2019 14:11:17 +0200
Subject: [PATCH] #945 Support for forks and joins

---
 .../integration/rendering/stateDiagram.spec.js | 18 ++++++++++++++++++
 src/diagrams/state/parser/stateDiagram.jison   | 14 ++++++++++----
 src/diagrams/state/shapes.js                   | 13 ++++++++++++-
 src/diagrams/state/stateRenderer.js            |  2 +-
 4 files changed, 41 insertions(+), 6 deletions(-)

diff --git a/cypress/integration/rendering/stateDiagram.spec.js b/cypress/integration/rendering/stateDiagram.spec.js
index 55c131da2..c7f214be3 100644
--- a/cypress/integration/rendering/stateDiagram.spec.js
+++ b/cypress/integration/rendering/stateDiagram.spec.js
@@ -161,6 +161,24 @@ describe('State diagram', () => {
       `,
       { logLevel: 0 }
     );
+  });
+  it('should render forks and joins', () => {
+    imgSnapshotTest(
+      `
+    stateDiagram
+    state fork_state &lt;&lt;fork&gt;&gt;
+      [*] --> fork_state
+      fork_state --> State2
+      fork_state --> State3
+
+      state join_state &lt;&lt;join&gt;&gt;
+      State2 --> join_state
+      State3 --> join_state
+      join_state --> State4
+      State4 --> [*]
+    `,
+      { logLevel: 0 }
+    );
     cy.get('svg');
   });
 });
diff --git a/src/diagrams/state/parser/stateDiagram.jison b/src/diagrams/state/parser/stateDiagram.jison
index b05eb8c9c..e79c8c4f1 100644
--- a/src/diagrams/state/parser/stateDiagram.jison
+++ b/src/diagrams/state/parser/stateDiagram.jison
@@ -43,8 +43,10 @@
 <SCALE>\s+"width"     {this.popState();}
 
 <INITIAL,struct>"state"\s+            { this.pushState('STATE'); }
-<STATE>.*"<<fork>>"                   {this.popState();console.log('Fork: ',yytext);return 'FORK';}
-<STATE>.*"<<join>>"                   {this.popState();console.log('Join: ',yytext);return 'JOIN';}
+<STATE>.*"<<fork>>"                   {this.popState();yytext=yytext.slice(0,-8).trim(); console.warn('Fork Fork: ',yytext);return 'FORK';}
+<STATE>.*"<<join>>"                   {this.popState();yytext=yytext.slice(0,-8).trim();console.warn('Fork Join: ',yytext);return 'JOIN';}
+<STATE>.*"[[fork]]"                   {this.popState();yytext=yytext.slice(0,-8).trim();console.warn('Fork Fork: ',yytext);return 'FORK';}
+<STATE>.*"[[join]]"                   {this.popState();yytext=yytext.slice(0,-8).trim();console.warn('Fork Join: ',yytext);return 'JOIN';}
 <STATE>["]                   this.begin("STATE_STRING");
 <STATE>"as"\s*         {this.popState();this.pushState('STATE_ID');return "AS";}
 <STATE_ID>[^\n\{]*         {this.popState();console.log('STATE_ID', yytext);return "ID";}
@@ -135,8 +137,12 @@ statement
          //console.warn('Adding document for state with id ', $3, $4); yy.addDocument($3);
          $$={ stmt: 'state', id: $3, type: 'default', description: $1, doc: $5 }
     }
-    | FORK
-    | JOIN
+    | FORK {
+        $$={ stmt: 'state', id: $1, type: 'fork' }
+    }
+    | JOIN {
+        $$={ stmt: 'state', id: $1, type: 'join' }
+    }
     | CONCURRENT
     | note notePosition ID NOTE_TEXT
     {
diff --git a/src/diagrams/state/shapes.js b/src/diagrams/state/shapes.js
index 8da33e594..f1d19ac18 100644
--- a/src/diagrams/state/shapes.js
+++ b/src/diagrams/state/shapes.js
@@ -168,6 +168,16 @@ const drawEndState = g => {
     .attr('cx', conf.padding + 7)
     .attr('cy', conf.padding + 7);
 };
+const drawForkJoinState = g => {
+  return g
+    .append('rect')
+    .style('stroke', 'black')
+    .style('fill', 'black')
+    .attr('width', 70)
+    .attr('height', 7)
+    .attr('x', conf.padding)
+    .attr('y', conf.padding);
+};
 
 export const drawText = function(elem, textData, width) {
   // Remove and ignore br:s
@@ -209,7 +219,7 @@ const _drawLongText = (_text, x, y, g) => {
       const textBounds = span.node().getBBox();
       textHeight += textBounds.height;
       span.attr('x', x + conf.noteMargin);
-      span.attr('y', y + textHeight + 1.25* conf.noteMargin);
+      span.attr('y', y + textHeight + 1.25 * conf.noteMargin);
       // textWidth = Math.max(textBounds.width, textWidth);
     }
   }
@@ -264,6 +274,7 @@ export const drawState = function(elem, stateDef, graph, doc) {
 
   if (stateDef.type === 'start') drawStartState(g);
   if (stateDef.type === 'end') drawEndState(g);
+  if (stateDef.type === 'fork' || stateDef.type === 'join') drawForkJoinState(g);
   if (stateDef.type === 'note') drawNote(stateDef.note.text, g);
   if (stateDef.type === 'default' && stateDef.descriptions.length === 0)
     drawSimpleState(g, stateDef);
diff --git a/src/diagrams/state/stateRenderer.js b/src/diagrams/state/stateRenderer.js
index 8812dee32..34a28cf4b 100644
--- a/src/diagrams/state/stateRenderer.js
+++ b/src/diagrams/state/stateRenderer.js
@@ -61,7 +61,7 @@ const insertMarkers = function(elem) {
 export const draw = function(text, id) {
   parser.yy.clear();
   parser.parse(text);
-  logger.info('Rendering diagram ' + text);
+  logger.warn('Rendering diagram ' + text);
 
   // /// / Fetch the default direction, use TD if none was found
   const diagram = d3.select(`[id='${id}']`);