Article on importing Twitter & Spotify links

Also some improvements to the twitter import.

assets/scss/_main.scss

@@ -220,7 +220,7 @@ article {
     margin-right: auto;
     max-width: 100%;
 
-    &.audio {
+    &.audio,&.spotify {
       margin: 0;
       padding: 0;
       width: 100%;

assets/scss/_single.scss

@@ -55,11 +55,14 @@
   &-content {
     margin-top: 30px;
 
-    svg {
+  }
+
+  &-content svg, &-info svg {
     display: inline-block;
     height: 1em;
-      vertical-align:text-top;
+    vertical-align: -0.125em;
-    }
+    width: 1em;
+    height: 1em;
   }
 
   &-cover {
@@ -531,8 +534,13 @@ figure {
   font-synthesis: none;
 }
 
-.notes-content {
+.post-content {
   footer {
     text-align: right;
   }
+
+  svg {
+    color: var(--accent);
+    vertical-align:middle;
+  }
 }

content/notes/twitter/1100684287727357952/index.md

@@ -3,6 +3,8 @@ date: "2019-02-27T09:09:18Z"
 tags:
 - imported
 - from-twitter
+- spotify
 ---
-Walking to work in glorious summer sun, while still in winter, listening to this outrageously talented musician, chemist, and \(clearly\) polymath is inspiring:\
+Walking to work in glorious summer sun, while still in winter, listening to this outrageously talented musician, chemist, and \(clearly\) polymath is inspiring:
-[https://open.spotify.com/track/7Hi4r3EULEJfLrwli8iw5Q](https://open.spotify.com/track/7Hi4r3EULEJfLrwli8iw5Q)
+
+{{< spotify path="/track/7Hi4r3EULEJfLrwli8iw5Q" artist="Isaac Stern" composer="Alexander Borodin" title="String Quartet No. 2 in D Major: III. Nocturne (arr. for violin and orchestra)" >}}

content/notes/twitter/1230333414/index.md

@@ -4,4 +4,4 @@ tags:
 - imported
 - from-twitter
 ---
-JP : WHAT DON'T YOU F\*ING UNDERSTAND, I'LL F\*ING KICK YOUR F\*ING ASS \(https://www.youtube.com/watch?v=YTihsJQHt48\).
+JP : WHAT DON'T YOU F\*ING UNDERSTAND, I'LL F\*ING KICK YOUR F\*ING ASS \([https://www.youtube.com/watch?v=YTihsJQHt48](https://www.youtube.com/watch?v=YTihsJQHt48)\).

content/notes/twitter/12569591975/index.md

@@ -3,5 +3,8 @@ date: "2010-04-21T10:45:59Z"
 tags:
 - imported
 - from-twitter
+- spotify
 ---
-Now this is *real* Rhythm and Blues. http://open.spotify.com/track/5ZiU4oxQ6RxiEBIQpVa0mU
+Now this is *real* Rhythm and Blues.
+
+{{< spotify path="/track/5ZiU4oxQ6RxiEBIQpVa0mU" artist="B.B. King" title="Rock Me Baby" >}}

content/notes/twitter/1484573119784550400/index.md

@@ -4,13 +4,13 @@ tags:
 - imported
 - from-twitter
 ---
-Absurdle 6/∞\
+[Absurdle](https://qntm.org/absurdle) 6/∞
-\
+
 ⬜⬜⬜⬜⬜\
 ⬜⬜🟨⬜⬜\
 ⬜🟨⬜🟨⬜\
 🟨🟨🟨🟩⬜\
 🟩🟩⬜🟩🟩\
-🟩🟩🟩🟩🟩\
+🟩🟩🟩🟩🟩
-\
+
-Pretty chuffed with that for a first try\! [https://qntm.org/files/wordle](https://qntm.org/files/wordle)
+Pretty chuffed with that for a first try\!

content/notes/twitter/1511973592191442944/index.md

@@ -3,5 +3,8 @@ date: "2022-04-07T07:46:10Z"
 tags:
 - imported
 - from-twitter
+- spotify
 ---
-Every time I listen to this track I'm re-awed by the poetry of the lyrics [https://open.spotify.com/track/1zU0kAJdEPyRs4x5gkQQER?si=a60d452bd37649b2](https://open.spotify.com/track/1zU0kAJdEPyRs4x5gkQQER?si=a60d452bd37649b2)
+Every time I listen to this track I'm re-awed by the poetry of the lyrics
+
+{{< spotify path="/track/1zU0kAJdEPyRs4x5gkQQER" artist="Squeeze" title="Up the Junction" >}}

content/notes/twitter/1526701008/index.md

@@ -3,5 +3,8 @@ date: "2009-04-15T17:11:28Z"
 tags:
 - imported
 - from-twitter
+- spotify
 ---
-tuuuune: http://open.spotify.com/track/2NLHOsJcGQK7MiE88QnmHZ
+tuuuune:
+
+{{< spotify path="/track/2NLHOsJcGQK7MiE88QnmHZ" artist="The Ting Tings" title="We Walk" >}}

content/notes/twitter/1592087563220979715/index.md

@@ -4,4 +4,4 @@ tags:
 - imported
 - from-twitter
 ---
-I'm now nervous about my private data here, so I'm going to delete my account \(and demand the erasure of its historical info\) soon. I *might* come back, but you can definitely find me at [@byjp](https://twitter.com/byjp)@hachyderm.io, or on a variety of platforms from my site, [https://www.byjp.me/](https://www.byjp.me/).
+I'm now nervous about my private data here, so I'm going to delete my account \(and demand the erasure of its historical info\) soon. I *might* come back, but you can definitely find me at [@byjp@hachyderm.io](https://hachyderm.io/@byjp), or on a variety of platforms from my site, [https://www.byjp.me/](https://www.byjp.me/).

content/notes/twitter/18118718716/index.md

@@ -3,5 +3,8 @@ date: "2010-07-09T13:41:53Z"
 tags:
 - imported
 - from-twitter
+- spotify
 ---
-I'm betting the 2005 and 2006 albums aren't from the same artist as the 1963 album… http://open.spotify.com/artist/6qF0CJP412Gd50Rn1sFg2o
+I'm betting the 2005 and 2006 albums aren't from the same artist as the 1963 album…
+
+{{< spotify path="/artist/6qF0CJP412Gd50Rn1sFg2o" artist="The Cascades" >}}

content/notes/twitter/3718775424/index.md

@@ -3,9 +3,10 @@ date: "2009-09-02T21:00:16Z"
 tags:
 - imported
 - from-twitter
+- spotify
 ---
-The Temper Trap – Science Of Fear - Mistabishi Remix.\
+The Temper Trap – Science Of Fear - Mistabishi Remix.
-\
+
-Listen.\
+Listen.
-\
+
-spotify:track:1vKIhe9D0Wv5BKjK1FY2Hl
+{{< spotify path="/track/0Z7CwV9ps38j0JvFmg43yr" artist="The Temper Trap" title="Science Of Fear (Mistabishi Remix)" >}}

content/notes/twitter/7406094021/index.md

@@ -4,4 +4,4 @@ tags:
 - imported
 - from-twitter
 ---
-Boom Boom http://poetry.kedakai.co.uk/poem:ltt/
+Boom Boom [Less Than Three](/poetry/ltt)

content/notes/twitter/75964463068618752/index.md

@@ -4,5 +4,8 @@ tags:
 - imported
 - from-twitter
 - chris
+- spotify
 ---
-Listening to my bro's "Old school hip-hop" spotify album after a hectic day at work. Nice. [https://open.spotify.com/user/chrismhs/playlist/6pb8pxWCfLRZJFsQcuB471](https://open.spotify.com/user/chrismhs/playlist/6pb8pxWCfLRZJFsQcuB471) cheers {{< friend "chris" >}}
+Listening to my bro's "Old school hip-hop" spotify album after a hectic day at work. Nice. Cheers {{< friend "chris" >}}
+
+{{< spotify path="/user/chrismhs/playlist/6pb8pxWCfLRZJFsQcuB471" title="Old School Hip Hop (Playlist)" >}}

content/notes/twitter/842381664751874048/index.md

@@ -3,5 +3,8 @@ date: "2017-03-16T14:26:54Z"
 tags:
 - imported
 - from-twitter
+- spotify
 ---
-Go for a walk. A walk to remember. [https://open.spotify.com/track/6Aoo9CtYY2q0jEt4GMDJUK](https://open.spotify.com/track/6Aoo9CtYY2q0jEt4GMDJUK)
+Go for a walk. A walk to remember.
+
+{{< spotify path="/track/6Aoo9CtYY2q0jEt4GMDJUK" artist="Vulfpeck" title="A Walk to Remember" >}}

content/notes/twitter/866365488531681280/index.md

@@ -4,4 +4,4 @@ tags:
 - imported
 - from-twitter
 ---
-What happens when you try and relax: an article on why cryptocurrencies are the future of commerce and government 😳 [https://medium.com/@jphastings/why-you-should-pay-attention-to-ethereum-96766a2c89a4](https://medium.com/@jphastings/why-you-should-pay-attention-to-ethereum-96766a2c89a4)
+What happens when you try and relax: an article on why cryptocurrencies are the future of commerce and government 😳 [Why you should pay attention to Ethertheum](/posts/pay-attention-to-ethereum)

content/notes/twitter/883029629463867393/index.md

@@ -4,5 +4,8 @@ tags:
 - imported
 - from-twitter
 - BritishThreatLevels
+- spotify
 ---
-Fear not tube users, my [@vulfpeck](https://twitter.com/vulfpeck) fuelled "dancing" has been stemmed by being forcibly sat down [BritishThreatLevels](/tags/BritishThreatLevels) [https://open.spotify.com/track/1SHA4IJyiyNobDOrQzFFXy](https://open.spotify.com/track/1SHA4IJyiyNobDOrQzFFXy)
+Fear not tube users, my [@vulfpeck](https://twitter.com/vulfpeck) fuelled "dancing" has been stemmed by being forcibly sat down [BritishThreatLevels](/tags/BritishThreatLevels)
+
+{{< spotify path="/track/1SHA4IJyiyNobDOrQzFFXy" artist="Vulfpeck" title="Animal Spirits" >}}

content/photos/w4dqgta6etolv2l7vyt6l7u3ya/index.md

@@ -7,9 +7,10 @@ draft: false
 tags:
 - imported
 - from-instagram
+- spotify
 ---
 I've adored Gordon's music at many a swing dancing social before, but getting to meet & hear him at a living room gig earlier this week was just superlative.
 
+Let his album sort your Friday out for you:
 
-
+{{< spotify path="/album/3RorNzHvrrJ3FHKz4scuit" artist="Gordon Webster" album="Blues Till Dawn" >}}
-Let his album sort your Friday out for you: https://open.spotify.com/album/3RorNzHvrrJ3FHKz4scuit

content/posts/archiving-instagram-posts/index.md

@@ -12,8 +12,10 @@ summary: Archiving my Instagram account, and releasing the code that imported it
 
 I spent a little time this weekend reminding myself of what writing code is like (before I start work again on Tuesday, after [4 months travelling](https://adventure.awaits.us)). After my recent post on [leaving Meta's social networks](/posts/goodbye-big-social) I decided to create a script to convert the GDPR-provided archive of all my activity on Instagram into this blog.
 
-You can find it at [/tags/from-instagram](/tags/from-instagram) — I'll figure out a good place to leave a permanent link soon!
+You can find it at [from-instagram](/tags/from-instagram) — ~~I'll figure out a good place to leave a permanent link soon!~~[^1].
 
 {{< figure src="instgram-posts.webp" title="A screenshot of the new archival page on this blog; tiled photos from my instagram feed." >}}
 
-If this incredibly specific challenge is something you also face, you can find the (slap-dash) code I wrote in the [repo that contains this blog](https://github.com/jphastings/www.byjp.me/tree/main/tools/archive/instagram).
+If this incredibly specific challenge is something you also face, you can find the (slap-dash) code I wrote in the [repo that contains this blog](https://github.com/by-jp/www.byjp.me/tree/main/tools/archive/instagram).
+
+[^1]: I switched to treating Instagram photos as a part of my [photos stream](/photos), but left the [from-instagram](/tags/from-instagram) tags on there, in case you want to find those specifically.

content/posts/importing-tweets/index.md

@@ -0,0 +1,30 @@
+---
+title: "Importing Tweets"
+emoji: 🐦
+date: 2024-01-19T15:35:04Z
+summary: More than a year after I closed my Twitter account, I've imported my tweets to my blog.
+tags:
+- twitter
+- import
+- code
+- archive
+- nostalgia
+---
+
+It wasn't until I started writing this post that I realised how long I was a user of Twitter. For 2 days shy of 13 years (from Nov 16, 2009 to Nov Nov 14, 2022) I posted [random thoughts](/notes/twitter/860849128724713472), experimented (with [geotagging](/notes/twitter/22679551), [OAuth](/notes/twitter/78268982) and more), and watched it change the internet with the invention of [hashtags](/notes/twitter/1412088964), retweets ([before](/notes/twitter/2460448329/) it was "via"), `@`tags ([before](/notes/twitter/74694)—while watching Ze Frank's The Show, [after](/notes/twitter/113686952)—when my friends all had handles that were just their names).
+
+I even used it during its SMS-powered phase, where the 140 charcter limit came from; a tweet starting with your username ([as they did](/notes/twitter/70903) back then) allowed for 20 characters of username and 140 characters of thought was the 160 limit of SMS.
+
+In late 2022 I became very worried about the (then new) management of Twitter, particularly the choices it was making in data security, so I decided to vote with my feet. I collected my data with their export functionality, checked it briefly, then put it on a backup drive and forgot about it. Until this weekend…
+
+I threw together some (crappy) [Go](/tags/go) code that processes the data from a Twitter export `.zip` file and creates Hugo compatible markdown files for this blog. You can see the code _in_ this blog's repo (currently [on Github](https://github.com/by-jp/www.byjp.me/tree/main/tools/archive/twitter)).
+
+This code also tries to rescue as much data from other silos as possible (like link shorteners and image hosters), but there's definitely plenty missing. If you find a `t.co` or `j.mp` shortener link still in there, then the data has already succumbed to linkrot, and I've left the (now dead) URL there in the unlikely event that I can pull info from an archive somewhere.
+
+I _did_ manage to manually download my (few) [audioboo](/tags/audioboo) recordings from what's now [audioboom.com](https://audioboom.com), and serve them up here. If you want a few, short, mostly grumble-based, recordings of my voice from 15 years ago, you've come to the right place.
+
+It's probably my age, and my [recent](/posts/mum) proximity to death, but I've really enjoyed travelling back into my past by reading through my early days of Twitter over-sharing. In fact, all the digital history work I've done around importing things into this blog has been thoroughly enjoyably nostalgic. I'd recommend it!
+
+And on that note I'll leave you with a nostalgic track, the first I seem to have posted to Twitter, The Mistabishi Remix of The Temper Trap's _Science Of Fear_:
+
+{{< spotify path="/track/0Z7CwV9ps38j0JvFmg43yr" artist="The Temper Trap" title="Science Of Fear (Mistabishi Remix)" >}}

layouts/_default/list.html

@@ -1,5 +1,5 @@
 {{ define "main" }}
-    {{ $paginator := .Paginate .Data.Pages }}
+    {{ $paginator := .Paginate .Pages }}
     
     <main class="posts" {{ if eq .Kind "taxonomy" }}data-pagefind-ignore{{ end }}>
         {{ partial "generic-list-header.html" . }}
@@ -25,7 +25,7 @@
                         <li class="post-item">
                             <a href="{{.Permalink}}">
                                 {{ if .Params.emoji }}<span class="post-emoji">{{ .Params.emoji }}</span>{{ end }}
-                                <span class="post-title">{{ if .Title }}{{.Title}}{{ else }}<i>Untitled {{ .Type | singularize -}}</i>{{ end }}</span>
+                                <span class="post-title">{{ if .Title }}{{.Title}}{{ else }}<i>{{ .Type | singularize | title }} from {{ partial "year-relative-date.txt" .Date }}</i>{{ end }}</span>
                                 <span class="post-day">
                                     {{ if .Site.Params.dateformShort }}
                                         {{ .Date.Format .Site.Params.dateformShort }}

layouts/_default/single.html

@@ -98,6 +98,12 @@
 
     {{ if ne .Type "site-infra" }}
       <div class="post-info">
+        {{ if in .Params.tags "from-twitter" }}
+          <p>
+            {{ partial "svg.html" (dict "name" "twitter") }}
+            From <a href="/posts/importing-tweets">twitter archive</a>
+          </p>
+        {{ end }}
         {{ partial "tags.html" .Params.tags }}
         {{ partial "series-tags.html" . }}
         <p>

layouts/notes/list.html

@@ -21,9 +21,12 @@
         <div class="posts-list">
           {{ range $paginator.Pages }}
             <hr />
-            <article class="notes-content e-content">
+            <article class="post-content e-content">
               {{ .Content }}
-              <footer><a href="{{.Permalink}}">{{ partial "year-relative-date.html" .Date }}</a></footer>
+              <footer>
+                <a href="{{.Permalink}}">{{ partial "year-relative-date.html" .Date }}</a>
+                {{ if collections.In .Params.tags "from-twitter" }}{{ partial "svg.html" (dict "name" "twitter") }}{{ end }}
+              </footer>
             </article>
           {{ end }}
           </div>

layouts/partials/generic-list-header.html

@@ -16,7 +16,7 @@
           <line x1="10" y1="3" x2="8" y2="21"></line>
           <line x1="16" y1="3" x2="14" y2="21"></line>
       </svg>
-    {{ len .Data.Pages }} {{ if eq .Title "Calendar" }}events{{ else if eq .Title "Notes" }}notes {{ else }}posts{{ end }}
+    {{ len .Data.Pages }} {{ if eq .Title "Calendar" }}events{{ else }}{{ .Title | lower }}{{ end }}
   </p>
   <p class="author h-card hidden" aria-hidden="true">
     <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-user"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>

layouts/partials/kebab.txt

@@ -0,0 +1 @@
+{{ . | lower | replaceRE `\.` "" | replaceRE "[^a-z0-9]+" "-" | strings.TrimSuffix "-" }}

layouts/photos/single.html

@@ -23,8 +23,8 @@
         <div class="post-info">
             {{ if in .Params.tags "from-instagram" }}
           <p>
-                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path><line x1="17.5" y1="6.5" x2="17.5" y2="6.5"></line></svg>
+            {{ partial "svg.html" (dict "name" "instagram") }}
-                    From <a href="../">instagram archive</a>
+            From <a href="/posts/archiving-instagram-posts/">instagram archive</a>
           </p>
         {{ end }}
             {{ partial "tags.html" .Params.tags }}

layouts/shortcodes/spotify.html

@@ -0,0 +1,13 @@
+{{- $displayArtist := (.Get "composer") | default (.Get "artist") -}}
+{{- $displayTitle := (.Get "title") | default (.Get "album") -}}
+{{ $songwhip := .Get "url" }}
+{{- if $displayArtist -}}
+  {{- $songwhip = printf "https://songwhip.com/%s/%s" (partial "kebab.txt" (.Get "artist")) (partial "kebab.txt" $displayTitle) }}
+{{- end -}}
+<figure class="spotify">
+  <iframe style="border-radius:12px; width:100%; max-width:486px;" src="https://open.spotify.com/embed{{ .Get "path" }}" height="80" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
+  <figcaption>
+    🎶 {{ $displayArtist }}{{ with $displayTitle }}{{ if $displayArtist }}: {{ end }}<em>{{ . }}</em>{{ end }}<br/>
+    {{ with $songwhip }}<a href="{{ . }}" target="_blank" style="font-style:italic;">Listen elsewhere</a>{{ end }}
+  </figcaption> 
+</figure>