Merge pull request #318 from ciekawy/activation_draft

activations doc + few fixes
This commit is contained in:
Knut Sveidqvist 2016-03-14 07:20:15 +01:00
commit 1ad9e75a86
2 changed files with 72 additions and 10 deletions

View File

@ -72,6 +72,55 @@ There are six types of arrows currently supported:
--x which will render a dotted line with a cross at the end (async)
## Activations
It is possible to activate and deactivate an actor. (de)activation can be dedicated declarations:
```
sequenceDiagram
Alice->>John: Hello John, how are you?
activate John
John-->>Alice: Great!
deactivate John
```
Renders to the diagram below:
```mermaid
sequenceDiagram
Alice->>John: Hello John, how are you?
activate John
John-->>Alice: Great!
deactivate John
```
There is also a shortcut notation by appending `+`/`-` suffix to the message arrow:
```
sequenceDiagram
Alice->>+John: Hello John, how are you?
John-->>-Alice: Great!
```
Activations can be stacked for same actor:
```
sequenceDiagram
Alice->>+John: Hello John, how are you?
Alice->>+John: John, can yoy hear me?
John-->>-Alice: Hi Alice, I can hear you!
John-->>-Alice: I feel great!
```
Stacked activations look like this:
```mermaid
sequenceDiagram
Alice->>+John: Hello John, how are you?
Alice->>+John: John, can yoy hear me?
John-->>-Alice: Hi Alice, I can hear you!
John-->>-Alice: I feel great!
```
## Notes
It is possible to add notes to a sequence diagram. This is done by the notation
Note [ right of | left of | over ] [Actor]: Text in note content

View File

@ -347,6 +347,19 @@ module.exports.draw = function (text, id) {
svgDraw.insertArrowHead(diagram);
svgDraw.insertArrowCrossHead(diagram);
function activeEnd(msg, verticalPos) {
var activationData = exports.bounds.endActivation(msg);
if(activationData.starty + 18 > verticalPos) {
activationData.starty = verticalPos - 6;
verticalPos += 12;
}
svgDraw.drawActivation(diagram, activationData, verticalPos, conf);
exports.bounds.insert(activationData.startx, verticalPos -10, activationData.stopx, verticalPos);
}
var lastMsg;
// Draw the messages/signals
messages.forEach(function(msg){
var loopData;
@ -374,15 +387,10 @@ module.exports.draw = function (text, id) {
}
break;
case sq.yy.LINETYPE.ACTIVE_START:
// exports.bounds.bumpVerticalPos(conf.boxMargin);
exports.bounds.newActivation(msg, diagram);
// exports.bounds.bumpVerticalPos(conf.boxMargin + conf.boxTextMargin);
break;
case sq.yy.LINETYPE.ACTIVE_END:
var activationData = exports.bounds.endActivation(msg);
svgDraw.drawActivation(diagram, activationData, exports.bounds.getVerticalPos(), conf);
exports.bounds.insert(activationData.startx, exports.bounds.getVerticalPos() -10, activationData.stopx, exports.bounds.getVerticalPos());
activeEnd(msg, exports.bounds.getVerticalPos());
break;
case sq.yy.LINETYPE.LOOP_START:
exports.bounds.bumpVerticalPos(conf.boxMargin);
@ -426,14 +434,19 @@ module.exports.draw = function (text, id) {
break;
default:
try {
lastMsg = msg;
exports.bounds.bumpVerticalPos(conf.messageMargin);
var fromBounds = actorFlowVerticaBounds(msg.from);
var toBounds = actorFlowVerticaBounds(msg.to);
var forward = fromBounds[0] < toBounds[0];
startx = fromBounds[forward?1:0];
stopx = toBounds[forward?0:1];
var fromIdx = fromBounds[0] <= toBounds[0]?1:0;
var toIdx = fromBounds[0] < toBounds[0]?0:1;
startx = fromBounds[fromIdx];
stopx = toBounds[toIdx];
drawMessage(diagram, startx, stopx, exports.bounds.getVerticalPos(), msg);
var verticalPos = exports.bounds.getVerticalPos();
drawMessage(diagram, startx, stopx, verticalPos, msg);
var allBounds = fromBounds.concat(toBounds);
exports.bounds.insert(Math.min.apply(null, allBounds), verticalPos, Math.max.apply(null, allBounds), verticalPos);
} catch (e) {
console.error('error while drawing message', e);
}