2
0
mirror of https://github.com/thumbsup/thumbsup synced 2024-11-11 07:10:26 +00:00
Go to file
2014-04-25 23:58:05 +10:00
bin support for custom title and CSS 2014-04-22 00:13:47 +10:00
example support for custom title and CSS 2014-04-22 00:13:47 +10:00
public support for custom title and CSS 2014-04-22 00:13:47 +10:00
src Upgrade to regen 0.0.3 2014-04-25 23:58:05 +10:00
templates support for custom title and CSS 2014-04-22 00:13:47 +10:00
.gitignore Initial commit 2014-04-17 21:26:18 +10:00
.npmignore ignore sample files in npm package 2014-04-25 23:52:54 +10:00
package.json Upgrade to regen 0.0.3 2014-04-25 23:58:05 +10:00
README.md npm badge 2014-04-22 19:27:21 +10:00
screenshot.jpg Fix README 2014-04-17 21:31:00 +10:00

thumbsup

Static HTML galleries from a list of photos & videos.

  • supports custom title and styles
  • creates thumbnails for fast previews
  • only rebuilds changed files: it's fast!
  • uses relative paths so you can deploy the pages anywhere
  • works great with Amazon S3 for static hosting

screenshot

Requirements

NPM

Input

Any folder with photos and videos. thumbsup supports 1 level of subfolders, where they each become a gallery.

input
  |
  |__ paris
  |    |__ img001.jpg
  |    |__ img002.jpg
  |
  |__ sydney
       |__ vid001.mp4
       |__ img003.png

Generating the galleries

thumbsup <args>

The following args are required:

  • --input <path> path to the folder with photos / videos
  • --output <path> target output folder

And you can optionally specify:

  • --title [text] website title (default "Photo gallery")
  • --thumb-size [pixels] thumbnail image size (default 120)
  • --large-size [pixels] fullscreen image size (default 1000)
  • --css [file] styles to be applied on top of the default theme (default none)

For example:

thumbsup --input "/media/photos" --output "./website" --title "My holidays" --thumb-size 200 --large-size 1500 --css "./custom.css"

Website structure

The generated static website has the following structure:

website
  |__ index.html
  |__ sydney.html
  |__ paris.html
  |__ public
  |__ media
  |    |__ original
  |    |__ large
  |    |__ thumbs

Deployment

The simplest is to deploy the media and generated pages to S3 buckets on AWS using the AWS CLI tools.

  • aws s3 sync ./generated/website s3://my.website.bucket --delete

Password protection

Amazon S3 buckets do not offer any type of authentication. However you can choose to deploy to another web server that offers password protection, such as HTTP Basic Auth.

An alternative is to deploy the galleries to UUID-based locations, like Dropbox shared galleries.

Dev notes

To create the sample gallery locally:

npm run example