Replace var with const

src/diagrams/sequenceDiagram/sequenceDb.js

@@ -1,13 +1,13 @@
 import { logger } from '../../logger'
 
-var actors = {}
+let actors = {}
-var messages = []
+let messages = []
-var notes = []
+const notes = []
-var title = ''
+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 })

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
+    const _self = this
-    var cnt = 0
+    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
+    const _startx = Math.min(startx, stopx)
-
+    const _stopx = Math.max(startx, stopx)
-    _startx = Math.min(startx, stopx)
+    const _starty = Math.min(starty, stopy)
-    _stopx = Math.max(startx, stopx)
+    const _stopy = Math.max(starty, stopy)
-    _starty = Math.min(starty, stopy)
-    _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]
+    const actorRect = parser.yy.getActors()[message.from.actor]
-    var stackedSize = actorActivations(message.from.actor).length
+    const stackedSize = actorActivations(message.from.actor).length
-    var x = actorRect.x + conf.width / 2 + (stackedSize - 1) * conf.activationWidth / 2
+    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) {
+const drawNote = function (elem, startx, verticalPos, msg, forceWidth) {
-  var rect = svgDraw.getNoteRect()
+  const rect = svgDraw.getNoteRect()
   rect.x = startx
   rect.y = verticalPos
   rect.width = forceWidth || conf.width
   rect.class = 'note'
 
-  var g = elem.append('g')
+  let g = elem.append('g')
-  var rectElem = svgDraw.drawRect(g, rect)
+  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) {
+const drawMessage = function (elem, startx, stopx, verticalPos, msg) {
-  var g = elem.append('g')
+  const g = elem.append('g')
-  var txtCenter = startx + (stopx - startx) / 2
+  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++) {
+  for (let i = 0; i < actorKeys.length; i++) {
-    var key = actorKeys[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()
+  const actors = parser.yy.getActors()
-  var activations = actorActivations(actor)
+  const activations = actorActivations(actor)
 
-  var left = activations.reduce(function (acc, activation) { return Math.min(acc, activation.startx) }, 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)
-  var right = activations.reduce(function (acc, activation) { return Math.max(acc, activation.stopx) }, 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
+  let startx
-  var stopx
+  let stopx
-  var forceWidth
+  let forceWidth
 
   // Fetch data from the parsing
-  var actors = parser.yy.getActors()
+  const actors = parser.yy.getActors()
-  var actorKeys = parser.yy.getActorKeys()
+  const actorKeys = parser.yy.getActorKeys()
-  var messages = parser.yy.getMessages()
+  const messages = parser.yy.getMessages()
-  var title = parser.yy.getTitle()
+  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)
+          const fromBounds = actorFlowVerticaBounds(msg.from)
-          var toBounds = actorFlowVerticaBounds(msg.to)
+          const toBounds = actorFlowVerticaBounds(msg.to)
-          var fromIdx = fromBounds[0] <= toBounds[0] ? 1 : 0
+          const fromIdx = fromBounds[0] <= toBounds[0] ? 1 : 0
-          var toIdx = fromBounds[0] < toBounds[0] ? 0 : 1
+          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))
 }
 

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(/<br\/?>/ig, ' ')
+  const nText = textData.text.replace(/<br\/?>/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)
+  const center = left + (conf.width / 2)
-  var g = elem.append('g')
+  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()
+  const rect = getNoteRect()
-  var g = bounds.anchored
+  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')
+  const g = elem.append('g')
-  var drawLoopLine = function (startx, starty, stopx, stopy) {
+  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')
+  const defs = elem.append('defs')
-  var marker = defs.append('marker')
+  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 <text> 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')
+    const s = g.append('switch')
-    var f = s.append('foreignObject')
+    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])
       }