107 lines
No EOL
3.3 KiB
JavaScript
107 lines
No EOL
3.3 KiB
JavaScript
import { CiderCache } from "./cidercache.js"
|
|
|
|
async function spawnMica() {
|
|
if (typeof window.micaSpawned !== "undefined") {
|
|
return
|
|
} else {
|
|
window.micaSpawned = true
|
|
}
|
|
const micaDiv = document.createElement('div');
|
|
const blurIterations = 6
|
|
micaDiv.id = 'micaEffect';
|
|
micaDiv.style.position = "fixed"
|
|
micaDiv.style.top = "0"
|
|
micaDiv.style.left = "0"
|
|
micaDiv.style.right = "0"
|
|
micaDiv.style.bottom = "0"
|
|
micaDiv.style.zIndex = -1
|
|
|
|
let lastScreenX;
|
|
let lastScreenY;
|
|
let lastScreenWidth;
|
|
let lastScreenHeight;
|
|
|
|
let regen = true
|
|
let imgSrc = await ipcRenderer.sendSync("get-wallpaper")
|
|
|
|
let micaCache = await CiderCache.getCache("mica-cache")
|
|
if (!micaCache) {
|
|
micaCache = {
|
|
path: "",
|
|
data: ""
|
|
}
|
|
}
|
|
if (micaCache.path == imgSrc.path) {
|
|
regen = false
|
|
imgSrc = micaCache
|
|
}
|
|
let canvas = document.createElement('canvas');
|
|
let ctx = canvas.getContext('2d');
|
|
let img = new Image();
|
|
img.src = imgSrc.data;
|
|
img.onload = function () {
|
|
canvas.width = img.width;
|
|
canvas.height = img.height;
|
|
ctx.drawImage(img, 0, 0);
|
|
if (regen) {
|
|
for (let i = 0; i < blurIterations; i++) {
|
|
StackBlur.canvasRGB(canvas, 0, 0, img.width, img.height, 128);
|
|
}
|
|
micaCache.path = imgSrc.path
|
|
micaCache.data = canvas.toDataURL()
|
|
CiderCache.putCache("mica-cache", micaCache)
|
|
}
|
|
let imgData = ctx.getImageData(0, 0, canvas.width, canvas.height);
|
|
micaDiv.style.backgroundImage = `url(${micaCache.data})`;
|
|
document.body.appendChild(micaDiv);
|
|
// on animation finished set animation to unset
|
|
micaDiv.addEventListener('animationend', function () {
|
|
micaDiv.style.opacity = '1';
|
|
micaDiv.style.animation = 'unset';
|
|
})
|
|
}
|
|
|
|
|
|
function onScreenMove(cb) {
|
|
function detectScreenMove() {
|
|
if (lastScreenY !== window.screenY || lastScreenX !== window.screenX) {
|
|
lastScreenY = window.screenY;
|
|
lastScreenX = window.screenX;
|
|
cb();
|
|
}
|
|
// window size change
|
|
if (lastScreenWidth !== window.innerWidth || lastScreenHeight !== window.innerHeight) {
|
|
lastScreenWidth = window.innerWidth;
|
|
lastScreenHeight = window.innerHeight;
|
|
cb();
|
|
}
|
|
if (true) {
|
|
requestAnimationFrame(detectScreenMove);
|
|
}
|
|
}
|
|
|
|
if (true) {
|
|
requestAnimationFrame(detectScreenMove);
|
|
}
|
|
}
|
|
|
|
onScreenMove(function () {
|
|
const screenHeight = window.screen.height;
|
|
const screenWidth = window.screen.width;
|
|
const windowHeight = window.innerHeight;
|
|
const windowWidth = window.innerWidth;
|
|
const ratio = windowWidth / windowHeight;
|
|
const x = window.screenX;
|
|
const y = window.screenY;
|
|
micaDiv.style.backgroundSize = `${screenWidth}px ${screenHeight}px`;
|
|
// micaDiv.style.backgroundPosition = `-${x}px -${y}px`;
|
|
if (x < 0) {
|
|
micaDiv.style.backgroundPosition = `${screenWidth + x}px -${y}px`;
|
|
} else {
|
|
micaDiv.style.backgroundPosition = `-${x}px -${y}px`;
|
|
}
|
|
});
|
|
return true
|
|
}
|
|
|
|
export { spawnMica } |