class WindowsCompositor{
    static windowsLayer

    constructor(){
        this.windowLayer = document.body.querySelector('#windows-layer')
        WindowsCompositor.windowsLayer = document.body.querySelector('#windows-layer')
        if (!WebDesktopEnvironment.isMobile) {
            let startDrag = function(event) {
                let window = event.target.closest('.WindowFrame')
                WindowsCompositor.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)
                }
            }
            WindowsCompositor.windowsLayer.addEventListener('mousedown', startDrag)
        }
    }
    
    /**
     * @param {HTMLElement} window
    */
    static bringWindowToFront(window){ //FIXME
        let previousWindow = WindowsCompositor.windowsLayer.lastChild
        if (window == null || window == undefined){
            return
        }
        if (window != previousWindow){
            WindowsCompositor.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}/`);
    }
}