From 57bdccf7dc8fa7200b56526311af87c48e5b493f Mon Sep 17 00:00:00 2001
From: Ryo Hilmawan <54142180+CloudHill@users.noreply.github.com>
Date: Thu, 19 Nov 2020 03:09:17 +0700
Subject: [PATCH] Update mod.js (#270)

---
 repo/notion-icons/mod.js | 31 +++++++++++++++++++------------
 1 file changed, 19 insertions(+), 12 deletions(-)

diff --git a/repo/notion-icons/mod.js b/repo/notion-icons/mod.js
index 5c83a1e..6bd8587 100644
--- a/repo/notion-icons/mod.js
+++ b/repo/notion-icons/mod.js
@@ -177,25 +177,31 @@ module.exports = {
               : `${iconData.sourceUrl}/${iconData.source}_${i}.${iconData.extension}`
             : iconData.source[i];
 
-            const icon = createElement(`<div class="notion-icons--icon"><img src="${iconUrl}" /></div>`);
-            
-            iconSetBody.append(icon);
-            garbageCollector.push(icon);
-            icon.addEventListener('click', () => setPageIcon(iconUrl));
-            
-            // Make sure elements load
-            promiseArray.push(
-              new Promise((resolve, reject) => {
+            const icon = createElement(`<div class="notion-icons--icon"></div>`);
+            if (iconData.enhancerIcons) {
+              // Load sprite sheet
+              icon.innerHTML = 
+                `<div style="width: 32px; height: 32px; background: url(${iconsUrl}${iconData.source}/sprite.png) 0 -${i * 32}px no-repeat; background-size: cover;"></div>`;
+            } else {
+              icon.innerHTML = `<img src="${iconUrl}" />`;
+              // Make sure icons load
+              promiseArray.push(
+                new Promise((resolve, reject) => {
                   icon.firstChild.onload = resolve;
                   icon.firstChild.onerror = () => {
                     reject();
                     icon.classList.add('error');
                     icon.innerHTML = '!';
                   };
-              })
-            );
-          }
+                })
+              );
+            }
 
+            iconSetBody.append(icon);
+            garbageCollector.push(icon);
+            icon.addEventListener('click', () => setPageIcon(iconUrl));
+          }
+          
           // Hide spinner after all icons finish loading
           (async () => {      
             const spinner = iconSetToggle.querySelector('.notion-icons--spinner'),
@@ -265,6 +271,7 @@ module.exports = {
           if (notionIconsData && notionIconsData.icons) {
             notionIconsData.icons.forEach(i => {
               i.sourceUrl = i.sourceUrl || (iconsUrl + i.source);
+              i.enhancerIcons = true;
               iconSets.push( renderIconSet(i) );
             });
           }