Merge pull request #2981 from Zumbala/develop

Sequence autonumbering and Git fix options parsing

demos/index.html

@@ -385,8 +385,7 @@
     A -->|Get money| B1[(Go shopping 1)]
     A -->|Get money| B2[(Go shopping 2)]
     A -->|Get money| B3[(Go shopping 3)]
-    C[(Let me think...<br />Do I want something for work,<br />something to spend every free second with,<br />or
- something to get around?)]
+    C[(Let me think...<br />Do I want something for work,<br />something to spend every free second with,<br />or something to get around?)]
     B1 --> C
     B2 --> C
     B3 --> C
@@ -518,8 +517,10 @@
     sequenceDiagram
     autonumber
     Alice->>John: Hello John,<br>how are you?
+    autonumber 50 10
     Alice->>John: John,<br />can you hear me?
     John-->>Alice: Hi Alice,<br />I can hear you!
+    autonumber off
     John-->>Alice: I feel great!
   </div>
 
@@ -601,10 +602,11 @@
     gitGraph:
     options
     {
-    "nodeSpacing": 150,
-    "nodeRadius": 10
+    "nodeSpacing": 50, 
+    "nodeRadius": 5
     }
     end
+    branch master
     commit
     branch newbranch
     checkout newbranch

demos/sequence.html

@@ -24,6 +24,7 @@
 		participant Alice
 		participant Bob
 		participant John as John<br />Second Line
+		autonumber 10 10
 		rect rgb(200, 220, 100)
 		rect rgb(200, 255, 200)
 		Alice ->> Bob: Hello Bob, how are you?
@@ -39,14 +40,17 @@
 		Bob-x John:wrap: John! Are you still debating about how you're doing? How long does it take??
 		Note over John: After a few more moments, John<br />finally snaps out of it.
 		end
+		autonumber off
 		alt either this
 		Alice->>+John: Yes
     John-->>-Alice: OK
 		else or this
+		autonumber
 		Alice->>John: No
 		else or this will happen
 		Alice->John: Maybe
 		end
+		autonumber 200
 		par this happens in parallel
 		Alice -->> Bob: Parallel message 1
 		and

src/diagrams/git/parser/gitGraph.jison

@@ -43,9 +43,9 @@
 "BT"                                    return 'DIR';
 ":"                                     return ':';
 "^"                                     return 'CARET'
-"options"\r?\n                          this.begin("options");
-<options>"end"\r?\n                     this.popState();
-<options>[^\n]+\r?\n                    return 'OPT';
+"options"\r?\n                          this.begin("options"); //
+<options>[ \r\n\t]+"end"                this.popState();       // not used anymore in the renderer, fixed for backward compatibility
+<options>[\s\S]+(?=[ \r\n\t]+"end")     return 'OPT';          //
 ["]                                     this.begin("string");
 <string>["]                             this.popState();
 <string>[^"]*                           return 'STR';

src/diagrams/sequence/parser/sequenceDiagram.jison

@@ -32,6 +32,7 @@
 <INITIAL,ID,ALIAS,LINE,arg_directive,type_directive,open_directive>\#[^\n]*   /* skip comments */
 \%%(?!\{)[^\n]*                                                 /* skip comments */
 [^\}]\%\%[^\n]*                                                 /* skip comments */
+[0-9]+(?=[ \n]+)       											return 'NUM';
 "participant"                                                   { this.begin('ID'); return 'participant'; }
 "actor"                                                   	{ this.begin('ID'); return 'participant_actor'; }
 <ID>[^\->:\n,;]+?(?=((?!\n)\s)+"as"(?!\n)\s|[#\n;]|$)           { yytext = yytext.trim(); this.begin('ALIAS'); return 'ACTOR'; }
@@ -58,9 +59,10 @@
 "deactivate"                                                    { this.begin('ID'); return 'deactivate'; }
 "title"\s[^#\n;]+                                               return 'title';
 "title:"\s[^#\n;]+                                              return 'legacy_title';
-"accDescription"\s[^#\n;]+       				return 'accDescription';
+"accDescription"\s[^#\n;]+       								return 'accDescription';
 "sequenceDiagram"                                               return 'SD';
 "autonumber"                                                    return 'autonumber';
+"off"															return 'off';
 ","                                                             return ',';
 ";"                                                             return 'NEWLINE';
 [^\+\->:\n,;]+((?!(\-x|\-\-x|\-\)|\-\-\)))[\-]*[^\+\->:\n,;]+)*             { yytext = yytext.trim(); return 'ACTOR'; }
@@ -115,7 +117,10 @@ statement
 	| 'participant_actor' actor 'AS' restOfLine 'NEWLINE' {$2.type='addActor';$2.description=yy.parseMessage($4); $$=$2;}
 	| 'participant_actor' actor 'NEWLINE' {$2.type='addActor'; $$=$2;}
 	| signal 'NEWLINE'
-	| autonumber {yy.enableSequenceNumbers()}
+	| autonumber NUM NUM 'NEWLINE' { $$= {type:'sequenceIndex',sequenceIndex: Number($2), sequenceIndexStep:Number($3), sequenceVisible:true, signalType:yy.LINETYPE.AUTONUMBER};}
+	| autonumber NUM 'NEWLINE' { $$ = {type:'sequenceIndex',sequenceIndex: Number($2), sequenceIndexStep:1, sequenceVisible:true, signalType:yy.LINETYPE.AUTONUMBER};}
+	| autonumber off 'NEWLINE' { $$ = {type:'sequenceIndex', sequenceVisible:false, signalType:yy.LINETYPE.AUTONUMBER};}
+	| autonumber 'NEWLINE'  {$$ = {type:'sequenceIndex', sequenceVisible:true, signalType:yy.LINETYPE.AUTONUMBER}; }
 	| 'activate' actor 'NEWLINE' {$$={type: 'activeStart', signalType: yy.LINETYPE.ACTIVE_START, actor: $2};}
 	| 'deactivate' actor 'NEWLINE' {$$={type: 'activeEnd', signalType: yy.LINETYPE.ACTIVE_END, actor: $2};}
 	| note_statement 'NEWLINE'

src/diagrams/sequence/sequenceDb.js

@@ -125,6 +125,9 @@ export const getTitle = function () {
 export const enableSequenceNumbers = function () {
   sequenceNumbersEnabled = true;
 };
+export const disableSequenceNumbers = function () {
+  sequenceNumbersEnabled = false;
+};
 export const showSequenceNumbers = () => sequenceNumbersEnabled;
 
 export const setWrap = function (wrapSetting) {
@@ -178,6 +181,7 @@ export const LINETYPE = {
   RECT_END: 23,
   SOLID_POINT: 24,
   DOTTED_POINT: 25,
+  AUTONUMBER: 26,
 };
 
 export const ARROWTYPE = {
@@ -333,6 +337,19 @@ export const apply = function (param) {
     });
   } else {
     switch (param.type) {
+      case 'sequenceIndex':
+        messages.push({
+          from: undefined,
+          to: undefined,
+          message: {
+            start: param.sequenceIndex,
+            step: param.sequenceIndexStep,
+            visible: param.sequenceVisible,
+          },
+          wrap: false,
+          type: param.signalType,
+        });
+        break;
       case 'addParticipant':
         addActor(param.actor, param.actor, param.description, 'participant');
         break;
@@ -425,6 +442,7 @@ export default {
   autoWrap,
   setWrap,
   enableSequenceNumbers,
+  disableSequenceNumbers,
   showSequenceNumbers,
   getMessages,
   getActors,

src/diagrams/sequence/sequenceDiagram.spec.js

@@ -47,6 +47,7 @@ Note right of Bob: Bob thinks
 Bob-->Alice: I am good thanks!`;
 
     mermaidAPI.parse(str);
+    renderer.draw(str, 'tst'); // needs to be rendered for the correct value of visibility autonumbers
     expect(parser.yy.showSequenceNumbers()).toBe(false);
   });
   it('it should show sequence numbers when autonumber is enabled', function () {
@@ -58,6 +59,7 @@ Note right of Bob: Bob thinks
 Bob-->Alice: I am good thanks!`;
 
     mermaidAPI.parse(str);
+    renderer.draw(str, 'tst'); // needs to be rendered for the correct value of visibility autonumbers
     expect(parser.yy.showSequenceNumbers()).toBe(true);
   });
   it('it should handle a sequenceDiagram definition with a title:', function () {
@@ -1676,6 +1678,7 @@ Note right of Bob: Bob thinks
 Bob-->Alice: I am good thanks!`;
 
     mermaidAPI.parse(str1);
+    renderer.draw(str1, 'tst'); // needs to be rendered for the correct value of visibility autonumbers
     expect(parser.yy.showSequenceNumbers()).toBe(true);
 
     const str2 = `
@@ -1685,6 +1688,7 @@ Note right of Bob: Bob thinks
 Bob-->Alice: I am good thanks!`;
 
     mermaidAPI.parse(str2);
+    renderer.draw(str2, 'tst');
     expect(parser.yy.showSequenceNumbers()).toBe(false);
   });
 });

src/diagrams/sequence/sequenceRenderer.js

@@ -329,7 +329,7 @@ const boundMessage = function (diagram, msgModel) {
  * @param {float} lineStarty - The Y coordinate at which the message line starts
  */
 const drawMessage = function (diagram, msgModel, lineStarty) {
-  const { startx, stopx, starty, message, type, sequenceIndex } = msgModel;
+  const { startx, stopx, starty, message, type, sequenceIndex, sequenceVisible } = msgModel;
   let textDims = utils.calculateTextDimensions(message, messageFont(conf));
   const textObj = svgDraw.getTextObj();
   textObj.x = startx;
@@ -432,7 +432,7 @@ const drawMessage = function (diagram, msgModel, lineStarty) {
   }
 
   // add node number
-  if (sequenceDb.showSequenceNumbers() || conf.showSequenceNumbers) {
+  if (sequenceVisible || conf.showSequenceNumbers) {
     line.attr('marker-start', 'url(' + url + '#sequencenumber)');
     diagram
       .append('text')
@@ -637,6 +637,7 @@ export const draw = function (text, id) {
 
   // Draw the messages/signals
   let sequenceIndex = 1;
+  let sequenceIndexStep = 1;
   let messagesToDraw = Array();
   messages.forEach(function (msg) {
     let loopModel, noteModel, msgModel;
@@ -741,12 +742,19 @@ export const draw = function (text, id) {
         bounds.bumpVerticalPos(loopModel.stopy - bounds.getVerticalPos());
         bounds.models.addLoop(loopModel);
         break;
+      case parser.yy.LINETYPE.AUTONUMBER:
+        sequenceIndex = msg.message.start || sequenceIndex;
+        sequenceIndexStep = msg.message.step || sequenceIndexStep;
+        if (msg.message.visible) parser.yy.enableSequenceNumbers();
+        else parser.yy.disableSequenceNumbers();
+        break;
       default:
         try {
           // lastMsg = msg
           msgModel = msg.msgModel;
           msgModel.starty = bounds.getVerticalPos();
           msgModel.sequenceIndex = sequenceIndex;
+          msgModel.sequenceVisible = parser.yy.showSequenceNumbers();
           let lineStarty = boundMessage(diagram, msgModel);
           messagesToDraw.push({ messageModel: msgModel, lineStarty: lineStarty });
           bounds.models.addMessage(msgModel);
@@ -768,7 +776,7 @@ export const draw = function (text, id) {
         parser.yy.LINETYPE.DOTTED_POINT,
       ].includes(msg.type)
     ) {
-      sequenceIndex++;
+      sequenceIndex = sequenceIndex + sequenceIndexStep;
     }
   });
 

src/mermaidAPI.js

@@ -224,7 +224,7 @@ export const decodeEntities = function (text) {
  */
 const render = function (id, _txt, cb, container) {
   configApi.reset();
-  let txt = _txt;
+  let txt = _txt.replace(/\r\n?/g, '\n'); // parser problems on CRLF ignore all CR and leave LF;;
   const graphInit = utils.detectInit(txt);
   if (graphInit) {
     directiveSanitizer(graphInit);