jxl #15

Open
rhi wants to merge 3 commits from jxl into 🎨
7 changed files with 61 additions and 15 deletions

View file

@ -66,6 +66,11 @@ $(TMPDIR)/%_big.jpg: $(DATADIR)/%.jpg
$(call resize,$(BIG),$(BIG),>) $(call resize,$(BIG),$(BIG),>)
%.jxl: %.png ; $(call cjxl,-e 9)
%.jxl: %.jpg ; $(call cjxl,-e 9)
%.jxl: %.gif ; $(call cjxl)
$(MAKEPAGES): make-pages/*.hs make-pages/make-pages.cabal $(MAKEPAGES): make-pages/*.hs make-pages/make-pages.cabal
echo "[make-pages]" echo "[make-pages]"
mkdir -p $(dir $@) mkdir -p $(dir $@)
@ -133,6 +138,14 @@ mkdir -p "$(dir $@)"
convert -resize "$(1)x$(2)$(3)" $(4) "$^" "$@" convert -resize "$(1)x$(2)$(3)" $(4) "$^" "$@"
endef endef
# args:
# 1. extra flags
define cjxl
echo "[cjxl] "$@
mkdir -p "$(dir $@)"
cjxl -d 1 "$^" "$@" $(1) 2>/dev/null
endef
# no args # no args
define depend-gallery define depend-gallery
echo "[deps] "$@ echo "[deps] "$@

View file

@ -30,16 +30,21 @@ dependSingle' yamlDir indexFile info prefix build nsfw =
images = #all if nsfw then #images info else #sfwImages info images = #all if nsfw then #images info else #sfwImages info
paths = map #path images paths = map #path images
thumb = thumbFile $ thumbnail info
jxls fs = [base <.> "jxl" | f <- fs,
let (base, ext) = splitExtension f,
ext `elem` imgTypes]
imgTypes = words ".png .jpg .gif"
imgFiles0 = thumb : map pageFile paths ++ map bigFile paths
imgFiles = imgFiles0 ++ jxls imgFiles0
dls = mapMaybe #download images dls = mapMaybe #download images
extras = #extras info extras = #extras info
dir = build </> prefix </> yamlDir dir = build </> prefix </> yamlDir
page = dir </> "index.html" page = dir </> "index.html"
deps = unwords $ map (dir </>) $ deps = unwords $ map (dir </>) $ imgFiles ++ dls ++ extras
thumbFile (thumbnail info) :
map pageFile paths ++
map bigFile paths ++
dls ++ extras
dependGallery :: GalleryInfo dependGallery :: GalleryInfo
-> FilePath -- ^ index file -> FilePath -- ^ index file

View file

@ -15,7 +15,7 @@ import qualified Data.HashSet as HashSet
import Data.List (intersperse, groupBy, sortBy, sortOn) import Data.List (intersperse, groupBy, sortBy, sortOn)
import Data.Maybe import Data.Maybe
import qualified Data.Text.Lazy as Lazy import qualified Data.Text.Lazy as Lazy
import System.FilePath (takeDirectory, joinPath, splitPath) import System.FilePath (takeDirectory, joinPath, splitPath, (-<.>))
import GHC.Exts (Down (..), the) import GHC.Exts (Down (..), the)
make :: Text -> GalleryInfo -> [(FilePath, Info)] -> Lazy.Text make :: Text -> GalleryInfo -> [(FilePath, Info)] -> Lazy.Text
@ -158,7 +158,10 @@ makeItem nsfw file info@(Info {bg}) = [b|@0
data-tags="$tags'"> data-tags="$tags'">
<figure> <figure>
<a href="$dir"> <a href="$dir">
<picture>
<source srcset="$thumbJxl" type=image/jxl>
<img src="$thumb" loading=lazy$bgStyle> <img src="$thumb" loading=lazy$bgStyle>
</picture>
</a> </a>
<figcaption> <figcaption>
<span class=date>$date'</span> <span class=date>$date'</span>
@ -169,7 +172,7 @@ makeItem nsfw file info@(Info {bg}) = [b|@0
where where
title = fromMaybe (#title info) $ #galleryTitle info title = fromMaybe (#title info) $ #galleryTitle info
dir = takeDirectory file dir = takeDirectory file
thumb = getThumb dir info thumb = getThumb dir info; thumbJxl = thumb -<.> "jxl"
nsfw' = if nsfw && #anyNsfw info then [b| nsfw|] else "" nsfw' = if nsfw && #anyNsfw info then [b| nsfw|] else ""
tags' = fold $ intersperse ";" $ map fromText $ tagsFor nsfw info tags' = fold $ intersperse ";" $ map fromText $ tagsFor nsfw info
date = #latestDate info nsfw date = #latestDate info nsfw

View file

@ -33,7 +33,7 @@ import Data.Text (Text)
import qualified Data.Text as Text import qualified Data.Text as Text
import Data.YAML (FromYAML (..), (.:), (.:?), (.!=)) import Data.YAML (FromYAML (..), (.:), (.:?), (.!=))
import qualified Data.YAML as YAML import qualified Data.YAML as YAML
import System.FilePath ((</>), takeBaseName, takeExtension, splitExtension) import System.FilePath ((</>), takeBaseName, takeExtension, splitExtensions)
import Data.Bifunctor (second) import Data.Bifunctor (second)
@ -244,7 +244,7 @@ bigFile f
addSuffix :: String -> FilePath -> FilePath addSuffix :: String -> FilePath -> FilePath
addSuffix suf path = addSuffix suf path =
let (pre, ext) = splitExtension path in let (pre, ext) = splitExtensions path in
pre ++ suf ++ ext pre ++ suf ++ ext

View file

@ -12,7 +12,7 @@ import Data.List (sort, intersperse)
import Data.Maybe (fromMaybe, isNothing, isJust) import Data.Maybe (fromMaybe, isNothing, isJust)
import qualified Data.Text as Strict import qualified Data.Text as Strict
import qualified Data.Text.Lazy as Lazy import qualified Data.Text.Lazy as Lazy
import System.FilePath (joinPath, splitPath) import System.FilePath (joinPath, splitPath, (-<.>))
import qualified Data.HashSet as Set import qualified Data.HashSet as Set
import Data.Traversable import Data.Traversable
@ -57,6 +57,7 @@ make' root siteName prefix nsfw _dataDir dir
let download0 = fromMaybe (bigFile path0) download0' let download0 = fromMaybe (bigFile path0) download0'
let path0' = pageFile path0 let path0' = pageFile path0
let path0'Jxl = path0' -<.> "jxl"
let descSection = makeDesc $ descFor nsfw info let descSection = makeDesc $ descFor nsfw info
let tagsList = makeTags undir $ tagsFor nsfw info let tagsList = makeTags undir $ tagsFor nsfw info
@ -155,7 +156,10 @@ make' root siteName prefix nsfw _dataDir dir
<figure id=mainfig> <figure id=mainfig>
$warning' $warning'
<a id=mainlink href="$download0" title="download full version"> <a id=mainlink href="$download0" title="download full version">
<img id=mainimg src="$path0'" alt=""> <picture id=mainimg>
<source srcset="$path0'Jxl" type=image/jxl>
<img src="$path0'" alt="">
</picture>
</a> </a>
</figure> </figure>

View file

@ -45,7 +45,10 @@ function setImage(id, src, width, height, href, cw, firstLoad) {
mainlink.tabIndex = -1; mainlink.tabIndex = -1;
} }
mainimg.src = src; let jxl = src.replace(/\..*?$/, ".jxl");
mainimg.querySelector('img').src = src;
mainimg.querySelector('source').srcset = jxl;
mainfig.dataset.width = width; mainfig.dataset.width = width;
mainfig.dataset.height = height; mainfig.dataset.height = height;
mainlink.href = href; mainlink.href = href;

View file

@ -27,7 +27,7 @@
box-shadow: var(--focus-box); box-shadow: var(--focus-box);
} }
#mainimg { #mainimg, #mainimg img {
display: block; display: block;
} }
@ -230,3 +230,21 @@ footer {
display: inline; display: inline;
margin-right: 0.75em; margin-right: 0.75em;
} }
.conversation {
display: grid;
grid-template-columns: min-content auto;
grid-gap: 0.15em 1em;
margin: 0;
}
.conversation > b {
grid-area: auto / 1 / auto / auto;
display: block;
text-align: right;
}
.conversation > q {
grid-area: auto / 2 / auto / auto;
font-style: initial;
quotes: none;
display: block;
}