AmigoPix

Sneak peek at v0.3

2005-02-12T18:05:00.000-06:00

What new features will v0.3 be showing off? Thanks to Chris, we've got a new theme in the works. Here's a glimpse:

Another big help will be the help text that Charles is working on.

If time permits, I'll try to get image rotation in there too, but that might not happen until 0.4

As always, you can see most of the future plans (though not in any order) on the todo list.

Editing progress

2005-02-11T00:52:00.000-06:00

It's not quite ready for a 0.2.2 release, but here's what I've got done over the last couple days.

Editing text in the textboxes doesn't rename anything, it's really just adding titles to the .description files for each item, not changing the filenames. So quite often, the filename will be different from the title.

After the edit boxes are some new controls. Hovering over the file icon () shows what the name of the file is. Clicking on that icon sets the text in the field to be the filename.

Hovering over the undo arrow () shows what the textbox contained when the page was loaded (sans any HTML in the field). Clicking on it will restore that text to the textbox (including any HTML).

Here's some samples:

Hovering over the file icon, you can see that the filename is DSC00728.

On a directory:

The title is green because I've changed the value and haven't saved it yet. Hovering over the undo icon, you can see the original title. Clicking will restore that title (and make the background white again). Note that neither of those titles are the actual name of the folder.

The second textbox is the short description. See Monday's posts for a sample of how the title and short description are both rendered when not in edit mode. Also note that there isn't a file icon next to the short description... not much point in making the desc be the directory name, that's what the title field is for.

Bugfix release: v0.2.1

2005-02-07T23:37:00.000-06:00

Going with the "release early, release often" philosophy, here's an update that addresses some recently discovered issues.

Of note, it will now warn you when trying to leave a page with unsaved changed (it was far too easy to click an image while editing titles and lose all the changes).
Fixed bug that prevented remote logins without SSL from working. It now functions as previously described.
Fixed bug that rejected dir title updates in some situations.

See the changelog for more.

AmigoPix gets a new home

2005-02-07T17:55:00.000-06:00

AmigoPix.com is the new home for AmigoPix. It will soon have news and download links (there's already a sample gallery).

This blog will still be the best place to find the latest development progress and discussion of upcoming features.

AmigoPix 0.2 released

2005-02-07T02:15:00.000-06:00

It's here! Now you can edit directory and image titles and descriptions! I was rushing to get this out over the weekend (as the timestamp will show), so there are a few things to note:

You have to create a password file to login. Apache comes with an htpasswd util:

htpasswd -c etc/passwd myusername

Anyone listed in the password file can edit titles for any picture.
For security, the login button only appears if your source IP is private, if you want to enable logins from elsewhere, add this to your config file:

PrivLogin = 0 (don't require private IP for login)

By default, remote (non-privateIPs) require SSL for login. If you understand the risks and want to enable remote logins without the protection of SSL, add this to your config file:

SSLRemote = 0 (don't require SSL for remote logins)

You can enter any text you want, including HTML for titles or descriptions.
Directory tiles aren't clickable when logged in, click the folder icon to go into the folder.
Fields turn green after editing if the text has been changed.
Clearing the text out of dir or image title will reset the title to match the file name.
~~Clicking on a folder, thumbnail or any other navigation will lose all unsaved changes.~~
Long descriptions for dir's can't yet be edited.
~~While editing, there isn't any way to see what the previous value was.~~
While editing, there isn't any way to preview HTML before saving.

All the red items above will be addressed in upcoming 0.2.x releases.

Here's a sample of what a customized dir tile looks like:

Note the use of HTML to change style and color of some of the title text. The black text is the short description. So far, the only way to get a customized thumbnail is to edit the .description file for the directory (by hand) and add a line like this:
icon = filename.jpg (must be a picture in that directory)
Be sure to use the filename, not the title. This ensures that if you later change the title, the icon will still be used.

Happy browsing and please report any issues you encounter.

Title editing update

2005-02-06T23:11:00.000-06:00

I've got directory and picture title editing working pretty smoothly. The hard part is trying to find the right encoding for all the various parts of a document. For example, it's common to see that a percent sign and two hex digits are used for illegal chars in a URL (e.g. %20 is a SPACE). It's also moderately common to know that some chars need to be quoted in the body of your document, but it's a different scheme (e.g. < is a less than sign and & is an ampersand). Less common is encoding chars for HTTP headers. It's the same plan as using & but some browsers don't decode & into a an and sign... this causes problems when you use & in URLs in the HTTP headers (I do). Then there's the set of chars that JavaScript will encode with its internal escape() vs the set of chars that are valid in a URL (yes, they're different). Getting those mixed up would mean that either chars get encoded twice or not at all, even when they should be.

Moving on to a practical example, say you have a dir with 100 images in it. Under each image is a textbox where you can edit the title of the image. When your done, you hit save. The browser sends all the new titles (as POSTDATA) back to the server. How does the server know which title goes with which file? The obvious answer is that each field's name is the filename. Sure, that's nice and simple and it will actually work... most of the time. What happens when you've got a file with some special chars in its name?

You might have an input box that looks like this where name is the filename and value is the title that you want people to see.
<input type="text" name="Behind you 100%.jpg" value="Rooting for you"/>

HTML says you can't have a % in the name attribute (among many other forbidden chars). Well, we've got all these encodings discussed above, surely one of them must work.

Encoding the name in the URL style doesn't work because % encodes as %25 (still has a % which isn't allowed). Encoding it as an HTML entity is allowed, but % becomes % and then you're stuck generating a huge table for all possible chars (what about other languages?)

I took what seemed to me the simple and safe route: make up yet another encoding. In this new one, I encode chars like URL style, but use an underscore instead of a percent sign. The user never sees that (unless they read the page source) and it's trivial to decode.

The end result of all my messing with various encodings is that they each have their own purpose and it's working out to be a very flexible and robust system. As an example, I gave my image titling textbox a torture test. I typed in all the usual suspects, including some HTML and hit save.

As you can see, the HTML is honored making the work bold bold. I have a simple regex that strips out the HTML tags for the tooltips so you don't see the <b> or </b> in there. I've also tested inline styles and they work too.

Now that I seem to have a working system, apply the same functions to editing image descriptions, add the form fields, collect the data and v0.2 will be ready.

Status update

2005-02-06T13:01:00.000-06:00

I've got the basics in place for editing directory titles and descriptions. There's some optimization to be done, but it seems to work. So far, the features I have are:

Add/edit dir titles
Add/edit dir short descriptions
Changing a dir title will not rename the directory, the title will be saved seperately.¹
Leaving a field, it will change the bg color if the text was changed
Re-visiting a field and changing the text so it matches the original, the bg color will be set back to normal to show that it hasn't been changed (e.g. the displayed text matches what was last saved).
Deleting a dir title (and saving it) will cause the directory's name to be shown instead¹

Still need to be done before v0.2 is ready:

Allow editing of image titles and descriptions.
Allow adding/editing of dir long descriptions
Error reporting
More testing

Subsequent updates to v0.2.x will have:

Allow editing of image date
Allow rotation of images
Faster response times: JS code that will only submit fields that have changed.

But I don't want to hold up v0.2 by waiting for extras... it will be released as soon as I've got image editing features done.

1: This is the normal behavior: any directory without a title will have its actual name used instead. This means that chars not normally allowed in dir names may be used in titles, e.g. slash.

Bugfix release: 0.1.1

2005-02-05T13:37:00.000-06:00

Some minor bugs were discovered in 0.1 and have been fixed. The updated 0.1.1 is now available for download from the same url (always points to the latest release).

Changed since 0.1: (see the changelog for complete details)

Image details and captions would always hide for new viewers.
Re-docking the NavPanel no longer stops a slideshow.
Clicking on a folder in the NavPanel works even from the prefs, login, etc.
Previously, when the NavPanel was opened in a popup, the nav buttons weren't updated until after the next page load; fixed.
Feedback link is hidden if no adminemail was specified in config file.
Sometimes, multiple NavPanels would open when running from /~username; fixed.

Stay tuned for more updates.

AmigoPix 0.1 released

2005-02-04T10:17:00.000-06:00

This is the first public Alpha release of AmigoPix. It can handle the basics of serving up images, but it's lacking in the documentation side. Install should be simple, but if anything need customization, it may take some fiddling to get it working right. Install guide coming soon.

Features:

Unlimited directory depth
Each user can set their own prefs
Customizable themes
Makes use of browser precaching when available (in Firefox, slideshows don't show a blank page while loading the next picture)
Basic browsing features even if JavaScript and cookies are disabled
Images are scale to the window size: one size fits all
Download directory feature for easy picture sharing
Navigation tree to easily find your way around a large collection of pictures
Supports descriptions and title for each directory and picture
CGI can run with read-only access (security)
Does not require any database

You can see it in action powering my photo gallery.