fix(download): ensure rangefetcher loads before abstractfile; skip queryString for blob; add Range probe

public/src/js/abstractfile.js

@@ -47,21 +47,33 @@ class RemoteFile{
 		}
 	}
 	arrayBuffer(){
-		return loader.ajax(this.url, request => {
-			request.responseType = "arraybuffer"
-		})
+		var name = this.name.toLowerCase()
+		if(name.endsWith(".ogg") || name.endsWith(".png") || name.endsWith(".gif") || name.endsWith(".tja") || name.endsWith(".osu")){
+			return RangeFetcher.fetchArrayBuffer(this.url, {concurrency: 4, chunkSize: 1048576}).catch(() => loader.ajax(this.url, request => { request.responseType = "arraybuffer" }))
+		}
+		return loader.ajax(this.url, request => { request.responseType = "arraybuffer" })
 	}
 	read(encoding){
 		if(encoding){
+			var name = this.name.toLowerCase()
+			if(name.endsWith(".tja") || name.endsWith(".osu")){
+				return RangeFetcher.fetchText(this.url, {concurrency: 4, chunkSize: 262144}).catch(() => this.blob().then(blob => readFile(blob, false, encoding)))
+			}
 			return this.blob().then(blob => readFile(blob, false, encoding))
 		}else{
+			var name = this.name.toLowerCase()
+			if(name.endsWith(".tja") || name.endsWith(".osu")){
+				return RangeFetcher.fetchText(this.url, {concurrency: 4, chunkSize: 262144}).catch(() => loader.ajax(this.url))
+			}
 			return loader.ajax(this.url)
 		}
 	}
 	blob(){
-		return loader.ajax(this.url, request => {
-			request.responseType = "blob"
-		})
+		var name = this.name.toLowerCase()
+		if(name.endsWith(".ogg") || name.endsWith(".png") || name.endsWith(".gif")){
+			return RangeFetcher.fetchBlob(this.url, {concurrency: 4, chunkSize: 1048576}).catch(() => loader.ajax(this.url, request => { request.responseType = "blob" }))
+		}
+		return loader.ajax(this.url, request => { request.responseType = "blob" })
 	}
 }
 class LocalFile{

public/src/js/assets.js

@@ -2,7 +2,6 @@ var assets = {
 	"js": [
 		"lib/md5.min.js",
 		"lib/fuzzysort.js",
-		"cookie.js",
 		"loadsong.js",
 		"parseosu.js",
 		"titlescreen.js",
@@ -37,6 +36,7 @@ var assets = {
 		"account.js",
 		"lyrics.js",
 		"customsongs.js",
+		"rangefetcher.js",
 		"abstractfile.js",
 		"idb.js",
 		"plugins.js",

public/src/js/cookie.js

@@ -1,41 +0,0 @@
-var cookie = {
-    get: function(name){
-        var pairs = document.cookie ? document.cookie.split("; ") : []
-        for(var i = 0; i < pairs.length; i++){
-            var idx = pairs[i].indexOf("=")
-            var key = idx > -1 ? pairs[i].slice(0, idx) : pairs[i]
-            if(key === name){
-                var val = idx > -1 ? pairs[i].slice(idx + 1) : ""
-                try{
-                    return decodeURIComponent(val)
-                }catch(e){
-                    return val
-                }
-            }
-        }
-        return null
-    },
-    set: function(name, value, maxAge){
-        var v = typeof value === "string" ? value : String(value)
-        document.cookie = name + "=" + encodeURIComponent(v) + ";path=/" + (maxAge ? ";max-age=" + maxAge : "")
-    },
-    getJSON: function(name){
-        var v = this.get(name)
-        if(!v){
-            return {}
-        }
-        try{
-            return JSON.parse(v)
-        }catch(e){
-            return {}
-        }
-    },
-    updateJSON: function(name, updater, maxAge){
-        var obj = this.getJSON(name)
-        var next = updater && updater(obj) || obj
-        try{
-            this.set(name, JSON.stringify(next), maxAge)
-        }catch(e){}
-        return next
-    }
-}

public/src/js/loader.js

@@ -23,8 +23,8 @@ class Loader{
 		
 		Promise.all(promises).then(this.run.bind(this))
 	}
-	run(){
-		this.promises = []
+		run(){
+			this.promises = []
 		this.loaderDiv = document.querySelector("#loader")
 		this.loaderPercentage = document.querySelector("#loader .percentage")
 		this.loaderProgress = document.querySelector("#loader .progress")
@@ -35,12 +35,10 @@ class Loader{
 			this.addPromise(this.loadScript(gameConfig.custom_js), gameConfig.custom_js)
 		}
 		var oggSupport = new Audio().canPlayType("audio/ogg;codecs=vorbis")
-		if(!oggSupport){
-			assets.js.push("lib/oggmented-wasm.js")
-		}
-		assets.js.forEach(name => {
-			this.addPromise(this.loadScript("src/js/" + name), "src/js/" + name)
-		})
+			if(!oggSupport){
+				assets.js.push("lib/oggmented-wasm.js")
+			}
+			this.addPromise(this.prefetchAndLoadScripts(assets.js), "src/js/*")
 		
 		var pageVersion = versionLink.href
 		var index = pageVersion.lastIndexOf("/")
@@ -399,6 +397,26 @@ class Loader{
 			}, e => this.errorMsg(e))
 		})
 	}
+	prefetchAndLoadScripts(names){
+		var urls = names.map(name => "src/js/" + name + this.queryString)
+		var fetches = urls.map(url => this.ajax(url, r => { r.responseType = "arraybuffer" }))
+		return Promise.all(fetches).then(buffers => {
+			var chain = Promise.resolve()
+			for(let i=0;i<buffers.length;i++){
+				chain = chain.then(() => {
+					var blob = new Blob([buffers[i]], {type: "application/javascript"})
+					var u = URL.createObjectURL(blob)
+					return this.loadScript(u).then(() => { URL.revokeObjectURL(u) })
+				})
+			}
+			return chain
+		}).catch(() => {
+			names.forEach(name => {
+				this.addPromise(this.loadScript("src/js/" + name), "src/js/" + name)
+			})
+			return Promise.resolve()
+		})
+	}
 	addPromise(promise, url){
 		this.promises.push(promise)
 		promise.then(this.assetLoaded.bind(this), response => {
@@ -558,7 +576,8 @@ class Loader{
 	}
 	loadScript(url){
 		var script = document.createElement("script")
-		var url = url + this.queryString
+		var isBlob = typeof url === "string" && (url.startsWith("blob:") || url.startsWith("data:"))
+		var url = isBlob ? url : (url + this.queryString)
 		var promise = pageEvents.load(script)
 		script.src = url
 		document.head.appendChild(script)

public/src/js/rangefetcher.js

@@ -0,0 +1,130 @@
+var RangeFetcher = {
+    _head: function(url){
+        return new Promise(function(resolve){
+            var r = new XMLHttpRequest()
+            r.open("HEAD", url)
+            r.onreadystatechange = function(){
+                if(r.readyState === 4){
+                    var len = parseInt(r.getResponseHeader("Content-Length")) || null
+                    var ranges = r.getResponseHeader("Accept-Ranges") || ""
+                    resolve({length: len, acceptRanges: /bytes/i.test(ranges)})
+                }
+            }
+            r.onerror = function(){ resolve({length: null, acceptRanges: false}) }
+            r.send()
+        })
+    },
+    _getRange: function(url, start, end, responseType){
+        return new Promise(function(resolve, reject){
+            var r = new XMLHttpRequest()
+            r.open("GET", url)
+            r.responseType = responseType || "arraybuffer"
+            r.setRequestHeader("Range", "bytes=" + start + "-" + end)
+            r.onload = function(){
+                if(r.status === 206 || r.status === 200){
+                    resolve(r.response)
+                }else{
+                    reject(r.status)
+                }
+            }
+            r.onerror = function(){ reject("network") }
+            r.send()
+        })
+    },
+    _getAll: function(url, responseType){
+        return new Promise(function(resolve, reject){
+            var r = new XMLHttpRequest()
+            r.open("GET", url)
+            r.responseType = responseType || "arraybuffer"
+            r.onload = function(){
+                if(r.status === 200){
+                    resolve(r.response)
+                }else{
+                    reject(r.status)
+                }
+            }
+            r.onerror = function(){ reject("network") }
+            r.send()
+        })
+    },
+    _probeRange: function(url){
+        return new Promise(function(resolve){
+            var r = new XMLHttpRequest()
+            r.open("GET", url)
+            r.responseType = "arraybuffer"
+            r.setRequestHeader("Range", "bytes=0-0")
+            r.onload = function(){
+                var ok = r.status === 206 && !!r.getResponseHeader("Content-Range")
+                resolve(ok)
+            }
+            r.onerror = function(){ resolve(false) }
+            r.send()
+        })
+    },
+    _runConcurrent: function(tasks, limit){
+        return new Promise(function(resolve, reject){
+            var i = 0
+            var running = 0
+            var results = []
+            var done = 0
+            function next(){
+                while(running < limit && i < tasks.length){
+                    var idx = i++
+                    running++
+                    tasks[idx]().then(function(res){
+                        results[idx] = res
+                        running--
+                        done++
+                        if(done === tasks.length){ resolve(results) }
+                        else{ next() }
+                    }, function(e){ reject(e) })
+                }
+            }
+            next()
+        })
+    },
+    fetchArrayBuffer: function(url, opts){
+        opts = opts || {}
+        var concurrency = opts.concurrency || 4
+        var minChunk = opts.chunkSize || 1048576
+        var self = this
+        return this._head(url).then(function(info){
+            if(!info.length || info.length < minChunk){
+                return self._getAll(url, "arraybuffer")
+            }
+            if(!info.acceptRanges){
+                return self._probeRange(url).then(function(supported){
+                    if(!supported){
+                        return self._getAll(url, "arraybuffer")
+                    }
+                    return supported
+                })
+            }
+            var total = info.length
+            var parts = Math.ceil(total / minChunk)
+            parts = Math.max(1, Math.min(parts, 16))
+            var tasks = []
+            for(var p=0; p<parts; p++){
+                var start = p * Math.floor(total / parts)
+                var end = p === parts - 1 ? total - 1 : ( (p+1) * Math.floor(total / parts) ) - 1
+                tasks.push(function(s, e){ return function(){ return self._getRange(url, s, e, "arraybuffer") } }(start, end))
+            }
+            return self._runConcurrent(tasks, concurrency).then(function(buffers){
+                var out = new Uint8Array(total)
+                var offset = 0
+                for(var p=0; p<buffers.length; p++){
+                    var b = new Uint8Array(buffers[p])
+                    out.set(b, offset)
+                    offset += b.byteLength
+                }
+                return out.buffer
+            })
+        })
+    },
+    fetchBlob: function(url, opts){
+        return this.fetchArrayBuffer(url, opts).then(function(buf){ return new Blob([buf]) })
+    },
+    fetchText: function(url, opts){
+        return this.fetchBlob(url, opts).then(function(blob){ return blob.text() })
+    }
+}

public/src/js/scoresheet.js

@@ -940,7 +940,7 @@ class Scoresheet{
 				delete this.resultsObj.title
 				delete this.resultsObj.difficulty
 				delete this.resultsObj.gauge
-		scoreStorage.add(hash, difficulty, this.resultsObj, true, title).catch(() => {
+				scoreStorage.add(hash, difficulty, this.resultsObj, true, title).catch(() => {
 					this.showWarning = {name: "scoreSaveFailed"}
 				})
 			}else if(oldScore && (crown === "gold" && oldScore.crown !== "gold" || crown && !oldScore.crown)){
@@ -949,21 +949,6 @@ class Scoresheet{
 					this.showWarning = {name: "scoreSaveFailed"}
 				})
 			}
-			var key = "taiko_best_records"
-			var obj = cookie.getJSON(key)
-			if(!(hash in obj)){
-				obj[hash] = {}
-			}
-			var prev = obj[hash][difficulty]
-			var total = this.resultsObj.good + this.resultsObj.ok + this.resultsObj.bad
-			var acc = total > 0 ? Math.round(((this.resultsObj.good + this.resultsObj.ok) / total) * 1000) / 10 : 0
-			var combo = this.resultsObj.maxCombo || 0
-			var points = this.resultsObj.points || 0
-			var update = !prev || points > prev.score || (points === prev.score && (acc > prev.accuracy || combo > prev.combo))
-			if(update){
-				obj[hash][difficulty] = {score: points, accuracy: acc, combo: combo, updatedAt: Date.now()}
-				try{ cookie.set(key, JSON.stringify(obj), 31536000) }catch(e){}
-			}
 		}
 		this.scoreSaved = true
 	}

public/src/js/songselect.js

@@ -1989,37 +1989,6 @@ class SongSelect{
 									})
 								}
 							}
-							var recAll = cookie.getJSON("taiko_best_records")
-							var bySong = recAll[currentSong.hash] || null
-							var diffName = currentUra ? "ura" : this.difficultyId[i]
-							var rec = bySong && bySong[diffName] || null
-							var elapsedMS2 = Math.max(this.state.screenMS, this.state.moveMS, this.state.mouseMoveMS)
-							var cycle = Math.floor(((ms - elapsedMS2) % 6000) / 2000)
-							var label = ""
-							if(rec){
-								if(cycle === 0){
-									label = (strings.bestAccuracy || "良率") + " " + (Math.round(rec.accuracy * 10) / 10) + "%"
-								}else if(cycle === 1){
-									label = (strings.bestCombo || "连打数") + " " + rec.combo
-								}else{
-									label = (strings.bestScore || "总分") + " " + rec.score
-								}
-							}else{
-								label = (strings.none || "无")
-							}
-							this.draw.verticalText({
-								ctx: ctx,
-								text: label,
-								x: _x,
-								y: songSel ? _y + 220 : _y + 265,
-								width: songSel ? 44 : 56,
-								height: songSel ? 120 : 135,
-								fill: currentUra ? "#fff" : "#000",
-								outline: currentUra ? "#003C52" : false,
-								outlineSize: currentUra ? this.songAsset.letterBorder : 0,
-								fontSize: songSel ? 22 : 24,
-								fontFamily: this.font
-							})
 						}
 						var currentDiff = this.selectedDiff - this.diffOptions.length
 						if(this.selectedDiff === 4 + this.diffOptions.length){

public/src/js/strings.js

@@ -67,27 +67,6 @@ var translations = {
 		tw: "選擇難度",
 		ko: "난이도 선택"
 	},
-	bestAccuracy: {
-		ja: "良率",
-		en: "Accuracy",
-		cn: "良率",
-		tw: "良率",
-		ko: "정확도"
-	},
-	bestCombo: {
-		ja: "連打数",
-		en: "Max Combo",
-		cn: "连打数",
-		tw: "連打數",
-		ko: "최대 콤보"
-	},
-	bestScore: {
-		ja: "総得点",
-		en: "Score",
-		cn: "总分",
-		tw: "總分",
-		ko: "총점"
-	},
 	back: {
 		ja: "もどる",
 		en: "Back",