open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

cache icon imageData because the browser doesn't

Browse Source
This commit is contained in:
tophf 2018-01-03 10:39:40 +03:00
parent 3f570c4d3a
commit a572620765
1 changed files with 32 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
background/background.js
View File

@ -333,30 +333,31 @@ function updateIcon({tab, styles}) {
const color = prefs.get(disableAll ? 'badgeDisabled' : 'badgeNormal'); const color = prefs.get(disableAll ? 'badgeDisabled' : 'badgeNormal');
const text = prefs.get('show-badge') && numStyles ? String(numStyles) : ''; const text = prefs.get('show-badge') && numStyles ? String(numStyles) : '';
const iconset = ['', 'light/'][prefs.get('iconset')] || ''; const iconset = ['', 'light/'][prefs.get('iconset')] || '';
const path = 'images/icon/' + iconset;
const tabIcon = tabIcons.get(tab.id) || {}; let tabIcon = tabIcons.get(tab.id);
if (!tabIcon) tabIcons.set(tab.id, (tabIcon = {}));
if (tabIcon.iconType !== iconset + postfix) { if (tabIcon.iconType !== iconset + postfix) {
tabIcons.set(tab.id, tabIcon);
tabIcon.iconType = iconset + postfix; tabIcon.iconType = iconset + postfix;
const paths = {}; const sizes = FIREFOX || CHROME >= 2883 && !VIVALDI ? [16, 32] : [19, 38];
if (FIREFOX || CHROME >= 2883 && !VIVALDI) { Promise.all(sizes.map(size => {
// Material Design 2016 new size is 16px const src = `/images/icon/${iconset}${size}${postfix}.png`;
paths['16'] = `${path}16${postfix}.png`; return tabIcons.get(src) || loadIcon(src);
paths['32'] = `${path}32${postfix}.png`; })).then(data => {
} else { const imageData = {};
// Chromium forks or non-chromium browsers may still use the traditional 19px sizes.forEach((size, i) => (imageData[size] = data[i]));
paths['19'] = `${path}19${postfix}.png`; chrome.browserAction.setIcon({tabId: tab.id, imageData}, ignoreChromeError);
paths['38'] = `${path}38${postfix}.png`; });
}
chrome.browserAction.setIcon({tabId: tab.id, path: paths}, ignoreChromeError);
} }
if (tab.id === undefined) return; if (tab.id === undefined) return;
let defaultIcon = tabIcons.get(undefined); let defaultIcon = tabIcons.get(undefined);
if (!defaultIcon) tabIcons.set(undefined, (defaultIcon = {})); if (!defaultIcon) tabIcons.set(undefined, (defaultIcon = {}));
if (defaultIcon.color !== color) { if (defaultIcon.color !== color) {
defaultIcon.color = color; defaultIcon.color = color;
chrome.browserAction.setBadgeBackgroundColor({color}); chrome.browserAction.setBadgeBackgroundColor({color});
} }
if (tabIcon.text !== text) { if (tabIcon.text !== text) {
tabIcon.text = text; tabIcon.text = text;
setTimeout(() => { setTimeout(() => {
@ -369,6 +370,23 @@ function updateIcon({tab, styles}) {
}); });
} }
} }
function loadIcon(src, resolve) {
if (!resolve) return new Promise(resolve => loadIcon(src, resolve));
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
const img = new Image();
img.src = src;
img.onload = () => {
const w = canvas.width = img.width;
const h = canvas.height = img.height;
ctx.clearRect(0, 0, w, h);
ctx.drawImage(img, 0, 0, w, h);
const data = ctx.getImageData(0, 0, w, h);
tabIcons.set(src, data);
resolve(data);
};
}
} }