diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/app/css/launcher.css | 16 | ||||
| -rw-r--r-- | src/app/main.js | 53 | ||||
| -rw-r--r-- | src/modules/update.js | 71 |
3 files changed, 128 insertions, 12 deletions
diff --git a/src/app/css/launcher.css b/src/app/css/launcher.css index 58b0c18..2b35dc2 100644 --- a/src/app/css/launcher.css +++ b/src/app/css/launcher.css @@ -178,6 +178,7 @@ color: white; padding: 20px; font-size: 24px; + overflow: hidden; font-weight: bold; margin-top: 100px; margin-bottom: 10px; @@ -185,6 +186,8 @@ background: var(--redbg); transition: 0.2s ease-in-out; filter: drop-shadow(0px 8px 5px rgba(0, 0, 0, 0.1)); + + --progress: 100%; } .contentContainer .playBtn:hover { @@ -197,6 +200,19 @@ filter: drop-shadow(0px 5px 10px rgba(0, 0, 0, 0.4)); } +.contentContainer .playBtn:before { + top: 0; + left: 0; + bottom: 0; + content: " "; + opacity: 0.5; + position: absolute; + right: var(--progress); + filter: brightness(1.5); + background: var(--bluebg); + transition: 0.2s ease-in-out; +} + .contentContainer #nsMain .playBtn { background: var(--bluebg); } diff --git a/src/app/main.js b/src/app/main.js index 44e15ce..3ee95ce 100644 --- a/src/app/main.js +++ b/src/app/main.js @@ -198,6 +198,41 @@ function setButtons(state, enable_gamepath_btns) { } } +// `percent` should be a number between 0 to 100, if it's `false` it'll +// reset it back to nothing instantly, with no animatino +function set_ns_progress(percent) { + // reset button progress + if (percent === false) { + document.querySelector(".contentContainer #nsMain .playBtn") + .style.setProperty("--progress", "unset"); + + return; + } + + percent = parseInt(percent); + + // make sure we're dealing with a number + if (isNaN(percent) || typeof percent !== "number") { + return false; + } + + // limit percent, while this barely has a difference, if you were to + // set a very high number, the CSS would then use a very high + // number, not great. + if (percent > 100) { + percent = 100; + } else if (percent < 0) { + percent = 0; + } + + // invert number to it works in the CSS + percent = 100 - percent; + + // set the CSS progress variable + document.querySelector(".contentContainer #nsMain .playBtn") + .style.setProperty("--progress", percent + "%"); +} + ipcRenderer.on("set-buttons", (event, state) => { setButtons(state); }) @@ -209,16 +244,30 @@ ipcRenderer.on("gamepath-lost", (event, state) => { }) // Frontend part of updating Northstar -ipcRenderer.on("ns-update-event", (event, key) => { +ipcRenderer.on("ns-update-event", (event, options) => { + let key = options.key; + if (typeof options == "string") { + key = options; + } + document.getElementById("update").innerText = `(${lang(key)})`; - console.log(lang(key)); + switch(key) { case "cli.update.uptodate_short": case "cli.update.no_internet": setButtons(true); + set_ns_progress(false); playNsBtn.innerText = lang("gui.launch"); break; default: + if (options.progress) { + set_ns_progress(options.progress); + } + + if (options.btn_text) { + playNsBtn.innerText = options.btn_text; + } + setButtons(false); break; } diff --git a/src/modules/update.js b/src/modules/update.js index c2d10d3..881e02d 100644 --- a/src/modules/update.js +++ b/src/modules/update.js @@ -197,8 +197,30 @@ update.northstar = async (force_install) => { return false; } + let unknown_size = false; + let content_length_mb = 0.0; + let content_length = res.headers["content-length"]; + + // if content_length is `undefined`, we can't get the complete + // size (not all servers send the content-length) + if (content_length == undefined) { + unknown_size = true; + } else { + content_length = parseInt(content_length); + + if (isNaN(content_length)) { + unknown_size = true; + } else { + content_length_mb = (content_length / 1024 / 1024).toFixed(1); + } + } + console.info(lang("cli.update.downloading") + ":", latest_version); - ipcMain.emit("ns-update-event", "cli.update.downloading"); + ipcMain.emit("ns-update-event", { + progress: 0, + btn_text: "1/2", + key: "cli.update.downloading", + }); let tmp = path.dirname(settings.zip); @@ -217,11 +239,26 @@ update.northstar = async (force_install) => { res.pipe(stream); let received = 0; - // progress messages, we should probably switch this to - // percentage instead of how much is downloaded. res.on("data", (chunk) => { received += chunk.length; - ipcMain.emit("ns-update-event", lang("gui.update.downloading") + " " + (received / 1024 / 1024).toFixed(1) + "mb"); + let received_mb = (received / 1024 / 1024).toFixed(1); + + let percentage_str = ""; + let current_percentage = 0; + + let key = lang("gui.update.downloading") + " " + received_mb + "mb"; + + if (unknown_size === false) { + key += " / " + content_length_mb + "mb"; + current_percentage = Math.floor(received_mb / content_length_mb * 100); + percentage_str = " - " + current_percentage + "%"; + } + + ipcMain.emit("ns-update-event", { + key: key, + progress: current_percentage, + btn_text: "1/2" + percentage_str + }); }) stream.on("finish", () => { @@ -229,19 +266,33 @@ update.northstar = async (force_install) => { let extract = fs.createReadStream(settings.zip); win.log(lang("gui.update.extracting")); - ipcMain.emit("ns-update-event", "gui.update.extracting"); + ipcMain.emit("ns-update-event", { + progress: 0, + btn_text: "2/2 - 0%", + key: lang("gui.update.extracting") + }); + console.ok(lang("cli.update.download_done")); + // extracts the zip, this is the part where we're actually // installing Northstar. extract.pipe(unzip.Extract({path: settings.gamepath})) - let max = received; - received = 0; + let extracted = 0; + let size = received; + let size_mb = (size / 1024 / 1024).toFixed(1); extract.on("data", (chunk) => { - received += chunk.length; - let percent = Math.floor(received / max * 100); - ipcMain.emit("ns-update-event", lang("gui.update.extracting") + " " + percent + "%"); + extracted += chunk.length; + let percent = Math.floor(extracted / size * 100); + let extracted_mb = (extracted / 1024 / 1024).toFixed(1); + + ipcMain.emit("ns-update-event", { + progress: percent, + btn_text: "2/2 - " + percent + "%", + key: lang("gui.update.extracting") + + " " + extracted_mb + "mb / " + size_mb + "mb" + }); }) extract.on("end", () => { |