Commit d9627de2 authored by Phil Hughes's avatar Phil Hughes

Merge branch 'branch_graph' into 'master'

Remove var from branch_graph.js

Closes #36276

See merge request gitlab-org/gitlab!20113
parents 94c8f345 c6e5579a
/* eslint-disable func-names, no-var, one-var, consistent-return, camelcase */ /* eslint-disable func-names, consistent-return, camelcase */
import $ from 'jquery'; import $ from 'jquery';
import { __ } from '../locale'; import { __ } from '../locale';
...@@ -40,18 +40,20 @@ export default class BranchGraph { ...@@ -40,18 +40,20 @@ export default class BranchGraph {
} }
prepareData(days, commits) { prepareData(days, commits) {
var c, ch, cw, j, len, ref; let c = 0;
let j = 0;
let len = 0;
this.days = days; this.days = days;
this.commits = commits; this.commits = commits;
this.collectParents(); this.collectParents();
this.graphHeight = $(this.element).height(); this.graphHeight = $(this.element).height();
this.graphWidth = $(this.element).width(); this.graphWidth = $(this.element).width();
ch = Math.max(this.graphHeight, this.offsetY + this.unitTime * this.mtime + 150); const ch = Math.max(this.graphHeight, this.offsetY + this.unitTime * this.mtime + 150);
cw = Math.max(this.graphWidth, this.offsetX + this.unitSpace * this.mspace + 300); const cw = Math.max(this.graphWidth, this.offsetX + this.unitSpace * this.mspace + 300);
this.r = Raphael(this.element.get(0), cw, ch); this.r = Raphael(this.element.get(0), cw, ch);
this.top = this.r.set(); this.top = this.r.set();
this.barHeight = Math.max(this.graphHeight, this.unitTime * this.days.length + 320); this.barHeight = Math.max(this.graphHeight, this.unitTime * this.days.length + 320);
ref = this.commits; const ref = this.commits;
for (j = 0, len = ref.length; j < len; j += 1) { for (j = 0, len = ref.length; j < len; j += 1) {
c = ref[j]; c = ref[j];
if (c.id in this.parents) { if (c.id in this.parents) {
...@@ -64,18 +66,20 @@ export default class BranchGraph { ...@@ -64,18 +66,20 @@ export default class BranchGraph {
} }
collectParents() { collectParents() {
var c, j, len, p, ref, results; let j = 0;
var l, len1, ref1, results1; let l = 0;
ref = this.commits; let len = 0;
results = []; let len1 = 0;
const ref = this.commits;
const results = [];
for (j = 0, len = ref.length; j < len; j += 1) { for (j = 0, len = ref.length; j < len; j += 1) {
c = ref[j]; const c = ref[j];
this.mtime = Math.max(this.mtime, c.time); this.mtime = Math.max(this.mtime, c.time);
this.mspace = Math.max(this.mspace, c.space); this.mspace = Math.max(this.mspace, c.space);
ref1 = c.parents; const ref1 = c.parents;
results1 = []; const results1 = [];
for (l = 0, len1 = ref1.length; l < len1; l += 1) { for (l = 0, len1 = ref1.length; l < len1; l += 1) {
p = ref1[l]; const p = ref1[l];
this.parents[p[0]] = true; this.parents[p[0]] = true;
results1.push((this.mspace = Math.max(this.mspace, p[1]))); results1.push((this.mspace = Math.max(this.mspace, p[1])));
} }
...@@ -85,9 +89,8 @@ export default class BranchGraph { ...@@ -85,9 +89,8 @@ export default class BranchGraph {
} }
collectColors() { collectColors() {
var k, results; let k = 0;
k = 0; const results = [];
results = [];
while (k < this.mspace) { while (k < this.mspace) {
this.colors.push(Raphael.getColor(0.8)); this.colors.push(Raphael.getColor(0.8));
// Skipping a few colors in the spectrum to get more contrast between colors // Skipping a few colors in the spectrum to get more contrast between colors
...@@ -99,20 +102,21 @@ export default class BranchGraph { ...@@ -99,20 +102,21 @@ export default class BranchGraph {
} }
buildGraph() { buildGraph() {
var cuday, cumonth, day, len, mm, ref; let mm = 0;
let len = 0;
let cuday = 0;
let cumonth = '';
const { r } = this; const { r } = this;
cuday = 0;
cumonth = '';
r.rect(0, 0, 40, this.barHeight).attr({ r.rect(0, 0, 40, this.barHeight).attr({
fill: '#222', fill: '#222',
}); });
r.rect(40, 0, 30, this.barHeight).attr({ r.rect(40, 0, 30, this.barHeight).attr({
fill: '#444', fill: '#444',
}); });
ref = this.days; const ref = this.days;
for (mm = 0, len = ref.length; mm < len; mm += 1) { for (mm = 0, len = ref.length; mm < len; mm += 1) {
day = ref[mm]; const day = ref[mm];
if (cuday !== day[0] || cumonth !== day[1]) { if (cuday !== day[0] || cumonth !== day[1]) {
// Dates // Dates
r.text(55, this.offsetY + this.unitTime * mm, day[0]).attr({ r.text(55, this.offsetY + this.unitTime * mm, day[0]).attr({
...@@ -137,26 +141,25 @@ export default class BranchGraph { ...@@ -137,26 +141,25 @@ export default class BranchGraph {
} }
renderPartialGraph() { renderPartialGraph() {
var commit, end, i, isGraphEdge, start, x, y; const isGraphEdge = true;
start = Math.floor((this.element.scrollTop() - this.offsetY) / this.unitTime) - 10; let i = 0;
let start = Math.floor((this.element.scrollTop() - this.offsetY) / this.unitTime) - 10;
if (start < 0) { if (start < 0) {
isGraphEdge = true;
start = 0; start = 0;
} }
end = start + 40; let end = start + 40;
if (this.commits.length < end) { if (this.commits.length < end) {
isGraphEdge = true;
end = this.commits.length; end = this.commits.length;
} }
if (this.prev_start === -1 || Math.abs(this.prev_start - start) > 10 || isGraphEdge) { if (this.prev_start === -1 || Math.abs(this.prev_start - start) > 10 || isGraphEdge) {
i = start; i = start;
this.prev_start = start; this.prev_start = start;
while (i < end) { while (i < end) {
commit = this.commits[i]; const commit = this.commits[i];
i += 1; i += 1;
if (commit.hasDrawn !== true) { if (commit.hasDrawn !== true) {
x = this.offsetX + this.unitSpace * (this.mspace - commit.space); const x = this.offsetX + this.unitSpace * (this.mspace - commit.space);
y = this.offsetY + this.unitTime * commit.time; const y = this.offsetY + this.unitTime * commit.time;
this.drawDot(x, y, commit); this.drawDot(x, y, commit);
this.drawLines(x, y, commit); this.drawLines(x, y, commit);
this.appendLabel(x, y, commit); this.appendLabel(x, y, commit);
...@@ -203,27 +206,25 @@ export default class BranchGraph { ...@@ -203,27 +206,25 @@ export default class BranchGraph {
} }
appendLabel(x, y, commit) { appendLabel(x, y, commit) {
var label, rect, shortrefs, text, textbox;
if (!commit.refs) { if (!commit.refs) {
return; return;
} }
const { r } = this; const { r } = this;
shortrefs = commit.refs; let shortrefs = commit.refs;
// Truncate if longer than 15 chars // Truncate if longer than 15 chars
if (shortrefs.length > 17) { if (shortrefs.length > 17) {
shortrefs = `${shortrefs.substr(0, 15)}…`; shortrefs = `${shortrefs.substr(0, 15)}…`;
} }
text = r.text(x + 4, y, shortrefs).attr({ const text = r.text(x + 4, y, shortrefs).attr({
'text-anchor': 'start', 'text-anchor': 'start',
font: '10px Monaco, monospace', font: '10px Monaco, monospace',
fill: '#FFF', fill: '#FFF',
title: commit.refs, title: commit.refs,
}); });
textbox = text.getBBox(); const textbox = text.getBBox();
// Create rectangle based on the size of the textbox // Create rectangle based on the size of the textbox
rect = r.rect(x, y - 7, textbox.width + 5, textbox.height + 5, 4).attr({ const rect = r.rect(x, y - 7, textbox.width + 5, textbox.height + 5, 4).attr({
fill: '#000', fill: '#000',
'fill-opacity': 0.5, 'fill-opacity': 0.5,
stroke: 'none', stroke: 'none',
...@@ -234,7 +235,7 @@ export default class BranchGraph { ...@@ -234,7 +235,7 @@ export default class BranchGraph {
'fill-opacity': 0.5, 'fill-opacity': 0.5,
stroke: 'none', stroke: 'none',
}); });
label = r.set(rect, text); const label = r.set(rect, text);
label.transform(['t', -rect.getBBox().width - 15, 0]); label.transform(['t', -rect.getBBox().width - 15, 0]);
// Set text to front // Set text to front
return text.toFront(); return text.toFront();
...@@ -286,17 +287,21 @@ export default class BranchGraph { ...@@ -286,17 +287,21 @@ export default class BranchGraph {
} }
drawLines(x, y, commit) { drawLines(x, y, commit) {
var arrow, color, i, len, offset, parent, parentCommit, parentX1, parentX2, parentY, route; let i = 0;
let len = 0;
let arrow = '';
let offset = [];
let color = [];
const { r } = this; const { r } = this;
const ref = commit.parents; const ref = commit.parents;
const results = []; const results = [];
for (i = 0, len = ref.length; i < len; i += 1) { for (i = 0, len = ref.length; i < len; i += 1) {
parent = ref[i]; const parent = ref[i];
parentCommit = this.preparedCommits[parent[0]]; const parentCommit = this.preparedCommits[parent[0]];
parentY = this.offsetY + this.unitTime * parentCommit.time; const parentY = this.offsetY + this.unitTime * parentCommit.time;
parentX1 = this.offsetX + this.unitSpace * (this.mspace - parentCommit.space); const parentX1 = this.offsetX + this.unitSpace * (this.mspace - parentCommit.space);
parentX2 = this.offsetX + this.unitSpace * (this.mspace - parent[1]); const parentX2 = this.offsetX + this.unitSpace * (this.mspace - parent[1]);
// Set line color // Set line color
if (parentCommit.space <= commit.space) { if (parentCommit.space <= commit.space) {
color = this.colors[commit.space]; color = this.colors[commit.space];
...@@ -315,7 +320,7 @@ export default class BranchGraph { ...@@ -315,7 +320,7 @@ export default class BranchGraph {
arrow = 'l-5,0,2,4,3,-4,-4,2'; arrow = 'l-5,0,2,4,3,-4,-4,2';
} }
// Start point // Start point
route = ['M', x + offset[0], y + offset[1]]; const route = ['M', x + offset[0], y + offset[1]];
// Add arrow if not first parent // Add arrow if not first parent
if (i > 0) { if (i > 0) {
route.push(arrow); route.push(arrow);
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment