KISS static web photo albums with `photoalbum.sh`

Published at 2023-10-29T22:25:04+02:00

Once in a while, I share photos on the inter-web with either family and friends or on my The Irregular Ninja photo site. One hobby of mine is photography (even though I don't have enough time for it - so I am primarily a point-and-shoot photographer).

I'm not particularly eager to use any photo social sharing platforms such as Flickr, 500px (I used them regularly in the past), etc., anymore. I value self-hosting, DIY and privacy (nobody should data mine my photos), and no third party should have any rights to my pictures.

I value KISS (keep it simple and stupid) and simplicity. All that's required for a web photo album is some simple HTML and spice it up with CSS. No need for JavaScript, no need for a complex dynamic website.

         ___        .---------.._
  ______!fsc!_....-' .g8888888p. '-------....._
.'          //     .g8:       :8p..---....___ \'.
| foo.zone //  ()  d88:       :88b|==========! !|
|         //       888:       :888|==========| !|
|___      \\_______'T88888888888P''----------'//|   
|   \       """"""""""""""""""""""""""""""""""/ |   
|    !...._____      .="""=.   .[]    ____...!  |   
|   /               ! .g$p. !   .[]          :  |   
|  !               :  $$$$$  :  .[]          :  |   
|  !irregular.ninja ! 'T$P' !   .[]           '.|   
|   \__              "=._.="   .()        __    |   
|.--'  '----._______________________.----'  '--.|
'._____________________________________________.'

⇢ KISS static web photo albums with photoalbum.sh
⇢ ⇢ Introducing photoalbum.sh
⇢ ⇢ Installation
⇢ ⇢ Setting it up
⇢ ⇢ Generating the static photo album
⇢ ⇢ Cleaning it up
⇢ ⇢ HTML templates
⇢ ⇢ Conclusion

Introducing `photoalbum.sh`

## Installation

Installation is straightforward. All required is a recent version of GNU Bash, GNU Make, Git and ImageMagick. On Fedora, the dependencies are installed with:

% sudo dnf install -y ImageMagick make git

Now, clone, make and install the script:

% git clone https://codeberg.org/snonux/photoalbum

Cloning into 'photoalbum'...

remote: Enumerating objects: 1624, done.

remote: Total 1624 (delta 0), reused 0 (delta 0), pack-reused 1624

Receiving objects: 100% (1624/1624), 193.36 KiB | 1.49 MiB/s, done.

Resolving deltas: 100% (1227/1227), done.

% cd photoalbum

/home/paul/photoalbum

% make

cut -d' ' -f2 changelog | head -n 1 | sed 's/(//;s/)//' > .version

test ! -d ./bin && mkdir ./bin || exit 0

sed "s/PHOTOALBUMVERSION/$(cat .version)/" src/photoalbum.sh > ./bin/photoalbum

chmod 0755 ./bin/photoalbum

% sudo make install

test ! -d /usr/bin && mkdir -p /usr/bin || exit 0

cp ./bin/* /usr/bin

test ! -d /usr/share/photoalbum/templates && mkdir -p /usr/share/photoalbum/templates || exit 0

cp -R ./share/templates /usr/share/photoalbum/

test ! -d /etc/default && mkdir -p /etc/default || exit 0

cp ./src/photoalbum.default.conf /etc/default/photoalbum

You should now have the `photoalbum` command in your `$PATH`. But wait to use it! First, it needs to be set up!

% photoalbum version

This is Photoalbum Version 0.5.1

## Setting it up

Now, it's time to set up the Irregular Ninja static web photo album (or any other web photo album you may be setting up!)! Create a directory (here: `irregular.ninja` for the Irregular Ninja Photo site - or any oter sub-directory reflecting your album's name), and inside of that directory, create an `incoming` directory. The `incoming` directory. Copy all photos to be part of the album there.

% mkdir irregular.ninja

% cd irregular.ninja

% # cp -Rpv ~/Photos/your-photos ./incoming

In this example, I am skipping the `cp ...` part as I intend to use an alternative `incoming` directory, as you will see later in the configuration file.

The general usage of `potoalbum` is as follows:

photoalbum clean|generate|version [rcfile] photoalbum

photoalbum makemake

Whereas:

* `clean`: Cleans up the workspace
* `generate`: Generates the static photo album
* `version`: Prints out the version
* `makemake`: Creates a `Makefile` and `photoalbumrc` in the current working directory.

So what we will do next is to run the following inside of the `irregular.ninja/` directory; it will generate a `Makefile` and a configuration file `photoalbumrc` containing a few configurable options:

% photoalbum makemake

You may now customize ./photoalbumrc and run make

% cat Makefile

all:

photoalbum generate photoalbumrc

clean:

photoalbum clean photoalbumrc

% cat photoalbumrc

The title of the photoalbum

TITLE='A simple Photoalbum'

Thumbnail height geometry

THUMBHEIGHT=300

Normal geometry height (when viewing photo). Uncomment, to keep original size.

HEIGHT=1200

Max previews per page.

MAXPREVIEWS=40

Randomly shuffle all previews.

SHUFFLE=yes

Diverse directories, need to be full paths, not relative!

INCOMING_DIR=$(pwd)/incoming

DIST_DIR=$(pwd)/dist

TEMPLATE_DIR=/usr/share/photoalbum/templates/default

TEMPLATE_DIR=/usr/share/photoalbum/templates/minimal

Includes a .tar of the incoming dir in the dist, can be yes or no

TARBALL_INCLUDE=yes

TARBALL_SUFFIX=.tar

TAR_OPTS='-c'

Some debugging options

set -e

set -x

In the case for `irregular.ninja`, I changed the defaults to the following:

--- photoalbumrc 2023-10-29 21:42:00.894202045 +0200

+++ photoalbumrc.new 2023-06-04 10:40:08.030994440 +0300

@@ -1,23 +1,24 @@

The title of the photoalbum

-TITLE='A simple Photoalbum'

+TITLE='Irregular.Ninja'

Thumbnail height geometry

-THUMBHEIGHT=300

+THUMBHEIGHT=400

Normal geometry height (when viewing photo). Uncomment, to keep original size.

-HEIGHT=1200

+HEIGHT=1800

Max previews per page.

MAXPREVIEWS=40

-# Randomly shuffle all previews.

-# SHUFFLE=yes

+# Randomly shuffle

+SHUFFLE=yes

Diverse directories, need to be full paths, not relative!

-INCOMING_DIR=$(pwd)/incoming

+INCOMING_DIR=~/Nextcloud/Photos/irregular.ninja

DIST_DIR=$(pwd)/dist

TEMPLATE_DIR=/usr/share/photoalbum/templates/default

#TEMPLATE_DIR=/usr/share/photoalbum/templates/minimal

Includes a .tar of the incoming dir in the dist, can be yes or no

-TARBALL_INCLUDE=yes

+TARBALL_INCLUDE=no

TARBALL_SUFFIX=.tar

TAR_OPTS='-c'

So I changed the album title, adjusted some image and thumbnail dimensions, and I want all images to be randomly shuffled every time the album is generated! I also have all my photos in my Nextcloud Photo directory and don't want to copy them to the local `incoming` directory. Also, a tarball containing the whole album as a download isn't provided.

## Generating the static photo album

Let's generate it. Depending on the image sizes and count, the following step may take a while.

% make

photoalbum generate photoalbumrc

Processing 1055079_cool-water-wallpapers-hd-hd-desktop-wal.jpg to /home/paul/irregular.ninja/dist/photos/1055079_cool-water-wallpapers-hd-hd-desktop-wal.jpg

Processing 11271242324.jpg to /home/paul/irregular.ninja/dist/photos/11271242324.jpg

Processing 11271306683.jpg to /home/paul/irregular.ninja/dist/photos/11271306683.jpg

Processing 13950707932.jpg to /home/paul/irregular.ninja/dist/photos/13950707932.jpg

Processing 14077406487.jpg to /home/paul/irregular.ninja/dist/photos/14077406487.jpg

Processing 14859380100.jpg to /home/paul/irregular.ninja/dist/photos/14859380100.jpg

Processing 14869239578.jpg to /home/paul/irregular.ninja/dist/photos/14869239578.jpg

Processing 14879132910.jpg to /home/paul/irregular.ninja/dist/photos/14879132910.jpg

Generating /home/paul/irregular.ninja/dist/html/7-4.html

Creating thumb /home/paul/irregular.ninja/dist/thumbs/20211130_091051.jpg

Creating blur /home/paul/irregular.ninja/dist/blurs/20211130_091051.jpg

Generating /home/paul/irregular.ninja/dist/html/page-7.html

Generating /home/paul/irregular.ninja/dist/html/7-5.html

Creating thumb /home/paul/irregular.ninja/dist/thumbs/DSCF0188.JPG

Creating blur /home/paul/irregular.ninja/dist/blurs/DSCF0188.JPG

Generating /home/paul/irregular.ninja/dist/html/page-7.html

Generating /home/paul/irregular.ninja/dist/html/7-6.html

Creating thumb /home/paul/irregular.ninja/dist/thumbs/P3500897-01.jpg

Creating blur /home/paul/irregular.ninja/dist/blurs/P3500897-01.jpg

Generating /home/paul/irregular.ninja/dist/html/8-0.html

Generating /home/paul/irregular.ninja/dist/html/8-41.html

Generating /home/paul/irregular.ninja/dist/html/9-0.html

Generating /home/paul/irregular.ninja/dist/html/9-41.html

Generating /home/paul/irregular.ninja/dist/html/index.html

Generating /home/paul/irregular.ninja/dist/.//index.html

The result will be in the distribution directory `./dist`. This directory is publishable to the inter-web:

% ls ./dist

blurs html index.html photos thumbs

I usually do that via rsync to my web server (I use OpenBSD with the standard `httpd` web server, btw.), which is as simple as:

% rsync --delete -av ./dist/. admin@blowfish.buetow.org:/var/www/htdocs/irregular.ninja/

Proxy Information

Original URL: gemini://standby.foo.zone/gemfeed/2023-10-29-kiss-static-web-photo-albums-with-photoalbum.sh.gmi
Status Code: Success (20)
Meta: text/gemini;
Capsule Response Time: 360.482639 milliseconds
Gemini-to-HTML Time: 2.431783 milliseconds

This content has been proxied by September (ba2dc).

KISS static web photo albums with photoalbum.sh

Table of Contents

Introducing photoalbum.sh

The title of the photoalbum

Thumbnail height geometry

Normal geometry height (when viewing photo). Uncomment, to keep original size.

Max previews per page.

Randomly shuffle all previews.

SHUFFLE=yes

Diverse directories, need to be full paths, not relative!

TEMPLATE_DIR=/usr/share/photoalbum/templates/minimal

Includes a .tar of the incoming dir in the dist, can be yes or no

Some debugging options

set -e

set -x

The title of the photoalbum

Thumbnail height geometry

Normal geometry height (when viewing photo). Uncomment, to keep original size.

Max previews per page.

Diverse directories, need to be full paths, not relative!

Includes a .tar of the incoming dir in the dist, can be yes or no

KISS static web photo albums with `photoalbum.sh`

Introducing `photoalbum.sh`