diff --git a/eleventy.config.js b/eleventy.config.js index 1fbb963..2ac05a2 100644 --- a/eleventy.config.js +++ b/eleventy.config.js @@ -12,7 +12,7 @@ import clean from "eleventy-plugin-clean" import toc from "eleventy-plugin-toc" import EleventyFeedPlugin from "@11ty/eleventy-plugin-rss" import EleventyVitePlugin from "@11ty/eleventy-plugin-vite" -import EleventyImage from "@11ty/eleventy-img" +import { eleventyImageTransformPlugin } from "@11ty/eleventy-img" import { ViteMinifyPlugin } from "vite-plugin-minify" import { execSync } from "child_process" import fetch from "@11ty/eleventy-fetch" @@ -66,32 +66,6 @@ export default async (config) => { config.addPassthroughCopy({ assets: "/", }) - mdLib.renderer.rules.image = (tokens, idx, _options, env, _self) => { - const token = tokens[idx]; - let src = token.attrGet('src'); - const alt = token.content; - const title = token.attrGet('title'); - - const file = relativeToInputPath(env.page.inputPath, src); - const formats = ["avif", "auto"]; - const imageOptions = { - widths: [125, 250, 500, "auto"], - formats, - outputDir: - path.join(config.dir.output, "img"), - } - EleventyImage(file, imageOptions); // async but we won't await it - const metadata = EleventyImage.statsSync(file, imageOptions); - const imageAttributes = { - alt, - title, - sizes: "var(--content-width)", - loading: "lazy", - decoding: "async", - }; - - return EleventyImage.generateHTML(metadata, imageAttributes); - } // collection from music folder config.addPassthroughCopy("site/music", { @@ -152,30 +126,29 @@ export default async (config) => { ) }) - config.addShortcode("image", function imageShortcode(src, alt, sizes, loading, classNames, inputPath) { - const file = relativeToInputPath(inputPath ?? this.page.inputPath, src); - const formats = ["avif", "auto"]; - const imageOptions = { - widths: [125, 250, 500, "auto"], - formats, - outputDir: - path.join(config.dir.output, "img"), - } - console.log({ - src, alt, sizes, loading, classNames, imageOptions - }) - EleventyImage(file, imageOptions); // async but we won't await it - const metadata = EleventyImage.statsSync(file, imageOptions); - const imageAttributes = { - alt, - sizes, - loading, - decoding: "async", - ...(classNames ? { class: classNames} : {}) - }; + // config.addShortcode( + // "image", + // function imageShortcode(src, alt, sizes, loading, classNames, inputPath) { + // const file = relativeToInputPath(inputPath ?? this.page.inputPath, src) + // const formats = ["avif", "auto"] + // const imageOptions = { + // widths: [125, 250, 500, "auto"], + // formats, + // outputDir: path.join(config.dir.output, "img"), + // } + // EleventyImage(file, imageOptions) // async but we won't await it + // const metadata = EleventyImage.statsSync(file, imageOptions) + // const imageAttributes = { + // alt, + // sizes, + // loading, + // decoding: "async", + // ...(classNames ? { class: classNames } : {}), + // } - return EleventyImage.generateHTML(metadata, imageAttributes); - }); + // return EleventyImage.generateHTML(metadata, imageAttributes) + // } + // ) config.addFilter("toISOString", (dateString) => { return new Date(dateString).toISOString() @@ -186,12 +159,34 @@ export default async (config) => { config.addFilter("markdown", (markdownString) => { return mdLib.renderInline(String(markdownString ?? "").trim()) }) + config.addFilter("pathOnly", (filePath) => { + let split = filePath.split("/") + split.pop() // gets rid of filename + split.shift() // gets rid of leading "." + split.shift() // gets rid of base folder "site" + return split.join("/") + }) + config.addFilter("debug", (value) => { + console.log(`######## ${JSON.stringify(value, null, 2)}`) + }) clean.updateFileRecord("dist") const buildTime = new Date().toISOString().replace(/[:.-]/g, "") config.addGlobalData("buildTime", buildTime) + config.addPlugin(eleventyImageTransformPlugin, { + formats: ["avif", "jpeg"], + widths: [128, 384, 1152, "auto"], + htmlOptions: { + imgAttributes: { + loading: "lazy", + decoding: "async", + }, + pictureAttributes: {}, + }, + }) + config.addPlugin(EleventyFeedPlugin) config.addPlugin(EleventyVitePlugin, { @@ -205,7 +200,6 @@ export default async (config) => { build: { mode: "production", emptyOutDir: true, - sourcemap: true, }, plugins: [ViteMinifyPlugin({})], }, @@ -264,9 +258,3 @@ async function fetchShaarliWebroll() { .sort((a, b) => a.date.getTime() - b.date.getTime()) return entries } - -function relativeToInputPath(inputPath, relativeFilePath) { - let split = inputPath.split("/"); - split.pop(); - return path.resolve(split.join(path.sep), relativeFilePath); - } diff --git a/site/_includes/-header.njk b/site/_includes/-header.njk index 1c44110..8b7b48d 100644 --- a/site/_includes/-header.njk +++ b/site/_includes/-header.njk @@ -12,7 +12,7 @@ {%- if cover %}
- {% image cover, "", "var(--content-width)", "eager" %} +

{{ title }}{% if rssUrl and page.url !== '/' %}{% endif %}

{%- else %} diff --git a/site/_includes/components/collectionList.njk b/site/_includes/components/collectionList.njk index c917e9e..7b48ca3 100644 --- a/site/_includes/components/collectionList.njk +++ b/site/_includes/components/collectionList.njk @@ -6,7 +6,7 @@ {%- if (limit === 0 or loop.index <= limit) -%}
  • {% if item.data.cover %} - {% image item.data.cover, "", "(min-width: 60rem) calc(0.5 * var(--content-width)), var(--content-width)", "lazy", "collection-cover", item.page.inputPath %} + {% endif %} {{item.data.title}}
    diff --git a/site/pages/books/index.md b/site/pages/books/index.md index 974c449..43a1320 100644 --- a/site/pages/books/index.md +++ b/site/pages/books/index.md @@ -14,39 +14,39 @@ These books had a big influence on my thinking and taste. } -### [{% image "0465026567.jpg", "book cover, showing a pair of carved shapes which cast shadows forming the letters G, E, and B", "8em" %} Gödel, Escher, Bach: an Eternal Golden Braid - Douglas Hofstadter](https://amzn.to/44Nvcuf) +### [book cover, showing a pair of carved shapes which cast shadows forming the letters G, E, and B Gödel, Escher, Bach: an Eternal Golden Braid - Douglas Hofstadter](https://amzn.to/44Nvcuf) I read this heady tome in college. I think I've completed it three times? It alternates between whimsical stories and theory, building a case that thought and meaning are emergent properties of the brain. It deals heavily with the idea of self-reference, which is the main theme uniting the three people in the title. Although he discounts the possibility of the immaterial aspect of reality as unknowable, Hofstadter introduced me to many interesting ideas and his book is a delightful journey, if you are prepared for it. -### [{% image "0007528418.jpg", "book cover, abstract space illustration showing three planets", "8em" %} The Space Trilogy: Out of the Silent Planet, Perelandra, and That Hideous Strength - C. S. Lewis](https://amzn.to/3SfO7Xc) +### [book cover, abstract space illustration showing three planets The Space Trilogy: Out of the Silent Planet, Perelandra, and That Hideous Strength - C. S. Lewis](https://amzn.to/3SfO7Xc) These stories contain so much richness. One theme that stuck with me emerges in _Out of the Silent Planet_ and is repeated in _Perelandra_: that good things can be spoiled by overconsumption. Something that is pleasant or satisfying stands by itself, and doesn't need to be repeated or hoarded. In fact, the drive to capture, concentrate, and control pleasant things can cheapen them, and could be at the root of many of our troubles. -### [{% image "1523006560.jpg", "book cover, a tromp-l'oeil torn segment reveals in bold letters \"SELF-DECEPTION\"", "8em" %} Leadership and Self-Deception - The Arbinger Institute](https://amzn.to/3GNsFGs) +### [book cover, a tromp-l'oeil torn segment reveals in bold letters “SELF-DECEPTION” Leadership and Self-Deception - The Arbinger Institute](https://amzn.to/3GNsFGs) This book painted for me a vivid picture of the mechanics of selfish and self-centered thinking. It describes in detail the ways that we blind ourselves, especially in interpersonal communication. The result of internalizing the concepts in this book is a sort of secular elaboration of "Love your neighbor", but even though it misses (or omits? subtracts?) the spiritual core of things, it still rings quite true and the tools found in this book and others from the Arbinger Instutute are fantastically valuable. If this is of interest, you may also enjoy [Marshall Rosenberg's "Non-violent communication"](https://amzn.to/3SmSQqi) or [my article on needs-based communication](/posts/needs-based-communication/). -### [{% image "188790400X.jpg", "book cover, a byzantine icon \"The triumph of the Archangel Michael over the antichrist, who is shown falling into the abyss together with the cities of this world at the end of time\"", "8em" %} Orthodoxy and the Religion of the Future - Fr. Seraphim Rose](https://amzn.to/4jVqE9F) +### [book cover, a byzantine icon “The triumph of the Archangel Michael over the antichrist, who is shown falling into the abyss together with the cities of this world at the end of time” Orthodoxy and the Religion of the Future - Fr. Seraphim Rose](https://amzn.to/4jVqE9F) This book synthesizes many pieces of the zeitgeist as I have seen it develop in my life. It touches on nihilism, the charismatic movement, yoga, eastern and new-age spirituality, and the UFO phenomenon. All these things are contextualized into a movement towards an upcoming religious synthesis, and contrasted with eastern Orthodoxy. Fr. Seraphim has a clear, academic writing style which I found easy to read, and this book answered many questions I had not even thought to ask. I also recommend his book/pamphlet [Nihilism: The Root of the Revolution of the Modern Age](https://amzn.to/4jYlRnX), which is slightly drier than this but sets a good foundation for it, and [The Soul After Death](https://amzn.to/4iDaAIv) for its sober and thorough approach to understanding things most people have not witnessed directly. -### [{% image "1887904166.jpg", "book cover, a mountainside monastery with a body of water in the background", "8em" %} The Gurus, the Young Man, and Elder Paisios - Dionysios Farasiotis](https://amzn.to/3GzsoXJ) +### [book cover, a mountainside monastery with a body of water in the background The Gurus, the Young Man, and Elder Paisios - Dionysios Farasiotis](https://amzn.to/3GzsoXJ) This is the fascinating true story of a young man's experiences with occult eastern gurus, the amazing adventures and troubles he had, and his conversations and visits with Elder Paisios of Mount Athos. He tells the story without embellishment, speaking plainly about the fantastic things that he saw and his thoughts and feelings as he struggled to find peace. -### [{% image "0765319853.jpg", "book cover, three shadowed figures in a dramatic pose in front of a looming red X", "8em" %} Little Brother - Cory Doctorow](https://www.gutenberg.org/ebooks/30142) +### [book cover, three shadowed figures in a dramatic pose in front of a looming red X Little Brother - Cory Doctorow](https://www.gutenberg.org/ebooks/30142) This book functions not only as an engaging story, but a primer for digital security as a whole. If it doesn't make you an outright cypherpunk, you will at least understand the movement better. -### [{% image "0553380958.jpg", "book cover, a red katana in front of a blue field of circuits", "8em" %} Snow Crash - Neal Stephenson](https://amzn.to/3SfPIMG) +### [book cover, a red katana in front of a blue field of circuits Snow Crash - Neal Stephenson](https://amzn.to/3SfPIMG) A sympathetic main character, heaps of style, a hacker aesthetic, an evocative and lived-in setting, and non-stop action. This book magnified my love of the written word as a literal creative force. Digital reality and baseline reality are both shaped by language, but in different ways, and this story explores that distinction vigorously and memorably. -### [{% image "0395423317.jpg", "book cover, a softly lit man in overalls stares as he is served a bowl of soup", "8em" %} The Stranger - Chris Van Allsburg](https://amzn.to/3SeBz2k) +### [book cover, a softly lit man in overalls stares as he is served a bowl of soup The Stranger - Chris Van Allsburg](https://amzn.to/3SeBz2k) The illustrations in this surreal children's book stuck with me my whole life. I like all this author's illustrations, but this book especially captured my imagination. -### [{% image "0936200111.jpg", "book cover, large text above a photo of a PC-2 computer, with a one-row LCD display and a tiny but complete QWERTY keyboard", "8em" %} Getting Started on the PC-2 - Harvard Pennington, Gary Camp, Ralph Burris](https://archive.org/details/gettingstartedon00harv) +### [book cover, large text above a photo of a PC-2 computer, with a one-row LCD display and a tiny but complete QWERTY keyboard Getting Started on the PC-2 - Harvard Pennington, Gary Camp, Ralph Burris](https://archive.org/details/gettingstartedon00harv) This was my first programming book. My grandfather Clarence gave it to me along with a Radio Shack PC-2 handheld computer. That evening I managed to make a program that produced "music", a random sequence of tones. I was hooked.