From a43ca52aa2d102c7499c7fd8478304a26ea2cd0a Mon Sep 17 00:00:00 2001 From: Volpeon Date: Sat, 18 Jun 2022 15:51:18 +0200 Subject: Improved Lua filters, improved exhibit pages --- content/art/doodles/2021-lazy-firefox/index.md | 12 +++-- content/art/drawings/2021-cute-ava/index.md | 7 +-- content/art/drawings/2021-eeveelutions/index.md | 20 ++++--- content/art/drawings/2021-lycanroc-ava/index.md | 7 +-- content/art/drawings/2021-refsheet/index.md | 20 ++++--- content/art/drawings/2021-spooky-ava-1/index.md | 7 +-- content/art/drawings/2021-spooky-ava-2/index.md | 7 +-- content/art/drawings/2022-autumn-fox/index.md | 7 +-- content/lightbox.js | 36 ++++--------- filters/code.lua | 15 ++++++ filters/headers.lua | 9 ++++ filters/icons.lua | 12 +++++ filters/lib/common.lua | 30 +++++++++++ filters/macros.lua | 72 ++++++------------------- filters/tables.lua | 5 ++ scripts/metadata_filter.lua | 8 --- templates/feed_entry.xml | 13 +---- templates/layouts/exhibit.html | 9 +--- templates/layouts/page.html | 2 +- yarn.lock | 2 +- 20 files changed, 155 insertions(+), 145 deletions(-) create mode 100644 filters/code.lua create mode 100644 filters/headers.lua create mode 100644 filters/icons.lua create mode 100644 filters/lib/common.lua create mode 100644 filters/tables.lua diff --git a/content/art/doodles/2021-lazy-firefox/index.md b/content/art/doodles/2021-lazy-firefox/index.md index d7d47e1..f57f184 100644 --- a/content/art/doodles/2021-lazy-firefox/index.md +++ b/content/art/doodles/2021-lazy-firefox/index.md @@ -4,8 +4,12 @@ title: Lazy Firefox date: 2021-10-16 thumbnail: png layout: exhibit - -images: - - url: firefox_lazy.png - - url: firefox_lazy_transparent.png --- + +::: figure +![](firefox_lazy.png) +::: + +::: figure +![](firefox_lazy_transparent.png) +::: diff --git a/content/art/drawings/2021-cute-ava/index.md b/content/art/drawings/2021-cute-ava/index.md index dd350bb..962c0ce 100644 --- a/content/art/drawings/2021-cute-ava/index.md +++ b/content/art/drawings/2021-cute-ava/index.md @@ -4,7 +4,8 @@ title: Cute Avatar date: 2021-03-01 thumbnail: png layout: exhibit - -images: - - url: ava.png --- + +::: figure +![](ava.png) +::: diff --git a/content/art/drawings/2021-eeveelutions/index.md b/content/art/drawings/2021-eeveelutions/index.md index 87c0869..9cd4352 100644 --- a/content/art/drawings/2021-eeveelutions/index.md +++ b/content/art/drawings/2021-eeveelutions/index.md @@ -4,12 +4,16 @@ title: Eeveelutions date: 2021-08-19 thumbnail: png layout: exhibit - -images: - - url: eevee.png - description: Eevee - - url: flareon.png - description: Flareon - - url: flareon_wink.png - description: Flareon, winking --- + +::: figure +![Eevee](eevee.png) +::: + +::: figure +![Flareon](flareon.png) +::: + +::: figure +![Flareon, winking](flareon_wink.png) +::: diff --git a/content/art/drawings/2021-lycanroc-ava/index.md b/content/art/drawings/2021-lycanroc-ava/index.md index 3e0fe64..8b7fb1d 100644 --- a/content/art/drawings/2021-lycanroc-ava/index.md +++ b/content/art/drawings/2021-lycanroc-ava/index.md @@ -4,9 +4,10 @@ title: Lycanroc Avatar date: 2021-10-19 thumbnail: png layout: exhibit - -images: - - url: ava.png --- Avatar for [@feralbot@botsin.space](https://botsin.space/@feralbot), a bot that posts pictures of feral characters from [e926](https://e926.net/). + +::: figure +![](ava.png) +::: diff --git a/content/art/drawings/2021-refsheet/index.md b/content/art/drawings/2021-refsheet/index.md index 8617a95..e9b4333 100644 --- a/content/art/drawings/2021-refsheet/index.md +++ b/content/art/drawings/2021-refsheet/index.md @@ -4,12 +4,16 @@ title: Reference Sheet Views date: 2021-10-06 thumbnail: png layout: exhibit - -images: - - url: bottom.png - description: Bottom view - - url: bottom_cofe.png - description: Bottom view, holding a cup of coffee - - url: side.png - description: Side view --- + +::: figure +![Bottom view](bottom.png) +::: + +::: figure +![Bottom view, holding a cup of coffee](bottom_cofe.png) +::: + +::: figure +![Side view](side.png) +::: diff --git a/content/art/drawings/2021-spooky-ava-1/index.md b/content/art/drawings/2021-spooky-ava-1/index.md index 500bd11..70f000d 100644 --- a/content/art/drawings/2021-spooky-ava-1/index.md +++ b/content/art/drawings/2021-spooky-ava-1/index.md @@ -4,7 +4,8 @@ title: \"Spooky\" Avatar date: 2021-10-07 thumbnail: png layout: exhibit - -images: - - url: ava.png --- + +::: figure +![](ava.png) +::: diff --git a/content/art/drawings/2021-spooky-ava-2/index.md b/content/art/drawings/2021-spooky-ava-2/index.md index 7fca6f0..672c4c0 100644 --- a/content/art/drawings/2021-spooky-ava-2/index.md +++ b/content/art/drawings/2021-spooky-ava-2/index.md @@ -4,7 +4,8 @@ title: Spooky Avatar date: 2021-10-14 thumbnail: png layout: exhibit - -images: - - url: ava.png --- + +::: figure +![](ava.png) +::: diff --git a/content/art/drawings/2022-autumn-fox/index.md b/content/art/drawings/2022-autumn-fox/index.md index 6816680..ebd51ab 100644 --- a/content/art/drawings/2022-autumn-fox/index.md +++ b/content/art/drawings/2022-autumn-fox/index.md @@ -4,10 +4,11 @@ title: Autumn Fox date: 2022-02-25 thumbnail: png layout: exhibit - -images: - - url: pic.png --- First attempt at cel shading. It's actually incomplete, but I felt like I had hit a roadblock with the shading and wanted to try again with another drawing. + +::: figure +![](pic.png) +::: diff --git a/content/lightbox.js b/content/lightbox.js index e4a2c29..e672d63 100644 --- a/content/lightbox.js +++ b/content/lightbox.js @@ -9,7 +9,7 @@ const lightboxFooterEl = lightboxEl.querySelector(".o-lightbox__footer"); const figureEls = Array.from(mainEl.querySelectorAll(".js-lightbox__image")); - const closeable = lightboxContainerEl.classList.contains("js-lightbox--closeable"); + const standalone = lightboxContainerEl.classList.contains("js-lightbox--standalone"); let currentIndex = 0; let visible = !lightboxContainerEl.classList.contains("u-d-none"); let mouseDown = false; @@ -20,7 +20,7 @@ } const hide = () => { - if (closeable) { + if (!standalone) { visible = false; lightboxContainerEl.classList.add("u-d-none"); } @@ -56,41 +56,27 @@ setIndex(i); }; - let anchorEl; - let imgEl; - - if (figureEl.firstElementChild.tagName === "A") { - anchorEl = figureEl.firstElementChild; - imgEl = anchorEl.firstElementChild; - } else { - imgEl = figureEl.firstElementChild; - anchorEl = document.createElement("a"); - anchorEl.href = imgEl.src; + const imgEl = figureEl.querySelector("img"); + const captionEl = figureEl.querySelector("figcaption"); - figureEl.insertBefore(anchorEl, imgEl); - figureEl.removeChild(imgEl); - anchorEl.appendChild(imgEl); - } + const src = imgEl.src; + const description = captionEl?.innerHTML ?? ""; - anchorEl.addEventListener("click", go); const thumbnailButtonEl = document.createElement("button"); const thumbnailImgEl = document.createElement("img"); thumbnailImgEl.classList.add("o-lightbox__thumbnail-img"); - thumbnailImgEl.src = anchorEl.href; + thumbnailImgEl.src = src; thumbnailButtonEl.classList.add("o-lightbox__thumbnail"); thumbnailButtonEl.appendChild(thumbnailImgEl); thumbnailButtonEl.addEventListener("click", go); - if (i === currentIndex) { - thumbnailButtonEl.classList.add("is-selected"); - } - lightboxFooterEl.appendChild(thumbnailButtonEl); - const captionEl = figureEl.querySelector("figcaption"); - const description = captionEl?.innerHTML ?? ""; + if (!standalone) { + figureEl.firstElementChild.addEventListener("click", go); + } return { thumbnailEl: thumbnailButtonEl, @@ -106,7 +92,7 @@ lightboxFooterEl.remove(); } - if (closeable) { + if (!standalone) { document.addEventListener('mousedown', (e) => { if (visible) { mouseDown = !lightboxEl.contains(e.target) || lightboxEl === e.target; diff --git a/filters/code.lua b/filters/code.lua new file mode 100644 index 0000000..2d6e5a5 --- /dev/null +++ b/filters/code.lua @@ -0,0 +1,15 @@ +local common = require 'filters.lib.common' + +function CodeBlock(el) + if el.classes[1] == "plain" then + el = pandoc.Div({ el }, { class = 's-code' }) + elseif el.classes[1] then + local formatted = pandoc.pipe('pygmentize', { + '-l', el.classes[1], '-f', 'html', '-O', 'cssclass=s-code s-code--highlight', + }, el.text) + + if formatted then el = pandoc.RawBlock('html', formatted) end + end + + return common.wide(el) +end diff --git a/filters/headers.lua b/filters/headers.lua new file mode 100644 index 0000000..ea9cde6 --- /dev/null +++ b/filters/headers.lua @@ -0,0 +1,9 @@ +function Header(el) + if el.level <= 3 then + local newchildren = pandoc.List() + newchildren:insert(pandoc.Span(el.content, { class = 's-headings__primary' })) + el.content = newchildren + end + + return el +end diff --git a/filters/icons.lua b/filters/icons.lua new file mode 100644 index 0000000..9e921f3 --- /dev/null +++ b/filters/icons.lua @@ -0,0 +1,12 @@ +function Str(el) + local icon = el.text:match('^:(.*):$') + + if icon then + return pandoc.RawInline('html', + '') + end + + return el +end diff --git a/filters/lib/common.lua b/filters/lib/common.lua new file mode 100644 index 0000000..7654eb9 --- /dev/null +++ b/filters/lib/common.lua @@ -0,0 +1,30 @@ +function wide(el) + local els = pandoc.List() + + els:insert(pandoc.RawBlock("html", "")) + if pcall(function() return #el end) then + els:extend(el) + else + els:insert(el) + end + els:insert(pandoc.RawBlock("html", "
")) + + return els +end + +function dump(o) + if type(o) == 'table' then + local s = '{ ' + for k, v in pairs(o) do + if type(k) ~= 'number' then k = '"' .. k .. '"' end + s = s .. '[' .. k .. '] = ' .. dump(v) .. ',' + end + return s .. '} ' + else + return tostring(o) + end +end + +return { + wide = wide +} diff --git a/filters/macros.lua b/filters/macros.lua index cb7975b..04cead6 100644 --- a/filters/macros.lua +++ b/filters/macros.lua @@ -1,12 +1,6 @@ -function wide(el) - local els = pandoc.List() +local common = require 'filters.lib.common' - els:insert(pandoc.RawBlock("html", "
")) - els:insert(el) - els:insert(pandoc.RawBlock("html", "
")) - - return els -end +local vars = {} function alert(el) el.classes = pandoc.List() @@ -14,22 +8,26 @@ function alert(el) el.classes:insert("o-alert--primary") el.classes:insert("s-alerts__alert") - return wide(el) + return common.wide(el) end function figure(el) local images = pandoc.List() - pandoc.walk_block(el, { Image = function(iel) images:insert(iel) end }) + images[1].classes:insert("c-figure__image") + + local class = "c-figure js-lightbox__image" + if vars.layout and vars.layout.is_exhibit then + class = class .. " u-d-none@js" + end + + el = pandoc.List() - el = pandoc.RawBlock("html", - "
\ - \ - \ - \ -
") + el:insert(pandoc.RawBlock("html", "
")) + el:insert(pandoc.Link(images[1], images[1].src, nil, { class = "c-figure__link" })) + el:insert(pandoc.RawBlock("html", "
")) - return wide(el) + return common.wide(el) end function Div(el) @@ -42,42 +40,6 @@ function Div(el) return el end -function CodeBlock(el) - if el.classes[1] == "plain" then - el = pandoc.Div({ el }, { class = 's-code' }) - elseif el.classes[1] then - local formatted = pandoc.pipe('pygmentize', { - '-l', el.classes[1], '-f', 'html', '-O', 'cssclass=s-code s-code--highlight', - }, el.text) - - if formatted then el = pandoc.RawBlock('html', formatted) end - end - - return wide(el) -end - -function Header(el) - if el.level <= 3 then - local newchildren = pandoc.List() - newchildren:insert(pandoc.Span(el.content, { class = 's-headings__primary' })) - el.content = newchildren - end - - return el -end - -function Table(el) - return wide(el) -end +function meta(meta) vars = meta end -function Str(el) - local icon = el.text:match('^:(.*):$') - - if icon then - return pandoc.RawInline('html', - '') - end - - return el -end +return { { Meta = meta }, { Div = Div } } diff --git a/filters/tables.lua b/filters/tables.lua new file mode 100644 index 0000000..2ff4eea --- /dev/null +++ b/filters/tables.lua @@ -0,0 +1,5 @@ +local common = require 'filters.lib.common' + +function Table(el) + return common.wide(el) +end diff --git a/scripts/metadata_filter.lua b/scripts/metadata_filter.lua index 4f7200a..8f32bd4 100644 --- a/scripts/metadata_filter.lua +++ b/scripts/metadata_filter.lua @@ -290,14 +290,6 @@ function process(global, meta) if meta.list_limit then meta.list_limit = tonumber(pandoc.utils.stringify(meta.list_limit)) end if meta.position then meta.position = pandoc.utils.stringify(meta.position) end - if meta.images then - for i = 1, #meta.images do - local image = meta.images[i] - image.url = make_absolute(pandoc.utils.stringify(image.url), meta.file_out) - image.url = resolve_url(global.site.url, global.file_out, image.url) - end - end - if meta.feed then if meta.file_out:match(".html$") then meta.feed = { diff --git a/templates/feed_entry.xml b/templates/feed_entry.xml index f0a7f1e..03d6569 100644 --- a/templates/feed_entry.xml +++ b/templates/feed_entry.xml @@ -22,15 +22,4 @@ $else$ $endfor$ $endif$ - - $it.description$ -
$it.description$
- - $endfor$ - $endif$ -]]> + diff --git a/templates/layouts/exhibit.html b/templates/layouts/exhibit.html index a7eeec1..cee28f9 100644 --- a/templates/layouts/exhibit.html +++ b/templates/layouts/exhibit.html @@ -5,7 +5,7 @@ itemtype="https://schema.org/$schema_type$" itemid="$url.full$" > -
+
@@ -52,13 +52,6 @@
$body$ - - $for(images)$ -
- $it.description$ -
$it.description$
-
- $endfor$
diff --git a/templates/layouts/page.html b/templates/layouts/page.html index 4058748..689d17b 100644 --- a/templates/layouts/page.html +++ b/templates/layouts/page.html @@ -36,7 +36,7 @@ $body$ $endif$ -
+