opendev/gerrit
Code Issues Proposed changes

ES6ify /gr-diff-builder/*

Browse Source 
Bug: Issue 6179
Change-Id: I9d72fb89a3c3ad916c9097bdf6e5fb31a1dd4cf0
This commit is contained in:
Kasper Nilsson
2017-05-16 13:45:17 -07:00
parent 72bd42419d
commit 3a2f287d71
6 changed files with 495 additions and 479 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-image.js
View File

@@ -17,7 +17,7 @@
// Prevent redefinition.
if (window.GrDiffBuilderImage) { return; }
var IMAGE_MIME_PATTERN = /^image\/(bmp|gif|jpeg|jpg|png|tiff|webp)$/;
const IMAGE_MIME_PATTERN = /^image\/(bmp|gif|jpeg|jpg|png|tiff|webp)$/;
function GrDiffBuilderImage(diff, comments, prefs, outputEl, baseImage,
revisionImage) {
@@ -31,7 +31,7 @@
GrDiffBuilderImage.prototype.constructor = GrDiffBuilderImage;
GrDiffBuilderImage.prototype.renderDiffImages = function() {
var section = this._createElement('tbody', 'image-diff');
const section = this._createElement('tbody', 'image-diff');
this._emitImagePair(section);
this._emitImageLabels(section);
@@ -40,7 +40,7 @@
};
GrDiffBuilderImage.prototype._emitImagePair = function(section) {
var tr = this._createElement('tr');
const tr = this._createElement('tr');
tr.appendChild(this._createElement('td'));
tr.appendChild(this._createImageCell(this._baseImage, 'left', section));
@@ -52,18 +52,18 @@
section.appendChild(tr);
};
GrDiffBuilderImage.prototype._createImageCell =
function(image, className, section) {
var td = this._createElement('td', className);
GrDiffBuilderImage.prototype._createImageCell = function(image, className,
section) {
const td = this._createElement('td', className);
if (image && IMAGE_MIME_PATTERN.test(image.type)) {
var imageEl = this._createElement('img');
const imageEl = this._createElement('img');
imageEl.onload = function() {
image._height = imageEl.naturalHeight;
image._width = imageEl.naturalWidth;
this._updateImageLabel(section, className, image);
}.bind(this);
imageEl.src = 'data:' + image.type + ';base64, ' + image.body;
imageEl.addEventListener('error', function() {
imageEl.addEventListener('error', () => {
imageEl.remove();
td.textContent = '[Image failed to load]';
});
@@ -72,9 +72,9 @@
return td;
};
GrDiffBuilderImage.prototype._updateImageLabel =
function(section, className, image) {
var label = Polymer.dom(section)
GrDiffBuilderImage.prototype._updateImageLabel = function(section, className,
image) {
const label = Polymer.dom(section)
.querySelector('.' + className + ' span.label');
this._setLabelText(label, image);
};
@@ -84,9 +84,9 @@
};
GrDiffBuilderImage.prototype._emitImageLabels = function(section) {
var tr = this._createElement('tr');
const tr = this._createElement('tr');
var addNamesInLabel = false;
let addNamesInLabel = false;
if (this._baseImage && this._revisionImage &&
this._baseImage._name !== this._revisionImage._name) {
@@ -94,10 +94,10 @@
}
tr.appendChild(this._createElement('td'));
var td = this._createElement('td', 'left');
var label = this._createElement('label');
var nameSpan;
var labelSpan = this._createElement('span', 'label');
let td = this._createElement('td', 'left');
let label = this._createElement('label');
let nameSpan;
let labelSpan = this._createElement('span', 'label');
if (addNamesInLabel) {
nameSpan = this._createElement('span', 'name');
@@ -135,7 +135,7 @@
GrDiffBuilderImage.prototype._getImageLabel = function(image) {
if (image) {
var type = image.type || image._expectedType;
const type = image.type || image._expectedType;
if (image._width && image._height) {
return image._width + '⨉' + image._height + ' ' + type;
} else {

24
polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-side-by-side.js
View File

@@ -24,13 +24,13 @@
GrDiffBuilderSideBySide.prototype.constructor = GrDiffBuilderSideBySide;
GrDiffBuilderSideBySide.prototype.buildSectionElement = function(group) {
var sectionEl = this._createElement('tbody', 'section');
const sectionEl = this._createElement('tbody', 'section');
sectionEl.classList.add(group.type);
if (this._isTotal(group)) {
sectionEl.classList.add('total');
}
var pairs = group.getSideBySidePairs();
for (var i = 0; i < pairs.length; i++) {
const pairs = group.getSideBySidePairs();
for (let i = 0; i < pairs.length; i++) {
sectionEl.appendChild(this._createRow(sectionEl, pairs[i].left,
pairs[i].right));
}
@@ -38,11 +38,11 @@
};
GrDiffBuilderSideBySide.prototype.addColumns = function(outputEl, fontSize) {
var width = fontSize * 4;
var colgroup = document.createElement('colgroup');
const width = fontSize * 4;
const colgroup = document.createElement('colgroup');
// Add left-side line number.
var col = document.createElement('col');
let col = document.createElement('col');
col.setAttribute('width', width);
colgroup.appendChild(col);
@@ -62,7 +62,7 @@
GrDiffBuilderSideBySide.prototype._createRow = function(section, leftLine,
rightLine) {
var row = this._createElement('tr');
const row = this._createElement('tr');
row.classList.add('diff-row', 'side-by-side');
row.setAttribute('left-type', leftLine.type);
row.setAttribute('right-type', rightLine.type);
@@ -76,15 +76,15 @@
GrDiffBuilderSideBySide.prototype._appendPair = function(section, row, line,
lineNumber, side) {
var lineEl = this._createLineEl(line, lineNumber, line.type, side);
const lineEl = this._createLineEl(line, lineNumber, line.type, side);
lineEl.classList.add(side);
row.appendChild(lineEl);
var action = this._createContextControl(section, line);
const action = this._createContextControl(section, line);
if (action) {
row.appendChild(action);
} else {
var textEl = this._createTextEl(line, side);
var threadGroupEl = this._commentThreadGroupForLine(line, side);
const textEl = this._createTextEl(line, side);
const threadGroupEl = this._commentThreadGroupForLine(line, side);
if (threadGroupEl) {
textEl.appendChild(threadGroupEl);
}
@@ -94,7 +94,7 @@
GrDiffBuilderSideBySide.prototype._getNextContentOnSide = function(
content, side) {
var tr = content.parentElement.parentElement;
let tr = content.parentElement.parentElement;
while (tr = tr.nextSibling) {
content = tr.querySelector(
'td.content .contentText[data-side="' + side + '"]');

22
polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-unified.js
View File

@@ -24,24 +24,24 @@
GrDiffBuilderUnified.prototype.constructor = GrDiffBuilderUnified;
GrDiffBuilderUnified.prototype.buildSectionElement = function(group) {
var sectionEl = this._createElement('tbody', 'section');
const sectionEl = this._createElement('tbody', 'section');
sectionEl.classList.add(group.type);
if (this._isTotal(group)) {
sectionEl.classList.add('total');
}
for (var i = 0; i < group.lines.length; ++i) {
for (let i = 0; i < group.lines.length; ++i) {
sectionEl.appendChild(this._createRow(sectionEl, group.lines[i]));
}
return sectionEl;
};
GrDiffBuilderUnified.prototype.addColumns = function(outputEl, fontSize) {
var width = fontSize * 4;
var colgroup = document.createElement('colgroup');
const width = fontSize * 4;
const colgroup = document.createElement('colgroup');
// Add left-side line number.
var col = document.createElement('col');
let col = document.createElement('col');
col.setAttribute('width', width);
colgroup.appendChild(col);
@@ -57,8 +57,8 @@
};
GrDiffBuilderUnified.prototype._createRow = function(section, line) {
var row = this._createElement('tr', line.type);
var lineEl = this._createLineEl(line, line.beforeNumber,
const row = this._createElement('tr', line.type);
let lineEl = this._createLineEl(line, line.beforeNumber,
GrDiffLine.Type.REMOVE);
lineEl.classList.add('left');
row.appendChild(lineEl);
@@ -68,12 +68,12 @@
row.appendChild(lineEl);
row.classList.add('diff-row', 'unified');
var action = this._createContextControl(section, line);
const action = this._createContextControl(section, line);
if (action) {
row.appendChild(action);
} else {
var textEl = this._createTextEl(line);
var threadGroupEl = this._commentThreadGroupForLine(line);
const textEl = this._createTextEl(line);
const threadGroupEl = this._commentThreadGroupForLine(line);
if (threadGroupEl) {
textEl.appendChild(threadGroupEl);
}
@@ -84,7 +84,7 @@
GrDiffBuilderUnified.prototype._getNextContentOnSide = function(
content, side) {
var tr = content.parentElement.parentElement;
let tr = content.parentElement.parentElement;
while (tr = tr.nextSibling) {
if (tr.classList.contains('both') || (
(side === 'left' && tr.classList.contains('remove')) ||

189
polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder.html
View File

@@ -48,12 +48,12 @@ limitations under the License.
(function() {
'use strict';
var DiffViewMode = {
const DiffViewMode = {
SIDE_BY_SIDE: 'SIDE_BY_SIDE',
UNIFIED: 'UNIFIED_DIFF',
};
var TimingLabel = {
const TimingLabel = {
TOTAL: 'Diff Total Render',
CONTENT: 'Diff Content Render',
SYNTAX: 'Diff Syntax Render',
@@ -61,9 +61,9 @@ limitations under the License.
// If any line of the diff is more than the character limit, then disable
// syntax highlighting for the entire file.
var SYNTAX_MAX_LINE_LENGTH = 500;
const SYNTAX_MAX_LINE_LENGTH = 500;
var TRAILING_WHITESPACE_PATTERN = /\s+$/;
const TRAILING_WHITESPACE_PATTERN = /\s+$/;
Polymer({
is: 'gr-diff-builder',
@@ -108,7 +108,7 @@ limitations under the License.
'_groupsChanged(_groups.splices)',
],
attached: function() {
attached() {
// Setup annotation layers.
this._layers = [
this._createTrailingWhitespaceLayer(),
@@ -118,12 +118,12 @@ limitations under the License.
this.$.rangeLayer,
];
this.async(function() {
this.async(() => {
this._preRenderThread();
});
},
render: function(comments, prefs) {
render(comments, prefs) {
this.$.syntaxLayer.enabled = prefs.syntax_highlighting;
this._showTabs = !!prefs.show_tabs;
this._showTrailingWhitespace = !!prefs.show_whitespace_errors;
@@ -140,34 +140,35 @@ limitations under the License.
this._clearDiffContent();
this._builder.addColumns(this.diffElement, prefs.font_size);
var reporting = this.$.reporting;
const reporting = this.$.reporting;
reporting.time(TimingLabel.TOTAL);
reporting.time(TimingLabel.CONTENT);
this.dispatchEvent(new CustomEvent('render-start', {bubbles: true}));
return this.$.processor.process(this.diff.content, this.isImageDiff)
.then(function() {
if (this.isImageDiff) {
this._builder.renderDiffImages();
}
this.dispatchEvent(new CustomEvent('render-content',
{bubbles: true}));
.then(() => {
if (this.isImageDiff) {
this._builder.renderDiffImages();
}
this.dispatchEvent(new CustomEvent('render-content',
{bubbles: true}));
if (this._anyLineTooLong()) {
this.$.syntaxLayer.enabled = false;
}
if (this._anyLineTooLong()) {
this.$.syntaxLayer.enabled = false;
}
reporting.timeEnd(TimingLabel.CONTENT);
reporting.time(TimingLabel.SYNTAX);
return this.$.syntaxLayer.process().then(function() {
reporting.timeEnd(TimingLabel.SYNTAX);
reporting.timeEnd(TimingLabel.TOTAL);
this.dispatchEvent(new CustomEvent('render', {bubbles: true}));
}.bind(this));
}.bind(this));
reporting.timeEnd(TimingLabel.CONTENT);
reporting.time(TimingLabel.SYNTAX);
return this.$.syntaxLayer.process().then(() => {
reporting.timeEnd(TimingLabel.SYNTAX);
reporting.timeEnd(TimingLabel.TOTAL);
this.dispatchEvent(
new CustomEvent('render', {bubbles: true}));
});
});
},
getLineElByChild: function(node) {
getLineElByChild(node) {
while (node) {
if (node instanceof Element) {
if (node.classList.contains('lineNum')) {
@@ -182,154 +183,154 @@ limitations under the License.
return null;
},
getLineNumberByChild: function(node) {
var lineEl = this.getLineElByChild(node);
getLineNumberByChild(node) {
const lineEl = this.getLineElByChild(node);
return lineEl ?
parseInt(lineEl.getAttribute('data-value'), 10) : null;
parseInt(lineEl.getAttribute('data-value'), 10) :
null;
},
getContentByLine: function(lineNumber, opt_side, opt_root) {
getContentByLine(lineNumber, opt_side, opt_root) {
return this._builder.getContentByLine(lineNumber, opt_side, opt_root);
},
getContentByLineEl: function(lineEl) {
var root = Polymer.dom(lineEl.parentElement);
var side = this.getSideByLineEl(lineEl);
var line = lineEl.getAttribute('data-value');
getContentByLineEl(lineEl) {
const root = Polymer.dom(lineEl.parentElement);
const side = this.getSideByLineEl(lineEl);
const line = lineEl.getAttribute('data-value');
return this.getContentByLine(line, side, root);
},
getLineElByNumber: function(lineNumber, opt_side) {
var sideSelector = !!opt_side ? ('.' + opt_side) : '';
getLineElByNumber(lineNumber, opt_side) {
const sideSelector = opt_side ? ('.' + opt_side) : '';
return this.diffElement.querySelector(
'.lineNum[data-value="' + lineNumber + '"]' + sideSelector);
},
getContentsByLineRange: function(startLine, endLine, opt_side) {
var result = [];
getContentsByLineRange(startLine, endLine, opt_side) {
const result = [];
this._builder.findLinesByRange(startLine, endLine, opt_side, null,
result);
return result;
},
getSideByLineEl: function(lineEl) {
getSideByLineEl(lineEl) {
return lineEl.classList.contains(GrDiffBuilder.Side.RIGHT) ?
GrDiffBuilder.Side.RIGHT : GrDiffBuilder.Side.LEFT;
GrDiffBuilder.Side.RIGHT : GrDiffBuilder.Side.LEFT;
},
createCommentThreadGroup: function(changeNum, patchNum, path,
createCommentThreadGroup(changeNum, patchNum, path,
isOnParent, commentSide, projectConfig) {
return this._builder.createCommentThreadGroup(changeNum, patchNum,
path, isOnParent, commentSide, projectConfig);
},
emitGroup: function(group, sectionEl) {
emitGroup(group, sectionEl) {
this._builder.emitGroup(group, sectionEl);
},
showContext: function(newGroups, sectionEl) {
var groups = this._builder.groups;
// TODO(viktard): Polyfill findIndex for IE10.
var contextIndex = groups.findIndex(function(group) {
return group.element == sectionEl;
});
groups.splice.apply(groups, [contextIndex, 1].concat(newGroups));
showContext(newGroups, sectionEl) {
const groups = this._builder.groups;
newGroups.forEach(function(newGroup) {
const contextIndex = groups.findIndex(group =>
group.element === sectionEl
);
groups.splice(...[contextIndex, 1].concat(newGroups));
for (const newGroup of newGroups) {
this._builder.emitGroup(newGroup, sectionEl);
}, this);
}
sectionEl.parentNode.removeChild(sectionEl);
this.async(function() {
this.fire('render-content');
}, 1);
this.async(() => this.fire('render-content'), 1);
},
_getDiffBuilder: function(diff, comments, prefs) {
_getDiffBuilder(diff, comments, prefs) {
if (this.isImageDiff) {
return new GrDiffBuilderImage(diff, comments, prefs,
this.diffElement, this.baseImage, this.revisionImage);
this.diffElement, this.baseImage, this.revisionImage);
} else if (this.viewMode === DiffViewMode.SIDE_BY_SIDE) {
return new GrDiffBuilderSideBySide(
diff, comments, prefs, this.diffElement, this._layers);
diff, comments, prefs, this.diffElement, this._layers);
} else if (this.viewMode === DiffViewMode.UNIFIED) {
return new GrDiffBuilderUnified(
diff, comments, prefs, this.diffElement, this._layers);
diff, comments, prefs, this.diffElement, this._layers);
}
throw Error('Unsupported diff view mode: ' + this.viewMode);
},
_clearDiffContent: function() {
_clearDiffContent() {
this.diffElement.innerHTML = null;
},
_getCommentLocations: function(comments) {
var result = {
_getCommentLocations(comments) {
const result = {
left: {},
right: {},
};
for (var side in comments) {
for (const side in comments) {
if (side !== GrDiffBuilder.Side.LEFT &&
side !== GrDiffBuilder.Side.RIGHT) {
continue;
}
comments[side].forEach(function(c) {
for (const c of comments[side]) {
result[side][c.line || GrDiffLine.FILE] = true;
});
}
}
return result;
},
_groupsChanged: function(changeRecord) {
_groupsChanged(changeRecord) {
if (!changeRecord) { return; }
changeRecord.indexSplices.forEach(function(splice) {
var group;
for (var i = 0; i < splice.addedCount; i++) {
for (const splice of changeRecord.indexSplices) {
let group;
for (let i = 0; i < splice.addedCount; i++) {
group = splice.object[splice.index + i];
this._builder.groups.push(group);
this._builder.emitGroup(group);
}
}, this);
}
},
_createIntralineLayer: function() {
_createIntralineLayer() {
return {
// Take a DIV.contentText element and a line object with intraline
// differences to highlight and apply them to the element as
// annotations.
annotate: function(el, line) {
var HL_CLASS = 'style-scope gr-diff intraline';
line.highlights.forEach(function(highlight) {
annotate(el, line) {
const HL_CLASS = 'style-scope gr-diff intraline';
for (const highlight of line.highlights) {
// The start and end indices could be the same if a highlight is
// meant to start at the end of a line and continue onto the
// next one. Ignore it.
if (highlight.startIndex === highlight.endIndex) { return; }
if (highlight.startIndex === highlight.endIndex) { continue; }
// If endIndex isn't present, continue to the end of the line.
var endIndex = highlight.endIndex === undefined ?
line.text.length : highlight.endIndex;
const endIndex = highlight.endIndex === undefined ?
line.text.length :
highlight.endIndex;
GrAnnotation.annotateElement(
el,
highlight.startIndex,
endIndex - highlight.startIndex,
HL_CLASS);
});
}
},
};
},
_createTabIndicatorLayer: function() {
var show = function() { return this._showTabs; }.bind(this);
_createTabIndicatorLayer() {
const show = () => this._showTabs;
return {
annotate: function(el, line) {
annotate(el, line) {
// If visible tabs are disabled, do nothing.
if (!show()) { return; }
// Find and annotate the locations of tabs.
var split = line.text.split('\t');
const split = line.text.split('\t');
if (!split) { return; }
for (var i = 0, pos = 0; i < split.length - 1; i++) {
for (let i = 0, pos = 0; i < split.length - 1; i++) {
// Skip forward by the length of the content
pos += split[i].length;
@@ -343,22 +344,22 @@ limitations under the License.
};
},
_createTrailingWhitespaceLayer: function() {
var show = function() {
_createTrailingWhitespaceLayer() {
const show = function() {
return this._showTrailingWhitespace;
}.bind(this);
return {
annotate: function(el, line) {
annotate(el, line) {
if (!show()) { return; }
var match = line.text.match(TRAILING_WHITESPACE_PATTERN);
const match = line.text.match(TRAILING_WHITESPACE_PATTERN);
if (match) {
// Normalize string positions in case there is unicode before or
// within the match.
var index = GrAnnotation.getStringLength(
const index = GrAnnotation.getStringLength(
line.text.substr(0, match.index));
var length = GrAnnotation.getStringLength(match[0]);
const length = GrAnnotation.getStringLength(match[0]);
GrAnnotation.annotateElement(el, index, length,
'style-scope gr-diff trailing-whitespace');
}
@@ -375,11 +376,11 @@ limitations under the License.
* already exist and the user's comment will be quick to load.
* @see https://gerrit-review.googlesource.com/c/82213/
*/
_preRenderThread: function() {
var thread = document.createElement('gr-diff-comment-thread');
_preRenderThread() {
const thread = document.createElement('gr-diff-comment-thread');
thread.setAttribute('hidden', true);
thread.addDraft();
var parent = Polymer.dom(this.root);
const parent = Polymer.dom(this.root);
parent.appendChild(thread);
Polymer.dom.flush();
parent.removeChild(thread);
@@ -389,9 +390,9 @@ limitations under the License.
* @return {Boolean} whether any of the lines in _groups are longer
* than SYNTAX_MAX_LINE_LENGTH.
*/
_anyLineTooLong: function() {
return this._groups.reduce(function(acc, group) {
return acc || group.lines.reduce(function(acc, line) {
_anyLineTooLong() {
return this._groups.reduce((acc, group) => {
return acc || group.lines.reduce((acc, line) => {
return acc || line.text.length >= SYNTAX_MAX_LINE_LENGTH;
}, false);
}, false);

169
polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder.js
View File

@@ -14,8 +14,8 @@
(function(window, GrDiffGroup, GrDiffLine) {
'use strict';
var HTML_ENTITY_PATTERN = /[&<>"'`\/]/g;
var HTML_ENTITY_MAP = {
const HTML_ENTITY_PATTERN = /[&<>"'`\/]/g;
const HTML_ENTITY_MAP = {
'&': '&amp;',
'<': '&lt;',
'>': '&gt;',
@@ -28,7 +28,7 @@
// Prevent redefinition.
if (window.GrDiffBuilder) { return; }
var REGEX_ASTRAL_SYMBOL = /[\uD800-\uDBFF][\uDC00-\uDFFF]/;
const REGEX_ASTRAL_SYMBOL = /[\uD800-\uDBFF][\uDC00-\uDFFF]/;
function GrDiffBuilder(diff, comments, prefs, outputEl, layers) {
this._diff = diff;
@@ -39,11 +39,11 @@
this.layers = layers || [];
this.layers.forEach(function(layer) {
for (const layer of this.layers) {
if (layer.addListener) {
layer.addListener(this._handleLayerUpdate.bind(this));
}
}.bind(this));
}
}
GrDiffBuilder.LESS_THAN_CODE = '<'.charCodeAt(0);
@@ -76,7 +76,7 @@
ALL: 'all',
};
var PARTIAL_CONTEXT_AMOUNT = 10;
const PARTIAL_CONTEXT_AMOUNT = 10;
/**
* Abstract method
@@ -96,16 +96,16 @@
};
GrDiffBuilder.prototype.emitGroup = function(group, opt_beforeSection) {
var element = this.buildSectionElement(group);
const element = this.buildSectionElement(group);
this._outputEl.insertBefore(element, opt_beforeSection);
group.element = element;
};
GrDiffBuilder.prototype.renderSection = function(element) {
for (var i = 0; i < this.groups.length; i++) {
var group = this.groups[i];
for (let i = 0; i < this.groups.length; i++) {
const group = this.groups[i];
if (group.element === element) {
var newElement = this.buildSectionElement(group);
const newElement = this.buildSectionElement(group);
group.element.parentElement.replaceChild(newElement, group.element);
group.element = newElement;
break;
@@ -115,14 +115,14 @@
GrDiffBuilder.prototype.getGroupsByLineRange = function(
startLine, endLine, opt_side) {
var groups = [];
for (var i = 0; i < this.groups.length; i++) {
var group = this.groups[i];
const groups = [];
for (let i = 0; i < this.groups.length; i++) {
const group = this.groups[i];
if (group.lines.length === 0) {
continue;
}
var groupStartLine = 0;
var groupEndLine = 0;
let groupStartLine = 0;
let groupEndLine = 0;
if (opt_side) {
groupStartLine = group.lineRange[opt_side].start;
groupEndLine = group.lineRange[opt_side].end;
@@ -143,8 +143,8 @@
GrDiffBuilder.prototype.getContentByLine = function(lineNumber, opt_side,
opt_root) {
var root = Polymer.dom(opt_root || this._outputEl);
var sideSelector = !!opt_side ? ('.' + opt_side) : '';
const root = Polymer.dom(opt_root || this._outputEl);
const sideSelector = opt_side ? ('.' + opt_side) : '';
return root.querySelector('td.lineNum[data-value="' + lineNumber +
'"]' + sideSelector + ' ~ td.content .contentText');
};
@@ -162,17 +162,17 @@
*/
GrDiffBuilder.prototype.findLinesByRange = function(start, end, opt_side,
out_lines, out_elements) {
var groups = this.getGroupsByLineRange(start, end, opt_side);
groups.forEach(function(group) {
var content = null;
group.lines.forEach(function(line) {
const groups = this.getGroupsByLineRange(start, end, opt_side);
for (const group of groups) {
let content = null;
for (const line of group.lines) {
if ((opt_side === 'left' && line.type === GrDiffLine.Type.ADD) ||
(opt_side === 'right' && line.type === GrDiffLine.Type.REMOVE)) {
return;
continue;
}
var lineNumber = opt_side === 'left' ?
const lineNumber = opt_side === 'left' ?
line.beforeNumber : line.afterNumber;
if (lineNumber < start || lineNumber > end) { return; }
if (lineNumber < start || lineNumber > end) { continue; }
if (out_lines) { out_lines.push(line); }
if (out_elements) {
@@ -184,8 +184,8 @@
}
if (content) { out_elements.push(content); }
}
}.bind(this));
}.bind(this));
}
}
};
/**
@@ -193,12 +193,12 @@
* diff content.
*/
GrDiffBuilder.prototype._renderContentByRange = function(start, end, side) {
var lines = [];
var elements = [];
var line;
var el;
const lines = [];
const elements = [];
let line;
let el;
this.findLinesByRange(start, end, side, lines, elements);
for (var i = 0; i < lines.length; i++) {
for (let i = 0; i < lines.length; i++) {
line = lines[i];
el = elements[i];
el.parentElement.replaceChild(this._createTextEl(line, side).firstChild,
@@ -209,7 +209,7 @@
GrDiffBuilder.prototype.getSectionsByLineRange = function(
startLine, endLine, opt_side) {
return this.getGroupsByLineRange(startLine, endLine, opt_side).map(
function(group) { return group.element; });
group => { return group.element; });
};
GrDiffBuilder.prototype._commentIsAtLineNum = function(side, lineNum) {
@@ -219,15 +219,15 @@
// TODO(wyatta): Move this completely into the processor.
GrDiffBuilder.prototype._insertContextGroups = function(groups, lines,
hiddenRange) {
var linesBeforeCtx = lines.slice(0, hiddenRange[0]);
var hiddenLines = lines.slice(hiddenRange[0], hiddenRange[1]);
var linesAfterCtx = lines.slice(hiddenRange[1]);
const linesBeforeCtx = lines.slice(0, hiddenRange[0]);
const hiddenLines = lines.slice(hiddenRange[0], hiddenRange[1]);
const linesAfterCtx = lines.slice(hiddenRange[1]);
if (linesBeforeCtx.length > 0) {
groups.push(new GrDiffGroup(GrDiffGroup.Type.BOTH, linesBeforeCtx));
}
var ctxLine = new GrDiffLine(GrDiffLine.Type.CONTEXT_CONTROL);
const ctxLine = new GrDiffLine(GrDiffLine.Type.CONTEXT_CONTROL);
ctxLine.contextGroup =
new GrDiffGroup(GrDiffGroup.Type.BOTH, hiddenLines);
groups.push(new GrDiffGroup(GrDiffGroup.Type.CONTEXT_CONTROL,
@@ -243,8 +243,8 @@
return null;
}
var td = this._createElement('td');
var showPartialLinks =
const td = this._createElement('td');
const showPartialLinks =
line.contextGroup.lines.length > PARTIAL_CONTEXT_AMOUNT;
if (showPartialLinks) {
@@ -266,14 +266,14 @@
};
GrDiffBuilder.prototype._createContextButton = function(type, section, line) {
var contextLines = line.contextGroup.lines;
var context = PARTIAL_CONTEXT_AMOUNT;
const contextLines = line.contextGroup.lines;
const context = PARTIAL_CONTEXT_AMOUNT;
var button = this._createElement('gr-button', 'showContext');
const button = this._createElement('gr-button', 'showContext');
button.setAttribute('link', true);
var text;
var groups = []; // The groups that replace this one if tapped.
let text;
const groups = []; // The groups that replace this one if tapped.
if (type === GrDiffBuilder.ContextButtonType.ALL) {
text = 'Show ' + contextLines.length + ' common line';
@@ -291,10 +291,10 @@
button.textContent = text;
button.addEventListener('tap', function(e) {
button.addEventListener('tap', e => {
e.detail = {
groups: groups,
section: section,
groups,
section,
};
// Let it bubble up the DOM tree.
});
@@ -310,15 +310,15 @@
(c.line === undefined && lineNum === GrDiffLine.FILE);
};
}
var leftComments =
const leftComments =
comments[GrDiffBuilder.Side.LEFT].filter(byLineNum(line.beforeNumber));
var rightComments =
const rightComments =
comments[GrDiffBuilder.Side.RIGHT].filter(byLineNum(line.afterNumber));
leftComments.forEach(function(c) { c.__commentSide = 'left'; });
rightComments.forEach(function(c) { c.__commentSide = 'right'; });
leftComments.forEach(c => { c.__commentSide = 'left'; });
rightComments.forEach(c => { c.__commentSide = 'right'; });
var result;
let result;
switch (opt_side) {
case GrDiffBuilder.Side.LEFT:
@@ -337,7 +337,7 @@
GrDiffBuilder.prototype.createCommentThreadGroup = function(changeNum,
patchNum, path, isOnParent, projectConfig, range) {
var threadGroupEl =
const threadGroupEl =
document.createElement('gr-diff-comment-thread-group');
threadGroupEl.changeNum = changeNum;
threadGroupEl.patchForNewThreads = patchNum;
@@ -348,24 +348,25 @@
return threadGroupEl;
};
GrDiffBuilder.prototype._commentThreadGroupForLine =
function(line, opt_side) {
var comments = this._getCommentsForLine(this._comments, line, opt_side);
GrDiffBuilder.prototype._commentThreadGroupForLine = function(line,
opt_side) {
const comments =
this._getCommentsForLine(this._comments, line, opt_side);
if (!comments || comments.length === 0) {
return null;
}
var patchNum = this._comments.meta.patchRange.patchNum;
var isOnParent = comments[0].side === 'PARENT' || false;
let patchNum = this._comments.meta.patchRange.patchNum;
let isOnParent = comments[0].side === 'PARENT' || false;
if (line.type === GrDiffLine.Type.REMOVE ||
opt_side === GrDiffBuilder.Side.LEFT) {
opt_side === GrDiffBuilder.Side.LEFT) {
if (this._comments.meta.patchRange.basePatchNum === 'PARENT') {
isOnParent = true;
} else {
patchNum = this._comments.meta.patchRange.basePatchNum;
}
}
var threadGroupEl = this.createCommentThreadGroup(
const threadGroupEl = this.createCommentThreadGroup(
this._comments.meta.changeNum,
patchNum,
this._comments.meta.path,
@@ -380,7 +381,7 @@
GrDiffBuilder.prototype._createLineEl = function(line, number, type,
opt_class) {
var td = this._createElement('td');
const td = this._createElement('td');
if (opt_class) {
td.classList.add(opt_class);
}
@@ -397,13 +398,13 @@
};
GrDiffBuilder.prototype._createTextEl = function(line, opt_side) {
var td = this._createElement('td');
var text = line.text;
const td = this._createElement('td');
const text = line.text;
if (line.type !== GrDiffLine.Type.BLANK) {
td.classList.add('content');
}
td.classList.add(line.type);
var html = this._escapeHTML(text);
let html = this._escapeHTML(text);
html = this._addTabWrappers(html, this._prefs.tab_size);
if (!this._prefs.line_wrapping &&
this._textLength(text, this._prefs.tab_size) >
@@ -411,7 +412,7 @@
html = this._addNewlines(text, html);
}
var contentText = this._createElement('div', 'contentText');
const contentText = this._createElement('div', 'contentText');
if (opt_side) {
contentText.setAttribute('data-side', opt_side);
}
@@ -424,9 +425,9 @@
contentText.innerHTML = html;
}
this.layers.forEach(function(layer) {
for (const layer of this.layers) {
layer.annotate(contentText, line);
});
}
td.appendChild(contentText);
@@ -439,8 +440,8 @@
*/
GrDiffBuilder.prototype._textLength = function(text, tabSize) {
text = text.replace(REGEX_ASTRAL_SYMBOL, '_');
var numChars = 0;
for (var i = 0; i < text.length; i++) {
let numChars = 0;
for (let i = 0; i < text.length; i++) {
if (text[i] === '\t') {
numChars += tabSize - (numChars % tabSize);
} else {
@@ -488,11 +489,11 @@
};
GrDiffBuilder.prototype._addNewlines = function(text, html) {
var htmlIndex = 0;
var indices = [];
var numChars = 0;
var prevHtmlIndex = 0;
for (var i = 0; i < text.length; i++) {
let htmlIndex = 0;
const indices = [];
let numChars = 0;
let prevHtmlIndex = 0;
for (let i = 0; i < text.length; i++) {
if (numChars > 0 && numChars % this._prefs.line_length === 0) {
indices.push(htmlIndex);
}
@@ -512,11 +513,11 @@
}
prevHtmlIndex = htmlIndex;
}
var result = html;
let result = html;
// Since the result string is being altered in place, start from the end
// of the string so that the insertion indices are not affected as the
// result string changes.
for (var i = indices.length - 1; i >= 0; i--) {
for (let i = indices.length - 1; i >= 0; i--) {
result = result.slice(0, indices[i]) + GrDiffBuilder.LINE_FEED_HTML +
result.slice(indices[i]);
}
@@ -535,12 +536,12 @@
GrDiffBuilder.prototype._addTabWrappers = function(line, tabSize) {
if (!line.length) { return ''; }
var result = '';
var offset = 0;
var split = line.split('\t');
var width;
let result = '';
let offset = 0;
const split = line.split('\t');
let width;
for (var i = 0; i < split.length - 1; i++) {
for (let i = 0; i < split.length - 1; i++) {
offset += split[i].length;
width = tabSize - (offset % tabSize);
result += split[i] + this._getTabWrapper(width);
@@ -560,7 +561,7 @@
throw Error('Invalid tab size from preferences.');
}
var str = '<span class="style-scope gr-diff tab ';
let str = '<span class="style-scope gr-diff tab ';
str += '" style="';
// TODO(andybons): CSS tab-size is not supported in IE.
str += 'tab-size:' + tabSize + ';';
@@ -570,7 +571,7 @@
};
GrDiffBuilder.prototype._createElement = function(tagName, className) {
var el = document.createElement(tagName);
const el = document.createElement(tagName);
// When Shady DOM is being used, these classes are added to account for
// Polymer's polyfill behavior. In order to guarantee sufficient
// specificity within the CSS rules, these are added to every element.
@@ -578,7 +579,7 @@
// automatically) are not being used for performance reasons, this is
// done manually.
el.classList.add('style-scope', 'gr-diff');
if (!!className) {
if (className) {
el.classList.add(className);
}
return el;
@@ -612,7 +613,7 @@
};
GrDiffBuilder.prototype._escapeHTML = function(str) {
return str.replace(HTML_ENTITY_PATTERN, function(s) {
return str.replace(HTML_ENTITY_PATTERN, s => {
return HTML_ENTITY_MAP[s];
});
};

534
polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder_test.html
View File

File diff suppressed because it is too large Load Diff