Utilize the global actor object in 11ty templates

This commit is contained in:
Gordon Pedersen 2023-09-28 12:23:25 +10:00
parent 6f2e122dd6
commit fa5ef0e282
8 changed files with 151 additions and 26 deletions

View file

@ -1,4 +1,4 @@
const { ACTOR_OBJ } = require("./src/env")
const ACTOR = require("./actor")
module.exports = function(eleventyConfig) {
// I'm .gitignoring my content for now, so 11ty should not ignore that
@ -11,7 +11,8 @@ module.exports = function(eleventyConfig) {
// and collections
addCollections(eleventyConfig)
eleventyConfig.addGlobalData("actor_obj", () => ACTOR_OBJ);
// add the actor data, accessible globally
eleventyConfig.addGlobalData("ACTOR", ACTOR);
// TODO: assets?
// files to passthrough copy
@ -22,6 +23,8 @@ module.exports = function(eleventyConfig) {
// plugins
eleventyConfig.addPlugin(require("@11ty/eleventy-plugin-rss"))
const { EleventyHtmlBasePlugin } = require("@11ty/eleventy")
eleventyConfig.addPlugin(EleventyHtmlBasePlugin)
// Return your Object options:
return {
@ -40,7 +43,7 @@ function addCollections(eleventyConfig) {
if(!item.data.published) return false
return item.filePathStem.startsWith('/posts/')
}).map(item => {
item.data.author = ACTOR_OBJ
item.data.author = ACTOR
return item
}).sort((a, b) => new Date(b.published).getTime() - new Date(a.published).getTime())
})

View file

@ -18,9 +18,9 @@ title: Mon Repos (Death's Domain)
<link rel="micropub" href="https://micropub.death.id.au/.netlify/functions/micropub">
<link rel="micropub_media" href="https://micropub.death.id.au/.netlify/functions/media"> #}
<link rel="stylesheet" href="/css/styles.css">
<link rel="alternate" type="application/rss+xml" title="RSS Feed for death.id.au" href="/rss.xml" />
<link rel="alternate" type="application/atom+xml" title="Atom Feed for death.id.au" href="/atom.xml" />
<link rel="alternate" type="application/json" title="JSON Feed for death.id.au" href="/feed.json" />
<link rel="alternate" type="application/rss+xml" title="RSS Feed for {{ ACTOR.hostname }}" href="/rss.xml" />
<link rel="alternate" type="application/atom+xml" title="Atom Feed for {{ ACTOR.hostname}}" href="/atom.xml" />
<link rel="alternate" type="application/json" title="JSON Feed for {{ ACTOR.hostname }}" href="/feed.json" />
<script src="https://kit.fontawesome.com/ebe14e90c3.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/luxon/build/global/luxon.min.js" crossorigin="anonymous"></script>
<title>{{ title }}</title>

37
_content/atom.njk Normal file
View file

@ -0,0 +1,37 @@
---json
{
"layout": null,
"permalink": "atom.xml",
"eleventyExcludeFromCollections": true,
"metadata": {
"subtitle": "A feed of all my posts on the fediverse",
"language": "en"
}
}
---
<?xml version="1.0" encoding="utf-8"?>
{% from "macro-summary.njk" import summaryMacro %}
<feed xmlns="http://www.w3.org/2005/Atom" xml:base="{{ ACTOR.url }}">
<title>{{ ACTOR.name }}'s feed</title>
<subtitle>{{ metadata.subtitle }}</subtitle>
<link href="{{ permalink | absoluteUrl(ACTOR.url) }}" rel="self"/>
<link href="{{ ACTOR.url }}"/>
<updated>{{ collections.feed[0].date | dateToRfc822 }}</updated>
<id>{{ ACTOR.url }}</id>
<author>
<name>{{ ACTOR.name }}</name>
</author>
{%- for post in collections.feed %}
{%- set absolutePostUrl = post.url | absoluteUrl(ACTOR.url) %}
<entry>
<title>{{ post.data.title }}</title>
<link href="{{ absolutePostUrl }}"/>
<updated>{{ post.date | dateToRfc822 }}</updated>
<id>{{ absolutePostUrl }}</id>
<content xml:lang="{{ metadata.language }}" type="html">
{{ summaryMacro(post.data, post.url) | htmlToAbsoluteUrls(absolutePostUrl) }}
{{ post.templateContent | htmlToAbsoluteUrls(absolutePostUrl) }}
</content>
</entry>
{%- endfor %}
</feed>

View file

@ -4,13 +4,20 @@ eleventyExcludeFromCollections: true
---
<!-- Reference for representative h-card properties: https://microformats.org/wiki/h-card -->
<div class="h-card" rel="author">
<img class="u-featured" src="/assets/img/banner-1500x500.jpg" alt="A grim reaper in a decorated cubicle, writing and daydreaming, surrounded by many other grim reapers in bland, grey, cubicles" />
<img class="u-photo" alt="My profile photo — a pixelated version of me" src="/assets/img/avatar-tt.svg" />
<img class="u-featured" src="{{ ACTOR.image.url }}" alt="{{ ACTOR.image.name}}" />
<img class="u-photo" alt="{{ ACTOR.icon.name}}" src="{{ ACTOR.icon.url }}" />
<h1>
I'm <span class="p-name">Gordon Pedersen</span>, a.k.a <span class="p-nickname">death.au</span>
I'm <span class="p-name">{{ ACTOR.name }}</span>
{% if ACTOR.name != ACTOR.preferredUsername %}
(a.k.a <span class="p-nickname">{{ ACTOR.preferredUsername }}</span>)
{% endif %}
</h1>
<p class="p-note">
{% if ACTOR.summary %}
{{ ACTOR.summary }}
{% else %}
...and I am a human on the Internet.
{% endif %}
</p>
<p>
Go check out some <a href="/posts">stuff I wrote</a><br>
@ -22,21 +29,24 @@ eleventyExcludeFromCollections: true
data-success="Thanks for the follow!"
onsubmit="handleFollow(event.value)">
<img src="/assets/img/Fediverse_logo_proposal.svg" alt="Fediverse logo">
Follow @death.au@death.id.au
Follow @{{ ACTOR.preferredUsername }}@{{ ACTOR.hostname }}
</button></li>
<li><i class="fa fa-rss"></i> <a class="u-url" href="/rss.xml">RSS Feed</a></li>
<li><i class="fa fa-feed"></i> <a class="u-url" href="/atom.xml">Atom Feed</a></li>
<li><i class="fa fa-feed"></i> <a class="u-url" href="/feed.json">JSON Feed</a></li>
</ul>
</p>
<p>
...or elsewhere on the Internet:
<ul>
<li><i><img class="tiny-avatar" src="/assets/img/avatar-tt-trans.svg"></i> <a class="u-uid u-url" href="https://death.id.au">Mon Repos (you are here)</a><a class="u-url" href="acct:death.au@death.id.au"></a></li>
<li><i><img class="tiny-avatar" src="/assets/img/Obsidian.svg"></i> <a class="u-url" href="https://notes.death.id.au" rel="me">My published notes</a>
<li><i><img class="tiny-avatar" src="/assets/img/Obsidian.svg"></i> <a class="u-url" href="https://notes.death.id.au" rel="me">My published notes</a></li>
<li><i class="fa-brands fa-mastodon"></i> <a class="u-url" href="https://pkm.social/@death_au" rel="me">@death_au@pkm.social</a></li>
<li><i class="fa-brands fa-github"></i> <a class="u-url" href="https://github.com/deathau" rel="me">@deathau</a></li>
<li><i class="fa-brands fa-twitter"></i> <a class="u-url" href="https://twitter.com/death_au" rel="me">@death_au</a></li>
<li><i class="fa-brands fa-linkedin"></i> <a class="u-url" href="https://www.linkedin.com/in/gordon-pedersen/">Gordon Pedersen</a></li>
</ul>
</p>
</div>
{% layoutblock 'foot' %}
@ -48,7 +58,7 @@ eleventyExcludeFromCollections: true
})
function handleFollow(handle) {
try{
follow('@death.au@death.id.au', handle)
follow(`@${ACTOR.preferredUsername}@${ACTOR.hostname}`, handle)
}
catch(e){
alert(e)

36
_content/json.njk Normal file
View file

@ -0,0 +1,36 @@
---json
{
"layout": null,
"permalink": "feed.json",
"eleventyExcludeFromCollections": true,
"metadata": {
"subtitle": "A feed of all my posts on the fediverse",
"language": "en"
}
}
---
{ {% from "macro-summary.njk" import summaryMacro %}
"version": "https://jsonfeed.org/version/1.1",
"title": "{{ ACTOR.name }}'s feed",
"language": "{{ metadata.language }}",
"home_page_url": "{{ ACTOR.url }}",
"feed_url": "{{ permalink | absoluteUrl(ACTOR.url) }}",
"description": "{{ metadata.subtitle }}",
"author": {
"name": "{{ ACTOR.name }}",
"url": "{{ ACTOR.url }}"
},
"items": [
{%- for post in collections.feed %}
{%- set absolutePostUrl = post.url | absoluteUrl(ACTOR.url) %}
{
"id": "{{ absolutePostUrl }}",
"url": "{{ absolutePostUrl }}",
"title": "{{ post.data.title }}",
"content_html": {{ summaryMacro(post.data, post.url) | concat(post.templateContent) | htmlToAbsoluteUrls(absolutePostUrl) | dump | safe }},
"date_published": "{{ post.date | dateToRfc3339 }}"
}
{% if not loop.last %},{% endif %}
{%- endfor %}
]
}

36
_content/rss.njk Normal file
View file

@ -0,0 +1,36 @@
---js
{
"layout": null,
"permalink": "rss.xml",
"eleventyExcludeFromCollections": true,
"metadata": {
"subtitle": "A feed of all my posts on the fediverse",
"language": "en"
}
}
---
<?xml version="1.0" encoding="utf-8"?>
{% from "macro-summary.njk" import summaryMacro %}
<rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xml:base="{{ ACTOR.url }}" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ ACTOR.name }}'s feed</title>
<link>{{ ACTOR.url }}</link>
<atom:link href="{{ permalink | absoluteUrl(ACTOR.url) }}" rel="self" type="application/rss+xml" />
<description>{{ metadata.subtitle }}</description>
<language>{{ metadata.language }}</language>
{%- for post in collections.feed | reverse %}
{%- set absolutePostUrl = post.url | absoluteUrl(ACTOR.url) %}
<item>
<title>{{ post.data.title }}</title>
<link>{{ absolutePostUrl }}</link>
<description>
{{ summaryMacro(post.data, post.url) | htmlToAbsoluteUrls(absolutePostUrl) }}
{{ post.templateContent | htmlToAbsoluteUrls(absolutePostUrl) }}
</description>
<pubDate>{{ post.date | dateToRfc822 }}</pubDate>
<dc:creator>{{ ACTOR.name }}</dc:creator>
<guid>{{ absolutePostUrl }}</guid>
</item>
{%- endfor %}
</channel>
</rss>

View file

@ -1,4 +1,4 @@
import { BASE_URL, PUBLIC_KEY } from "./src/env"
import { BASE_URL, HOSTNAME, PUBLIC_KEY } from "./src/env"
// change "activitypub" to whatever you want your account name to be
export const preferredUsername:string = process.env.ACCOUNT || "activitypub"
@ -6,17 +6,19 @@ export const name = process.env.REAL_NAME || preferredUsername
export const summary = ""
// avatar image
const icon:{ type:"Image", mediaType:string, url:string } = {
const icon:{ type:"Image", mediaType:string, url:string, name:string } = {
type: "Image",
mediaType: "image/svg+xml",
url: BASE_URL + "/assets/img/avatar-tt.svg"
url: BASE_URL + "/assets/img/avatar-tt.svg",
name: "My profile photo — a pixelated version of me"
}
// banner image
const image:{ type:"Image", mediaType:string, url:string } = {
const image:{ type:"Image", mediaType:string, url:string, name:string } = {
type: "Image",
mediaType: "image/jpeg",
url: BASE_URL + "/assets/img/banner-1500x500.jpg"
url: BASE_URL + "/assets/img/banner-1500x500.jpg",
name: "A grim reaper in a decorated cubicle, writing and daydreaming, surrounded by many other grim reapers in bland, grey, cubicles"
}
// This is a list of other actor ids you identify as
@ -72,6 +74,7 @@ export default {
preferredUsername,
name,
summary,
hostname: HOSTNAME,
url: BASE_URL,
manuallyApprovesFollowers: false,
discoverable: true,

View file

@ -64,7 +64,7 @@ async function fetchActor(url:string) {
export async function fetchObject(object_url:string) {
console.log(`fetch ${object_url}`)
const res = await fetch(object_url);
const res = await signedFetch(object_url);
if (res.status < 200 || 299 < res.status) {
throw new Error(res.statusText + ": " + (await res.text()));