ritual/ritual.sh
ritual/ritual.sh
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Adding lastfm and other bits

Browse source
This commit is contained in:
Dan Baker 2024-02-13 11:04:53 +00:00
parent 0e4e0318cc
commit f0902b072f
10 changed files with 313 additions and 90 deletions
Download patch file Download diff file Expand all files Collapse all files

28
assets/css/extended/custom.css
View file

@ -18,3 +18,31 @@ article a[href^="https://"]:not(article .social-icons a, .paginav a, .buy-me-a-c
background-size: 100% 2px; background-size: 100% 2px;
background-repeat: repeat-x; background-repeat: repeat-x;
} }
.row {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
width: 100%;
gap: 14px;
}
.col {
display: flex;
flex-direction: column;
flex-basis: 100%;
flex: 1;
}
.photo {
flex: 25%;
img {
border-radius: var(--radius);
}
}
.intro-text {
flex: 75%;
}

BIN
assets/images/me.webp Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 70 KiB

4
config.yml
View file

@ -73,7 +73,7 @@ params:
# home-info mode # home-info mode
homeInfoParams: homeInfoParams:
Title: "I’m Dan. I live in the Golden Valley, Herefordshire. I work remotely as a software engineer, team leader, and system architect. " Title: "I’m Dan. I live in the Golden Valley, Herefordshire. I work remotely as a software engineer, team leader, and system architect. "
Content: "I like to talk about engineering, networking, and system design. There’s a higher I may also talk about many of my other interests – photography, digital minimalism, lego, gaming and game dev, coffee, or the great outdoors." Content: "I like to talk about engineering, networking, and system design. There’s a higher change I will also talk about many of my other interests – photography, digital minimalism, lego, gaming and game dev, coffee, or the great outdoors."
socialIcons: socialIcons:
- name: instagram - name: instagram
@ -82,6 +82,8 @@ params:
url: "https://dice.camp/@ritual" url: "https://dice.camp/@ritual"
- name: github - name: github
url: "https://github.com/unbolt" url: "https://github.com/unbolt"
- name: lastfm
url: "https://www.last.fm/user/ritualplays"
analytics: analytics:
google: google:

86
content/about/index.md
View file

@ -1,92 +1,12 @@
--- ---
title: What’s up? title: Some stuff about me
author: Dan author: Dan
type: page type: page
date: 2024-01-09T11:46:01+00:00 date: 2024-01-09T11:46:01+00:00
comments: false comments: false
disableCoffee: true disableCoffee: true
hideMeta: true
--- ---
<div class="wp-block-group alignfull has-accent-background-color has-background has-global-padding is-layout-constrained wp-block-group-is-layout-constrained" style="margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)">
<div class="wp-block-columns alignwide is-layout-flex wp-container-core-columns-layout-1 wp-block-columns-is-layout-flex">
<div class="wp-block-column is-vertically-aligned-stretch is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:50%">
<div class="wp-block-group is-vertical is-content-justification-stretch is-layout-flex wp-container-core-group-layout-1 wp-block-group-is-layout-flex" style="min-height:100%">
<p class="has-large-font-size">
I'm <strong><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-base-color">Dan</mark></strong>. I live in the Golden Valley, <strong><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-base-color">Herefordshire</mark></strong>. I work remotely as a <strong><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-base-color">software engineer</mark></strong>, team leader, and system architect.
</p>
<p> This page is coming soon...
I like to talk about engineering, networking, and system design. There's a really good chance I may also talk about some of my other interests - photography, lego, gaming and game dev, coffee, or the great outdoors.
</p>
</div>
</div>
<div class="wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:30%">
<figure class="wp-block-image size-large is-style-rounded wp-duotone-unset-1"><img data-dominant-color="6a5949" data-has-transparency="false" loading="lazy" decoding="async" width="1119" height="1120" src="https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/IMG_5055-edited.webp?resize=1119%2C1120&#038;ssl=1" alt="" class="not-transparent wp-image-50" style="--dominant-color: #6a5949; aspect-ratio:1;object-fit:cover" srcset="https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/IMG_5055-edited.webp?w=1119&ssl=1 1119w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/IMG_5055-edited.webp?resize=300%2C300&ssl=1 300w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/IMG_5055-edited.webp?resize=1024%2C1024&ssl=1 1024w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/IMG_5055-edited.webp?resize=150%2C150&ssl=1 150w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/IMG_5055-edited.webp?resize=768%2C769&ssl=1 768w" sizes="(max-width: 1000px) 100vw, 1000px" data-recalc-dims="1" /></figure>
</div>
</div>
</div>
<div class="wp-block-group alignfull has-base-2-color has-contrast-background-color has-text-color has-background has-link-color wp-elements-3fb09f2875769cf7d7ccd642208cba31 has-global-padding is-layout-constrained wp-block-group-is-layout-constrained" style="margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)">
<div class="wp-block-columns alignwide is-layout-flex wp-container-core-columns-layout-2 wp-block-columns-is-layout-flex">
<div class="wp-block-column is-vertically-aligned-stretch is-layout-flow wp-block-column-is-layout-flow" style="padding-right:0;flex-basis:60%">
<div class="wp-block-group is-vertical is-content-justification-stretch is-layout-flex wp-container-core-group-layout-3 wp-block-group-is-layout-flex" style="min-height:100%">
<figure class="wp-block-image size-large is-resized is-style-rounded is-layout-flow wp-block-image-is-layout-flow"><img data-dominant-color="898b75" data-has-transparency="false" loading="lazy" decoding="async" width="1024" height="732" src="https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DJI_0229-HDR-1024x732.webp?resize=1024%2C732&#038;ssl=1" alt="" class="not-transparent wp-image-64" style="--dominant-color: #898b75; width:667px;height:auto" srcset="https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DJI_0229-HDR-jpg.webp?resize=1024%2C732&ssl=1 1024w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DJI_0229-HDR-jpg.webp?resize=300%2C214&ssl=1 300w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DJI_0229-HDR-jpg.webp?resize=768%2C549&ssl=1 768w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DJI_0229-HDR-jpg.webp?resize=1536%2C1097&ssl=1 1536w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DJI_0229-HDR-jpg.webp?w=2048&ssl=1 2048w" sizes="(max-width: 1000px) 100vw, 1000px" data-recalc-dims="1" /><figcaption class="wp-element-caption">Dorset 2023, near Bridport. 50°41'28&#8221; N 2°42'32&#8221; W</figcaption></figure>
<p>
As well as traditional photoghraphy, I am trying to get to grips with my DJI Mini 2 for drone photography which opens up a whole new world of angles.
</p>
</div>
</div>
<div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:40%">
<div class="wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained">
<h2 class="wp-block-heading has-base-color has-text-color has-link-color has-large-font-size wp-elements-a248b251d7830cc1a26d6de4bfa004a4">
Photography
</h2>
<p>
I've been a keen photographer for many years. Currently I shoot with a Fujifilm X-T5, mainly with the 16-55mm f2.8. I also have the 70-300 f4-5. I'm making some effort to post my photos to <a href="https://www.instagram.com/ritualphotos/" target="_blank" rel="noreferrer noopener">instagram</a> more frequently.
</p>
<div class="wp-block-jetpack-instagram-gallery wp-block-jetpack-instagram-gallery__grid wp-block-jetpack-instagram-gallery__grid-columns-3 is-stacked-on-mobile" style="grid-gap: 10px; --latest-instagram-posts-spacing: 10px;">
<a
class="wp-block-jetpack-instagram-gallery__grid-post"
href="https://www.instagram.com/p/C2C7CrLthy4/"
rel="noopener noreferrer"
target="_blank"
> <img
alt="These seed heads always have some crazy #tentacle action. #nature #weird #photography #naturephotography"
src="https://scontent-dfw5-2.cdninstagram.com/v/t51.29350-15/418639424_741086241251254_471771321641352299_n.jpg?_nc_cat=108&#038;ccb=1-7&#038;_nc_sid=18de74&#038;_nc_ohc=ZUSyi4tjHVoAX9ITSfD&#038;_nc_ht=scontent-dfw5-2.cdninstagram.com&#038;edm=ANo9K5cEAAAA&#038;oh=00_AfB1n67fPCXaQ0r9ykZ78eybIxLfcI4zrcrVUvNlwjzzNw&#038;oe=65CBC9B4"
loading="lazy"
/> </a> <a
class="wp-block-jetpack-instagram-gallery__grid-post"
href="https://www.instagram.com/p/C2C62C-trjv/"
rel="noopener noreferrer"
target="_blank"
> <img
alt="Flowers being hung to dry in the #greenhouse at #weirgarden @nationaltrust in #hereford. #driedflowers #flower"
src="https://scontent-dfw5-2.cdninstagram.com/v/t51.29350-15/418610808_942834420595794_277835948344277259_n.jpg?_nc_cat=103&#038;ccb=1-7&#038;_nc_sid=18de74&#038;_nc_ohc=kdRCYaqnYrYAX81bHP1&#038;_nc_ht=scontent-dfw5-2.cdninstagram.com&#038;edm=ANo9K5cEAAAA&#038;oh=00_AfDzL_uMfajhnFzpfua1Ql7GyRb2fMalfPkNhhXpeZhEyg&#038;oe=65CB7E1F"
loading="lazy"
/> </a> <a
class="wp-block-jetpack-instagram-gallery__grid-post"
href="https://www.instagram.com/p/C2C6iJdtvY0/"
rel="noopener noreferrer"
target="_blank"
> <img
alt="Friendly robin at the #weirgarden in #hereford today. #robin #wildlife #wildlifephotography #ukwildlife"
src="https://scontent-dfw5-2.cdninstagram.com/v/t51.29350-15/419447288_2141674276187415_6647487415531800578_n.jpg?_nc_cat=106&#038;ccb=1-7&#038;_nc_sid=18de74&#038;_nc_ohc=u1FqQ25QKKAAX8kUEdC&#038;_nc_ht=scontent-dfw5-2.cdninstagram.com&#038;edm=ANo9K5cEAAAA&#038;oh=00_AfBuDQ7aOgoeULg5mUNjQ9r0EHhBW1gOQgMQz_1jWAdgMQ&#038;oe=65CA781A"
loading="lazy"
/> </a>
</div>
<div style="height:var(--wp--preset--spacing--40)" aria-hidden="true" class="wp-block-spacer">
</div>
<div class="wp-block-group is-layout-flow wp-block-group-is-layout-flow">
<figure class="wp-block-image aligncenter size-large is-style-rounded"><img data-dominant-color="92867c" data-has-transparency="false" style="--dominant-color: #92867c;" loading="lazy" decoding="async" width="1024" height="732" src="https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DSCF1130-1024x732.webp?resize=1024%2C732&#038;ssl=1" alt="" class="not-transparent wp-image-65" srcset="https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DSCF1130-jpg.webp?resize=1024%2C732&ssl=1 1024w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DSCF1130-jpg.webp?resize=300%2C214&ssl=1 300w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DSCF1130-jpg.webp?resize=768%2C549&ssl=1 768w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DSCF1130-jpg.webp?resize=1536%2C1097&ssl=1 1536w, https://i0.wp.com/danbaker.dev/wp-content/uploads/2024/01/DSCF1130-jpg.webp?w=2048&ssl=1 2048w" sizes="(max-width: 1000px) 100vw, 1000px" data-recalc-dims="1" /><figcaption class="wp-element-caption">Rhayader, 2023</figcaption></figure>
</div>
</div>
</div>
</div>
</div>

121
layouts/_default/list.html Normal file
View file

@ -0,0 +1,121 @@
{{- define "main" }}
{{- if (and site.Params.profileMode.enabled .IsHome) }}
{{- partial "index_profile.html" . }}
{{- else }} {{/* if not profileMode */}}
{{- if not .IsHome | and .Title }}
<header class="page-header">
{{- partial "breadcrumbs.html" . }}
<h1>
{{ .Title }}
{{- if and (or (eq .Kind `term`) (eq .Kind `section`)) (.Param "ShowRssButtonInSectionTermList") }}
{{- with .OutputFormats.Get "rss" }}
<a href="{{ .RelPermalink }}" title="RSS" aria-label="RSS">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" height="23">
<path d="M4 11a9 9 0 0 1 9 9" />
<path d="M4 4a16 16 0 0 1 16 16" />
<circle cx="5" cy="19" r="1" />
</svg>
</a>
{{- end }}
{{- end }}
</h1>
{{- if .Description }}
<div class="post-description">
{{ .Description | markdownify }}
</div>
{{- end }}
</header>
{{- end }}
{{- if .Content }}
<div class="post-content">
{{- if not (.Param "disableAnchoredHeadings") }}
{{- partial "anchored_headings.html" .Content -}}
{{- else }}{{ .Content }}{{ end }}
</div>
{{- end }}
{{- $pages := union .RegularPages .Sections }}
{{- if .IsHome }}
{{- $pages = where site.RegularPages "Type" "in" site.Params.mainSections }}
{{- $pages = where $pages "Params.hiddenInHomeList" "!=" "true" }}
{{- end }}
{{- $paginator := .Paginate $pages }}
{{- if and .IsHome site.Params.homeInfoParams (eq $paginator.PageNumber 1) }}
{{- partial "home_info.html" . }}
{{- end }}
{{- $term := .Data.Term }}
{{- range $index, $page := $paginator.Pages }}
{{- $class := "post-entry" }}
{{- $user_preferred := or site.Params.disableSpecial1stPost site.Params.homeInfoParams }}
{{- if (and $.IsHome (eq $paginator.PageNumber 1) (eq $index 0) (not $user_preferred)) }}
{{- $class = "first-entry" }}
{{- else if $term }}
{{- $class = "post-entry tag-entry" }}
{{- end }}
<article class="{{ $class }}">
{{- $isHidden := (.Param "cover.hiddenInList") | default (.Param "cover.hidden") | default false }}
{{- partial "cover.html" (dict "cxt" . "IsSingle" false "isHidden" $isHidden) }}
<header class="entry-header">
<h2 class="entry-hint-parent">
{{- .Title }}
{{- if .Draft }}
<span class="entry-hint" title="Draft">
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" fill="currentColor">
<path
d="M160-410v-60h300v60H160Zm0-165v-60h470v60H160Zm0-165v-60h470v60H160Zm360 580v-123l221-220q9-9 20-13t22-4q12 0 23 4.5t20 13.5l37 37q9 9 13 20t4 22q0 11-4.5 22.5T862.09-380L643-160H520Zm300-263-37-37 37 37ZM580-220h38l121-122-18-19-19-18-122 121v38Zm141-141-19-18 37 37-18-19Z" />
</svg>
</span>
{{- end }}
</h2>
</header>
{{- if (ne (.Param "hideSummary") true) }}
<div class="entry-content">
<p>{{ .Summary | plainify | htmlUnescape }}{{ if .Truncated }}...{{ end }}</p>
</div>
{{- end }}
{{- if not (.Param "hideMeta") }}
<footer class="entry-footer">
{{- partial "post_meta.html" . -}}
</footer>
{{- end }}
<a class="entry-link" aria-label="post link to {{ .Title | plainify }}" href="{{ .Permalink }}"></a>
</article>
{{- end }}
{{- if gt $paginator.TotalPages 1 }}
<footer class="page-footer">
<nav class="pagination">
{{- if $paginator.HasPrev }}
<a class="prev" href="{{ $paginator.Prev.URL | absURL }}">
«&nbsp;{{ i18n "prev_page" }}&nbsp;
{{- if (.Param "ShowPageNums") }}
{{- sub $paginator.PageNumber 1 }}/{{ $paginator.TotalPages }}
{{- end }}
</a>
{{- end }}
{{- if $paginator.HasNext }}
<a class="next" href="{{ $paginator.Next.URL | absURL }}">
{{- i18n "next_page" }}&nbsp;
{{- if (.Param "ShowPageNums") }}
{{- add 1 $paginator.PageNumber }}/{{ $paginator.TotalPages }}
{{- end }}&nbsp;»
</a>
{{- end }}
</nav>
</footer>
{{- end }}
{{- end }}{{/* end profileMode */}}
{{- end }}{{- /* end main */ -}}

23
layouts/partials/home_info.html
View file

@ -3,11 +3,32 @@
<header class="entry-header"> <header class="entry-header">
<h1>{{ .Title | markdownify }}</h1> <h1>{{ .Title | markdownify }}</h1>
</header> </header>
<div class="entry-content"> <div class="entry-content">
{{ .Content | markdownify }}
<div class="row">
<div class="col photo">
{{- $me := resources.Get "/images/me.webp" }}
<img src="{{ $me.Permalink }}">
</div> </div>
<div class="col intro-text">
{{ .Content | markdownify }}
<div class="entry-content">
{{- partial "nowplaying.html" . }}
</div>
</div>
</div>
<footer class="entry-footer"> <footer class="entry-footer">
{{ partial "social_icons.html" (dict "align" site.Params.homeInfoParams.AlignSocialIconsTo) }} {{ partial "social_icons.html" (dict "align" site.Params.homeInfoParams.AlignSocialIconsTo) }}
</footer> </footer>
</div>
</article> </article>
{{- end -}} {{- end -}}

26
layouts/partials/nowplaying.html Executable file
View file

@ -0,0 +1,26 @@
<script src="/js/nowplaying.js"></script>
<link rel="stylesheet" href="/css/nowplaying.css">
<div class="nowplayingcard">
<div class="nowplayingcontainer-inner">
<div class="trackInfo">
<p><strong>Recently listening to:</strong></p>
🎵 <span id="artist"></span> - <a id="tracktitle"></a>
<a id="album"></a>
</div>
<img id="trackart" src="">
</div>
</div>
<script>
setInterval(getLastTrack("ritualplays","3a4fef48fecc593d25e0f9a40df1fefe"), 10 * 1000);
</script>

28
static/css/nowplaying.css Executable file
View file

@ -0,0 +1,28 @@
.nowplayingcard {
margin: auto;
padding: 14px;
}
.nowplayingcontainer-inner {
transition: 0.3s;
display: inline-flex;
.trackInfo {
width: 100%;
}
#album {
display: none;
}
}
img#trackart {
transition: 0.3s;
width: 60px;
height: 50px;
padding-left: 10px;
}
img#trackart[src=""] {
display: none;
}

BIN
static/images/OoO.png Executable file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 9.9 KiB

77
static/js/nowplaying.js Executable file
View file

@ -0,0 +1,77 @@
const URL_BASE = "https://ws.audioscrobbler.com/2.0/?method=";
const TRACK_METHOD = "user.getrecenttracks&user=";
const KEY_PARAM = "&api_key="
const MB_PARAM = "&mbid="
const REQ_PARAMS = "&format=json&limit=1"
function getDetail(item, requestType, key) {
const detailNode = document.getElementById(requestType);
if (Object.values(item).indexOf('mbid') > -1) {
const detailUrl = URL_BASE + requestType + ".getinfo" + KEY_PARAM + key + MB_PARAM + item["mbid"] + REQ_PARAMS
let detailRequest = null;
if (window.XMLHttpRequest) {
detailRequest = new XMLHttpRequest();
} else {
detailRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
detailRequest.onreadystatechange = function () {
if (detailRequest.readyState === XMLHttpRequest.DONE) {
if (detailRequest.status === 200) {
const response = JSON.parse(detailRequest.responseText);
detailNode.setAttribute("href", response[requestType]["url"])
detailNode.innerText = response[requestType]["name"]
}
}
}
detailRequest.open('GET', detailUrl, true);
detailRequest.send();
} else {
detailNode.setAttribute("href", "#")
detailNode.innerText = item["#text"]
}
}
function getLastTrack(user, key) {
const recentTracksUrl =
URL_BASE + TRACK_METHOD + user + KEY_PARAM + key + REQ_PARAMS
if (window.XMLHttpRequest) {
httpRequest = new XMLHttpRequest();
} else {
httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
httpRequest.onreadystatechange = function () {
if (httpRequest.readyState === XMLHttpRequest.DONE) {
const titleNode = document.getElementById("tracktitle");
const imageNode = document.getElementById("trackart");
const albumNode = document.getElementById("album")
if (httpRequest.status === 200) {
const response = JSON.parse(httpRequest.responseText);
const recentTrack = response.recenttracks.track[0];
console.log(recentTrack)
titleNode.innerText = recentTrack.name;
titleNode.setAttribute("href", recentTrack.url);
titleNode.setAttribute("title", recentTrack.name + " by " + recentTrack.artist["#text"]);
imageNode.setAttribute("src", recentTrack.image[3]["#text"]);
getDetail(recentTrack.album, "album", key)
getDetail(recentTrack.artist, "artist", key)
} else {
titleNode.innerText = "Please Try Again";
imageNode.setAttribute("src", "/images/OoO.png");
albumNode.innerText = "Last.fm"
}
}
}
httpRequest.open('GET', recentTracksUrl, true);
httpRequest.send();
}