cdransf/coryd.dev-eleventy
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: more chart periods

Browse source
This commit is contained in:
Cory Dransfeldt 2024-04-05 09:42:42 -07:00
parent 3bad27b305
commit cab278f102
No known key found for this signature in database
8 changed files with 79 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/_data/json/scrobbles-one-year-chart.json Normal file
View file

File diff suppressed because one or more lines are too long

1
src/_data/json/scrobbles-six-month-chart.json Normal file
View file

File diff suppressed because one or more lines are too long

1
src/_data/json/scrobbles-three-month-chart.json Normal file
View file

File diff suppressed because one or more lines are too long

8
src/_data/musicCharts.js
View file

@ -3,9 +3,15 @@ import { buildChart } from './helpers/music.js'
export default async function () {
const monthChart = JSON.parse(await readFile('./src/_data/json/scrobbles-month-chart.json', 'utf8'));
const threeMonthChart = JSON.parse(await readFile('./src/_data/json/scrobbles-three-month-chart.json', 'utf8'));
const sixMonthChart = JSON.parse(await readFile('./src/_data/json/scrobbles-six-month-chart.json', 'utf8'));
const oneYearChart = JSON.parse(await readFile('./src/_data/json/scrobbles-one-year-chart.json', 'utf8'));
const artists = JSON.parse(await readFile('./src/_data/json/artists-map.json', 'utf8'));
const albums = JSON.parse(await readFile('./src/_data/json/albums-map.json', 'utf8'));
return {
month: buildChart(monthChart['data'], artists, albums)
month: buildChart(monthChart['data'], artists, albums),
threeMonthChart: buildChart(threeMonthChart['data'], artists, albums),
sixMonthChart: buildChart(sixMonthChart['data'], artists, albums),
oneYearChart: buildChart(sixMonthChart['data'], artists, albums),
}
}

24
src/_includes/now.liquid
View file

@ -21,6 +21,9 @@ layout: default
<div class="now__section--header-buttons client-side">
<button class="small active" data-toggle="artists-window">This week</button>
<button class="small secondary" data-toggle="artists-month">This month</button>
<button class="small secondary" data-toggle="artists-three-months">3 months</button>
<button class="small secondary" data-toggle="artists-six-months">6 months</button>
<button class="small secondary" data-toggle="artists-one-year">1 year</button>
</div>
</div>
<div id="artists-window">
@ -29,6 +32,15 @@ layout: default
<div class="hidden" id="artists-month">
{% render "partials/now/media-grid.liquid", data:musicCharts.month.artists, shape: "square", count: 8 %}
</div>
<div class="hidden" id="artists-three-months">
{% render "partials/now/media-grid.liquid", data:musicCharts.threeMonthChart.artists, shape: "square", count: 8 %}
</div>
<div class="hidden" id="artists-six-months">
{% render "partials/now/media-grid.liquid", data:musicCharts.sixMonthChart.artists, shape: "square", count: 8 %}
</div>
<div class="hidden" id="artists-one-year">
{% render "partials/now/media-grid.liquid", data:musicCharts.oneYearChart.artists, shape: "square", count: 8 %}
</div>
<div class="now__section--header-wrapper">
<h2 id="albums" class="now__section--header flex--centered">
{% tablericon "vinyl" "Albums" %}
@ -37,6 +49,9 @@ layout: default
<div class="now__section--header-buttons client-side">
<button class="small active" data-toggle="albums-window">This week</button>
<button class="small secondary" data-toggle="albums-month">This month</button>
<button class="small secondary" data-toggle="albums-three-months">3 months</button>
<button class="small secondary" data-toggle="albums-six-months">6 months</button>
<button class="small secondary" data-toggle="albums-one-year">1 year</button>
</div>
</div>
<div id="albums-window">
@ -45,6 +60,15 @@ layout: default
<div class="hidden" id="albums-month">
{% render "partials/now/media-grid.liquid", data:musicCharts.month.albums, shape: "square", count: 8 %}
</div>
<div class="hidden" id="albums-three-months">
{% render "partials/now/media-grid.liquid", data:musicCharts.threeMonthChart.albums, shape: "square", count: 8 %}
</div>
<div class="hidden" id="albums-six-months">
{% render "partials/now/media-grid.liquid", data:musicCharts.sixMonthChart.albums, shape: "square", count: 8 %}
</div>
<div class="hidden" id="albums-one-year">
{% render "partials/now/media-grid.liquid", data:musicCharts.oneYearChart.albums, shape: "square", count: 8 %}
</div>
{% render "partials/now/albumReleases.liquid", albumReleases:albumReleases %}
<h2 id="books" class="now__section--header flex--centered">
{% tablericon "books" "Books" %}

14
src/assets/styles/components/media-grid.css
View file

@ -4,13 +4,17 @@
}
.now__section--header,
.now__section--header-buttons,
.recent__links-header {
margin: var(--sizing-3xl) 0 var(--sizing-lg);
}
.now__section--header-buttons {
margin: 0 0 var(--sizing-lg);
}
.now__section--header-wrapper {
display: flex;
flex-direction: column;
justify-content: space-between;
}
@ -108,4 +112,12 @@
--grid-square: repeat(4,minmax(0,1fr));
--grid-vertical: repeat(6,minmax(0,1fr));
}
.now__section--header-wrapper {
flex-direction: row;
}
.now__section--header-buttons {
margin: var(--sizing-3xl) 0 var(--sizing-lg);
}
}