feat: view queries in; media updated
This commit is contained in:
parent
08e2c2ff3f
commit
057d75f863
49 changed files with 578 additions and 353 deletions
|
|
@ -1,44 +1,51 @@
|
|||
{%- assign hidePagination = count or data.pages.size <= 1 -%}
|
||||
{%- assign media = data.items | default: data | normalizeMedia: count -%}
|
||||
<div class="media-grid {% if shape == 'square' -%}square{%- else -%}vertical{%- endif -%}">
|
||||
{%- for item in media | default: media.size -%}
|
||||
{%- capture alt -%}{{ item.title | escape }} ({{ item.year }}){% endcapture %}
|
||||
{%- assign alt = item.alt | strip | escape -%}
|
||||
<a href="{{ item.url }}" title="{{ alt }}">
|
||||
{%- assign pageCount = pagination.pages.size | default: 0 -%}
|
||||
{%- assign hidePagination = pageCount <= 1 -%}
|
||||
<div class="media-grid {% if shape == 'poster' -%}poster{%- elsif shape == 'square' -%}square{%- elsif shape == 'vertical' -%}vertical{%- endif -%}">
|
||||
{%- for item in data limit: count -%}
|
||||
{%- assign alt = item.grid.alt | strip | escape -%}
|
||||
<a href="{{ item.grid.url }}" title="{{ alt }}">
|
||||
<div class="item">
|
||||
<div class="meta-text">
|
||||
{%- if item.title -%}
|
||||
<div class="header">{{ item.title }}</div>
|
||||
{%- endif -%}
|
||||
{%- if item.plays -%}
|
||||
<div class="subheader">{{ item.plays }} plays</div>
|
||||
{%- elsif item.subtext -%}
|
||||
<div class="subheader">{{ item.subtext }}</div>
|
||||
{%- endif -%}
|
||||
<div class="header">{{ item.grid.title }}</div>
|
||||
<div class="subheader">{{ item.grid.subtext }}</div>
|
||||
</div>
|
||||
{%- assign loadingStrategy = loading | default: 'lazy' -%}
|
||||
{%- if shape == 'square' -%}
|
||||
{%- if shape == 'poster' -%}
|
||||
<img
|
||||
srcset="
|
||||
https://cdn.coryd.dev{{ item.image }}?class=squaresm&type=webp 200w,
|
||||
https://cdn.coryd.dev{{ item.image }}?class=squaremd&type=webp 400w
|
||||
https://cdn.coryd.dev{{ item.grid.backdrop }}?class=bannersm&type=webp 256w,
|
||||
https://cdn.coryd.dev{{ item.grid.backdrop }}?class=bannermd&type=webp 512w
|
||||
"
|
||||
sizes="(max-width: 450px) 256px, 512px"
|
||||
src="https://cdn.coryd.dev{{ item.grid.backdrop }}?class=bannersm&type=webp"
|
||||
alt="{{ alt }}"
|
||||
loading="{{ loadingStrategy }}"
|
||||
decoding="async"
|
||||
width="256"
|
||||
height="170"
|
||||
/>
|
||||
{%- elsif shape == 'square' -%}
|
||||
<img
|
||||
srcset="
|
||||
https://cdn.coryd.dev{{ item.grid.image }}?class=squaresm&type=webp 200w,
|
||||
https://cdn.coryd.dev{{ item.grid.image }}?class=squaremd&type=webp 400w
|
||||
"
|
||||
sizes="(max-width: 450px) 200px, 400px"
|
||||
src="https://cdn.coryd.dev{{ item.image }}?class=squaresm&type=webp"
|
||||
src="https://cdn.coryd.dev{{ item.grid.image }}?class=squaresm&type=webp"
|
||||
alt="{{ alt }}"
|
||||
loading="{{ loadingStrategy }}"
|
||||
decoding="async"
|
||||
width="200"
|
||||
height="200"
|
||||
/>
|
||||
{%- else -%}
|
||||
{%- elsif shape == 'vertical' -%}
|
||||
<img
|
||||
srcset="
|
||||
https://cdn.coryd.dev{{ item.image }}?class=verticalsm&type=webp 200w,
|
||||
https://cdn.coryd.dev{{ item.image }}?class=verticalmd&type=webp 400w
|
||||
https://cdn.coryd.dev{{ item.grid.image }}?class=verticalsm&type=webp 200w,
|
||||
https://cdn.coryd.dev{{ item.grid.image }}?class=verticalmd&type=webp 400w
|
||||
"
|
||||
sizes="(max-width: 450px) 200px, 400px"
|
||||
src="https://cdn.coryd.dev{{ item.image }}?class=verticalsm&type=webp"
|
||||
src="https://cdn.coryd.dev{{ item.grid.image }}?class=verticalsm&type=webp"
|
||||
alt="{{ alt }}"
|
||||
loading="{{ loadingStrategy }}"
|
||||
decoding="async"
|
||||
|
|
@ -51,5 +58,5 @@
|
|||
{%- endfor -%}
|
||||
</div>
|
||||
{%- unless hidePagination -%}
|
||||
{% render "partials/nav/paginator.liquid", pagination:data %}
|
||||
{% render "partials/nav/paginator.liquid", pagination:pagination %}
|
||||
{%- endunless -%}
|
||||
|
|
@ -1,22 +1,20 @@
|
|||
<div class="music-chart">
|
||||
{%- assign items = data.items | default: data -%}
|
||||
<ol type="1">
|
||||
{%- for item in items limit: count | default: items.size -%}
|
||||
{%- assign playTotal = playTotal | default: mostPlayed -%}
|
||||
{%- assign percentage = item.plays | calculatePlayPercentage: playTotal -%}
|
||||
<li value="{{ item.rank }}">
|
||||
{%- for item in data limit: count -%}
|
||||
{%- assign percentage = item.chart.percentage | append: '%' -%}
|
||||
<li value="{{ item.chart.rank }}">
|
||||
<div class="item">
|
||||
<div class="info">
|
||||
<a class="title" href="{{ item.url }}">{{ item.title }}</a>
|
||||
<a class="title" href="{{ item.chart.url }}">{{ item.chart.title }}</a>
|
||||
{%- capture playsLabel -%}
|
||||
{%- if item.plays > 1 -%}
|
||||
{%- if item.chart.plays > 1 -%}
|
||||
plays
|
||||
{%- else -%}
|
||||
play
|
||||
{%- endif -%}
|
||||
{%- endcapture -%}
|
||||
<span class="subtext">{{ item.artist }}</span>
|
||||
<span class="subtext">{{ item.plays }} {{ playsLabel }}</span>
|
||||
<span class="subtext">{{ item.chart.artist }}</span>
|
||||
<span class="subtext">{{ item.chart.plays }} {{ playsLabel }}</span>
|
||||
</div>
|
||||
{% render "partials/media/progress-bar.liquid", percentage:percentage %}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,17 +1,16 @@
|
|||
<div class="music-chart">
|
||||
{%- for item in data limit: 10 -%}
|
||||
{%- capture alt -%}{{ item.title | escape }} by {{ item.artist }}{%- endcapture -%}
|
||||
<div class="item">
|
||||
<div class="meta">
|
||||
<a href="{{ item.url }}">
|
||||
<a href="{{ item.chart.url }}">
|
||||
<img
|
||||
srcset="
|
||||
https://cdn.coryd.dev{{ item.image }}?class=w50&type=webp 50w,
|
||||
https://cdn.coryd.dev{{ item.image }}?class=w100&type=webp 100w
|
||||
https://cdn.coryd.dev{{ item.chart.image }}?class=w50&type=webp 50w,
|
||||
https://cdn.coryd.dev{{ item.chart.image }}?class=w100&type=webp 100w
|
||||
"
|
||||
sizes="(max-width: 450px) 50px, 100px"
|
||||
src="https://cdn.coryd.dev{{ item.image }}?class=w50&type=webp"
|
||||
alt="{{ alt }}"
|
||||
src="https://cdn.coryd.dev{{ item.chart.image }}?class=w50&type=webp"
|
||||
alt="{{ item.chart.alt }}"
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
width="64"
|
||||
|
|
@ -19,12 +18,12 @@
|
|||
/>
|
||||
</a>
|
||||
<div class="meta-text">
|
||||
<a class="title" href="{{ item.url }}">{{ item.title }}</a>
|
||||
<span class="subtext">{{ item.artist }}</span>
|
||||
<a class="title" href="{{ item.chart.url }}">{{ item.chart.title }}</a>
|
||||
<span class="subtext">{{ item.chart.subtext }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="timestamp">
|
||||
{{ item.timestamp | date: "%B %-d, %-I:%M%p", "America/Los_Angeles" }}
|
||||
{{ item.chart.played_at | date: "%B %-d, %-I:%M%p", "America/Los_Angeles" }}
|
||||
</div>
|
||||
</div>
|
||||
{%- endfor -%}
|
||||
|
|
|
|||
|
|
@ -1,32 +1,32 @@
|
|||
{%- assign hidePagination = count or data.pages.size <= 1 -%}
|
||||
{%- assign pageCount = pagination.pages.size | default: 0 -%}
|
||||
{%- assign hidePagination = pageCount <= 1 -%}
|
||||
<div class="watching grid">
|
||||
{%- assign items = data.items | default: mediaItems -%}
|
||||
{%- for item in items limit: count -%}
|
||||
{%- capture alt -%}{{ item.title | escape }} ({{ item.year }}){% endcapture %}
|
||||
<a href="{{ item.url }}">
|
||||
{%- for item in data limit: count -%}
|
||||
{%- assign alt = item.grid.grid.alt | strip | escape -%}
|
||||
<a href="{{ item.grid.url }}">
|
||||
<div class="watching item">
|
||||
<div class="meta-text">
|
||||
{%- if item.type == 'movie' -%}
|
||||
<div class="header">{{ item.title }}</div>
|
||||
{%- if item.grid.type == 'movie' -%}
|
||||
<div class="header">{{ item.grid.title }}</div>
|
||||
<div class="subheader">
|
||||
{%- if item.rating -%}
|
||||
<span class="rating"> {{ item.rating }}</span>
|
||||
{%- if item.grid.rating -%}
|
||||
<span class="rating"> {{ item.grid.rating }}</span>
|
||||
{%- endif -%}
|
||||
({{ item.year }})
|
||||
({{ item.grid.year }})
|
||||
</div>
|
||||
{%- else -%}
|
||||
<div class="header">{{ item.title }}</div>
|
||||
<div class="subheader">({{ item.year }})</div>
|
||||
<div class="header">{{ item.grid.title }}</div>
|
||||
<div class="subheader">({{ item.grid.year }})</div>
|
||||
{%- endif -%}
|
||||
</div>
|
||||
{%- assign loadingStrategy = loading | default: 'lazy' -%}
|
||||
<img
|
||||
srcset="
|
||||
https://cdn.coryd.dev{{ item.backdrop }}?class=bannersm&type=webp 256w,
|
||||
https://cdn.coryd.dev{{ item.backdrop }}?class=bannermd&type=webp 512w
|
||||
https://cdn.coryd.dev{{ item.grid.backdrop }}?class=bannersm&type=webp 256w,
|
||||
https://cdn.coryd.dev{{ item.grid.backdrop }}?class=bannermd&type=webp 512w
|
||||
"
|
||||
sizes="(max-width: 450px) 256px, 512px"
|
||||
src="https://cdn.coryd.dev{{ item.backdrop }}?class=bannersm&type=webp"
|
||||
src="https://cdn.coryd.dev{{ item.grid.backdrop }}?class=bannersm&type=webp"
|
||||
alt="{{ alt }}"
|
||||
loading="{{ loadingStrategy }}"
|
||||
decoding="async"
|
||||
|
|
@ -38,5 +38,5 @@
|
|||
{%- endfor -%}
|
||||
</div>
|
||||
{%- unless hidePagination -%}
|
||||
{% render "partials/nav/paginator.liquid", pagination:data %}
|
||||
{% render "partials/nav/paginator.liquid", pagination:pagination %}
|
||||
{%- endunless -%}
|
||||
Reference in a new issue