From 7e473fe72c21b1a0d7eb793ee441b1be81033c44 Mon Sep 17 00:00:00 2001
From: chris48s <chris48s@users.noreply.github.com>
Date: Wed, 23 Jan 2019 21:41:10 +0000
Subject: [PATCH] pre-compute the 3 most common icon styles on server init
 (#2856)

refs #2833 (comment)
---
 lib/load-simple-icons.js | 12 +++++++++---
 lib/logos.js             | 22 +++++++++++++---------
 lib/logos.spec.js        |  6 +++---
 3 files changed, 25 insertions(+), 15 deletions(-)

diff --git a/lib/load-simple-icons.js b/lib/load-simple-icons.js
index 6e8a4e8725..47af134356 100644
--- a/lib/load-simple-icons.js
+++ b/lib/load-simple-icons.js
@@ -10,9 +10,15 @@ function loadSimpleIcons() {
       simpleIcons[k] = simpleIcons[key]
       delete simpleIcons[key]
     }
-    simpleIcons[k].base64 = svg2base64(
-      simpleIcons[k].svg.replace('<svg', `<svg fill="#${simpleIcons[k].hex}"`)
-    )
+    simpleIcons[k].base64 = {
+      default: svg2base64(
+        simpleIcons[k].svg.replace('<svg', `<svg fill="#${simpleIcons[k].hex}"`)
+      ),
+      light: svg2base64(
+        simpleIcons[k].svg.replace('<svg', `<svg fill="whitesmoke"`)
+      ),
+      dark: svg2base64(simpleIcons[k].svg.replace('<svg', `<svg fill="#333"`)),
+    }
   })
   return simpleIcons
 }
diff --git a/lib/logos.js b/lib/logos.js
index b6026df0e1..f9324fc06a 100644
--- a/lib/logos.js
+++ b/lib/logos.js
@@ -69,15 +69,15 @@ function hexToRgb(hex) {
   }
 }
 
-function getSimpleIconColor({ icon, style }) {
+function getSimpleIconStyle({ icon, style }) {
   const { hex } = icon
   if (style !== 'social' && brightness(hexToRgb(hex)) <= 0.4) {
-    return 'whitesmoke'
+    return 'light'
   }
   if (style === 'social' && brightness(hexToRgb(hex)) >= 0.6) {
-    return '#333'
+    return 'dark'
   }
-  return hex
+  return 'default'
 }
 
 function getSimpleIcon({ name, color, style }) {
@@ -87,11 +87,15 @@ function getSimpleIcon({ name, color, style }) {
     return undefined
   }
 
-  const { svg } = simpleIcons[key]
-  const svgColor =
-    toSvgColor(color) ||
-    toSvgColor(getSimpleIconColor({ icon: simpleIcons[key], style }))
-  return svg2base64(svg.replace('<svg', `<svg fill="${svgColor}"`))
+  const svgColor = toSvgColor(color)
+  if (svgColor) {
+    return svg2base64(
+      simpleIcons[key].svg.replace('<svg', `<svg fill="${svgColor}"`)
+    )
+  } else {
+    const iconStyle = getSimpleIconStyle({ icon: simpleIcons[key], style })
+    return simpleIcons[key].base64[iconStyle]
+  }
 }
 
 function prepareNamedLogo({ name, color, style }) {
diff --git a/lib/logos.spec.js b/lib/logos.spec.js
index 330d1a57c9..cf0f044493 100644
--- a/lib/logos.spec.js
+++ b/lib/logos.spec.js
@@ -39,7 +39,7 @@ describe('Logo helpers', function() {
         logo.replace('data:image/svg+xml;base64,', ''),
         'base64'
       ).toString('ascii')
-      expect(decodedLogo).to.contain('fill="#f7df1e"')
+      expect(decodedLogo).to.contain('fill="#F7DF1E"')
     })
     it('recolors logo if light logo on light background', function() {
       const logo = prepareNamedLogo({ name: 'javascript', style: 'social' })
@@ -73,7 +73,7 @@ describe('Logo helpers', function() {
         logo.replace('data:image/svg+xml;base64,', ''),
         'base64'
       ).toString('ascii')
-      expect(decodedLogo).to.contain('fill="#00aff0"')
+      expect(decodedLogo).to.contain('fill="#00AFF0"')
     })
     it('preserves color if medium logo on light background', function() {
       const logo = prepareNamedLogo({ name: 'skype', style: 'social' })
@@ -81,7 +81,7 @@ describe('Logo helpers', function() {
         logo.replace('data:image/svg+xml;base64,', ''),
         'base64'
       ).toString('ascii')
-      expect(decodedLogo).to.contain('fill="#00aff0"')
+      expect(decodedLogo).to.contain('fill="#00AFF0"')
     })
   })