Browse Source

Generating source, lossy PNG, and WEBP images for gallery

master
Mobius K 1 year ago
parent
commit
2da3c465f0
  1. 1
      .gitattributes
  2. 23
      README.md
  3. BIN
      assets/emotes/owelleCry.png
  4. BIN
      assets/emotes/owelleCry.png.webp
  5. BIN
      assets/emotes/owelleShook.png
  6. BIN
      assets/emotes/owelleShook.png.webp
  7. BIN
      assets/emotes/owelleThink.png
  8. BIN
      assets/emotes/owelleThink.png.webp
  9. BIN
      assets/emotes/owelleWave.png
  10. BIN
      assets/emotes/owelleWave.png.webp
  11. BIN
      assets/emotes/remCheer.png
  12. BIN
      assets/emotes/remCheer.png.webp
  13. BIN
      assets/emotes/rivers3k1.png
  14. BIN
      assets/emotes/rivers3k1.png.webp
  15. BIN
      assets/emotes/rivers3k3.png
  16. BIN
      assets/emotes/rivers3k3.png.webp
  17. BIN
      assets/emotes/schwApple.png
  18. BIN
      assets/emotes/schwApple.png.webp
  19. BIN
      assets/gallery/dig-site.png
  20. BIN
      assets/gallery/dig-site.png.webp
  21. BIN
      assets/gallery/emrys.png
  22. BIN
      assets/gallery/emrys.png.webp
  23. BIN
      assets/gallery/frostwolf.png
  24. BIN
      assets/gallery/frostwolf.png.webp
  25. BIN
      assets/gallery/half-orc.png
  26. BIN
      assets/gallery/half-orc.png.webp
  27. BIN
      assets/gallery/honey.png
  28. BIN
      assets/gallery/honey.png.webp
  29. BIN
      assets/gallery/molten-core.png
  30. BIN
      assets/gallery/molten-core.png.webp
  31. BIN
      assets/gallery/nightshade.png
  32. BIN
      assets/gallery/nightshade.png.webp
  33. BIN
      assets/gallery/stained-glass.png
  34. BIN
      assets/gallery/stained-glass.png.webp
  35. BIN
      assets/gallery/study.png
  36. BIN
      assets/gallery/study.png.webp
  37. BIN
      assets/gallery/wisp.png
  38. BIN
      assets/gallery/wisp.png.webp
  39. BIN
      assets/source/emotes/owelleCry.png
  40. BIN
      assets/source/emotes/owelleShook.png
  41. BIN
      assets/source/emotes/owelleThink.png
  42. BIN
      assets/source/emotes/owelleWave.png
  43. BIN
      assets/source/emotes/remCheer.png
  44. BIN
      assets/source/emotes/rivers3k1.png
  45. BIN
      assets/source/emotes/rivers3k3.png
  46. BIN
      assets/source/emotes/schwApple.png
  47. BIN
      assets/source/gallery/dig-site.png
  48. BIN
      assets/source/gallery/emrys.png
  49. BIN
      assets/source/gallery/frostwolf.png
  50. BIN
      assets/source/gallery/half-orc.png
  51. BIN
      assets/source/gallery/honey.png
  52. BIN
      assets/source/gallery/molten-core.png
  53. BIN
      assets/source/gallery/nightshade.png
  54. BIN
      assets/source/gallery/stained-glass.png
  55. BIN
      assets/source/gallery/study.png
  56. BIN
      assets/source/gallery/wisp.png
  57. 4
      html/components/gallery.pug

1
.gitattributes

@ -1,2 +1,3 @@
*.png filter=lfs diff=lfs merge=lfs -text
*.jpg filter=lfs diff=lfs merge=lfs -text
*.webp filter=lfs diff=lfs merge=lfs -text

23
README.md

@ -12,3 +12,26 @@ git clone git@gitlab.com:mobius_k/mobius_k.git
cd mobius_k
git submodule update --init pixelle
```
## Image optimization
There are generally three copies of any given gallery image:
1. Source that should never be altered for possible future transformations, resizing, crops, etc.
2. WEBP for modern lossy image display
3. PNG or JPG fallback for older clients
Four possible scripts make image optimization easy:
```bash
# Resize an image that is too large with ImageMagick by width, or by height, respectively
convert path/to/file -resize 200 path/to/destination
convert path/to/file -resize x100 path/to/destination
# Convert any image to a WEBP
cwebp -q 90 path/to/file -o path/to/destination.webp
# Quantize PNG images
pngquant --output path/to/destination.png -- path/to/file
# Optimize JPG images
jpegoptim -m 90 path/to/file --stdout > path/to/destination.jpg
```

BIN
assets/emotes/owelleCry.png (Stored with Git LFS)

size 7687

BIN
assets/emotes/owelleCry.png.webp (Stored with Git LFS)

size 7430

BIN
assets/emotes/owelleShook.png (Stored with Git LFS)

size 6661

BIN
assets/emotes/owelleShook.png.webp (Stored with Git LFS)

size 7102

BIN
assets/emotes/owelleThink.png (Stored with Git LFS)

size 8793

BIN
assets/emotes/owelleThink.png.webp (Stored with Git LFS)

size 8010

BIN
assets/emotes/owelleWave.png (Stored with Git LFS)

size 8161

BIN
assets/emotes/owelleWave.png.webp (Stored with Git LFS)

size 6764

BIN
assets/emotes/remCheer.png (Stored with Git LFS)

size 8173

BIN
assets/emotes/remCheer.png.webp (Stored with Git LFS)

size 8608

BIN
assets/emotes/rivers3k1.png (Stored with Git LFS)

size 11249

BIN
assets/emotes/rivers3k1.png.webp (Stored with Git LFS)

size 8056

BIN
assets/emotes/rivers3k3.png (Stored with Git LFS)

size 10754

BIN
assets/emotes/rivers3k3.png.webp (Stored with Git LFS)

size 7374

BIN
assets/emotes/schwApple.png (Stored with Git LFS)

size 9043

BIN
assets/emotes/schwApple.png.webp (Stored with Git LFS)

size 8460

BIN
assets/gallery/dig-site.png (Stored with Git LFS)

size 333387

BIN
assets/gallery/dig-site.png.webp (Stored with Git LFS)

size 106240

BIN
assets/gallery/emrys.png (Stored with Git LFS)

size 291295

BIN
assets/gallery/emrys.png.webp (Stored with Git LFS)

size 131940

BIN
assets/gallery/frostwolf.png (Stored with Git LFS)

size 158843

BIN
assets/gallery/frostwolf.png.webp (Stored with Git LFS)

size 60418

BIN
assets/gallery/half-orc.png (Stored with Git LFS)

size 143314

BIN
assets/gallery/half-orc.png.webp (Stored with Git LFS)

size 31878

BIN
assets/gallery/honey.png (Stored with Git LFS)

size 87446

BIN
assets/gallery/honey.png.webp (Stored with Git LFS)

size 27718

BIN
assets/gallery/molten-core.png (Stored with Git LFS)

size 315169

BIN
assets/gallery/molten-core.png.webp (Stored with Git LFS)

size 82264

BIN
assets/gallery/nightshade.png (Stored with Git LFS)

size 146391

BIN
assets/gallery/nightshade.png.webp (Stored with Git LFS)

size 57434

BIN
assets/gallery/stained-glass.png (Stored with Git LFS)

size 323398

BIN
assets/gallery/stained-glass.png.webp (Stored with Git LFS)

size 90902

BIN
assets/gallery/study.png (Stored with Git LFS)

size 257019

BIN
assets/gallery/study.png.webp (Stored with Git LFS)

size 95922

BIN
assets/gallery/wisp.png (Stored with Git LFS)

size 135198

BIN
assets/gallery/wisp.png.webp (Stored with Git LFS)

size 20960

BIN
assets/source/emotes/owelleCry.png (Stored with Git LFS)

size 23327

BIN
assets/source/emotes/owelleShook.png (Stored with Git LFS)

size 18687

BIN
assets/source/emotes/owelleThink.png (Stored with Git LFS)

size 26912

BIN
assets/source/emotes/owelleWave.png (Stored with Git LFS)

size 24404

BIN
assets/source/emotes/remCheer.png (Stored with Git LFS)

size 24923

BIN
assets/source/emotes/rivers3k1.png (Stored with Git LFS)

size 27022

BIN
assets/source/emotes/rivers3k3.png (Stored with Git LFS)

size 25255

BIN
assets/source/emotes/schwApple.png (Stored with Git LFS)

size 24226

BIN
assets/source/gallery/dig-site.png (Stored with Git LFS)

size 302520

BIN
assets/source/gallery/emrys.png (Stored with Git LFS)

size 263701

BIN
assets/source/gallery/frostwolf.png (Stored with Git LFS)

size 147186

BIN
assets/source/gallery/half-orc.png (Stored with Git LFS)

size 135178

BIN
assets/source/gallery/honey.png (Stored with Git LFS)

size 78607

BIN
assets/source/gallery/molten-core.png (Stored with Git LFS)

size 971784

BIN
assets/source/gallery/nightshade.png (Stored with Git LFS)

size 133451

BIN
assets/source/gallery/stained-glass.png (Stored with Git LFS)

size 1022544

BIN
assets/source/gallery/study.png (Stored with Git LFS)

size 229696

BIN
assets/source/gallery/wisp.png (Stored with Git LFS)

size 125978

4
html/components/gallery.pug

@ -6,8 +6,8 @@ mixin gallery(path, width, height, description)
.lightbox(uk-lightbox="velocity: 4")
div(uk-grid class="uk-child-width-1-2@s")
+gallery("molten-core.png", 1488, 2104, "Molten core")
+gallery("stained-glass.png", 1488, 2104, "Stained glass")
+gallery("molten-core.png", 716, 1012, "Molten core")
+gallery("stained-glass.png", 716, 1012, "Stained glass")
div(uk-grid class="uk-child-width-1-3@s")
+gallery("honey.png", 490, 694, "Honey")

Loading…
Cancel
Save