Add search field

This commit is contained in:
Cadence Ember 2025-04-02 17:40:14 +13:00
parent 26ea869285
commit 4744a22ef6
6 changed files with 39 additions and 20 deletions

View file

@ -9,16 +9,16 @@ block view
img(loading="lazy" src=item.item_art_url width=210 height=210)
p.fs-body3.mb8= item.item_title
.d-flex.fw-wrap.g4
a.s-tag.s-tag__xs(href=and({arrange: "track", filter_field: "item_id", filter: item.item_id}))
a.s-tag.s-tag__xs(href=and({arrange: "track", filter_field: "item_id", filter: item.item_id, filter_fuzzy: null}))
span.s-tag--sponsor!= icons.get("music-note", 16)
= item.track_count
span.s-tag.s-tag__xs
span.s-tag--sponsor!= icons.get("compact-disc", 16)
= item.total_duration
a.s-tag.s-tag__xs(href=and({filter_field: "band_name", filter: item.band_name}))
a.s-tag.s-tag__xs(href=and({filter_field: "band_name", filter: item.band_name, filter_fuzzy: null}))
span.s-tag--sponsor!= icons.get("people-tag", 16)
= item.band_name
- let label = item.band_url.replace(/https?:\/\/(.*?)\.bandcamp\.com.*/, "$1")
a.s-tag.s-tag__xs(href=and({filter_field: "band_url", filter: label}))
a.s-tag.s-tag__xs(href=and({filter_field: "band_url", filter: label, filter_fuzzy: null}))
span.s-tag--sponsor!= icons.get("flower", 16)
= label

View file

@ -8,10 +8,10 @@ block view
.fl-grow1.pb12
.fs-headline1= item.band_name
.d-flex.fw-wrap.g4
a.s-tag.s-tag__xs(href=and({arrange: "album", filter_field: "band_name", filter: item.band_name}))
a.s-tag.s-tag__xs(href=and({arrange: "album", filter_field: "band_name", filter: item.band_name, filter_fuzzy: null}))
span.s-tag--sponsor!= icons.get("album", 16)
= item.album_count
a.s-tag.s-tag__xs(href=and({arrange: "track", filter_field: "band_name", filter: item.band_name}))
a.s-tag.s-tag__xs(href=and({arrange: "track", filter_field: "band_name", filter: item.band_name, filter_fuzzy: null}))
span.s-tag--sponsor!= icons.get("music-note", 16)
= item.track_count
span.s-tag.s-tag__xs
@ -19,7 +19,7 @@ block view
= item.total_duration
- let labels = item.labels.split("|").map(x => x.replace(/https?:\/\/(.*?)\.bandcamp\.com.*/, "$1"))
each label in labels
a.s-tag.s-tag__xs(href=and({filter_field: "band_url", filter: label}))
a.s-tag.s-tag__xs(href=and({filter_field: "band_url", filter: label, filter_fuzzy: null}))
span.s-tag--sponsor!= icons.get("flower", 16)
= label
each preview in item.previews

View file

@ -25,7 +25,7 @@ html
--theme-dark-primary-color-s: 45%;
--theme-dark-primary-color-l: 60%;
}
.s-navigation--item.is-loading svg, .s-tag.is-loading svg {
.s-navigation--item.is-loading svg, .s-tag.is-loading svg, .s-sidebarwidget.is-loading svg {
visibility: hidden;
}
.s-navigation__toggle.s-navigation {
@ -52,6 +52,9 @@ html
color: blue;
outline: 1px solid black;
}
svg {
flex-shrink: 0;
}
body.themed.theme-system.overflow-y-scroll(hx-boost="true")
header.s-topbar.ps-sticky.t0
.s-topbar--container.wmx9
@ -84,15 +87,29 @@ html
.ps-sticky.d-flex.fd-column.g12.wmx4(style="top: 80px")
if arrange === "tag"
include tag-status.pug
if filter
if filter && filter_field
.s-sidebarwidget.s-sidebarwidget__blue.d-flex.ai-center.gx16.jc-space-between.p8.pl16
.fl-shrink0!= icons.get("search")
!= icons.get("search")
.fl-grow1= `Searching for `
if filter_field === "item_id"
strong= items[0].item_title
else
strong= filter
a.s-btn.s-notice--btn(href=and({filter: null, filter_field: null})) Clear
a.s-btn.s-notice--btn(href=and({filter: null, filter_field: null, filter_fuzzy: null})) Clear
else
form.d-flex.ai-stretch.gx8.jc-space-between.baw0
input.s-input(name="filter" placeholder="Search" autocomplete="off").fl-grow1
input(type="hidden" name="filter_field" value=
( arrange === "artist" ? "band_name"
: arrange === "label" ? "band_url"
: arrange === "tag" ? "tag"
: "item_title"))
input(type="hidden" name="filter_fuzzy" value="true")
input(type="hidden" name="arrange" value=arrange)
input(type="hidden" name="shape" value=shape)
button.s-btn.s-btn__xs.s-btn__outlined.s-btn__muted!= icons.get("search")
.s-sidebarwidget.wmn3
.s-sidebarwidget--header Collection
a.s-sidebarwidget--action Refresh

View file

@ -10,13 +10,13 @@ block view
- let label = item.display_name.replace(/https?:\/\/(.*?)\.bandcamp\.com.*/, "$1")
.fs-headline1= label
.d-flex.fw-wrap.g4
a.s-tag.s-tag__xs(href=and({arrange: "album", filter_field: "band_url", filter: minBandURL}))
a.s-tag.s-tag__xs(href=and({arrange: "album", filter_field: "band_url", filter: minBandURL, filter_fuzzy: null}))
span.s-tag--sponsor!= icons.get("album", 16)
= item.album_count
a.s-tag.s-tag__xs(href=and({arrange: "artist", filter_field: "band_url", filter: minBandURL}))
a.s-tag.s-tag__xs(href=and({arrange: "artist", filter_field: "band_url", filter: minBandURL, filter_fuzzy: null}))
span.s-tag--sponsor!= icons.get("people-tag", 16)
= item.artist_count
a.s-tag.s-tag__xs(href=and({arrange: "track", filter_field: "band_url", filter: minBandURL}))
a.s-tag.s-tag__xs(href=and({arrange: "track", filter_field: "band_url", filter: minBandURL, filter_fuzzy: null}))
span.s-tag--sponsor!= icons.get("music-note", 16)
= item.track_count
span.s-tag.s-tag__xs

View file

@ -27,6 +27,7 @@ block view
const newURL = new URL(location)
newURL.searchParams.set("filter", highlightedItem)
newURL.searchParams.set("filter_field", "tag")
newURL.searchParams.delete("filter_fuzzy")
newURL.searchParams.set("arrange", filter_field ? "album" : "label")
location = newURL
}