personal-website/front/src/decorat/desktop-decorat.js
2023-07-18 23:47:12 +03:00

54 lines
1.9 KiB
JavaScript

export default class DesktopDecorat{
/** @type {Element} */
#windowsLayer
constructor(){
this.windowLayer = document.body.querySelector('#windows-layer')
// this.#windowsLayer = document.body.querySelector('#windows-layer')
this.#windowsLayer = document.body.querySelector('#windows-layer')
let startDrag = function(event) {
let window = event.target.closest('.WindowFrame')
DesktopDecorat.bringWindowToFront(window)
if (event.target.classList.contains("DragArea")){
let xPosInit = event.offsetX
let yPosInit = event.offsetY
let dragWindow = function(event){
window.style.left = `${event.clientX - xPosInit}px`
window.style.top = `${event.clientY - yPosInit}px`
}
let stopDrag = function(){
removeEventListener('mousemove', dragWindow)
removeEventListener('mouseup', stopDrag)
}
addEventListener('mousemove', dragWindow)
addEventListener('mouseup', stopDrag)
}
}
this.#windowsLayer.addEventListener('mousedown', startDrag)
}
/**
* @param {HTMLElement} window
*/
static bringWindowToFront(window){ //FIXME
let previousWindow = this.#windowsLayer.lastChild
if (window == null || window == undefined){
return
}
if (window != previousWindow){
this.#windowsLayer.insertBefore(window, previousWindow.nextSibling)
previousWindow.classList.remove("Focused")
window.classList.add("Focused")
} else {
window.classList.add("Focused")
}
return
}
static ChangeURL(appWindow){
let appId = appWindow.getAttribute('appid')
window.history.replaceState(null, "", `/${appId}/`);
}
}