feat(webui): add Mods card #252

Merged
Sainan merged 4 commits from webui-mods into main 2024-06-01 03:57:27 -07:00
3 changed files with 237 additions and 36 deletions
Showing only changes of commit 146af7b203 - Show all commits

View File

@ -1,16 +1,19 @@
import { RequestHandler } from "express";
import { MinItem, warframes, weapons, items } from "@/src/services/itemDataService";
import badItems from "@/static/json/exclude-mods.json";
interface ListedItem {
uniqueName: string;
name: string;
fusionLimit?: number;
}
function reduceItems(items: MinItem[]): ListedItem[] {
return items.map((item: MinItem): ListedItem => {
return {
uniqueName: item.uniqueName,
name: item.name
name: item.name,
fusionLimit: (item as any).fusionLimit
};
});
}
@ -19,7 +22,9 @@ const getItemListsController: RequestHandler = (_req, res) => {
res.json({
warframes: reduceItems(warframes),
weapons: reduceItems(weapons.filter(item => item.productCategory != "OperatorAmps")),
miscitems: reduceItems(items.filter(item => item.category == "Misc" || item.category == "Resources"))
miscitems: reduceItems(items.filter(item => item.category == "Misc" || item.category == "Resources")),
mods: reduceItems(items.filter(item => item.category == "Mods" || item.category == "Arcanes")),
badItems
});
};

View File

@ -117,33 +117,61 @@
</div>
</div>
<div data-route="/webui/mods" data-title="Mods | OpenWF WebUI">
<div class="card mb-4">
<h5 class="card-header">Add Riven</h5>
<form class="card-body" onsubmit="doAcquireRiven();return false;">
<select class="form-control mb-3" id="addriven-type">
<option value="LotusArchgunRandomModRare">LotusArchgunRandomModRare</option>
<option value="LotusModularMeleeRandomModRare">LotusModularMeleeRandomModRare</option>
<option value="LotusModularPistolRandomModRare">LotusModularPistolRandomModRare</option>
<option value="LotusPistolRandomModRare">LotusPistolRandomModRare</option>
<option value="LotusRifleRandomModRare" selected>LotusRifleRandomModRare</option>
<option value="LotusShotgunRandomModRare">LotusShotgunRandomModRare</option>
<option value="PlayerMeleeWeaponRandomModRare">PlayerMeleeWeaponRandomModRare</option>
</select>
<textarea
id="addriven-fingerprint"
class="form-control mb-3"
placeholder="Fingerprint"
></textarea>
<button class="btn btn-primary" style="margin-right: 5px" type="submit">Add</button>
<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 class="row">
<div class="col-xxl-6">
<div class="card mb-4">
<h5 class="card-header">Add Riven</h5>
<form class="card-body" onsubmit="doAcquireRiven();return false;">
<select class="form-control mb-3" id="addriven-type">
<option value="LotusArchgunRandomModRare">LotusArchgunRandomModRare</option>
<option value="LotusModularMeleeRandomModRare">
LotusModularMeleeRandomModRare
</option>
<option value="LotusModularPistolRandomModRare">
LotusModularPistolRandomModRare
</option>
<option value="LotusPistolRandomModRare">LotusPistolRandomModRare</option>
<option value="LotusRifleRandomModRare" selected>
LotusRifleRandomModRare
</option>
<option value="LotusShotgunRandomModRare">LotusShotgunRandomModRare</option>
<option value="PlayerMeleeWeaponRandomModRare">
PlayerMeleeWeaponRandomModRare
</option>
</select>
<textarea
id="addriven-fingerprint"
class="form-control mb-3"
placeholder="Fingerprint"
></textarea>
<button class="btn btn-primary" style="margin-right: 5px" type="submit">Add</button>
<a href="https://riven.builds.wf/" target="_blank">
Need help with the fingerprint?
</a>
</form>
</div>
<div class="card mb-4">
<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 class="col-xxl-6">
<div class="card mb-4">
<h5 class="card-header">Mods</h5>
<div class="card-body">
<table class="table table-hover w-100">
<tbody id="mods-list"></tbody>
</table>
<form class="input-group" onsubmit="doAcquireMod();return false;">
<input class="form-control" id="mod-to-acquire" list="datalist-mods" />
<button class="btn btn-primary" type="submit">Add</button>
</form>
</div>
</div>
</div>
</div>
</div>
@ -152,6 +180,7 @@
<datalist id="datalist-warframes"></datalist>
<datalist id="datalist-weapons"></datalist>
<datalist id="datalist-miscitems"></datalist>
<datalist id="datalist-mods"></datalist>
<script src="libs/jquery-3.6.0.min.js"></script>
<script src="libs/whirlpool-js.min.js"></script>
<script src="libs/single.js"></script>

View File

@ -89,16 +89,23 @@ window.itemListPromise = new Promise(resolve => {
"/Lotus/Weapons/Tenno/Rifle/LotusRifle": { name: "Rifle" },
"/Lotus/Weapons/Tenno/Shotgun/LotusShotgun": { name: "Shotgun" },
// Missing in data sources
"/Lotus/Upgrades/CosmeticEnhancers/Peculiars/CyoteMod": { name: "Traumatic Peculiar" },
"/Lotus/Weapons/Tenno/Grimoire/TnGrimoire": { name: "Grimoire" }
};
for (const [type, items] of Object.entries(data)) {
items.forEach(item => {
const option = document.createElement("option");
option.setAttribute("data-key", item.uniqueName);
option.value = item.name;
document.getElementById("datalist-" + type).appendChild(option);
itemMap[item.uniqueName] = { ...item, type };
});
if (type != "badItems") {
items.forEach(item => {
if (item.uniqueName in data.badItems) {
item.name += " (Imposter)";
} else if (item.uniqueName.substr(0, 18) != "/Lotus/Types/Game/") {
const option = document.createElement("option");
option.setAttribute("data-key", item.uniqueName);
option.value = item.name;
document.getElementById("datalist-" + type).appendChild(option);
}
itemMap[item.uniqueName] = { ...item, type };
});
}
}
resolve(itemMap);
});
@ -191,6 +198,7 @@ function updateInventory() {
});
document.getElementById("riven-list").innerHTML = "";
document.getElementById("mods-list").innerHTML = "";
data.Upgrades.forEach(item => {
if (item.ItemType.substr(0, 32) == "/Lotus/Upgrades/Mods/Randomized/") {
const rivenType = item.ItemType.substr(32);
@ -243,6 +251,92 @@ function updateInventory() {
tr.appendChild(td);
}
document.getElementById("riven-list").appendChild(tr);
} else {
const tr = document.createElement("tr");
const rank = parseInt(JSON.parse(item.UpgradeFingerprint).lvl);
const maxRank = itemMap[item.ItemType]?.fusionLimit ?? 5;
{
const td = document.createElement("td");
td.textContent = itemMap[item.ItemType]?.name ?? item.ItemType;
td.innerHTML += " <span title='Rank'>★ " + rank + "/" + maxRank + "</span>";
tr.appendChild(td);
}
{
const td = document.createElement("td");
td.classList = "text-end";
if (rank < maxRank) {
const a = document.createElement("a");
a.href = "#";
a.onclick = function (event) {
event.preventDefault();
setFingerprint(item.ItemType, item.ItemId, { lvl: maxRank });
};
a.textContent = "Max Rank";
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("mods-list").appendChild(tr);
}
});
data.RawUpgrades.forEach(item => {
if (item.ItemCount > 0) {
const maxRank = itemMap[item.ItemType]?.fusionLimit ?? 5;
const tr = document.createElement("tr");
{
const td = document.createElement("td");
td.textContent = itemMap[item.ItemType]?.name ?? item.ItemType;
td.innerHTML += " <span title='Rank'>★ 0/" + maxRank + "</span>";
if (item.ItemCount > 1) {
td.innerHTML += " <span title='Count'>🗍 " + parseInt(item.ItemCount) + "</span>";
}
tr.appendChild(td);
}
{
const td = document.createElement("td");
td.classList = "text-end";
{
const a = document.createElement("a");
a.href = "#";
a.onclick = function (event) {
event.preventDefault();
setFingerprint(item.ItemType, item.LastAdded, { lvl: maxRank });
};
a.textContent = "Max Rank";
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();
disposeOfItems("Upgrades", item.ItemType, item.ItemCount);
};
a.textContent = "Remove";
td.appendChild(a);
}
tr.appendChild(td);
}
document.getElementById("mods-list").appendChild(tr);
}
});
});
@ -350,6 +444,29 @@ function disposeOfGear(category, oid) {
});
}
function disposeOfItems(category, type, count) {
const data = {
SellCurrency: "SC_RegularCredits",
SellPrice: 0,
Items: {}
};
data.Items[category] = [
{
String: type,
Count: count
}
];
revalidateAuthz(() => {
$.post({
url: "/api/sell.php?" + window.authz,
contentType: "text/plain",
data: JSON.stringify(data)
}).done(function () {
updateInventory();
});
});
}
function doAcquireMiscItems() {
const uniqueName = getKey(document.getElementById("miscitem-type"));
if (!uniqueName) {
@ -443,3 +560,53 @@ function doAcquireRiven() {
$("#addriven-fingerprint").on("input", () => {
$("#addriven-fingerprint").removeClass("is-invalid");
});
function setFingerprint(ItemType, ItemId, fingerprint) {
revalidateAuthz(() => {
$.post({
url: "/api/artifacts.php?" + window.authz,
contentType: "text/plain",
data: JSON.stringify({
Upgrade: {
ItemType,
ItemId,
UpgradeFingerprint: JSON.stringify(fingerprint)
},
LevelDiff: 0,
Cost: 0,
FusionPointCost: 0
})
}).done(function () {
updateInventory();
});
});
}
function doAcquireMod() {
const uniqueName = getKey(document.getElementById("mod-to-acquire"));
if (!uniqueName) {
$("#mod-to-acquire").addClass("is-invalid").focus();
return;
}
revalidateAuthz(() => {
$.post({
url: "/api/missionInventoryUpdate.php?" + window.authz,
contentType: "text/plain",
data: JSON.stringify({
RawUpgrades: [
{
ItemType: uniqueName,
ItemCount: 1
}
]
})
}).done(function () {
document.getElementById("mod-to-acquire").value = "";
updateInventory();
});
});
}
$("#mod-to-acquire").on("input", () => {
$("#mod-to-acquire").removeClass("is-invalid");
});