#931 Aligning with code standard

This commit is contained in:
knsv
2019-09-12 12:58:04 -07:00
parent cf05a8d8fa
commit 34de31195f
5 changed files with 2415 additions and 2327 deletions

View File

@@ -1,33 +1,33 @@
import * as d3 from 'd3'
import { sanitizeUrl } from '@braintree/sanitize-url'
import { logger } from '../../logger'
import utils from '../../utils'
import { getConfig } from '../../config'
import * as d3 from 'd3';
import { sanitizeUrl } from '@braintree/sanitize-url';
import { logger } from '../../logger';
import utils from '../../utils';
import { getConfig } from '../../config';
const config = getConfig()
let vertices = {}
let edges = []
let classes = []
let subGraphs = []
let subGraphLookup = {}
let tooltips = {}
let subCount = 0
let direction
const config = getConfig();
let vertices = {};
let edges = [];
let classes = [];
let subGraphs = [];
let subGraphLookup = {};
let tooltips = {};
let subCount = 0;
let direction;
// Functions to be run after graph rendering
let funs = []
let funs = [];
const sanitize = text => {
let txt = text
let txt = text;
if (config.securityLevel !== 'loose') {
txt = txt.replace(/<br>/g, '#br#')
txt = txt.replace(/<br\S*?\/>/g, '#br#')
txt = txt.replace(/</g, '&lt;').replace(/>/g, '&gt;')
txt = txt.replace(/=/g, '&equals;')
txt = txt.replace(/#br#/g, '<br/>')
txt = txt.replace(/<br>/g, '#br#');
txt = txt.replace(/<br\S*?\/>/g, '#br#');
txt = txt.replace(/</g, '&lt;').replace(/>/g, '&gt;');
txt = txt.replace(/=/g, '&equals;');
txt = txt.replace(/#br#/g, '<br/>');
}
return txt
}
return txt;
};
/**
* Function called by parser when a node definition has been found
@@ -37,53 +37,53 @@ const sanitize = text => {
* @param style
* @param classes
*/
export const addVertex = function (_id, text, type, style, classes) {
let txt
let id = _id
export const addVertex = function(_id, text, type, style, classes) {
let txt;
let id = _id;
if (typeof id === 'undefined') {
return
return;
}
if (id.trim().length === 0) {
return
return;
}
if (id[0].match(/\d/)) id = 's' + id
if (id[0].match(/\d/)) id = 's' + id;
if (typeof vertices[id] === 'undefined') {
vertices[id] = { id: id, styles: [], classes: [] }
vertices[id] = { id: id, styles: [], classes: [] };
}
if (typeof text !== 'undefined') {
txt = sanitize(text.trim())
txt = sanitize(text.trim());
// strip quotes if string starts and exnds with a quote
if (txt[0] === '"' && txt[txt.length - 1] === '"') {
txt = txt.substring(1, txt.length - 1)
txt = txt.substring(1, txt.length - 1);
}
vertices[id].text = txt
vertices[id].text = txt;
} else {
if (!vertices[id].text) {
vertices[id].text = _id
vertices[id].text = _id;
}
}
if (typeof type !== 'undefined') {
vertices[id].type = type
vertices[id].type = type;
}
if (typeof style !== 'undefined') {
if (style !== null) {
style.forEach(function (s) {
vertices[id].styles.push(s)
})
style.forEach(function(s) {
vertices[id].styles.push(s);
});
}
}
if (typeof classes !== 'undefined') {
if (classes !== null) {
classes.forEach(function (s) {
vertices[id].classes.push(s)
})
classes.forEach(function(s) {
vertices[id].classes.push(s);
});
}
}
}
};
/**
* Function called by parser when a link/edge definition has been found
@@ -92,134 +92,138 @@ export const addVertex = function (_id, text, type, style, classes) {
* @param type
* @param linktext
*/
export const addLink = function (_start, _end, type, linktext) {
let start = _start
let end = _end
if (start[0].match(/\d/)) start = 's' + start
if (end[0].match(/\d/)) end = 's' + end
logger.info('Got edge...', start, end)
export const addLink = function(_start, _end, type, linktext) {
let start = _start;
let end = _end;
if (start[0].match(/\d/)) start = 's' + start;
if (end[0].match(/\d/)) end = 's' + end;
logger.info('Got edge...', start, end);
const edge = { start: start, end: end, type: undefined, text: '' }
linktext = type.text
const edge = { start: start, end: end, type: undefined, text: '' };
linktext = type.text;
if (typeof linktext !== 'undefined') {
edge.text = sanitize(linktext.trim())
edge.text = sanitize(linktext.trim());
// strip quotes if string starts and exnds with a quote
if (edge.text[0] === '"' && edge.text[edge.text.length - 1] === '"') {
edge.text = edge.text.substring(1, edge.text.length - 1)
edge.text = edge.text.substring(1, edge.text.length - 1);
}
}
if (typeof type !== 'undefined') {
edge.type = type.type
edge.stroke = type.stroke
edge.type = type.type;
edge.stroke = type.stroke;
}
edges.push(edge)
}
edges.push(edge);
};
/**
* Updates a link's line interpolation algorithm
* @param pos
* @param interpolate
*/
export const updateLinkInterpolate = function (positions, interp) {
positions.forEach(function (pos) {
export const updateLinkInterpolate = function(positions, interp) {
positions.forEach(function(pos) {
if (pos === 'default') {
edges.defaultInterpolate = interp
edges.defaultInterpolate = interp;
} else {
edges[pos].interpolate = interp
edges[pos].interpolate = interp;
}
})
}
});
};
/**
* Updates a link with a style
* @param pos
* @param style
*/
export const updateLink = function (positions, style) {
positions.forEach(function (pos) {
export const updateLink = function(positions, style) {
positions.forEach(function(pos) {
if (pos === 'default') {
edges.defaultStyle = style
edges.defaultStyle = style;
} else {
if (utils.isSubstringInArray('fill', style) === -1) {
style.push('fill:none')
style.push('fill:none');
}
edges[pos].style = style
edges[pos].style = style;
}
})
}
});
};
export const addClass = function (id, style) {
export const addClass = function(id, style) {
if (typeof classes[id] === 'undefined') {
classes[id] = { id: id, styles: [] }
classes[id] = { id: id, styles: [] };
}
if (typeof style !== 'undefined') {
if (style !== null) {
style.forEach(function (s) {
classes[id].styles.push(s)
})
style.forEach(function(s) {
classes[id].styles.push(s);
});
}
}
}
};
/**
* Called by parser when a graph definition is found, stores the direction of the chart.
* @param dir
*/
export const setDirection = function (dir) {
direction = dir
}
export const setDirection = function(dir) {
direction = dir;
};
/**
* Called by parser when a special node is found, e.g. a clickable element.
* @param ids Comma separated list of ids
* @param className Class to add
*/
export const setClass = function (ids, className) {
ids.split(',').forEach(function (_id) {
let id = _id
if (_id[0].match(/\d/)) id = 's' + id
export const setClass = function(ids, className) {
ids.split(',').forEach(function(_id) {
let id = _id;
if (_id[0].match(/\d/)) id = 's' + id;
if (typeof vertices[id] !== 'undefined') {
vertices[id].classes.push(className)
vertices[id].classes.push(className);
}
if (typeof subGraphLookup[id] !== 'undefined') {
subGraphLookup[id].classes.push(className)
subGraphLookup[id].classes.push(className);
}
})
}
});
};
const setTooltip = function (ids, tooltip) {
ids.split(',').forEach(function (id) {
const setTooltip = function(ids, tooltip) {
ids.split(',').forEach(function(id) {
if (typeof tooltip !== 'undefined') {
tooltips[id] = sanitize(tooltip)
tooltips[id] = sanitize(tooltip);
}
})
}
});
};
const setClickFun = function (_id, functionName) {
let id = _id
if (_id[0].match(/\d/)) id = 's' + id
const setClickFun = function(_id, functionName) {
let id = _id;
if (_id[0].match(/\d/)) id = 's' + id;
if (config.securityLevel !== 'loose') {
return
return;
}
if (typeof functionName === 'undefined') {
return
return;
}
if (typeof vertices[id] !== 'undefined') {
funs.push(function (element) {
const elem = document.querySelector(`[id="${id}"]`)
funs.push(function(element) {
const elem = document.querySelector(`[id="${id}"]`);
if (elem !== null) {
elem.addEventListener('click', function () {
window[functionName](id)
}, false)
elem.addEventListener(
'click',
function() {
window[functionName](id);
},
false
);
}
})
});
}
}
};
/**
* Called by parser when a link is found. Adds the URL to the vertex data.
@@ -227,24 +231,24 @@ const setClickFun = function (_id, functionName) {
* @param linkStr URL to create a link for
* @param tooltip Tooltip for the clickable element
*/
export const setLink = function (ids, linkStr, tooltip) {
ids.split(',').forEach(function (_id) {
let id = _id
if (_id[0].match(/\d/)) id = 's' + id
export const setLink = function(ids, linkStr, tooltip) {
ids.split(',').forEach(function(_id) {
let id = _id;
if (_id[0].match(/\d/)) id = 's' + id;
if (typeof vertices[id] !== 'undefined') {
if (config.securityLevel !== 'loose') {
vertices[id].link = sanitizeUrl(linkStr) // .replace(/javascript:.*/g, '')
vertices[id].link = sanitizeUrl(linkStr); // .replace(/javascript:.*/g, '')
} else {
vertices[id].link = linkStr
vertices[id].link = linkStr;
}
}
})
setTooltip(ids, tooltip)
setClass(ids, 'clickable')
}
export const getTooltip = function (id) {
return tooltips[id]
}
});
setTooltip(ids, tooltip);
setClass(ids, 'clickable');
};
export const getTooltip = function(id) {
return tooltips[id];
};
/**
* Called by parser when a click definition is found. Registers an event handler.
@@ -252,209 +256,219 @@ export const getTooltip = function (id) {
* @param functionName Function to be called on click
* @param tooltip Tooltip for the clickable element
*/
export const setClickEvent = function (ids, functionName, tooltip) {
ids.split(',').forEach(function (id) { setClickFun(id, functionName) })
setTooltip(ids, tooltip)
setClass(ids, 'clickable')
}
export const setClickEvent = function(ids, functionName, tooltip) {
ids.split(',').forEach(function(id) {
setClickFun(id, functionName);
});
setTooltip(ids, tooltip);
setClass(ids, 'clickable');
};
export const bindFunctions = function (element) {
funs.forEach(function (fun) {
fun(element)
})
}
export const getDirection = function () {
return direction
}
export const bindFunctions = function(element) {
funs.forEach(function(fun) {
fun(element);
});
};
export const getDirection = function() {
return direction;
};
/**
* Retrieval function for fetching the found nodes after parsing has completed.
* @returns {{}|*|vertices}
*/
export const getVertices = function () {
return vertices
}
export const getVertices = function() {
return vertices;
};
/**
* Retrieval function for fetching the found links after parsing has completed.
* @returns {{}|*|edges}
*/
export const getEdges = function () {
return edges
}
export const getEdges = function() {
return edges;
};
/**
* Retrieval function for fetching the found class definitions after parsing has completed.
* @returns {{}|*|classes}
*/
export const getClasses = function () {
return classes
}
export const getClasses = function() {
return classes;
};
const setupToolTips = function (element) {
let tooltipElem = d3.select('.mermaidTooltip')
const setupToolTips = function(element) {
let tooltipElem = d3.select('.mermaidTooltip');
if ((tooltipElem._groups || tooltipElem)[0][0] === null) {
tooltipElem = d3.select('body')
tooltipElem = d3
.select('body')
.append('div')
.attr('class', 'mermaidTooltip')
.style('opacity', 0)
.style('opacity', 0);
}
const svg = d3.select(element).select('svg')
const svg = d3.select(element).select('svg');
const nodes = svg.selectAll('g.node')
const nodes = svg.selectAll('g.node');
nodes
.on('mouseover', function () {
const el = d3.select(this)
const title = el.attr('title')
.on('mouseover', function() {
const el = d3.select(this);
const title = el.attr('title');
// Dont try to draw a tooltip if no data is provided
if (title === null) {
return
return;
}
const rect = this.getBoundingClientRect()
const rect = this.getBoundingClientRect();
tooltipElem.transition()
tooltipElem
.transition()
.duration(200)
.style('opacity', '.9')
tooltipElem.html(el.attr('title'))
.style('left', (rect.left + (rect.right - rect.left) / 2) + 'px')
.style('top', (rect.top - 14 + document.body.scrollTop) + 'px')
el.classed('hover', true)
.style('opacity', '.9');
tooltipElem
.html(el.attr('title'))
.style('left', rect.left + (rect.right - rect.left) / 2 + 'px')
.style('top', rect.top - 14 + document.body.scrollTop + 'px');
el.classed('hover', true);
})
.on('mouseout', function () {
tooltipElem.transition()
.on('mouseout', function() {
tooltipElem
.transition()
.duration(500)
.style('opacity', 0)
const el = d3.select(this)
el.classed('hover', false)
})
}
funs.push(setupToolTips)
.style('opacity', 0);
const el = d3.select(this);
el.classed('hover', false);
});
};
funs.push(setupToolTips);
/**
* Clears the internal graph db so that a new graph can be parsed.
*/
export const clear = function () {
vertices = {}
classes = {}
edges = []
funs = []
funs.push(setupToolTips)
subGraphs = []
subGraphLookup = {}
subCount = 0
tooltips = []
}
export const clear = function() {
vertices = {};
classes = {};
edges = [];
funs = [];
funs.push(setupToolTips);
subGraphs = [];
subGraphLookup = {};
subCount = 0;
tooltips = [];
};
/**
*
* @returns {string}
*/
export const defaultStyle = function () {
return 'fill:#ffa;stroke: #f66; stroke-width: 3px; stroke-dasharray: 5, 5;fill:#ffa;stroke: #666;'
}
export const defaultStyle = function() {
return 'fill:#ffa;stroke: #f66; stroke-width: 3px; stroke-dasharray: 5, 5;fill:#ffa;stroke: #666;';
};
/**
* Clears the internal graph db so that a new graph can be parsed.
*/
export const addSubGraph = function (_id, list, _title) {
let id = _id
let title = _title
export const addSubGraph = function(_id, list, _title) {
let id = _id;
let title = _title;
if (_id === _title && _title.match(/\s/)) {
id = undefined
id = undefined;
}
function uniq (a) {
const prims = { 'boolean': {}, 'number': {}, 'string': {} }
const objs = []
function uniq(a) {
const prims = { boolean: {}, number: {}, string: {} };
const objs = [];
return a.filter(function (item) {
const type = typeof item
return a.filter(function(item) {
const type = typeof item;
if (item.trim() === '') {
return false
return false;
}
if (type in prims) { return prims[type].hasOwnProperty(item) ? false : (prims[type][item] = true) } else { return objs.indexOf(item) >= 0 ? false : objs.push(item) }
})
if (type in prims) {
return prims[type].hasOwnProperty(item) ? false : (prims[type][item] = true);
} else {
return objs.indexOf(item) >= 0 ? false : objs.push(item);
}
});
}
let nodeList = []
let nodeList = [];
nodeList = uniq(nodeList.concat.apply(nodeList, list))
nodeList = uniq(nodeList.concat.apply(nodeList, list));
for (let i = 0; i < nodeList.length; i++) {
if (nodeList[i][0].match(/\d/)) nodeList[i] = 's' + nodeList[i]
if (nodeList[i][0].match(/\d/)) nodeList[i] = 's' + nodeList[i];
}
id = id || ('subGraph' + subCount)
if (id[0].match(/\d/)) id = 's' + id
title = title || ''
title = sanitize(title)
subCount = subCount + 1
const subGraph = { id: id, nodes: nodeList, title: title.trim(), classes: [] }
subGraphs.push(subGraph)
subGraphLookup[id] = subGraph
return id
}
id = id || 'subGraph' + subCount;
if (id[0].match(/\d/)) id = 's' + id;
title = title || '';
title = sanitize(title);
subCount = subCount + 1;
const subGraph = { id: id, nodes: nodeList, title: title.trim(), classes: [] };
subGraphs.push(subGraph);
subGraphLookup[id] = subGraph;
return id;
};
const getPosForId = function (id) {
const getPosForId = function(id) {
for (let i = 0; i < subGraphs.length; i++) {
if (subGraphs[i].id === id) {
return i
return i;
}
}
return -1
}
let secCount = -1
const posCrossRef = []
const indexNodes2 = function (id, pos) {
const nodes = subGraphs[pos].nodes
secCount = secCount + 1
return -1;
};
let secCount = -1;
const posCrossRef = [];
const indexNodes2 = function(id, pos) {
const nodes = subGraphs[pos].nodes;
secCount = secCount + 1;
if (secCount > 2000) {
return
return;
}
posCrossRef[secCount] = pos
posCrossRef[secCount] = pos;
// Check if match
if (subGraphs[pos].id === id) {
return {
result: true,
count: 0
}
};
}
let count = 0
let posCount = 1
let count = 0;
let posCount = 1;
while (count < nodes.length) {
const childPos = getPosForId(nodes[count])
const childPos = getPosForId(nodes[count]);
// Ignore regular nodes (pos will be -1)
if (childPos >= 0) {
const res = indexNodes2(id, childPos)
const res = indexNodes2(id, childPos);
if (res.result) {
return {
result: true,
count: posCount + res.count
}
};
} else {
posCount = posCount + res.count
posCount = posCount + res.count;
}
}
count = count + 1
count = count + 1;
}
return {
result: false,
count: posCount
}
}
};
};
export const getDepthFirstPos = function (pos) {
return posCrossRef[pos]
}
export const indexNodes = function () {
secCount = -1
export const getDepthFirstPos = function(pos) {
return posCrossRef[pos];
};
export const indexNodes = function() {
secCount = -1;
if (subGraphs.length > 0) {
indexNodes2('none', subGraphs.length - 1, 0)
indexNodes2('none', subGraphs.length - 1, 0);
}
}
};
export const getSubGraphs = function () {
return subGraphs
}
export const getSubGraphs = function() {
return subGraphs;
};
export default {
addVertex,
@@ -478,4 +492,4 @@ export default {
getDepthFirstPos,
indexNodes,
getSubGraphs
}
};