Show ETH price, split headline into ETH balance and total USD
Some checks failed
check / check (push) Has been cancelled
Some checks failed
check / check (push) Has been cancelled
Headline shows active address ETH balance with ETH-only USD value in parentheses. Small "Total:" subtitle below includes ETH + token values. A centered well between Send/Receive buttons and the wallet list displays the current ETH price in USD.
This commit is contained in:
@@ -172,11 +172,12 @@
|
|||||||
|
|
||||||
<!-- ============ MAIN VIEW: ALL WALLETS & ADDRESSES ============ -->
|
<!-- ============ MAIN VIEW: ALL WALLETS & ADDRESSES ============ -->
|
||||||
<div id="view-main" class="view hidden">
|
<div id="view-main" class="view hidden">
|
||||||
<!-- total portfolio value -->
|
<!-- active address headline -->
|
||||||
<div
|
<div
|
||||||
id="total-value"
|
id="total-value"
|
||||||
class="text-2xl font-bold mb-2 min-h-[2rem]"
|
class="text-2xl font-bold min-h-[2rem]"
|
||||||
></div>
|
></div>
|
||||||
|
<div id="total-value-sub" class="text-xs text-muted mb-2"></div>
|
||||||
|
|
||||||
<!-- active address display -->
|
<!-- active address display -->
|
||||||
<div
|
<div
|
||||||
@@ -185,7 +186,7 @@
|
|||||||
></div>
|
></div>
|
||||||
|
|
||||||
<!-- quick actions for active address -->
|
<!-- quick actions for active address -->
|
||||||
<div class="flex gap-2 mb-3">
|
<div class="flex gap-2 mb-2">
|
||||||
<button
|
<button
|
||||||
id="btn-main-send"
|
id="btn-main-send"
|
||||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer flex-1"
|
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer flex-1"
|
||||||
@@ -200,6 +201,12 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- ETH price -->
|
||||||
|
<div
|
||||||
|
id="eth-price-display"
|
||||||
|
class="bg-well text-center font-bold text-xs p-1 mx-1 mb-3"
|
||||||
|
></div>
|
||||||
|
|
||||||
<!-- wallet list -->
|
<!-- wallet list -->
|
||||||
<div id="wallet-list"></div>
|
<div id="wallet-list"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -27,17 +27,31 @@ function findActiveAddr() {
|
|||||||
|
|
||||||
function renderTotalValue() {
|
function renderTotalValue() {
|
||||||
const el = $("total-value");
|
const el = $("total-value");
|
||||||
|
const subEl = $("total-value-sub");
|
||||||
|
const priceEl = $("eth-price-display");
|
||||||
if (!el) return;
|
if (!el) return;
|
||||||
|
|
||||||
|
const ethPrice = getPrice("ETH");
|
||||||
|
if (priceEl) {
|
||||||
|
priceEl.textContent = ethPrice ? "ETH " + formatUsd(ethPrice) : "";
|
||||||
|
}
|
||||||
|
|
||||||
const addr = findActiveAddr();
|
const addr = findActiveAddr();
|
||||||
if (!addr) {
|
if (!addr) {
|
||||||
el.textContent = "";
|
el.textContent = "";
|
||||||
|
if (subEl) subEl.textContent = "";
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const ethBal = parseFloat(addr.balance || "0");
|
const ethBal = parseFloat(addr.balance || "0");
|
||||||
const ethStr = ethBal.toFixed(4) + " ETH";
|
const ethStr = ethBal.toFixed(4) + " ETH";
|
||||||
const usd = getAddressValueUsd(addr);
|
const ethUsd = ethPrice ? " (" + formatUsd(ethBal * ethPrice) + ")" : "";
|
||||||
const usdStr = usd !== null ? " (" + formatUsd(usd) + " USD)" : "";
|
el.textContent = ethStr + ethUsd;
|
||||||
el.textContent = ethStr + usdStr;
|
|
||||||
|
if (subEl) {
|
||||||
|
const totalUsd = getAddressValueUsd(addr);
|
||||||
|
subEl.textContent =
|
||||||
|
totalUsd !== null ? "Total: " + formatUsd(totalUsd) : "";
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const EXT_ICON =
|
const EXT_ICON =
|
||||||
|
|||||||
Reference in New Issue
Block a user