diff --git a/src/diagrams/sequenceDiagram/sequenceDb.js b/src/diagrams/sequenceDiagram/sequenceDb.js
index be8f1aac1..665ca820d 100644
--- a/src/diagrams/sequenceDiagram/sequenceDb.js
+++ b/src/diagrams/sequenceDiagram/sequenceDb.js
@@ -1,13 +1,13 @@
import { logger } from '../../logger'
-var actors = {}
-var messages = []
-var notes = []
-var title = ''
+let actors = {}
+let messages = []
+const notes = []
+let title = ''
export const addActor = function (id, name, description) {
// Don't allow description nulling
- var old = actors[id]
+ const old = actors[id]
if (old && name === old.name && description == null) return
// Don't allow null descriptions, either
@@ -81,10 +81,10 @@ export const PLACEMENT = {
}
export const addNote = function (actor, placement, message) {
- var note = { actor: actor, placement: placement, message: message }
+ const note = { actor: actor, placement: placement, message: message }
// Coerce actor into a [to, from, ...] array
- var actors = [].concat(actor, actor)
+ const actors = [].concat(actor, actor)
notes.push(note)
messages.push({ from: actors[0], to: actors[1], message: message, type: LINETYPE.NOTE, placement: placement })
diff --git a/src/diagrams/sequenceDiagram/sequenceRenderer.js b/src/diagrams/sequenceDiagram/sequenceRenderer.js
index 37335316a..7d2a72a57 100644
--- a/src/diagrams/sequenceDiagram/sequenceRenderer.js
+++ b/src/diagrams/sequenceDiagram/sequenceRenderer.js
@@ -6,7 +6,7 @@ import sequenceDb from './sequenceDb'
parser.yy = sequenceDb
-var conf = {
+const conf = {
diagramMarginX: 50,
diagramMarginY: 30,
@@ -65,13 +65,13 @@ export const bounds = {
}
},
updateBounds: function (startx, starty, stopx, stopy) {
- var _self = this
- var cnt = 0
+ const _self = this
+ let cnt = 0
function updateFn (type) {
return function updateItemBounds (item) {
cnt++
// The loop sequenceItems is a stack so the biggest margins in the beginning of the sequenceItems
- var n = _self.sequenceItems.length - cnt + 1
+ const n = _self.sequenceItems.length - cnt + 1
_self.updateVal(item, 'starty', starty - n * conf.boxMargin, Math.min)
_self.updateVal(item, 'stopy', stopy + n * conf.boxMargin, Math.max)
@@ -93,12 +93,10 @@ export const bounds = {
this.activations.forEach(updateFn('activation'))
},
insert: function (startx, starty, stopx, stopy) {
- var _startx, _starty, _stopx, _stopy
-
- _startx = Math.min(startx, stopx)
- _stopx = Math.max(startx, stopx)
- _starty = Math.min(starty, stopy)
- _stopy = Math.max(starty, stopy)
+ const _startx = Math.min(startx, stopx)
+ const _stopx = Math.max(startx, stopx)
+ const _starty = Math.min(starty, stopy)
+ const _stopy = Math.max(starty, stopy)
this.updateVal(bounds.data, 'startx', _startx, Math.min)
this.updateVal(bounds.data, 'starty', _starty, Math.min)
@@ -108,9 +106,9 @@ export const bounds = {
this.updateBounds(_startx, _starty, _stopx, _stopy)
},
newActivation: function (message, diagram) {
- var actorRect = parser.yy.getActors()[message.from.actor]
- var stackedSize = actorActivations(message.from.actor).length
- var x = actorRect.x + conf.width / 2 + (stackedSize - 1) * conf.activationWidth / 2
+ const actorRect = parser.yy.getActors()[message.from.actor]
+ const stackedSize = actorActivations(message.from.actor).length
+ const x = actorRect.x + conf.width / 2 + (stackedSize - 1) * conf.activationWidth / 2
this.activations.push({
startx: x,
starty: this.verticalPos + 2,
@@ -122,21 +120,21 @@ export const bounds = {
},
endActivation: function (message) {
// find most recent activation for given actor
- var lastActorActivationIdx = this.activations
+ const lastActorActivationIdx = this.activations
.map(function (activation) { return activation.actor })
.lastIndexOf(message.from.actor)
- var activation = this.activations.splice(lastActorActivationIdx, 1)[0]
+ const activation = this.activations.splice(lastActorActivationIdx, 1)[0]
return activation
},
newLoop: function (title) {
this.sequenceItems.push({ startx: undefined, starty: this.verticalPos, stopx: undefined, stopy: undefined, title: title })
},
endLoop: function () {
- var loop = this.sequenceItems.pop()
+ const loop = this.sequenceItems.pop()
return loop
},
addSectionToLoop: function (message) {
- var loop = this.sequenceItems.pop()
+ const loop = this.sequenceItems.pop()
loop.sections = loop.sections || []
loop.sectionTitles = loop.sectionTitles || []
loop.sections.push(bounds.getVerticalPos())
@@ -161,17 +159,17 @@ export const bounds = {
* @param pos The position if the actor in the liost of actors
* @param description The text in the box
*/
-var drawNote = function (elem, startx, verticalPos, msg, forceWidth) {
- var rect = svgDraw.getNoteRect()
+const drawNote = function (elem, startx, verticalPos, msg, forceWidth) {
+ const rect = svgDraw.getNoteRect()
rect.x = startx
rect.y = verticalPos
rect.width = forceWidth || conf.width
rect.class = 'note'
- var g = elem.append('g')
- var rectElem = svgDraw.drawRect(g, rect)
+ let g = elem.append('g')
+ const rectElem = svgDraw.drawRect(g, rect)
- var textObj = svgDraw.getTextObj()
+ const textObj = svgDraw.getTextObj()
textObj.x = startx - 4
textObj.y = verticalPos - 13
textObj.textMargin = conf.noteMargin
@@ -179,9 +177,9 @@ var drawNote = function (elem, startx, verticalPos, msg, forceWidth) {
textObj.text = msg.message
textObj.class = 'noteText'
- var textElem = svgDraw.drawText(g, textObj, rect.width - conf.noteMargin)
+ let textElem = svgDraw.drawText(g, textObj, rect.width - conf.noteMargin)
- var textHeight = textElem[0][0].getBBox().height
+ let textHeight = textElem[0][0].getBBox().height
if (!forceWidth && textHeight > conf.width) {
textElem.remove()
g = elem.append('g')
@@ -207,34 +205,32 @@ var drawNote = function (elem, startx, verticalPos, msg, forceWidth) {
* @param txtCenter
* @param msg
*/
-var drawMessage = function (elem, startx, stopx, verticalPos, msg) {
- var g = elem.append('g')
- var txtCenter = startx + (stopx - startx) / 2
+const drawMessage = function (elem, startx, stopx, verticalPos, msg) {
+ const g = elem.append('g')
+ const txtCenter = startx + (stopx - startx) / 2
- var textElem = g.append('text') // text label for the x axis
+ const textElem = g.append('text') // text label for the x axis
.attr('x', txtCenter)
.attr('y', verticalPos - 7)
.style('text-anchor', 'middle')
.attr('class', 'messageText')
.text(msg.message)
- var textWidth
-
+ let textWidth
if (typeof textElem[0][0].getBBox !== 'undefined') {
textWidth = textElem[0][0].getBBox().width
} else {
textWidth = textElem[0][0].getBoundingClientRect()
}
- var line
-
+ let line
if (startx === stopx) {
line = g.append('path')
.attr('d', 'M ' + startx + ',' + verticalPos + ' C ' + (startx + 60) + ',' + (verticalPos - 10) + ' ' + (startx + 60) + ',' +
(verticalPos + 30) + ' ' + startx + ',' + (verticalPos + 20))
bounds.bumpVerticalPos(30)
- var dx = Math.max(textWidth / 2, 100)
+ const dx = Math.max(textWidth / 2, 100)
bounds.insert(startx - dx, bounds.getVerticalPos() - 10, stopx + dx, bounds.getVerticalPos())
} else {
line = g.append('line')
@@ -253,7 +249,7 @@ var drawMessage = function (elem, startx, stopx, verticalPos, msg) {
line.attr('class', 'messageLine0')
}
- var url = ''
+ let url = ''
if (conf.arrowMarkerAbsolute) {
url = window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search
url = url.replace(/\(/g, '\\(')
@@ -273,10 +269,9 @@ var drawMessage = function (elem, startx, stopx, verticalPos, msg) {
}
export const drawActors = function (diagram, actors, actorKeys, verticalPos) {
- var i
// Draw the actors
- for (i = 0; i < actorKeys.length; i++) {
- var key = actorKeys[i]
+ for (let i = 0; i < actorKeys.length; i++) {
+ const key = actorKeys[i]
// Add some rendering data to the object
actors[key].x = i * conf.actorMargin + i * conf.width
@@ -294,26 +289,26 @@ export const drawActors = function (diagram, actors, actorKeys, verticalPos) {
}
export const setConf = function (cnf) {
- var keys = Object.keys(cnf)
+ const keys = Object.keys(cnf)
keys.forEach(function (key) {
conf[key] = cnf[key]
})
}
-var actorActivations = function (actor) {
+const actorActivations = function (actor) {
return bounds.activations.filter(function (activation) {
return activation.actor === actor
})
}
-var actorFlowVerticaBounds = function (actor) {
+const actorFlowVerticaBounds = function (actor) {
// handle multiple stacked activations for same actor
- var actors = parser.yy.getActors()
- var activations = actorActivations(actor)
+ const actors = parser.yy.getActors()
+ const activations = actorActivations(actor)
- var left = activations.reduce(function (acc, activation) { return Math.min(acc, activation.startx) }, actors[actor].x + conf.width / 2)
- var right = activations.reduce(function (acc, activation) { return Math.max(acc, activation.stopx) }, actors[actor].x + conf.width / 2)
+ const left = activations.reduce(function (acc, activation) { return Math.min(acc, activation.startx) }, actors[actor].x + conf.width / 2)
+ const right = activations.reduce(function (acc, activation) { return Math.max(acc, activation.stopx) }, actors[actor].x + conf.width / 2)
return [left, right]
}
@@ -327,17 +322,17 @@ export const draw = function (text, id) {
parser.parse(text + '\n')
bounds.init()
- var diagram = d3.select('#' + id)
+ const diagram = d3.select('#' + id)
- var startx
- var stopx
- var forceWidth
+ let startx
+ let stopx
+ let forceWidth
// Fetch data from the parsing
- var actors = parser.yy.getActors()
- var actorKeys = parser.yy.getActorKeys()
- var messages = parser.yy.getMessages()
- var title = parser.yy.getTitle()
+ const actors = parser.yy.getActors()
+ const actorKeys = parser.yy.getActorKeys()
+ const messages = parser.yy.getMessages()
+ const title = parser.yy.getTitle()
drawActors(diagram, actors, actorKeys, 0)
// The arrow head definition is attached to the svg once
@@ -345,7 +340,7 @@ export const draw = function (text, id) {
svgDraw.insertArrowCrossHead(diagram)
function activeEnd (msg, verticalPos) {
- var activationData = bounds.endActivation(msg)
+ const activationData = bounds.endActivation(msg)
if (activationData.starty + 18 > verticalPos) {
activationData.starty = verticalPos - 6
verticalPos += 12
@@ -355,12 +350,11 @@ export const draw = function (text, id) {
bounds.insert(activationData.startx, verticalPos - 10, activationData.stopx, verticalPos)
}
- // var lastMsg
+ // const lastMsg
// Draw the messages/signals
messages.forEach(function (msg) {
- var loopData
-
+ let loopData
switch (msg.type) {
case parser.yy.LINETYPE.NOTE:
bounds.bumpVerticalPos(conf.boxMargin)
@@ -445,16 +439,16 @@ export const draw = function (text, id) {
try {
// lastMsg = msg
bounds.bumpVerticalPos(conf.messageMargin)
- var fromBounds = actorFlowVerticaBounds(msg.from)
- var toBounds = actorFlowVerticaBounds(msg.to)
- var fromIdx = fromBounds[0] <= toBounds[0] ? 1 : 0
- var toIdx = fromBounds[0] < toBounds[0] ? 0 : 1
+ const fromBounds = actorFlowVerticaBounds(msg.from)
+ const toBounds = actorFlowVerticaBounds(msg.to)
+ const fromIdx = fromBounds[0] <= toBounds[0] ? 1 : 0
+ const toIdx = fromBounds[0] < toBounds[0] ? 0 : 1
startx = fromBounds[fromIdx]
stopx = toBounds[toIdx]
- var verticalPos = bounds.getVerticalPos()
+ const verticalPos = bounds.getVerticalPos()
drawMessage(diagram, startx, stopx, verticalPos, msg)
- var allBounds = fromBounds.concat(toBounds)
+ const allBounds = fromBounds.concat(toBounds)
bounds.insert(Math.min.apply(null, allBounds), verticalPos, Math.max.apply(null, allBounds), verticalPos)
} catch (e) {
console.error('error while drawing message', e)
@@ -468,20 +462,19 @@ export const draw = function (text, id) {
drawActors(diagram, actors, actorKeys, bounds.getVerticalPos())
}
- var box = bounds.getBounds()
+ const box = bounds.getBounds()
// Adjust line height of actor lines now that the height of the diagram is known
logger.debug('For line height fix Querying: #' + id + ' .actor-line')
- var actorLines = d3.selectAll('#' + id + ' .actor-line')
+ const actorLines = d3.selectAll('#' + id + ' .actor-line')
actorLines.attr('y2', box.stopy)
- var height = box.stopy - box.starty + 2 * conf.diagramMarginY
-
+ let height = box.stopy - box.starty + 2 * conf.diagramMarginY
if (conf.mirrorActors) {
height = height - conf.boxMargin + conf.bottomMarginAdj
}
- var width = (box.stopx - box.startx) + (2 * conf.diagramMarginX)
+ const width = (box.stopx - box.startx) + (2 * conf.diagramMarginX)
if (title) {
diagram.append('text')
@@ -498,7 +491,7 @@ export const draw = function (text, id) {
diagram.attr('height', height)
diagram.attr('width', width)
}
- var extraVertForTitle = title ? 40 : 0
+ const extraVertForTitle = title ? 40 : 0
diagram.attr('viewBox', (box.startx - conf.diagramMarginX) + ' -' + (conf.diagramMarginY + extraVertForTitle) + ' ' + width + ' ' + (height + extraVertForTitle))
}
diff --git a/src/diagrams/sequenceDiagram/svgDraw.js b/src/diagrams/sequenceDiagram/svgDraw.js
index ca5eb9cd7..4660dce8d 100644
--- a/src/diagrams/sequenceDiagram/svgDraw.js
+++ b/src/diagrams/sequenceDiagram/svgDraw.js
@@ -1,5 +1,5 @@
export const drawRect = function (elem, rectData) {
- var rectElem = elem.append('rect')
+ const rectElem = elem.append('rect')
rectElem.attr('x', rectData.x)
rectElem.attr('y', rectData.y)
rectElem.attr('fill', rectData.fill)
@@ -18,9 +18,9 @@ export const drawRect = function (elem, rectData) {
export const drawText = function (elem, textData, width) {
// Remove and ignore br:s
- var nText = textData.text.replace(/
/ig, ' ')
+ const nText = textData.text.replace(/
/ig, ' ')
- var textElem = elem.append('text')
+ const textElem = elem.append('text')
textElem.attr('x', textData.x)
textElem.attr('y', textData.y)
textElem.style('text-anchor', textData.anchor)
@@ -29,7 +29,7 @@ export const drawText = function (elem, textData, width) {
textElem.attr('class', textData.class)
}
- var span = textElem.append('tspan')
+ const span = textElem.append('tspan')
span.attr('x', textData.x + textData.textMargin * 2)
span.attr('fill', textData.fill)
span.text(nText)
@@ -53,7 +53,7 @@ export const drawLabel = function (elem, txtObject) {
(x + width - cut * 1.2) + ',' + (y + height) + ' ' +
(x) + ',' + (y + height)
}
- var polygon = elem.append('polygon')
+ const polygon = elem.append('polygon')
polygon.attr('points', genPoints(txtObject.x, txtObject.y, 50, 20, 7))
polygon.attr('class', 'labelBox')
@@ -61,7 +61,7 @@ export const drawLabel = function (elem, txtObject) {
txtObject.x = txtObject.x + 0.5 * txtObject.labelMargin
drawText(elem, txtObject)
}
-var actorCnt = -1
+let actorCnt = -1
/**
* Draws an actor in the diagram with the attaced line
* @param center - The center of the the actor
@@ -69,8 +69,8 @@ var actorCnt = -1
* @param description The text in the box
*/
export const drawActor = function (elem, left, verticalPos, description, conf) {
- var center = left + (conf.width / 2)
- var g = elem.append('g')
+ const center = left + (conf.width / 2)
+ const g = elem.append('g')
if (verticalPos === 0) {
actorCnt++
g.append('line')
@@ -84,7 +84,7 @@ export const drawActor = function (elem, left, verticalPos, description, conf) {
.attr('stroke', '#999')
}
- var rect = getNoteRect()
+ const rect = getNoteRect()
rect.x = left
rect.y = verticalPos
rect.fill = '#eaeaea'
@@ -109,8 +109,8 @@ export const anchorElement = function (elem) {
* @param verticalPos - precise y cooridnate of bottom activation box edge
*/
export const drawActivation = function (elem, bounds, verticalPos) {
- var rect = getNoteRect()
- var g = bounds.anchored
+ const rect = getNoteRect()
+ const g = bounds.anchored
rect.x = bounds.startx
rect.y = bounds.starty
rect.fill = '#f4f4f4'
@@ -126,8 +126,8 @@ export const drawActivation = function (elem, bounds, verticalPos) {
* @param description The text in the box
*/
export const drawLoop = function (elem, bounds, labelText, conf) {
- var g = elem.append('g')
- var drawLoopLine = function (startx, starty, stopx, stopy) {
+ const g = elem.append('g')
+ const drawLoopLine = function (startx, starty, stopx, stopy) {
return g.append('line')
.attr('x1', startx)
.attr('y1', starty)
@@ -145,7 +145,7 @@ export const drawLoop = function (elem, bounds, labelText, conf) {
})
}
- var txt = getTextObj()
+ let txt = getTextObj()
txt.text = labelText
txt.x = bounds.startx
txt.y = bounds.starty
@@ -192,8 +192,8 @@ export const insertArrowHead = function (elem) {
* Setup arrow head and define the marker. The result is appended to the svg.
*/
export const insertArrowCrossHead = function (elem) {
- var defs = elem.append('defs')
- var marker = defs.append('marker')
+ const defs = elem.append('defs')
+ const marker = defs.append('marker')
.attr('id', 'crosshead')
.attr('markerWidth', 15)
.attr('markerHeight', 8)
@@ -220,7 +220,7 @@ export const insertArrowCrossHead = function (elem) {
}
export const getTextObj = function () {
- var txt = {
+ const txt = {
x: 0,
y: 0,
'fill': 'black',
@@ -236,7 +236,7 @@ export const getTextObj = function () {
}
export const getNoteRect = function () {
- var rect = {
+ const rect = {
x: 0,
y: 0,
fill: '#EDF2AE',
@@ -250,9 +250,9 @@ export const getNoteRect = function () {
return rect
}
-var _drawTextCandidateFunc = (function () {
+const _drawTextCandidateFunc = (function () {
function byText (content, g, x, y, width, height, textAttrs) {
- var text = g.append('text')
+ const text = g.append('text')
.attr('x', x + width / 2).attr('y', y + height / 2 + 5)
.style('text-anchor', 'middle')
.text(content)
@@ -260,7 +260,7 @@ var _drawTextCandidateFunc = (function () {
}
function byTspan (content, g, x, y, width, height, textAttrs) {
- var text = g.append('text')
+ const text = g.append('text')
.attr('x', x + width / 2).attr('y', y)
.style('text-anchor', 'middle')
text.append('tspan')
@@ -272,7 +272,7 @@ var _drawTextCandidateFunc = (function () {
x: x + width / 2, y: y, width: width, height: height
}, 0)
// vertical aligment after d3textwrap expans tspan to multiple tspans
- var tspans = text.selectAll('tspan')
+ let tspans = text.selectAll('tspan')
if (tspans.length > 0 && tspans[0].length > 0) {
tspans = tspans[0]
// set y of to the mid y of the first line
@@ -285,12 +285,12 @@ var _drawTextCandidateFunc = (function () {
}
function byFo (content, g, x, y, width, height, textAttrs) {
- var s = g.append('switch')
- var f = s.append('foreignObject')
+ const s = g.append('switch')
+ const f = s.append('foreignObject')
.attr('x', x).attr('y', y)
.attr('width', width).attr('height', height)
- var text = f.append('div').style('display', 'table')
+ const text = f.append('div').style('display', 'table')
.style('height', '100%').style('width', '100%')
text.append('div').style('display', 'table-cell')
@@ -302,7 +302,7 @@ var _drawTextCandidateFunc = (function () {
}
function _setTextAttrs (toText, fromTextAttrsDict) {
- for (var key in fromTextAttrsDict) {
+ for (const key in fromTextAttrsDict) {
if (fromTextAttrsDict.hasOwnProperty(key)) {
toText.attr(key, fromTextAttrsDict[key])
}