class Main {
    constructor() {
        this.object = {
            head: document.getElementsByTagName('head')[0],
            body: document.getElementsByTagName('body')[0]
        }
    }

    async Init() {
        await this.Get()
    }

    #Loading() {
        new Loading().Stop()
    }
    async Get(x) {
        const object = {
            session: document.cookie,
            url: window.location.href
        }
        this.fetch = '/'
        if (x) this.fetch = x

        await fetch(this.fetch, {
            method: 'post',
            body: JSON.stringify(object),
            headers: new Headers({
                'Content-Type': 'application/json'
            })
        })
            .then(res => res.json())
            .then(output => {
                this.output = output
                const section = document.getElementById('main')

                this.#LoadCSS(output.css).then(output => {
                    this.#Loading()
                    section.innerHTML = DOMPurify.sanitize(this.output.html)
                    this.output.js.map(file => {
                        const script = document.createElement('script')
                        script.src = `${window.location.origin}/js/${file}`
                        this.object.body.appendChild(script)
                    })
                })
            })
    }
    async #LoadCSS(files) {
        const promises = files.map(file => {
            return new Promise(res => {
                const link = document.createElement('link')
                link.rel = 'stylesheet'
                link.type = 'text/css'
                link.href = `${window.location.origin}/css/${file}`
                this.object.head.appendChild(link)
                link.onload = res
            })
        })
        return Promise.all(promises)
    }
}

new Main().Init()