scripts

commit: 8b5e1cfe18a4bca45216f750ea11ba462822f450
parent: 9c76ee27e93c2736c46289f38094bfd0b879168c
Author: Haelwenn (lanodan) Monnier <contact@hacktivis.me>
Date:   Fri, 18 Sep 2020 01:31:34 +0200

photo_gallery: Add width/height, add loading=lazy

Diffstat:
M
photo_gallery/script.sh
14
+++++++-------

1 file changed, 7 insertions(+), 7 deletions(-)
diff --git a/photo_gallery/script.sh b/photo_gallery/script.sh
@@ -1,5 +1,5 @@
 #!/bin/sh
-# Copyright 2017 CC-BY-SA-4.0 Haelwenn (lanodan) Monnier <contact@hacktivis.me>
+# Copyright 2017-2020 CC-BY-SA-4.0 Haelwenn (lanodan) Monnier <contact@hacktivis.me>
 # Script that generates a photo gallery with details on dedicated pages
 
 ## Generate the index
@@ -17,11 +17,11 @@ test -e index.html || (
 	<h1>${title}</h1>
 	<main>"
 for img in *.JPG; do
-	test -e "./thumbs/$img" || gm convert "$img" -resize 8% -auto-orient -quality 69% "./thumbs/$img"
-	echo "<a class=\"photo\" href=\"${img//.JPG/.html}\"><img src=\"thumbs/$img\"/></a>";
+	test -e "./thumbs/$img" || gm convert "$img" -resize 8% -auto-orient -quality 69% "./thumbs/$img" && jpegoptim -s "./thumbs/$img"
+	echo "<a class=\"photo\" href=\"${img//.JPG/.html}\"><img loading=\"lazy\" "$(gm identify -format 'width="%[width]" height="%[height]"' "./thumbs/$img")" src=\"thumbs/$img\"/></a>";
 done
 echo "	</main>
-	<footer rel=\"copyright\">© 2014-2017 <a rel=\"license\" href=\"http://creativecommons.org/licenses/by-sa/4.0/\">CC-BY-SA-4.0</a> Haelwenn (lanodan) Monnier</footer>
+	<footer rel=\"copyright\">© 2014-2020 <a rel=\"license\" href=\"http://creativecommons.org/licenses/by-sa/4.0/\">CC-BY-SA-4.0</a> Haelwenn (lanodan) Monnier</footer>
 	</body>
 </html>" ) | tee index.html
 
@@ -40,15 +40,15 @@ for img in *.JPG; do
 	<h1><a href=\"./\">$(basename "${PWD}")</a>/${img//.JPG}</h1>
 	<main>"
 test -e "./preview/$img" || gm convert "$img" -resize 50% -auto-orient -quality 80% "./preview/$img"
-echo "<a class=\"photo\" href=\"$img\"><img src=\"preview/$img\"/></a>"
-gm identify "$img" -format '<ul>
+gm identify "$img" -format '<a class="photo" href="$img"><img width="%[width]" height="%[height]" src="preview/$img"/></a>
+<ul>
 	<li>Camera: %[EXIF:Make]%[EXIF:Model]'
 printf '	<li>DateTime: '; date "+%F %T%z" --date="$(gm identify "$img" -format '%[EXIF:DateTime]'|sed -r 's/:(..):/-\1-/')Z"
 gm identify "$img" -format '	<li>ExposureTime: %[EXIF:ExposureTime]
 	<li>ISOSpeedRatings: %[EXIF:ISOSpeedRatings]
 	<li>FNumber: %[EXIF:FNumber]
 	<li>MaxApertureValue: %[EXIF:MaxApertureValue]
-	<li rel=\"copyright\">© 2014-2017 <a rel=\"license\" href=\"http://creativecommons.org/licenses/by-sa/4.0/\">CC-BY-SA-4.0</a> Haelwenn (lanodan) Monnier</li>
+	<li rel=\"copyright\">© 2014-2020 <a rel=\"license\" href=\"http://creativecommons.org/licenses/by-sa/4.0/\">CC-BY-SA-4.0</a> Haelwenn (lanodan) Monnier</li>
 </ul>'
 echo "	</main>
 	</body>