171 lines
9.2 KiB
Text
171 lines
9.2 KiB
Text
mixin navi(key, value, icon, text)
|
|
-
|
|
let bits = {[key]: value}
|
|
if (isStatsPage) bits.shape = "grid"
|
|
a.s-navigation--item(href="./" + and(bits) class={"is-selected": query && query[key] === value})&attributes(attributes)
|
|
if icon
|
|
!= icons.get(icon)
|
|
if text
|
|
span.ml4= text
|
|
block
|
|
|
|
doctype html
|
|
html
|
|
- let searchText = !filter_field ? null : filter_field === "item_id" ? items[0].item_title : filter
|
|
|
|
head
|
|
meta(charset="utf-8")
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
- let title = "BC Explorer"
|
|
block title
|
|
if searchText
|
|
- title = `${searchText} | ${title}`
|
|
title#title= title
|
|
link(rel="icon" href="/favicon.png")
|
|
link(rel="stylesheet" type="text/css" href="/static/stacks.css")
|
|
link(rel="stylesheet" type="text/css" href="/static/style.css")
|
|
script(src="/static/htmx.js")
|
|
script(src="/static/wordcloud.js")
|
|
script(defer src="/static/player-marker.js")
|
|
meta(name="htmx-config" content='{"requestClass":"is-loading"}')
|
|
body.themed.theme-system.overflow-y-scroll(hx-boost="true" hx-swap="outerHTML" hx-target="#page" hx-select="#page")
|
|
#page(hx-history-elt)
|
|
header.s-topbar.ps-sticky.t0
|
|
.s-topbar--container.wmx9.h-auto
|
|
button.s-topbar--logo.h-auto.as-stretch.s-btn.s-btn__muted.s-btn__dropdown.pr24.bar0.fc-black(popovertarget="menu")
|
|
!= icons.get("compass-solid", 24)
|
|
.ml6(class="md:d-none") BC Explorer
|
|
#menu(popover data-popper-placement="bottom" style="display: revert;").s-popover.overflow-visible.px0.py8
|
|
.s-popover--arrow.s-popover--arrow__tc
|
|
ul.s-menu(role="menu")
|
|
li.s-menu--title.d-none(class="md:d-block") BC Explorer
|
|
li(role="menuitem")
|
|
a.s-block-link.d-flex.ai-center.fc-black(href="/" hx-boost="false")
|
|
!= icons.get("log-out")
|
|
.ml6 Switch account
|
|
li.s-menu--divider(role="separator")
|
|
li.s-menu--title Settings
|
|
if query && query.show
|
|
li(role="menuitem")
|
|
.s-block-link.d-flex.ai-center.py2
|
|
span.fl-grow1.d-flex.ai-center
|
|
!= icons.get("eye")
|
|
.pl6 Showing all items
|
|
a.s-btn.s-btn__filled.s-btn__sm.d-flex.ai-center(href=and({show: null}))
|
|
!= icons.get("undo", 16)
|
|
span.pl6 Undo
|
|
li(role="menuitem")
|
|
if arrange === "tag"
|
|
form.s-block-link.d-flex.ai-center(hx-post="/api/settings/location-tags" hx-trigger="change" hx-indicator="#location-tags-loading" hx-select="#tag-page" hx-target="#tag-page")
|
|
span.fl-grow1.d-flex.ai-center
|
|
!= icons.get("map-pin")
|
|
.pl6 Region tags
|
|
#location-tags-loading
|
|
input(type="hidden" name="account" value=account)
|
|
if filter_field
|
|
input(type="hidden" name="filter_field" value=filter_field)
|
|
if filter
|
|
input(type="hidden" name="filter" value=filter)
|
|
if filter_fuzzy
|
|
input(type="hidden" name="filter_fuzzy" value=filter_fuzzy)
|
|
.s-toggle-switch.s-toggle-switch__multiple
|
|
- const locationTagsSetting = h3.getCookie(event, "bcex-location-tags") || "all"
|
|
input#location-tags-all(type="radio" name="location_tags" value="all" autocomplete="off" checked=(locationTagsSetting === "all"))
|
|
label.px8.py6(for="location-tags-all") All
|
|
input#location-tags-hide(type="radio" name="location_tags" value="hide" autocomplete="off" checked=(locationTagsSetting === "hide"))
|
|
label.px8.py6(for="location-tags-hide") Hide
|
|
input#location-tags-only(type="radio" name="location_tags" value="only" autocomplete="off" checked=(locationTagsSetting === "only"))
|
|
label.px8.py6(for="location-tags-only") Only
|
|
else
|
|
.s-block-link.d-flex.ai-center
|
|
span.fl-grow1.d-flex.ai-center.fc-black-400
|
|
!= icons.get("map-pin")
|
|
.pl6 Region tags
|
|
a.fc-black-400.td-underline(href=and({arrange: "tag"})) Set on tags view
|
|
li(role="menuitem")
|
|
form.s-block-link.d-flex.ai-center(hx-post="/api/settings/inline-player" hx-trigger="change" hx-indicator="#inline-player-loading")
|
|
label.fl-grow1.d-flex.ai-center
|
|
!= icons.get("layout-right")
|
|
.pl6(for="inline-player-switch") Inline player
|
|
#inline-player-loading
|
|
input.s-toggle-switch#inline-player-switch(type="checkbox" name="inline_player" checked=(h3.getCookie(event, "bcex-inline-player-disabled") !== "true"))
|
|
li(role="menuitem")
|
|
form.s-block-link.py2.d-flex.ai-center(hx-post="/api/settings/currency" hx-trigger="change" hx-select="#collection-stats" hx-target="#collection-stats" hx-indicator="#currency-loading")
|
|
label.fl-grow1(for="currency-select").d-flex.ai-center
|
|
!= icons.get("coins")
|
|
.pl6 Currency
|
|
#currency-loading
|
|
input(type="hidden" name="account" value=account)
|
|
.s-select
|
|
select#currency-select(name="currency")
|
|
each currency in currencies
|
|
option(selected=(currency === count.displayCurrency))= currency
|
|
.fl-grow1
|
|
nav.d-block
|
|
ul.s-navigation(class="sm:d-grid sm:grid__3")
|
|
li: +navi("arrange", "album", "album", "Album")
|
|
li: +navi("arrange", "artist", "people-tag", "Artist")
|
|
li: +navi("arrange", "label", "flower", "Label")
|
|
//- asana, flower, component, circle-spark, rhombus, sphere, union-alt, color-wheel, community, combine
|
|
li: +navi("arrange", "tag", "label", "Tag")
|
|
li: +navi("arrange", "track", "music-note", "Track")
|
|
li.d-none(class="md:d-block")
|
|
a.s-navigation--item(href="collection-stats" class={"is-selected": isStatsPage})
|
|
!= icons.get("graph-up")
|
|
span.ml4 Stats
|
|
if !isStatsPage
|
|
nav.shape-nav.pl32(class="md:pl8")
|
|
ul.s-navigation.s-navigation__toggle.g0
|
|
li: +navi("shape", "grid").brr0!= icons.get("view-grid")
|
|
li: +navi("shape", "list").blr0!= icons.get("align-justify")
|
|
.fl-grow1
|
|
button#toggle-player.s-btn.s-btn__xs.d-none.mr4(class="md:d-block")!= icons.get("playlist")
|
|
|
|
.d-flex.py24.px16.g24.fs-body1.fd-row-reverse(class="md:fd-column")
|
|
aside.ws340.fl-shrink0
|
|
.ps-fixed.ws340.d-flex.fd-column.g12(class="md:ps-static md:jc-center" style="top: 80px")
|
|
if arrange === "tag"
|
|
include tag-status.pug
|
|
|
|
if filter && filter_field
|
|
.s-sidebarwidget.s-sidebarwidget__blue.d-flex.ai-center.gx16.jc-space-between.p8.pl16
|
|
!= icons.get("search")
|
|
.fl-grow1 Searching for #[strong= searchText]
|
|
a.s-btn.s-notice--btn(href=and({filter: null, filter_field: null, filter_fuzzy: null})) Clear
|
|
else
|
|
form.d-flex.ai-stretch.gx12.jc-space-between.baw0(hx-indicator="#search-submit")
|
|
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__icon.s-btn__outlined.s-btn__muted#search-submit(style="height: 38px")!= icons.get("search")
|
|
|
|
#player-marker.pe-none(class="md:d-none" style="display: none")
|
|
|
|
#collection-sync.d-none
|
|
|
|
div(class="md:d-none")
|
|
include collection-stats.pug
|
|
|
|
main.fl-grow1
|
|
if items && items.length >= 1000
|
|
//- a great deal of performance is spent on htmx's bfcache emulation when navigating away from large pages
|
|
div(hx-history="false")
|
|
block view
|
|
|
|
#player-container.ps-fixed.r16.ws340.z-modal(class="md:t64 md:l16 md:r16 md:b16" hx-preserve="true")
|
|
#player
|
|
|
|
aside.s-modal#server-error(aria-hidden="true")
|
|
.s-modal--dialog
|
|
h1.s-modal--header Server error
|
|
pre.overflow-auto#server-error-content
|
|
p If you know what causes this error, #[a(href="https://cadence.moe/contact") please tell Cadence about it!]
|
|
button.s-modal--close.s-btn.s-btn__muted(aria-label="Close" type="button" onclick="hideError()")!= icons.get("xmark")
|
|
.s-modal--footer
|
|
button.s-btn.s-btn__outlined.s-btn__muted(type="button" onclick="hideError()") OK
|