|
|
@ -126,7 +126,20 @@ var gitGraph = function (canvas, rawGraphList, config) { |
|
|
|
!(row[i - 2] && row[i] === "_" && row[i - 2] === "|")) {} |
|
|
|
!(row[i - 2] && row[i] === "_" && row[i - 2] === "|")) {} |
|
|
|
|
|
|
|
|
|
|
|
return i; |
|
|
|
return i; |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var findLineBreak = function (row) { |
|
|
|
|
|
|
|
if (!row) { |
|
|
|
|
|
|
|
return -1 |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var i = row.length; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
while (i-- && |
|
|
|
|
|
|
|
!(row[i - 1] && row[i - 2] && row[i] === " " && row[i - 1] === "|" && row[i - 2] === "_")) {} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return i; |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
var genNewFlow = function () { |
|
|
|
var genNewFlow = function () { |
|
|
|
var newId; |
|
|
|
var newId; |
|
|
@ -138,21 +151,21 @@ var gitGraph = function (canvas, rawGraphList, config) { |
|
|
|
return {id:newId, color:"#" + newId}; |
|
|
|
return {id:newId, color:"#" + newId}; |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
//draw method
|
|
|
|
//Draw methods
|
|
|
|
var drawLineRight = function (x, y, color) { |
|
|
|
var drawLine = function (moveX, moveY, lineX, lineY, color) { |
|
|
|
ctx.strokeStyle = color; |
|
|
|
ctx.strokeStyle = color; |
|
|
|
ctx.beginPath(); |
|
|
|
ctx.beginPath(); |
|
|
|
ctx.moveTo(x, y + config.unitSize / 2); |
|
|
|
ctx.moveTo(moveX, moveY); |
|
|
|
ctx.lineTo(x + config.unitSize, y + config.unitSize / 2); |
|
|
|
ctx.lineTo(lineX, lineY); |
|
|
|
ctx.stroke(); |
|
|
|
ctx.stroke(); |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var drawLineRight = function (x, y, color) { |
|
|
|
|
|
|
|
drawLine(x, y + config.unitSize / 2, x + config.unitSize, y + config.unitSize / 2, color); |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
var drawLineUp = function (x, y, color) { |
|
|
|
var drawLineUp = function (x, y, color) { |
|
|
|
ctx.strokeStyle = color; |
|
|
|
drawLine(x, y + config.unitSize / 2, x, y - config.unitSize / 2, color); |
|
|
|
ctx.beginPath(); |
|
|
|
|
|
|
|
ctx.moveTo(x, y + config.unitSize / 2); |
|
|
|
|
|
|
|
ctx.lineTo(x, y - config.unitSize / 2); |
|
|
|
|
|
|
|
ctx.stroke(); |
|
|
|
|
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
var drawNode = function (x, y, color) { |
|
|
|
var drawNode = function (x, y, color) { |
|
|
@ -166,37 +179,28 @@ var gitGraph = function (canvas, rawGraphList, config) { |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
var drawLineIn = function (x, y, color) { |
|
|
|
var drawLineIn = function (x, y, color) { |
|
|
|
ctx.strokeStyle = color; |
|
|
|
drawLine(x + config.unitSize, y + config.unitSize / 2, x, y - config.unitSize / 2, color); |
|
|
|
|
|
|
|
|
|
|
|
ctx.beginPath(); |
|
|
|
|
|
|
|
ctx.moveTo(x + config.unitSize, y + config.unitSize / 2); |
|
|
|
|
|
|
|
ctx.lineTo(x, y - config.unitSize / 2); |
|
|
|
|
|
|
|
ctx.stroke(); |
|
|
|
|
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
var drawLineOut = function (x, y, color) { |
|
|
|
var drawLineOut = function (x, y, color) { |
|
|
|
ctx.strokeStyle = color; |
|
|
|
drawLine(x, y + config.unitSize / 2, x + config.unitSize, y - config.unitSize / 2, color); |
|
|
|
ctx.beginPath(); |
|
|
|
|
|
|
|
ctx.moveTo(x, y + config.unitSize / 2); |
|
|
|
|
|
|
|
ctx.lineTo(x + config.unitSize, y - config.unitSize / 2); |
|
|
|
|
|
|
|
ctx.stroke(); |
|
|
|
|
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
var draw = function (graphList) { |
|
|
|
var draw = function (graphList) { |
|
|
|
var colomn, colomnIndex, prevColomn, condenseIndex; |
|
|
|
var colomn, colomnIndex, prevColomn, condenseIndex, breakIndex = -1; |
|
|
|
var x, y; |
|
|
|
var x, y; |
|
|
|
var color; |
|
|
|
var color; |
|
|
|
var nodePos, outPos; |
|
|
|
var nodePos; |
|
|
|
var tempFlow; |
|
|
|
var tempFlow; |
|
|
|
var prevRowLength = 0; |
|
|
|
var prevRowLength = 0; |
|
|
|
var flowSwapPos = -1; |
|
|
|
var flowSwapPos = -1; |
|
|
|
var lastLinePos; |
|
|
|
var lastLinePos; |
|
|
|
var i, k, l; |
|
|
|
var i, l; |
|
|
|
var condenseCurrentLength, condensePrevLength = 0, condenseNextLength = 0; |
|
|
|
var condenseCurrentLength, condensePrevLength = 0, condenseNextLength = 0; |
|
|
|
|
|
|
|
|
|
|
|
var inlineIntersect = false; |
|
|
|
var inlineIntersect = false; |
|
|
|
|
|
|
|
|
|
|
|
//initiate for first row
|
|
|
|
//initiate color array for first row
|
|
|
|
for (i = 0, l = graphList[0].length; i < l; i++) { |
|
|
|
for (i = 0, l = graphList[0].length; i < l; i++) { |
|
|
|
if (graphList[0][i] !== "_" && graphList[0][i] !== " ") { |
|
|
|
if (graphList[0][i] !== "_" && graphList[0][i] !== " ") { |
|
|
|
flows.push(genNewFlow()); |
|
|
|
flows.push(genNewFlow()); |
|
|
@ -275,6 +279,7 @@ var gitGraph = function (canvas, rawGraphList, config) { |
|
|
|
colomnIndex = 0; //reset index
|
|
|
|
colomnIndex = 0; //reset index
|
|
|
|
condenseIndex = 0; |
|
|
|
condenseIndex = 0; |
|
|
|
condensePrevLength = 0; |
|
|
|
condensePrevLength = 0; |
|
|
|
|
|
|
|
breakIndex = -1; //reset break index
|
|
|
|
while (colomnIndex < currentRow.length) { |
|
|
|
while (colomnIndex < currentRow.length) { |
|
|
|
colomn = currentRow[colomnIndex]; |
|
|
|
colomn = currentRow[colomnIndex]; |
|
|
|
|
|
|
|
|
|
|
@ -282,6 +287,18 @@ var gitGraph = function (canvas, rawGraphList, config) { |
|
|
|
++condensePrevLength; |
|
|
|
++condensePrevLength; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//check and fix line break in next row
|
|
|
|
|
|
|
|
if (colomn === "/" && currentRow[colomnIndex - 1] && currentRow[colomnIndex - 1] === "|") { |
|
|
|
|
|
|
|
if ((breakIndex = findLineBreak(nextRow)) !== -1) { |
|
|
|
|
|
|
|
nextRow.splice(breakIndex, 1); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
//if line break found replace all '/' with '|' after breakIndex in previous row
|
|
|
|
|
|
|
|
if (breakIndex !== - 1 && colomn === "/" && colomnIndex > breakIndex) { |
|
|
|
|
|
|
|
currentRow[colomnIndex] = "|"; |
|
|
|
|
|
|
|
colomn = "|"; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
if (colomn === " " &&
|
|
|
|
if (colomn === " " &&
|
|
|
|
currentRow[colomnIndex + 1] && |
|
|
|
currentRow[colomnIndex + 1] && |
|
|
|
currentRow[colomnIndex + 1] === "_" && |
|
|
|
currentRow[colomnIndex + 1] === "_" && |
|
|
@ -294,7 +311,7 @@ var gitGraph = function (canvas, rawGraphList, config) { |
|
|
|
colomn = "/"; |
|
|
|
colomn = "/"; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
//create new flow only when no intersetc happened
|
|
|
|
//create new flow only when no intersect happened
|
|
|
|
if (flowSwapPos === -1 && |
|
|
|
if (flowSwapPos === -1 && |
|
|
|
colomn === "/" && |
|
|
|
colomn === "/" && |
|
|
|
currentRow[colomnIndex - 1] &&
|
|
|
|
currentRow[colomnIndex - 1] &&
|
|
|
@ -415,4 +432,4 @@ var gitGraph = function (canvas, rawGraphList, config) { |
|
|
|
init(); |
|
|
|
init(); |
|
|
|
draw(graphList); |
|
|
|
draw(graphList); |
|
|
|
}; |
|
|
|
}; |
|
|
|
// @end-license
|
|
|
|
// @end-license
|