diff --git a/src/Tinter.js b/src/Tinter.js index 11dea0170f..f2a02b6e6d 100644 --- a/src/Tinter.js +++ b/src/Tinter.js @@ -74,7 +74,7 @@ class Tinter { "#FFFFFF", // white highlights of the SVGs (for switching to dark theme) ]; - // cache of our replacement colours + // track the replacement colours actually being used // defaults to our keys. this.colors = [ this.keyHex[0], @@ -83,6 +83,15 @@ class Tinter { this.keyHex[3], ]; + // track the most current tint request inputs (which may differ from the + // end result stored in this.colors + this.currentTint = [ + undefined, + undefined, + undefined, + undefined, + ]; + this.cssFixups = [ // { theme: { // style: a style object that should be fixed up taken from a stylesheet @@ -136,11 +145,11 @@ class Tinter { return this.keyRgb; } - getCurrentColors() { - return this.colors; - } - tint(primaryColor, secondaryColor, tertiaryColor) { + this.currentTint[0] = primaryColor; + this.currentTint[1] = secondaryColor; + this.currentTint[2] = tertiaryColor; + this.calcCssFixups(); if (DEBUG) console.log("Tinter.tint(" + primaryColor + ", " + @@ -200,6 +209,8 @@ class Tinter { } tintSvgWhite(whiteColor) { + this.currentTint[3] = whiteColor; + if (!whiteColor) { whiteColor = this.colors[3]; } @@ -234,6 +245,16 @@ class Tinter { this.calcCssFixups(); this.forceTint = true; + + this.tint(this.currentTint[0], this.currentTint[1], this.currentTint[2]); + + if (theme === 'dark') { + // abuse the tinter to change all the SVG's #fff to #2d2d2d + // XXX: obviously this shouldn't be hardcoded here. + this.tintSvgWhite('#2d2d2d'); + } else { + this.tintSvgWhite('#ffffff'); + } } calcCssFixups() { diff --git a/src/components/structures/MatrixChat.js b/src/components/structures/MatrixChat.js index f287ff27af..7847e8e8dc 100644 --- a/src/components/structures/MatrixChat.js +++ b/src/components/structures/MatrixChat.js @@ -922,13 +922,11 @@ module.exports = React.createClass({ styleElements[theme].disabled = false; const switchTheme = function() { - const colors = Tinter.getCurrentColors(); Object.values(styleElements).forEach((a) => { if (a == styleElements[theme]) return; a.disabled = true; }); Tinter.setTheme(theme); - Tinter.tint(colors[0], colors[1]); }; // turns out that Firefox preloads the CSS for link elements with @@ -952,14 +950,6 @@ module.exports = React.createClass({ styleElements[theme].onload = undefined; switchTheme(); } - - if (theme === 'dark') { - // abuse the tinter to change all the SVG's #fff to #2d2d2d - // XXX: obviously this shouldn't be hardcoded here. - Tinter.tintSvgWhite('#2d2d2d'); - } else { - Tinter.tintSvgWhite('#ffffff'); - } }, /**