Move of drawLoop to svgDraw

dist/mermaid.full.js

@@ -16313,6 +16313,9 @@ module.exports.draw = function (text, id) {
     exports.bounds.init();
     var diagram = d3.select('#'+id);
 
+    var startx;
+    var stopx;
+
     // Fetch data from the parsing
     var actors = sq.yy.getActors();
     var actorKeys = sq.yy.getActorKeys();
@@ -16392,9 +16395,6 @@ module.exports.draw = function (text, id) {
                 drawMessage(diagram, startx, stopx, exports.bounds.getVerticalPos(), msg);
 
         }
-
-        var startx;
-        var stopx;
     });
 
     var box = exports.bounds.getBounds();
@@ -16461,7 +16461,7 @@ exports.drawLabel = function(elem , txtObject){
     rectData.class = 'labelBox';
     //rectData.color = 'white';
 
-    var label = exports.drawRect(elem, rectData);
+    exports.drawRect(elem, rectData);
 
     txtObject.y = txtObject.y + txtObject.labelMargin;
     txtObject.x = txtObject.x + 0.5*txtObject.labelMargin;
@@ -16489,16 +16489,16 @@ exports.drawActor = function(elem, left,description,conf){
         .attr("stroke-width", '0.5px')
         .attr("stroke", '#999');
 
-    g.append("rect")
-        .attr("x", left)
-        .attr("y", 0)
-        .attr("fill", '#eaeaea')
-        .attr("stroke", '#666')
-        .attr("width", conf.width)
-        .attr("height", conf.height)
-        .attr("class", 'actor')
-        .attr("rx", 3)
-        .attr("ry", 3);
+    var rect = exports.getNoteRect();
+    rect.x = left;
+    rect.fill = '#eaeaea';
+    rect.width = conf.width;
+    rect.height = conf.height;
+    rect.class = 'actor';
+    rect.rx = 3;
+    rect.ry = 3;
+    exports.drawRect(g, rect);
+
     g.append("text")      // text label for the x axis
         .attr("x", center)
         .attr("y", (conf.height/2)+5)
@@ -16513,7 +16513,7 @@ exports.drawActor = function(elem, left,description,conf){
 exports.insertArrowHead = function(elem){
     elem.append("defs").append("marker")
         .attr("id", "arrowhead")
-        .attr("refX", 5) /*must be smarter way to calculate shift*/
+        .attr("refX", 5)
         .attr("refY", 2)
         .attr("markerWidth", 6)
         .attr("markerHeight", 4)
@@ -16527,11 +16527,11 @@ exports.insertArrowHead = function(elem){
 exports.insertArrowCrossHead = function(elem){
     elem.append("defs").append("marker")
         .attr("id", "crosshead")
-        .attr("refX", 15) /*must be smarter way to calculate shift*/
-        .attr("refY", 4)
         .attr("markerWidth", 8)
         .attr("markerHeight", 8)
         .attr("orient", "auto")
+        .attr("refX", 15)
+        .attr("refY", 4)
         .append("path")
         .attr("fill",'none')
         .attr("stroke",'#000000')

dist/mermaid.slim.js

@@ -16281,6 +16281,9 @@ module.exports.draw = function (text, id) {
     exports.bounds.init();
     var diagram = d3.select('#'+id);
 
+    var startx;
+    var stopx;
+
     // Fetch data from the parsing
     var actors = sq.yy.getActors();
     var actorKeys = sq.yy.getActorKeys();
@@ -16360,9 +16363,6 @@ module.exports.draw = function (text, id) {
                 drawMessage(diagram, startx, stopx, exports.bounds.getVerticalPos(), msg);
 
         }
-
-        var startx;
-        var stopx;
     });
 
     var box = exports.bounds.getBounds();
@@ -16429,7 +16429,7 @@ exports.drawLabel = function(elem , txtObject){
     rectData.class = 'labelBox';
     //rectData.color = 'white';
 
-    var label = exports.drawRect(elem, rectData);
+    exports.drawRect(elem, rectData);
 
     txtObject.y = txtObject.y + txtObject.labelMargin;
     txtObject.x = txtObject.x + 0.5*txtObject.labelMargin;
@@ -16457,16 +16457,16 @@ exports.drawActor = function(elem, left,description,conf){
         .attr("stroke-width", '0.5px')
         .attr("stroke", '#999');
 
-    g.append("rect")
-        .attr("x", left)
-        .attr("y", 0)
-        .attr("fill", '#eaeaea')
-        .attr("stroke", '#666')
-        .attr("width", conf.width)
-        .attr("height", conf.height)
-        .attr("class", 'actor')
-        .attr("rx", 3)
-        .attr("ry", 3);
+    var rect = exports.getNoteRect();
+    rect.x = left;
+    rect.fill = '#eaeaea';
+    rect.width = conf.width;
+    rect.height = conf.height;
+    rect.class = 'actor';
+    rect.rx = 3;
+    rect.ry = 3;
+    exports.drawRect(g, rect);
+
     g.append("text")      // text label for the x axis
         .attr("x", center)
         .attr("y", (conf.height/2)+5)
@@ -16481,7 +16481,7 @@ exports.drawActor = function(elem, left,description,conf){
 exports.insertArrowHead = function(elem){
     elem.append("defs").append("marker")
         .attr("id", "arrowhead")
-        .attr("refX", 5) /*must be smarter way to calculate shift*/
+        .attr("refX", 5)
         .attr("refY", 2)
         .attr("markerWidth", 6)
         .attr("markerHeight", 4)
@@ -16495,11 +16495,11 @@ exports.insertArrowHead = function(elem){
 exports.insertArrowCrossHead = function(elem){
     elem.append("defs").append("marker")
         .attr("id", "crosshead")
-        .attr("refX", 15) /*must be smarter way to calculate shift*/
-        .attr("refY", 4)
         .attr("markerWidth", 8)
         .attr("markerHeight", 8)
         .attr("orient", "auto")
+        .attr("refX", 15)
+        .attr("refY", 4)
         .append("path")
         .attr("fill",'none')
         .attr("stroke",'#000000')

src/diagrams/sequenceDiagram/sequenceRenderer.js

@@ -147,58 +147,6 @@ var drawNote = function(elem, startx, verticalPos, msg){
     exports.bounds.bumpVerticalPos(textHeight+ 2*conf.noteMargin);
 };
 
-/**
- * Draws an actor in the diagram with the attaced line
- * @param center - The center of the the actor
- * @param pos The position if the actor in the list of actors
- * @param description The text in the box
- */
-exports.drawLoop = function(elem,bounds,labelText){
-    var g = elem.append("g");
-    var drawLoopLine = function(startx,starty,stopx,stopy){
-        g.append("line")
-            .attr("x1", startx)
-            .attr("y1", starty)
-            .attr("x2", stopx )
-            .attr("y2", stopy )
-            .attr("stroke-width", 2)
-            .attr("stroke", "#526e52")
-            .attr('class','loopLine');
-    };
-    drawLoopLine(bounds.startx, bounds.starty, bounds.stopx , bounds.starty);
-    drawLoopLine(bounds.stopx , bounds.starty, bounds.stopx , bounds.stopy );
-    drawLoopLine(bounds.startx, bounds.stopy , bounds.stopx , bounds.stopy );
-    drawLoopLine(bounds.startx, bounds.starty, bounds.startx, bounds.stopy );
-    if(typeof bounds.elsey !== 'undefined'){
-        drawLoopLine(bounds.startx, bounds.elsey, bounds.stopx, bounds.elsey );
-    }
-
-    var txt = svgDraw.getTextObj();
-    txt.text = labelText;
-    txt.x = bounds.startx;
-    txt.y = bounds.starty;
-    txt.labelMargin =  1.5 * conf.boxMargin;
-    txt.class =  'labelText';
-    txt.fill =  'white';
-
-    svgDraw.drawLabel(g,txt);
-
-    txt = svgDraw.getTextObj();
-    txt.text = '[ ' + bounds.title + ' ]';
-    txt.x = bounds.startx + (bounds.stopx - bounds.startx)/2;
-    txt.y = bounds.starty + 1.5 * conf.boxMargin;
-    txt.anchor = 'middle';
-    txt.class = 'loopText';
-
-    svgDraw.drawText(g,txt);
-
-    if(typeof bounds.elseText !== 'undefined') {
-        txt.text = '[ ' + bounds.elseText + ' ]';
-        txt.y = bounds.elsey + 1.5 * conf.boxMargin;
-        svgDraw.drawText(g, txt);
-    }
-};
-
 
 /**
  * Draws a message
@@ -344,7 +292,7 @@ module.exports.draw = function (text, id) {
             case sq.yy.LINETYPE.LOOP_END:
                 loopData = exports.bounds.endLoop();
 
-                exports.drawLoop(diagram, loopData,'loop');
+                exports.drawLoop(diagram, loopData,'loop', conf);
                 exports.bounds.bumpVerticalPos(conf.boxMargin);
                 break;
             case sq.yy.LINETYPE.OPT_START:
@@ -355,7 +303,7 @@ module.exports.draw = function (text, id) {
             case sq.yy.LINETYPE.OPT_END:
                 loopData = exports.bounds.endLoop();
 
-                exports.drawLoop(diagram, loopData, 'opt');
+                exports.drawLoop(diagram, loopData, 'opt', conf);
                 exports.bounds.bumpVerticalPos(conf.boxMargin);
                 break;
             case sq.yy.LINETYPE.ALT_START:
@@ -373,7 +321,7 @@ module.exports.draw = function (text, id) {
             case sq.yy.LINETYPE.ALT_END:
                 loopData = exports.bounds.endLoop();
 
-                exports.drawLoop(diagram, loopData,'alt');
+                exports.drawLoop(diagram, loopData,'alt', conf);
                 exports.bounds.bumpVerticalPos(conf.boxMargin);
                 break;
             default:

src/diagrams/sequenceDiagram/svgDraw.js

@@ -97,6 +97,59 @@ exports.drawActor = function(elem, left,description,conf){
         .text(description)
     ;
 };
+
+/**
+ * Draws an actor in the diagram with the attaced line
+ * @param center - The center of the the actor
+ * @param pos The position if the actor in the list of actors
+ * @param description The text in the box
+ */
+exports.drawLoop = function(elem,bounds,labelText, conf){
+    var g = elem.append("g");
+    var drawLoopLine = function(startx,starty,stopx,stopy){
+        g.append("line")
+            .attr("x1", startx)
+            .attr("y1", starty)
+            .attr("x2", stopx )
+            .attr("y2", stopy )
+            .attr("stroke-width", 2)
+            .attr("stroke", "#526e52")
+            .attr('class','loopLine');
+    };
+    drawLoopLine(bounds.startx, bounds.starty, bounds.stopx , bounds.starty);
+    drawLoopLine(bounds.stopx , bounds.starty, bounds.stopx , bounds.stopy );
+    drawLoopLine(bounds.startx, bounds.stopy , bounds.stopx , bounds.stopy );
+    drawLoopLine(bounds.startx, bounds.starty, bounds.startx, bounds.stopy );
+    if(typeof bounds.elsey !== 'undefined'){
+        drawLoopLine(bounds.startx, bounds.elsey, bounds.stopx, bounds.elsey );
+    }
+
+    var txt = exports.getTextObj();
+    txt.text = labelText;
+    txt.x = bounds.startx;
+    txt.y = bounds.starty;
+    txt.labelMargin =  1.5 * conf.boxMargin;
+    txt.class =  'labelText';
+    txt.fill =  'white';
+
+    exports.drawLabel(g,txt);
+
+    txt = exports.getTextObj();
+    txt.text = '[ ' + bounds.title + ' ]';
+    txt.x = bounds.startx + (bounds.stopx - bounds.startx)/2;
+    txt.y = bounds.starty + 1.5 * conf.boxMargin;
+    txt.anchor = 'middle';
+    txt.class = 'loopText';
+
+    exports.drawText(g,txt);
+
+    if(typeof bounds.elseText !== 'undefined') {
+        txt.text = '[ ' + bounds.elseText + ' ]';
+        txt.y = bounds.elsey + 1.5 * conf.boxMargin;
+        exports.drawText(g, txt);
+    }
+};
+
 /**
  * Setup arrow head and define the marker. The result is appended to the svg.
  */