diff --git a/css/hues-res.css b/css/hues-res.css index 1ed528d..2c8c186 100644 --- a/css/hues-res.css +++ b/css/hues-res.css @@ -169,13 +169,18 @@ display: none; } +.res-button.loaded { + background-color: rgba(0,127,0,0.5); + cursor: auto; +} + .res-button:hover { background: rgba(255,255,255, 0.5); } -.res-button.loaded { - background-color: rgb(0,127,0,0.5); - cursor: auto; +.res-button.loaded:hover { + background-color: rgba(0,127,0,0.5); + cursor: default; } #res-countscontainer { diff --git a/js/ResourceManager.js b/js/ResourceManager.js index 3457878..ecdf91f 100644 --- a/js/ResourceManager.js +++ b/js/ResourceManager.js @@ -109,19 +109,19 @@ Resources.prototype.addAll = function(urls, callback, progressCallback) { Resources.prototype.createProgCallback = function(i) { var that = this; - return function(progress) { + return function(progress, pack) { that.progressState[i] = progress; - that.updateProgress(); + that.updateProgress(pack); } } -Resources.prototype.updateProgress = function() { +Resources.prototype.updateProgress = function(pack) { var total = 0; for(var i = 0; i < this.progressState.length; i++) { total += this.progressState[i]; } total /= this.progressState.length; - this.progressCallback(total); + this.progressCallback(total, pack); } Resources.prototype.addPack = function(pack) { @@ -774,19 +774,51 @@ Resources.prototype.selectRemotePack = function(id) { Resources.prototype.loadCurrentRemote = function() { var pack = this.packView.pack; + var that = this; // Not actually a remote, ignore. How did you press this :< if(pack.loaded == undefined || pack.loaded) { return; } + // TODO Error checking on failure + pack.loaded = true; + that.packsView.loadRemote.className = "res-button loaded"; + that.packsView.loadRemote.textContent = "LOADING"; this.addAll([pack.url], function() { - pack.loaded = true; - this.packsView.loadRemote.className = "res-button loaded"; - }, null + that.remoteComplete(); + }, function(progress, respack) {that.remoteProgress(progress, respack);} ); } +Resources.prototype.remoteProgress = function(progress, respack) { + if(progress < 0.5) { + this.packsView.progressStatus.textContent = "Downloading..."; + this.packsView.progressCurrent.textContent = Math.round(respack.downloaded / 1024) + "b"; + this.packsView.progressTop.textContent = Math.round(respack.size / 1024) + "b"; + this.packsView.progressBar.style.width = (progress * 2 * 100) + "%"; + this.packsView.progressPercent.textContent = Math.round(progress * 2 * 100) + "%"; + } else { + this.packsView.progressStatus.textContent = "Processing..."; + this.packsView.progressCurrent.textContent = respack.filesLoaded; + this.packsView.progressTop.textContent = respack.filesToLoad; + this.packsView.progressBar.style.width = ((progress - 0.5) * 2 * 100) + "%"; + this.packsView.progressPercent.textContent = Math.round((progress - 0.5) * 2 * 100) + "%"; + } +} + +Resources.prototype.remoteComplete = function(progress) { + var progStat = this.packsView.progressStatus; + progStat.textContent = "Complete"; + window.setTimeout(function() {progStat.textContent = "Idle";}, 2000); + this.packsView.loadRemote.textContent = "LOADED"; + + this.packsView.progressBar.style.width = "100%"; + this.packsView.progressCurrent.textContent = "0b"; + this.packsView.progressTop.textContent = "0b"; + this.packsView.progressPercent.textContent = "0%"; +} + Resources.prototype.appendSimpleListItem = function(value, root, onclick) { var div = document.createElement("div"); div.className = "res-listitem"; diff --git a/js/ResourcePack.js b/js/ResourcePack.js index aabd582..e772f6a 100644 --- a/js/ResourcePack.js +++ b/js/ResourcePack.js @@ -38,6 +38,7 @@ function Respack(url) { this.link = null; this.size = -1; + this.downloaded = -1; this.enabled = true; this._songFile = null; @@ -89,9 +90,11 @@ Respack.prototype.loadFromURL = function(url, callback, progress) { } req.onprogress = function(event) { if (event.lengthComputable) { + that.size = event.total; + that.downloaded = event.loaded; var percent = event.loaded / event.total; if(progress) { - progress(percent / 2); // because of processing too + progress(percent / 2, that); // because of processing too } } else { // Unable to compute progress information since the total size is unknown