Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Fix linting errors. #1610

Merged
merged 1 commit into from
Nov 15, 2017
Merged
Changes from all commits
Commits
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
74 changes: 40 additions & 34 deletions src/Tinter.js
Original file line number Diff line number Diff line change
Expand Up @@ -31,16 +31,17 @@ function colorToRgb(color) {
const g = (val >> 8) & 255;
const b = val & 255;
return [r, g, b];
}
else {
let match = color.match(/rgb\((.*?),(.*?),(.*?)\)/);
} else {
const match = color.match(/rgb\((.*?),(.*?),(.*?)\)/);
if (match) {
return [ parseInt(match[1]),
parseInt(match[2]),
parseInt(match[3]) ];
return [
parseInt(match[1]),
parseInt(match[2]),
parseInt(match[3]),
];
}
}
return [0,0,0];
return [0, 0, 0];
}

// utility to turn [red,green,blue] into #rrggbb
Expand Down Expand Up @@ -152,9 +153,11 @@ class Tinter {

this.calcCssFixups();

if (DEBUG) console.log("Tinter.tint(" + primaryColor + ", " +
secondaryColor + ", " +
tertiaryColor + ")");
if (DEBUG) {
console.log("Tinter.tint(" + primaryColor + ", " +
secondaryColor + ", " +
tertiaryColor + ")");
}

if (!primaryColor) {
primaryColor = this.keyRgb[0];
Expand Down Expand Up @@ -194,9 +197,11 @@ class Tinter {
this.colors[1] = secondaryColor;
this.colors[2] = tertiaryColor;

if (DEBUG) console.log("Tinter.tint final: (" + primaryColor + ", " +
secondaryColor + ", " +
tertiaryColor + ")");
if (DEBUG) {
console.log("Tinter.tint final: (" + primaryColor + ", " +
secondaryColor + ", " +
tertiaryColor + ")");
}

// go through manually fixing up the stylesheets.
this.applyCssFixups();
Expand Down Expand Up @@ -229,18 +234,15 @@ class Tinter {
// update keyRgb from the current theme CSS itself, if it defines it
if (document.getElementById('mx_theme_accentColor')) {
this.keyRgb[0] = window.getComputedStyle(
document.getElementById('mx_theme_accentColor')
).color;
document.getElementById('mx_theme_accentColor')).color;
}
if (document.getElementById('mx_theme_secondaryAccentColor')) {
this.keyRgb[1] = window.getComputedStyle(
document.getElementById('mx_theme_secondaryAccentColor')
).color;
document.getElementById('mx_theme_secondaryAccentColor')).color;
}
if (document.getElementById('mx_theme_tertiaryAccentColor')) {
this.keyRgb[2] = window.getComputedStyle(
document.getElementById('mx_theme_tertiaryAccentColor')
).color;
document.getElementById('mx_theme_tertiaryAccentColor')).color;
}

this.calcCssFixups();
Expand All @@ -261,9 +263,11 @@ class Tinter {
// cache our fixups
if (this.cssFixups[this.theme]) return;

if (DEBUG) console.debug("calcCssFixups start for " + this.theme + " (checking " +
document.styleSheets.length +
" stylesheets)");
if (DEBUG) {
console.debug("calcCssFixups start for " + this.theme + " (checking " +
document.styleSheets.length +
" stylesheets)");
}

this.cssFixups[this.theme] = [];

Expand Down Expand Up @@ -319,21 +323,24 @@ class Tinter {
}
}
}
if (DEBUG) console.log("calcCssFixups end (" +
this.cssFixups[this.theme].length +
" fixups)");
if (DEBUG) {
console.log("calcCssFixups end (" +
this.cssFixups[this.theme].length +
" fixups)");
}
}

applyCssFixups() {
if (DEBUG) console.log("applyCssFixups start (" +
this.cssFixups[this.theme].length +
" fixups)");
if (DEBUG) {
console.log("applyCssFixups start (" +
this.cssFixups[this.theme].length +
" fixups)");
}
for (let i = 0; i < this.cssFixups[this.theme].length; i++) {
const cssFixup = this.cssFixups[this.theme][i];
try {
cssFixup.style[cssFixup.attr] = this.colors[cssFixup.index];
}
catch (e) {
} catch (e) {
// Firefox Quantum explodes if you manually edit the CSS in the
// inspector and then try to do a tint, as apparently all the
// fixups are then stale.
Expand All @@ -355,7 +362,7 @@ class Tinter {
if (DEBUG) console.log("calcSvgFixups start for " + svgs);
const fixups = [];
for (let i = 0; i < svgs.length; i++) {
var svgDoc;
let svgDoc;
try {
svgDoc = svgs[i].contentDocument;
} catch(e) {
Expand All @@ -366,7 +373,7 @@ class Tinter {
if (e.stack) {
msg += ' | stack: ' + e.stack;
}
console.error(e);
console.error(msg);
}
if (!svgDoc) continue;
const tags = svgDoc.getElementsByTagName("*");
Expand All @@ -376,8 +383,7 @@ class Tinter {
const attr = this.svgAttrs[k];
for (let l = 0; l < this.keyHex.length; l++) {
if (tag.getAttribute(attr) &&
tag.getAttribute(attr).toUpperCase() === this.keyHex[l])
{
tag.getAttribute(attr).toUpperCase() === this.keyHex[l]) {
Copy link
Contributor

Choose a reason for hiding this comment

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

the style we would generally go with is

if (reallyLongstuff &&
    otherReallyLongStuff
) {
    bla

Copy link
Member

Choose a reason for hiding this comment

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

says who, though? i've never used that style in my life, and it's not in our code style (https://github.com/matrix-org/matrix-react-sdk/blob/master/code_style.md), and I don't understand why we are enforcing lint rules which are more extreme than our code style!

Copy link
Contributor

Choose a reason for hiding this comment

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

I've never seen that, actually. We really ought to update the linting configuration to reflect that.

Copy link
Member

Choose a reason for hiding this comment

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

Yes. just to be clear: linting is meant to fix bugs and help legibility in terms of enforcing a consistent style - but there is no benefit in making it needlessly over-restrictive (especially based on personal taste, when there's already a formal style). I don't think anyone's eyes are ever going jar at where the { goes after an multiline if clause, so in the end it just burns time having to fix up unnecessary linting errors. In other words: we should introduce linting where it helps us, not slows us down, and certainly not for the sake of arbitrary consistency.

As Emerson said (and I think the old MX Coding Style guide as written by vdh & myself about 15 years ago, which you have more of an excuse not to have read ;): A foolish consistency is the hobgoblin of little minds.

Copy link
Member

Choose a reason for hiding this comment

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

+1 to having the lint less strict. It's getting tiring to have an "appease the linter" commit on every PR.

Copy link
Contributor

Choose a reason for hiding this comment

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

I don't find it that bad, but then I do have the linting built into my IDE, so there's no extra "appeasing" step in general.

fixups.push({
node: tag,
attr: attr,
Expand Down