About Andrew's Album Application
This is a web-based photograph album: the photos are stored in a folder hierarchy on the server, and the web page uses JavaScript to show them to you.

On a desktop web browser, navigate by clicking the buttons in the top bar. When viewing a photo (on a non-touch-screen device), you can also click the arrows that appear if you move the cursor near to the left, right, or top edges of the window. On a touch-screen device like an iPhone the “Next” and “Previous” actions are done by swiping across the screen. Finally, on a device with a keyboard you can navigate with the cursor-arrow keys: left for “Previous”, right for “Next”, up-arrow to view the parent folder, and down-arrow to view this folder’s first directly-contained photo (if any).

The “Skip” button or shift-right arrow skips the remainder of the current folder and any sub-folders.

The “Play” button (or the spacebar) starts a slide show of all the photos in the current folder, and its sub-folders. The spacebar will also pause or resume the slide show, and the escape key will stop it.

Clicking in a photo hides or displays the menu bar and title bar.

You can edit the title of a folder or photo by clicking “Edit” or by clicking on the title. The edit dialog also allows you to nominate an image or folder to be used as a thumbnail for its enclosing folder. Editting requires a valid Pachylet name and password. You can sort the directly-contained photos in a folder by dragging them around, then clicking “Save”.

All navigation within the album keeps your browser on the same single web page: the browser’s “Back” button takes you to the page you were viewing before the album. But each folder and photo has its own URL, distinguished by the part after the “#”, as shown in the browser’s address bar. The address bar is updated as you navigate around the album, so reloading the window will always return you to the part of the album that you were viewing, and the URL can be bookmarked or sent to a friend.

There’s also a version that doesn't use any Javascript, but which has a very limited set of features: just basic navigation. See also the separate technical details page.

Technical Details
The server side of the application consists of a PHP script plus its subroutines and settings. The script responds to requests from the client side by returning XML descriptions of the images and folders. The server-side script is also responsible for creating and maintaining a cache of scaled images, and a database of image and folder titles. The server-side script doesn't do any HTML, and it has no opinion on how you are going to navigate and view the images.

After changing the set of images and folders on the server, you can pre-load the server-side cache by shift-clicking on the "Play" button.

The client side consists of HTML generated by a PHP script, plus its associated stylesheet and Javascript.

All of this is copyright © Andrew Birrell.

 
thumbnail
Writing ...
User:
Password:
Title:
Thumb: Use for containing folder’s thumbnail.
 
Reading ...
 
 
Up
Previous
Next
Andrew's Album Application
EditSave…RawRevertHelp