diff options
| -rw-r--r-- | src/app/css/grid.css | 7 | ||||
| -rw-r--r-- | src/app/index.html | 17 | ||||
| -rw-r--r-- | src/app/js/browser.js | 81 | ||||
| -rw-r--r-- | src/app/js/mods.js | 59 |
4 files changed, 120 insertions, 44 deletions
diff --git a/src/app/css/grid.css b/src/app/css/grid.css index 6622762..cf86660 100644 --- a/src/app/css/grid.css +++ b/src/app/css/grid.css @@ -15,6 +15,13 @@ transition: 0.15s ease-in-out; } +.grid .el.no-animation, +.popup .misc.no-animation, +.popup .loading.no-animation { + opacity: 1.0; + animation-name: none; +} + .grid .el, .popup #search, .popup #close, .popup .misc button, .option .actions select, .option .actions input { diff --git a/src/app/index.html b/src/app/index.html index 30bee9e..52ac532 100644 --- a/src/app/index.html +++ b/src/app/index.html @@ -227,17 +227,16 @@ </div> <div id="nsMods" class="hidden section"> <div id="modsdiv" class="grid"> - <div class="line"> - <div class="text" id="modcount">%%gui.mods%%</div> - <div class="buttons modbtns"> - <button id="removeall" class="bg-red2" onclick="mods.remove('allmods')">%%gui.mods.removeall%%</button> - <button id="toggleall" class="bg-orange2" onclick="mods.toggle('allmods')">%%gui.mods.toggleall%%</button> - <button id="installmod" class="bg-blue" onclick="installmod()">%%gui.mods.install%%</button> - <button id="findmod" class="bg-blue2" onclick="Browser.toggle(true)">%%gui.mods.find%%</button> + <div class="line"> + <div class="text" id="modcount">%%gui.mods%%</div> + <div class="buttons modbtns"> + <button id="removeall" class="bg-red2" onclick="mods.remove('allmods')">%%gui.mods.removeall%%</button> + <button id="toggleall" class="bg-orange2" onclick="mods.toggle('allmods')">%%gui.mods.toggleall%%</button> + <button id="installmod" class="bg-blue" onclick="installmod()">%%gui.mods.install%%</button> + <button id="findmod" class="bg-blue2" onclick="Browser.toggle(true)">%%gui.mods.find%%</button> + </div> </div> </div> - - </div> </div> <div id="nsRelease" class="hidden section"></div> </div> diff --git a/src/app/js/browser.js b/src/app/js/browser.js index c859024..ece28bd 100644 --- a/src/app/js/browser.js +++ b/src/app/js/browser.js @@ -4,6 +4,8 @@ var packages = []; var packagecount = 0; +var mod_versions = {}; + var Browser = { maxentries: 50, filters: { @@ -108,6 +110,51 @@ var Browser = { overlay.classList.toggle("shown"); browser.classList.toggle("shown"); }, + install: (package_obj, clear_queue = false) => { + console.log(package_obj) + return installFromURL( + package_obj.download || package_obj.versions[0].download_url, + package_obj.dependencies || package_obj.versions[0].dependencies, + clear_queue, package_obj.owner + ) + }, + add_pkg_properties: () => { + for (let i = 0; i < packages.length; i++) { + let properties = packages[i]; + let normalized = normalize(packages[i].name); + + let has_update = false; + let local_version = false; + let remote_version = packages[i].versions[0].version_number; + remote_version = version.format(remote_version); + + for (let ii = 0; ii < modsobj.all.length; ii++) { + let mod = modsobj.all[ii]; + if (normalize(mod.Name) === normalized) { + local_version = version.format(mod.Version); + if (version.is_newer(remote_version, local_version)) { + has_update = true; + } + } + } + + let install = () => { + return Browser.install({...properties}); + } + + packages[i].install = install; + packages[i].has_update = has_update; + packages[i].local_version = local_version; + + if (local_version) { + mod_versions[normalized] = { + install: install, + has_update: has_update, + local_version: local_version + } + } + } + }, loadfront: async () => { Browser.loading(); @@ -116,6 +163,8 @@ var Browser = { if (packages.length < 1) { packages = await (await fetch("https://northstar.thunderstore.io/api/v1/package/")).json(); + Browser.add_pkg_properties(); + fuse = new Fuse(packages, { keys: ["full_name"] }) @@ -263,6 +312,8 @@ var Browser = { } } +setInterval(Browser.add_pkg_properties, 1500); + if (navigator.onLine) { Browser.loadfront(); } @@ -290,6 +341,7 @@ function BrowserElFromObj(obj) { let pkg = {...obj, ...obj.versions[0]}; new BrowserEl({ + pkg: pkg, title: pkg.name, image: pkg.icon, author: pkg.owner, @@ -329,31 +381,14 @@ function BrowserEl(properties) { normalized_mods.push(normalize(mods_list[i].Name)); } - if (normalized_mods.includes(normalize(properties.title))) { + if (properties.pkg.local_version) { installstr = lang("gui.browser.reinstall"); - if (version.is_newer(properties.version, modsobj.all[i].Version)) { + if (properties.pkg.has_update) { installstr = lang("gui.browser.update"); } - } else { - for (let i = 0; i < modsobj.all.length; i++) { - let title = normalize(properties.title); - let folder = normalize(modsobj.all[i].FolderName); - let manifestname = null; - if (modsobj.all[i].ManifestName) { - manifestname = normalize(modsobj.all[i].ManifestName); - } - - if (title.includes(folder) || title.includes(manifestname)) { - installstr = lang("gui.browser.reinstall"); - - if (version.is_newer(properties.version, modsobj.all[i].Version)) { - installstr = lang("gui.browser.update"); - } - } - } } - + let entry = document.createElement("div"); entry.classList.add("el"); entry.id = `mod-${normalize(properties.title)}`; @@ -374,11 +409,7 @@ function BrowserEl(properties) { ` entry.querySelector("button.install").addEventListener("click", () => { - installFromURL( - properties.download, - JSON.stringify(properties.dependencies), - true, properties.author - ) + Browser.install(properties); }) browserEntries.appendChild(entry); diff --git a/src/app/js/mods.js b/src/app/js/mods.js index a2e4492..c80221b 100644 --- a/src/app/js/mods.js +++ b/src/app/js/mods.js @@ -35,6 +35,7 @@ mods.load = (mods_obj) => { <div class="title">${mod.Name}</div> <div class="description">${mod.Description}</div> <button class="switch on orange"></button> + <button class="update bg-blue">${lang("gui.browser.update")}</button> <button class="bg-red" onclick="mods.remove('${mod.Name}')">Remove</button> <button class="visual">${mod.Version}</button> <button class="visual">by ${mod.Author || "Unknown"}</button> @@ -61,9 +62,47 @@ mods.load = (mods_obj) => { } let mod_els = document.querySelectorAll("#modsdiv .el"); + let mod_update_els = []; + for (let i = 0; i < mod_els.length; i++) { + let update_btn = mod_els[i].querySelector(".update"); + + if (update_btn && update_btn.style.display != "none") { + mod_update_els.push(mod_els[i].id); + } else { + break; + } + } + + for (let i = 0; i < mod_els.length; i++) { + let mod = mod_els[i].id.replace(/^mod-list-/, ""); + if (! normalized_names.includes(mod_els[i].id)) { mod_els[i].remove(); + return; + } + + if (mod_versions[mod] + && mod_versions[mod].has_update) { + + mod_els[i].querySelector(".update").style.display = null; + + mod_els[i].querySelector(".update").setAttribute( + "onclick", `mod_versions["${mod}"].install()` + ) + + if (mod_update_els.includes(mod_els[i].id)) { + continue; + } + + let mod_el = mod_els[i].cloneNode(true); + + mod_el.classList.add("no-animation"); + + mod_els[i].remove(); + modsdiv.querySelector(".line").after(mod_el); + } else { + mod_els[i].querySelector(".update").style.display = "none"; } } } @@ -83,15 +122,15 @@ mods.remove = (mod) => { } mods.toggle = (mod) => { - if (mod.match(/^Northstar\./)) { - if (! confirm(lang("gui.mods.required.confirm"))) { - return; - } - } else if (mod == "allmods") { - if (! confirm(lang("gui.mods.toggleall.confirm"))) { - return; - } - } + if (mod.match(/^Northstar\./)) { + if (! confirm(lang("gui.mods.required.confirm"))) { + return; + } + } else if (mod == "allmods") { + if (! confirm(lang("gui.mods.toggleall.confirm"))) { + return; + } + } - ipcRenderer.send("toggle-mod", mod); + ipcRenderer.send("toggle-mod", mod); } |