Collector/scripts/scene.js

// TODO:
// - Support removal of images
// - Add adjustable slideshow speed
// - Add image fading


let socket
let socketStatus = false

let jsonValid = (json) => {
    try {
        JSON.parse(json);
        if (json == null) {
            return false;
        }
    } catch (e) {
        return false;
    }
    return true;
}

let setWallpaper = (path) => {
    console.log(`Setting wallpaper to ${path}`)
    let wallpaper = document.getElementById('wallpaper')
    // wallpaper.src = path
    wallpaper.style.backgroundImage = `url(${path})`
}

let dumpStorage = () => {
    console.log('%cDumping Local Storage', 'color: #EBCB8B; font-family: monospace; font-size: 18px;')
    console.log('  Member:' + localStorage.getItem('member'))
    // console.log('  Token' + localStorage.getItem('token'))
    console.log('  System:' + localStorage.getItem('systemId'))
    console.log('  Socket:' + localStorage.getItem('socket'))
    console.log('  Wallpapers:' + localStorage.getItem('wallpapers'))
}

let grabLatestFronter = () => {
    let systemId = localStorage.getItem('systemId')
    if (systemId != null) {
        var xhr = new XMLHttpRequest()
        xhr.withCredentials = true
        xhr.addEventListener("readystatechange", function() {
        if(this.readyState === 4) {
            // console.log(this.responseText)
            let fronter = JSON.parse(this.responseText).members[0].id
            localStorage.setItem('member', fronter)
            console.log(`%cFronter: ${fronter}`, 'color: #ECEFF4; font-family: monospace;')
            pickWallpaper()
        }
        })
        xhr.open("GET", "https://api.pluralkit.me/v2/systems/"+systemId+"/fronters")
        xhr.send()
    }else{
        localStorage.setItem('member', 'null')
    }
}

let pickWallpaper = () => {
    let wallpapers = localStorage.getItem('wallpapers')
    if (jsonValid(wallpapers)) {
        wallpapers = JSON.parse(localStorage.getItem('wallpapers'))
    } else {
        wallpapers = []
        console.log('%cWallpapers not found in Local Storage', 'color: #BF616A; font-size: 18px; font-family: monospace;')
    }
    // for (let index = wallpapers.length-1; index >= 0; index--) {
    //     if (!wallpapers.includes(localStorage.getItem('member'))) {
    //         wallpapers.splice(index, 1)
    //     }
    // }
    let validWallpapers = []
    wallpapers.forEach(wp => {
        if (wp.includes(localStorage.getItem('member'))) {
            validWallpapers.push(wp)
        }
    })
    let wallpaper = "file:///" + validWallpapers[Math.floor(Math.random() * validWallpapers.length)]
    if (validWallpapers.length == 0) {
        wallpaper = "https://picsum.photos/3840/2160"
    }
    setWallpaper(wallpaper)
    setTimeout(() => {
        pickWallpaper()
    }, 30000)
}

let loadSocket = () => {
    console.log('%cLoading Socket', 'color: #ECEFF4; font-family: monospace;')
    if (socket){
        try {
            socket.close()
        } catch (error) {
            console.log('%cSocket not found', 'color: #BF616A; font-size: 18px; font-family: monospace;')
        }
    }
    socket = new WebSocket(localStorage.getItem('socket'))
    socket.onopen = (e) => {
        console.log('%cSocket Opened', 'color: #A3BE8C; font-size: 18px; font-family: serif;')
        socketStatus = true
    }
    socket.onmessage = (e) => {
        console.log('%cMessage Received', 'color: #ECEFF4; font-family: monospace;')

        // e.data contains member ID
        // console.dir(e)
        localStorage.setItem('member', e.data)
        pickWallpaper()

        // Copilot-generated Code
        // let data = JSON.parse(e.data)
        // if (data.type === 'wallpaper') {
        //     setWallpaper(data.path)
        // }
    }
    socket.onclose = (e) => {
        console.log('%cSocket Closed', 'color: #BF616A; font-size: 18px; font-family: serif;')
        socketStatus = false
        setTimeout(() => {
            loadSocket()
        }, 1200)
    }
    socket.onerror = (e) => {
        console.log('%cSocket Error', 'color: #BF616A; font-size: 18px; font-family: monospace;')
        console.dir(e)
    }
}

window.wallpaperPropertyListener = {
    applyUserProperties: function(properties) {
        // Grab PKit token, System ID, and Socket URI
        // if (properties.token) {
        //     // config.token = properties.token.value
        //     localStorage.setItem('token', properties.token.value)
        // }
        if (properties.systemid) {
            // config.systemId = properties.systemid.value
            localStorage.setItem('systemId', properties.systemid.value)
        }
        if (properties.uri) {
            // config.socket = properties.uri.value
            localStorage.setItem('socket', properties.uri.value)
        }
        dumpStorage()
        // Reload Socket
        if (socketStatus) {
            socketStatus = false
            socket.close()
        }
        loadSocket()
    },
    userDirectoryFilesAddedOrChanged: function(propertyName, changedFiles) {
        // Do something with the list of added files here
        // console.dir(propertyName)
        console.dir(changedFiles) // Array of filepaths added
        let wallpapers = localStorage.getItem('wallpapers')
        if (jsonValid(wallpapers)) {
            wallpapers = JSON.parse(localStorage.getItem('wallpapers'))
        } else {
            wallpapers = []
            console.log('%cWallpapers not found in Local Storage', 'color: #BF616A; font-size: 18px; font-family: monospace;')
        }
        changedFiles.forEach((file) => {
            if (!wallpapers.includes(file)) {
                wallpapers.push(file)
            }
        })
        localStorage.setItem('wallpapers', JSON.stringify(wallpapers))
    },
}

window.onload = () => {
    console.log("%cPage Loaded.", "background: #2E3440; color: #A3BE8C; font-size: 24px;")
    // Set default member
    dumpStorage()
    grabLatestFronter()
    loadSocket()
}