// Enable styling body background while using vue hotreload
// Tags with side effect (<script> and <style>) are ignored in client component templates.

const backgrounds = new Map();
backgrounds.set('default', "linear-gradient(#738ef2, white)");
backgrounds.set('/', "url(/static/radiocampus/backgrounds/photo-04-20.jpg) no-repeat center center fixed");


export default class BackgroundLoad {
    constructor () {
        let url = new URL(document.location)
        this.path = url.pathname
        this.update()
        document.addEventListener("pageLoaded", this.handlePageLoad.bind(this), false)
    }

    handlePageLoad (e) {
        this.path = e.detail
        this.update()
    }

    update () {
        let background = backgrounds.get(this.path) || backgrounds.get("default")
        document.body.style.background = background;
        document.body.style.backgroundSize = "cover";
    }
}
