59 lines
1.3 KiB
JavaScript
59 lines
1.3 KiB
JavaScript
const mist = new Howl({ src: ['mist.mp3'], autoplay: true, loop: true })
|
|
const swish = new Howl({ src: ['sound1.mp3'] })
|
|
|
|
const fadeTime = 1100
|
|
|
|
async function getImage() {
|
|
let response = await fetch('/getimage')
|
|
|
|
try {
|
|
return response.json()
|
|
} catch (e) {
|
|
console.error(e)
|
|
}
|
|
}
|
|
|
|
function createImage(data) {
|
|
const leftPos = Math.floor(Math.random() * (window.innerWidth - 200 + 1)) + 'px'
|
|
const topPos = Math.floor(Math.random() * (window.innerHeight - 200 + 1)) + 'px'
|
|
const newDiv = document.createElement('div')
|
|
|
|
newDiv.setAttribute('class', 'image')
|
|
newDiv.style.top = topPos
|
|
newDiv.style.left = leftPos
|
|
newDiv.innerHTML = `<img src="https://files.yyyyyyy.info/images/${data.file}" width="${data.width}" height="${data.height}">`
|
|
document.body.appendChild(newDiv)
|
|
|
|
setTimeout(() => {
|
|
newDiv.classList.add('visible')
|
|
swish.play()
|
|
}, 50)
|
|
|
|
return newDiv
|
|
}
|
|
|
|
function removeImage() {
|
|
const oldDiv = document.getElementsByClassName('image')[0]
|
|
|
|
oldDiv.classList.remove('visible')
|
|
setTimeout(() => {
|
|
oldDiv.parentNode.removeChild(oldDiv)
|
|
}, fadeTime)
|
|
}
|
|
|
|
async function cycleImage() {
|
|
const image = await getImage()
|
|
|
|
createImage(image.image[0])
|
|
swish.play()
|
|
}
|
|
|
|
mist.play()
|
|
cycleImage()
|
|
|
|
setInterval(() => {
|
|
setTimeout(() => {
|
|
removeImage()
|
|
}, 100)
|
|
cycleImage()
|
|
}, 6000)
|