sjs/spirit-tracker
1
0
Fork 0
mirror of https://github.com/samsonjs/spirit-tracker.git synced 2026-04-27 15:07:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: V10 store page

Browse source
This commit is contained in:
Brennan Wilkes (Text Groove) 2026-01-30 16:52:05 -08:00
parent 7ac41370cf
commit 925dc0f55d
1 changed files with 8 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
viz/app/store_page.js
View file

@ -64,9 +64,7 @@ export async function renderStore($app, storeLabelRaw) {
<div class="card"> <div class="card">
<div style="display:flex; flex-direction:column; gap:10px;"> <div style="display:flex; flex-direction:column; gap:10px;">
<input id="q" class="input" placeholder="Search in this store..." autocomplete="off" /> <div id="priceWrap" style="display:flex; align-items:center; gap:10px; width:100%;">
<div id="priceWrap" style="display:flex; align-items:center; gap:10px;">
<div class="small" style="white-space:nowrap; opacity:.75;">Max price</div> <div class="small" style="white-space:nowrap; opacity:.75;">Max price</div>
<input <input
@ -77,8 +75,8 @@ export async function renderStore($app, storeLabelRaw) {
step="1" step="1"
value="1000" value="1000"
style=" style="
width: 320px; flex: 1 1 auto;
max-width: 100%; width: 100%;
height: 18px; height: 18px;
accent-color: #9aa3b2; accent-color: #9aa3b2;
opacity: .85; opacity: .85;
@ -93,9 +91,12 @@ export async function renderStore($app, storeLabelRaw) {
text-align: right; text-align: right;
white-space: nowrap; white-space: nowrap;
opacity: .9; opacity: .9;
flex: 0 0 auto;
" "
></div> ></div>
</div> </div>
<input id="q" class="input" placeholder="Search in this store..." autocomplete="off" />
</div> </div>
<div class="small" id="status" style="margin-top:10px;"></div> <div class="small" id="status" style="margin-top:10px;"></div>
@ -358,10 +359,7 @@ export async function renderStore($app, storeLabelRaw) {
$maxPriceLabel.textContent = "No prices"; $maxPriceLabel.textContent = "No prices";
return; return;
} }
const atTop = Math.abs(selectedMaxPrice - boundMax) <= 0.01; $maxPriceLabel.textContent = `${formatDollars(selectedMaxPrice)}`;
$maxPriceLabel.textContent = atTop
? `${formatDollars(boundMax)} (all)`
: `${formatDollars(selectedMaxPrice)}`;
} }
if (pageMax === null) { if (pageMax === null) {
@ -422,7 +420,6 @@ export async function renderStore($app, storeLabelRaw) {
const diffBadge = priceBadgeHtml(it); const diffBadge = priceBadgeHtml(it);
const skuLink = `#/link/?left=${encodeURIComponent(String(it.sku || ""))}`; const skuLink = `#/link/?left=${encodeURIComponent(String(it.sku || ""))}`;
console.log(it);
return ` return `
<div class="item" data-sku="${esc(it.sku)}"> <div class="item" data-sku="${esc(it.sku)}">
<div class="itemRow"> <div class="itemRow">
@ -474,9 +471,7 @@ export async function renderStore($app, storeLabelRaw) {
} }
if (pageMax !== null) { if (pageMax !== null) {
const atTop = Math.abs(selectedMaxPrice - boundMax) <= 0.01; $status.textContent = `In stock: ${total} item(s) (≤ ${formatDollars(selectedMaxPrice)}).`;
const cap = atTop ? "all prices" : `≤ ${formatDollars(selectedMaxPrice)}`;
$status.textContent = `In stock: ${total} item(s) (${cap}).`;
return; return;
} }