Skip to content

Fix line break bug, aka 'Cannot read property 'color' of undefined' (#4) #5

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jun 1, 2018
Merged

Fix line break bug, aka 'Cannot read property 'color' of undefined' (#4) #5

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
7b984dd
Refactoring
axifive May 30, 2018
521a01c
Fixed line break bug #4
axifive May 31, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
69 changes: 43 additions & 26 deletions gitgraph.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,20 @@ var gitGraph = function (canvas, rawGraphList, config) {
!(row[i - 2] && row[i] === "_" && row[i - 2] === "|")) {}

return i;
}
};

var findLineBreak = function (row) {
if (!row) {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think there should also need to have check || row.length === 0 just to be sure not to have infinite loop below in unexpected corner case

Copy link
Contributor Author

@axifive axifive May 31, 2018 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

postfix decrement in the while loop returns 0 what's stops it, and row.length can't be negative

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 newId;
Expand All @@ -137,21 +150,21 @@ var gitGraph = function (canvas, rawGraphList, config) {
return {id:newId, color:"#" + newId};
};

//draw method
var drawLineRight = function (x, y, color) {
//Draw methods
var drawLine = function (moveX, moveY, lineX, lineY, color) {
ctx.strokeStyle = color;
ctx.beginPath();
ctx.moveTo(x, y + config.unitSize / 2);
ctx.lineTo(x + config.unitSize, y + config.unitSize / 2);
ctx.moveTo(moveX, moveY);
ctx.lineTo(lineX, lineY);
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) {
ctx.strokeStyle = color;
ctx.beginPath();
ctx.moveTo(x, y + config.unitSize / 2);
ctx.lineTo(x, y - config.unitSize / 2);
ctx.stroke();
drawLine(x, y + config.unitSize / 2, x, y - config.unitSize / 2, color);
};

var drawNode = function (x, y, color) {
Expand All @@ -165,37 +178,28 @@ var gitGraph = function (canvas, rawGraphList, config) {
};

var drawLineIn = function (x, y, color) {
ctx.strokeStyle = color;

ctx.beginPath();
ctx.moveTo(x + config.unitSize, y + config.unitSize / 2);
ctx.lineTo(x, y - config.unitSize / 2);
ctx.stroke();
drawLine(x + config.unitSize, y + config.unitSize / 2, x, y - config.unitSize / 2, color);
};

var drawLineOut = function (x, y, color) {
ctx.strokeStyle = color;
ctx.beginPath();
ctx.moveTo(x, y + config.unitSize / 2);
ctx.lineTo(x + config.unitSize, y - config.unitSize / 2);
ctx.stroke();
drawLine(x, y + config.unitSize / 2, x + config.unitSize, y - config.unitSize / 2, color);
};

var draw = function (graphList) {
var colomn, colomnIndex, prevColomn, condenseIndex;
var colomn, colomnIndex, prevColomn, condenseIndex, breakIndex = -1;
var x, y;
var color;
var nodePos, outPos;
var nodePos;
var tempFlow;
var prevRowLength = 0;
var flowSwapPos = -1;
var lastLinePos;
var i, k, l;
var i, l;
var condenseCurrentLength, condensePrevLength = 0, condenseNextLength = 0;

var inlineIntersect = false;

//initiate for first row
//initiate color array for first row
for (i = 0, l = graphList[0].length; i < l; i++) {
if (graphList[0][i] !== "_" && graphList[0][i] !== " ") {
flows.push(genNewFlow());
Expand Down Expand Up @@ -274,13 +278,26 @@ var gitGraph = function (canvas, rawGraphList, config) {
colomnIndex = 0; //reset index
condenseIndex = 0;
condensePrevLength = 0;
breakIndex = -1; //reset break index
while (colomnIndex < currentRow.length) {
colomn = currentRow[colomnIndex];

if (colomn !== " " && colomn !== "_") {
++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 === " " &&
currentRow[colomnIndex + 1] &&
currentRow[colomnIndex + 1] === "_" &&
Expand All @@ -293,7 +310,7 @@ var gitGraph = function (canvas, rawGraphList, config) {
colomn = "/";
}

//create new flow only when no intersetc happened
//create new flow only when no intersect happened
if (flowSwapPos === -1 &&
colomn === "/" &&
currentRow[colomnIndex - 1] &&
Expand Down