104 lines
2.8 KiB
JavaScript
104 lines
2.8 KiB
JavaScript
class Loader{
|
|
constructor(){
|
|
this.loadedAssets = 0
|
|
this.errorCount = 0
|
|
this.assetsDiv = document.getElementById("assets")
|
|
this.promises = []
|
|
$("#screen").load("/src/views/loader.html", () => {
|
|
this.run()
|
|
})
|
|
}
|
|
run(){
|
|
this.loaderPercentage = document.querySelector("#loader .percentage")
|
|
|
|
assets.fonts.forEach(name => {
|
|
var font = document.createElement("h1")
|
|
font.style.fontFamily = name
|
|
font.appendChild(document.createTextNode("I am a font"))
|
|
this.assetsDiv.appendChild(font)
|
|
this.promises.push(new Promise((resolve, reject) => {
|
|
FontDetect.onFontLoaded(name, resolve, reject, {msTimeout: 90000})
|
|
}))
|
|
})
|
|
|
|
assets.img.forEach(name => {
|
|
var id = name.substr(0, name.length - 4)
|
|
var image = document.createElement("img")
|
|
this.promises.push(promiseLoad(image))
|
|
image.id = name
|
|
image.src = "/assets/img/" + name
|
|
this.assetsDiv.appendChild(image)
|
|
assets.image[id] = image
|
|
})
|
|
|
|
snd.buffer = new SoundBuffer()
|
|
snd.musicGain = snd.buffer.createGain()
|
|
snd.sfxGain = snd.buffer.createGain()
|
|
snd.buffer.setCrossfade(snd.musicGain, snd.sfxGain, 0.5)
|
|
snd.previewGain = snd.buffer.createGain()
|
|
snd.previewGain.setVolume(0.5)
|
|
|
|
assets.audioSfx.forEach(name => {
|
|
var id = name.substr(0, name.length-4)
|
|
this.promises.push(snd.sfxGain.load("/assets/audio/" + name).then(sound => {
|
|
assets.sounds[id] = sound
|
|
}))
|
|
})
|
|
assets.audioMusic.forEach(name => {
|
|
var id = name.substr(0, name.length-4)
|
|
this.promises.push(snd.musicGain.load("/assets/audio/" + name).then(sound => {
|
|
assets.sounds[id] = sound
|
|
}))
|
|
})
|
|
|
|
this.promises.push(ajax("/api/songs").then(songs => {
|
|
assets.songs = JSON.parse(songs)
|
|
}))
|
|
|
|
this.promises.forEach(promise => {
|
|
promise.then(() => {
|
|
this.assetLoaded()
|
|
}, () => {
|
|
this.errorMsg()
|
|
})
|
|
})
|
|
|
|
Promise.all(this.promises).then(() => {
|
|
new Titlescreen()
|
|
})
|
|
}
|
|
errorMsg(){
|
|
if(this.errorCount == 0){
|
|
this.loaderPercentage.appendChild(document.createElement("br"))
|
|
this.loaderPercentage.appendChild(document.createTextNode("An error occurred, please refresh"))
|
|
}
|
|
this.errorCount++
|
|
}
|
|
assetLoaded(){
|
|
this.loadedAssets++
|
|
var percentage = parseInt(this.loadedAssets * 100 / this.promises.length)
|
|
document.querySelector("#loader .progress").style.width = percentage + "%"
|
|
this.loaderPercentage.firstChild.data = percentage + "%"
|
|
}
|
|
}
|
|
function ajax(url){
|
|
return new Promise((resolve, reject) => {
|
|
var request = new XMLHttpRequest()
|
|
request.open("GET", url)
|
|
promiseLoad(request).then(() => {
|
|
resolve(request.response)
|
|
}, reject)
|
|
request.send()
|
|
})
|
|
}
|
|
function promiseLoad(asset){
|
|
return new Promise((resolve, reject) => {
|
|
asset.addEventListener("load", resolve)
|
|
asset.addEventListener("error", reject)
|
|
asset.addEventListener("abort", reject)
|
|
})
|
|
}
|
|
|
|
var snd = {}
|
|
new Loader()
|