feat(webui): Add list of owned rivens (#241)

Co-authored-by: Sainan <Sainan@users.noreply.github.com>

static/webui/index.html

@@ -51,8 +51,12 @@
                 </div>
                 <div class="offcanvas-body">
                     <ul>
-                        <li><a href="/webui/inventory">Inventory</a></li>
+                        <li>
-                        <li><a href="/webui/mods">Mods</a></li>
+                            <a href="/webui/inventory" data-bs-dismiss="offcanvas" data-bs-target="#sidebar"
+                                >Inventory</a
+                            >
+                        </li>
+                        <li><a href="/webui/mods" data-bs-dismiss="offcanvas" data-bs-target="#sidebar">Mods</a></li>
                     </ul>
                 </div>
             </div>
@@ -87,7 +91,7 @@
                             <div class="card mb-4">
                                 <h5 class="card-header">Warframes</h5>
                                 <div class="card-body">
-                                    <table class="table table-striped w-100">
+                                    <table class="table table-hover w-100">
                                         <tbody id="warframe-list"></tbody>
                                     </table>
                                     <form class="input-group" onsubmit="doAcquireWarframe();return false;">
@@ -105,7 +109,7 @@
                             <div class="card mb-4">
                                 <h5 class="card-header">Weapons</h5>
                                 <div class="card-body">
-                                    <table class="table table-striped w-100">
+                                    <table class="table table-hover w-100">
                                         <tbody id="weapon-list"></tbody>
                                     </table>
                                     <form class="input-group" onsubmit="doAcquireWeapon();return false;">
@@ -139,6 +143,14 @@
                             <a href="https://riven.builds.wf/" target="_blank">Need help with the fingerprint?</a>
                         </form>
                     </div>
+                    <div class="card mb-4 col-xxl-6">
+                        <h5 class="card-header">Rivens</h5>
+                        <div class="card-body">
+                            <table class="table table-hover w-100">
+                                <tbody id="riven-list"></tbody>
+                            </table>
+                        </div>
+                    </div>
                 </div>
             </div>
         </div>
@@ -152,6 +164,7 @@
         ></script>
         <script src="https://cdn.jsdelivr.net/gh/angeal185/whirlpool-js/dist/whirlpool-js.min.js"></script>
         <script src="single.js"></script>
+        <script src="RivenParser.js"></script>
         <script src="script.js"></script>
         <script
             src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"

static/webui/script.js

@@ -95,6 +95,14 @@ window.itemListPromise = new Promise(resolve => {
     });
 });
 
+const rivenGenericCompatNames = {
+    "/Lotus/Weapons/Tenno/Archwing/Primary/ArchGun": "Archgun",
+    "/Lotus/Weapons/Tenno/Melee/PlayerMeleeWeapon": "Melee",
+    "/Lotus/Weapons/Tenno/Pistol/LotusPistol": "Pistol",
+    "/Lotus/Weapons/Tenno/Rifle/LotusRifle": "Rifle",
+    "/Lotus/Weapons/Tenno/Shotgun/LotusShotgun": "Shotgun"
+};
+
 function updateInventory() {
     const req = $.get("/api/inventory.php?" + window.authz);
     req.done(data => {
@@ -180,6 +188,65 @@ function updateInventory() {
                     document.getElementById("weapon-list").appendChild(tr);
                 });
             });
+
+            document.getElementById("riven-list").innerHTML = "";
+            data.Upgrades.forEach(item => {
+                if (item.ItemType.substr(0, 32) == "/Lotus/Upgrades/Mods/Randomized/") {
+                    const rivenType = item.ItemType.substr(32);
+                    const fingerprint = JSON.parse(item.UpgradeFingerprint);
+
+                    const tr = document.createElement("tr");
+                    {
+                        const td = document.createElement("td");
+                        td.textContent =
+                            itemMap[fingerprint.compat]?.name ??
+                            rivenGenericCompatNames[fingerprint.compat] ??
+                            fingerprint.compat;
+                        td.textContent += " " + RivenParser.parseRiven(rivenType, fingerprint, 1).name;
+                        td.innerHTML += " <span title='Number of buffs'>▲ " + fingerprint.buffs.length + "</span>";
+                        td.innerHTML += " <span title='Number of curses'>▼ " + fingerprint.curses.length + "</span>";
+                        td.innerHTML +=
+                            " <span title='Number of rerolls'>⟳ " + parseInt(fingerprint.rerolls) + "</span>";
+                        tr.appendChild(td);
+                    }
+                    {
+                        const td = document.createElement("td");
+                        td.classList = "text-end";
+                        {
+                            const a = document.createElement("a");
+                            a.href =
+                                "https://riven.builds.wf/#" +
+                                encodeURIComponent(
+                                    JSON.stringify({
+                                        rivenType: rivenType,
+                                        omegaAttenuation: 1,
+                                        fingerprint: fingerprint
+                                    })
+                                );
+                            a.target = "_blank";
+                            a.textContent = "View Stats";
+                            td.appendChild(a);
+                        }
+                        {
+                            const span = document.createElement("span");
+                            span.innerHTML = " &middot; ";
+                            td.appendChild(span);
+                        }
+                        {
+                            const a = document.createElement("a");
+                            a.href = "#";
+                            a.onclick = function (event) {
+                                event.preventDefault();
+                                disposeOfGear("Upgrades", item.ItemId.$oid);
+                            };
+                            a.textContent = "Remove";
+                            td.appendChild(a);
+                        }
+                        tr.appendChild(td);
+                    }
+                    document.getElementById("riven-list").appendChild(tr);
+                }
+            });
         });
     });
 }
@@ -272,7 +339,8 @@ function disposeOfGear(category, oid) {
     };
     data.Items[category] = [
         {
-            String: oid
+            String: oid,
+            Count: 0
         }
     ];
     revalidateAuthz(() => {
@@ -365,7 +433,8 @@ function doAcquireRiven() {
                                 FusionPointCost: 0
                             })
                         }).done(function () {
-                            alert("Successfully added.");
+                            $("#addriven-fingerprint").val("");
+                            updateInventory();
                         });
                         break;
                     }

static/webui/style.css

@@ -5,6 +5,12 @@
         gap: 1.5rem;
     }
 
+    body.logged-in #sidebar {
+        position: sticky;
+        top: 5rem;
+        height: 100px;
+    }
+
     body:not(.logged-in) #sidebar {
         display: none;
     }