mirror of
https://github.com/cheeaun/phanpy.git
synced 2025-02-08 17:16:25 +01:00
More queueMicrotask
This commit is contained in:
parent
f645815b84
commit
7fb0044471
1 changed files with 25 additions and 22 deletions
|
@ -62,29 +62,32 @@ function Avatar({ url, size, alt = '', squircle, ...props }) {
|
||||||
if (avatarRef.current) avatarRef.current.dataset.loaded = true;
|
if (avatarRef.current) avatarRef.current.dataset.loaded = true;
|
||||||
if (alphaCache[url] !== undefined) return;
|
if (alphaCache[url] !== undefined) return;
|
||||||
if (isMissing) return;
|
if (isMissing) return;
|
||||||
try {
|
queueMicrotask(() => {
|
||||||
// Check if image has alpha channel
|
try {
|
||||||
const { width, height } = e.target;
|
// Check if image has alpha channel
|
||||||
if (canvas.width !== width) canvas.width = width;
|
const { width, height } = e.target;
|
||||||
if (canvas.height !== height) canvas.height = height;
|
if (canvas.width !== width) canvas.width = width;
|
||||||
ctx.drawImage(e.target, 0, 0);
|
if (canvas.height !== height) canvas.height = height;
|
||||||
const allPixels = ctx.getImageData(0, 0, width, height);
|
ctx.drawImage(e.target, 0, 0);
|
||||||
// At least 10% of pixels have alpha <= 128
|
const allPixels = ctx.getImageData(0, 0, width, height);
|
||||||
const hasAlpha =
|
// At least 10% of pixels have alpha <= 128
|
||||||
allPixels.data.filter((pixel, i) => i % 4 === 3 && pixel <= 128)
|
const hasAlpha =
|
||||||
.length /
|
allPixels.data.filter(
|
||||||
(allPixels.data.length / 4) >
|
(pixel, i) => i % 4 === 3 && pixel <= 128,
|
||||||
0.1;
|
).length /
|
||||||
if (hasAlpha) {
|
(allPixels.data.length / 4) >
|
||||||
// console.log('hasAlpha', hasAlpha, allPixels.data);
|
0.1;
|
||||||
avatarRef.current.classList.add('has-alpha');
|
if (hasAlpha) {
|
||||||
|
// console.log('hasAlpha', hasAlpha, allPixels.data);
|
||||||
|
avatarRef.current.classList.add('has-alpha');
|
||||||
|
}
|
||||||
|
alphaCache[url] = hasAlpha;
|
||||||
|
ctx.clearRect(0, 0, width, height);
|
||||||
|
} catch (e) {
|
||||||
|
// Silent fail
|
||||||
|
alphaCache[url] = false;
|
||||||
}
|
}
|
||||||
alphaCache[url] = hasAlpha;
|
});
|
||||||
ctx.clearRect(0, 0, width, height);
|
|
||||||
} catch (e) {
|
|
||||||
// Silent fail
|
|
||||||
alphaCache[url] = false;
|
|
||||||
}
|
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
|
Loading…
Reference in a new issue