PiGallery2

This is a directory-first photo gallery website, optimised for running on low resource servers (especially on raspberry pi)

Live Demo

Live Demo @ heroku: https://pigallery2.herokuapp.com/

Table of contents

1. Getting started
2. Translate the page to your own language
3. Feature list
4. Known errors
5. Credits

Getting started (on Raspberry Pi 1)

Install NodeJs

Download and extract

cd ~
wget https://nodejs.org/dist/v6.10.3/node-v6.10.3-linux-armv6l.tar.gz
tar -xzf node-v6.10.3-linux-armv6l.tar.gz

Copy it to /usr/local:

cd node-v6.10.3-linux-armv6l/
sudo cp -R * /usr/local/

Add to path. Add the following line to ~/.bashrc

PATH=$PATH:/usr/local/bin

Full node install description: https://raspberrypi.stackexchange.com/questions/48303/install-nodejs-for-all-raspberry-pi

Install PiGallery2

Install from release

cd ~
wget https://github.com/bpatrik/pigallery2/releases/download/1.2.0/pigallery2.zip
unzip pigallery2.zip
cd pigallery2
npm install

Install from source

cd ~
wget https://github.com/bpatrik/pigallery2/archive/master.zip
unzip master.zip
cd pigallery2-master # enter the unzipped directory
npm install

Run PiGallery2

npm start

To configure it. Run PiGallery2 first to create config.json file, then edit it and restart. Default user: admin pass: admin

Useful links/tips:

using nginx

https://stackoverflow.com/questions/5009324/node-js-nginx-what-now

making https

https://certbot.eff.org/

node install error:

If you get error during module installation, make sure you have everything to build node modules from source

apt-get install build-essential  libkrb5-dev gcc g++

Translate the page to your own language

1. download / clone the repo (the source not the packed release!)
2. add your language e.g: fr

   npm run add-translation -- --fr
   

   it creates a new messages.fr.xls file at frontend/translate folder, it will already contain dummy translation with google translate.
3. 'fix' the dummy translation
4. test if it works: build and start the app

   npm install
   npm start
   

5. create a pull request at github to add your translation to the project.

Feature list

• Rendering directories as it is
  • Listing subdirectories recursively
  • Listing photos in a nice grid layout
    • supporting most common image formats
    • showing tag/keywords, locations, GPS coordinates for photos
    • rendering photos on demand (on scroll)
• On the fly thumbnail generation in several sizes
  • prioritizes thumbnail generation (generating thumbnail first for the visible photos)
  • saving generated thumbnails to TEMP folder for reuse
  • supporting several core CPU
  • supporting hardware acceleration (sharp and gm as optional and JS-based Jimp as fallback)
• Custom lightbox for full screen photo viewing
  • keyboard support for navigation
  • showing low-res thumbnail while full image loads
  • Information panel for showing Exif info
  • Automatic playing
  • gesture support (swipe left, right, up)
• Client side caching (directories and search results)
• Rendering photos with GPS coordinates on google map
  • .gpx file support
• Two modes: SQL database and no-database mode
  • both modes supports
    • user management
    • password protection can be disabled/enabled
  • database mode supports:
    • faster directory listing
    • searching
      • instant search, auto complete
    • sharing
      • setting link expiration time
• internalization / translation support
• Nice design
  • responsive design (phone, tablet desktop support)
• Setup page
• Random photo url
  • You can generate an url that returns a random photo from your gallery. You can use this feature to develop 3rd party applications, like: changing desktop background
• video support
  • fully supports *.mp4 files and partially (might have errors with safari and IE) supports *.ogg, *.ogv, *.webm files
  • uses ffmpeg and ffprobe to generate video thumbnails
• Markdown based blogging support - future plan
  • you can write some note in the blog.md for every directory
• bug free :) - In progress

Known errors

• EXIF orientation tag:
  • There is no nice way to handle EXIF orientation tag properly. The page handles these photos, but might cause same error in the user experience (e.g.: the pages loads those photos slower. See issue #11)
• Video support on weak servers (like raspberry pi) with low upload rate
  • video playback may use up too much resources and the server might not response for a while. A solution might be to down scale / convert the video files to lower bitrate.

Credits

Crossbrowser testing sponsored by Browser Stack