From 228b832bedb68212cee8b8c134ad60afc9d1ddaa Mon Sep 17 00:00:00 2001 From: "Bland, Paul" Date: Wed, 22 Aug 2018 10:22:50 -0400 Subject: [PATCH 1/3] moved hard-coded fill and stroke colors from svgDraw.js to scss files, and added defaults to all themes --- src/diagrams/sequence/svgDraw.js | 2 +- src/themes/dark/index.scss | 2 ++ src/themes/default/index.scss | 2 ++ src/themes/forest/index.scss | 2 ++ src/themes/neutral/index.scss | 2 ++ src/themes/sequence.scss | 5 +++++ 6 files changed, 14 insertions(+), 1 deletion(-) diff --git a/src/diagrams/sequence/svgDraw.js b/src/diagrams/sequence/svgDraw.js index 29dbbafba..998c51a6a 100644 --- a/src/diagrams/sequence/svgDraw.js +++ b/src/diagrams/sequence/svgDraw.js @@ -106,7 +106,7 @@ export const drawActivation = function (elem, bounds, verticalPos) { const g = bounds.anchored rect.x = bounds.startx rect.y = bounds.starty - rect.fill = '#f4f4f4' + rect.class = 'activation' rect.width = bounds.stopx - bounds.startx rect.height = verticalPos - bounds.starty drawRect(g, rect) diff --git a/src/themes/dark/index.scss b/src/themes/dark/index.scss index 529eb3f70..579d871b2 100644 --- a/src/themes/dark/index.scss +++ b/src/themes/dark/index.scss @@ -30,6 +30,8 @@ $labelBoxBorderColor: $actorBorder; $labelTextColor: $mainContrastColor; $noteBorderColor: $border2; $noteBkgColor: #fff5ad; +$activationBorderColor: #666; +$activationBkgColor: #f4f4f4; /* Gantt chart variables */ diff --git a/src/themes/default/index.scss b/src/themes/default/index.scss index e98fc0741..2718eb3ef 100644 --- a/src/themes/default/index.scss +++ b/src/themes/default/index.scss @@ -28,6 +28,8 @@ $labelBoxBorderColor: $actorBorder; $labelTextColor: $actorTextColor; $noteBorderColor: $border2; $noteBkgColor: #fff5ad; +$activationBorderColor: #666; +$activationBkgColor: #f4f4f4; /* Gantt chart variables */ diff --git a/src/themes/forest/index.scss b/src/themes/forest/index.scss index f6e1a1dae..c4a712297 100644 --- a/src/themes/forest/index.scss +++ b/src/themes/forest/index.scss @@ -29,6 +29,8 @@ $labelBoxBorderColor: #326932; $labelTextColor: $actorTextColor; $noteBorderColor: $border2; $noteBkgColor: #fff5ad; +$activationBorderColor: #666; +$activationBkgColor: #f4f4f4; /* Gantt chart variables */ diff --git a/src/themes/neutral/index.scss b/src/themes/neutral/index.scss index f0560142f..ea41b9b8c 100644 --- a/src/themes/neutral/index.scss +++ b/src/themes/neutral/index.scss @@ -33,6 +33,8 @@ $labelBoxBorderColor: $actorBorder; $labelTextColor: white; $noteBorderColor: darken($note, 60%); $noteBkgColor: $note; +$activationBorderColor: #666; +$activationBkgColor: #f4f4f4; /* Gantt chart variables */ diff --git a/src/themes/sequence.scss b/src/themes/sequence.scss index 780e8ecf5..1fc9622c7 100644 --- a/src/themes/sequence.scss +++ b/src/themes/sequence.scss @@ -73,3 +73,8 @@ text.actor { font-family: 'trebuchet ms', verdana, arial; font-size: 14px; } + +.activation { + fill: $activationBkgColor; + stroke: $activationBorderColor; +} From 80c7c9a86e64108e0f9dca88714640625f4ca1bd Mon Sep 17 00:00:00 2001 From: "Bland, Paul" Date: Fri, 24 Aug 2018 11:56:28 -0400 Subject: [PATCH 2/3] added ability to style nested activations --- src/diagrams/sequence/sequenceRenderer.js | 2 +- src/diagrams/sequence/svgDraw.js | 4 ++-- src/themes/sequence.scss | 12 +++++++++++- 3 files changed, 14 insertions(+), 4 deletions(-) diff --git a/src/diagrams/sequence/sequenceRenderer.js b/src/diagrams/sequence/sequenceRenderer.js index fcf41d28e..8d8094e6b 100644 --- a/src/diagrams/sequence/sequenceRenderer.js +++ b/src/diagrams/sequence/sequenceRenderer.js @@ -338,7 +338,7 @@ export const draw = function (text, id) { activationData.starty = verticalPos - 6 verticalPos += 12 } - svgDraw.drawActivation(diagram, activationData, verticalPos, conf) + svgDraw.drawActivation(diagram, activationData, verticalPos, conf, actorActivations(msg.from.actor).length) bounds.insert(activationData.startx, verticalPos - 10, activationData.stopx, verticalPos) } diff --git a/src/diagrams/sequence/svgDraw.js b/src/diagrams/sequence/svgDraw.js index 998c51a6a..aaabfea60 100644 --- a/src/diagrams/sequence/svgDraw.js +++ b/src/diagrams/sequence/svgDraw.js @@ -101,12 +101,12 @@ export const anchorElement = function (elem) { * @param bounds - activation box bounds * @param verticalPos - precise y cooridnate of bottom activation box edge */ -export const drawActivation = function (elem, bounds, verticalPos) { +export const drawActivation = function (elem, bounds, verticalPos, conf, actorActivations) { const rect = getNoteRect() const g = bounds.anchored rect.x = bounds.startx rect.y = bounds.starty - rect.class = 'activation' + rect.class = 'activation' + actorActivations rect.width = bounds.stopx - bounds.startx rect.height = verticalPos - bounds.starty drawRect(g, rect) diff --git a/src/themes/sequence.scss b/src/themes/sequence.scss index 1fc9622c7..572bcc07b 100644 --- a/src/themes/sequence.scss +++ b/src/themes/sequence.scss @@ -74,7 +74,17 @@ text.actor { font-size: 14px; } -.activation { +.activation0 { + fill: $activationBkgColor; + stroke: $activationBorderColor; +} + +.activation1 { + fill: $activationBkgColor; + stroke: $activationBorderColor; +} + +.activation2 { fill: $activationBkgColor; stroke: $activationBorderColor; } From 06aa4a5c0711c90d7206b0a65637a6d1573d74e6 Mon Sep 17 00:00:00 2001 From: "Bland, Paul" Date: Wed, 29 Aug 2018 14:24:42 -0400 Subject: [PATCH 3/3] prevent deeply nested activations from calling classes that don't exist (by limiting to 3) --- src/diagrams/sequence/svgDraw.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/diagrams/sequence/svgDraw.js b/src/diagrams/sequence/svgDraw.js index aaabfea60..cf1d6fd2c 100644 --- a/src/diagrams/sequence/svgDraw.js +++ b/src/diagrams/sequence/svgDraw.js @@ -106,7 +106,7 @@ export const drawActivation = function (elem, bounds, verticalPos, conf, actorAc const g = bounds.anchored rect.x = bounds.startx rect.y = bounds.starty - rect.class = 'activation' + actorActivations + rect.class = 'activation' + (actorActivations % 3) // Will evaluate to 0, 1 or 2 rect.width = bounds.stopx - bounds.startx rect.height = verticalPos - bounds.starty drawRect(g, rect)