108 lines
2.5 KiB
JavaScript
108 lines
2.5 KiB
JavaScript
import { loadEvents } from './events.js'
|
|
import { loadStatus } from './status.js'
|
|
import { scanlinesAnimation } from './cuteTexture.js'
|
|
import { noiseAnimation } from './cuteTexture.js'
|
|
import { loadCanvas } from './cuteTexture.js'
|
|
|
|
|
|
|
|
|
|
|
|
// =================================== background texture
|
|
loadCanvas();
|
|
let backgroundVideo = document.querySelector('main > #background');
|
|
|
|
let proxyTarget = {};
|
|
let proxyHandler = {
|
|
|
|
};
|
|
export let statusProxy = new Proxy(proxyTarget, {
|
|
set(obj, prop, value){
|
|
if(prop === 'lolStatus'){
|
|
if (value){
|
|
backgroundVideo.style.visibility = 'visible';
|
|
scanlinesAnimation();
|
|
return true
|
|
} else {
|
|
backgroundVideo.style.visibility = 'collapse';
|
|
noiseAnimation();
|
|
return true
|
|
}
|
|
}
|
|
}
|
|
})
|
|
|
|
statusProxy.lolStatus = false;
|
|
|
|
//console.log(proxyTarget.lolStatus);
|
|
|
|
|
|
// ======================================== events & statut d'ouverture
|
|
loadEvents();
|
|
loadStatus();
|
|
|
|
// ======================================== floating event window
|
|
|
|
let target = document.querySelector('#posterWindow');
|
|
|
|
let startTarget = target.querySelector('.posterTitle');
|
|
|
|
console.log('selected target :', startTarget);
|
|
|
|
let startX, startY;
|
|
let clicked = false;
|
|
|
|
startTarget.addEventListener('mousedown', (event) => {
|
|
startX = event.pageX;
|
|
startY = event.pageY;
|
|
clicked = true;
|
|
console.log('clicking...')
|
|
})
|
|
|
|
document.addEventListener('mousemove', (event) => {
|
|
if(clicked){
|
|
console.log('moving...')
|
|
let currentX = event.pageX;
|
|
let currentY = event.pageY;
|
|
let moveX = target.offsetLeft + currentX - startX;
|
|
target.style.left = moveX + 'px';
|
|
let moveY = target.offsetTop + currentY - startY;
|
|
target.style.top = moveY + 'px';
|
|
startX = currentX;
|
|
startY = currentY;
|
|
}
|
|
});
|
|
|
|
document.addEventListener('mouseup', () => {
|
|
console.log('STOP !')
|
|
clicked = false;
|
|
})
|
|
|
|
|
|
//================================ tentative de gestion des écran tactiles
|
|
startTarget.addEventListener('touchstart', (event) => {
|
|
startX = event.pageX;
|
|
startY = event.pageY;
|
|
clicked = true;
|
|
console.log('touching...')
|
|
})
|
|
|
|
document.addEventListener('touchmove', (event) => {
|
|
if(clicked){
|
|
console.log('moving...')
|
|
let currentX = event.pageX;
|
|
let currentY = event.pageY;
|
|
let moveX = target.offsetLeft + currentX - startX;
|
|
target.style.left = moveX + 'px';
|
|
let moveY = target.offsetTop + currentY - startY;
|
|
target.style.top = moveY + 'px';
|
|
startX = currentX;
|
|
startY = currentY;
|
|
}
|
|
});
|
|
|
|
document.addEventListener('touchend', () => {
|
|
console.log('STOP !')
|
|
clicked = false;
|
|
})
|