| home | sitemap | travel pix | interactive mathematics |


Flash-based photo gallery

Posted in Computers & Internet on 3 Feb 2006.
30 Comments

The gallery

Updated 4 Jun 2006: Go to the latest Flash-based photo gallery, based on Coppermine gallery.

Background

I have been using Coppermine photo gallery on this site for a while now (see the Coppermine version of the gallery: Travel Pix). I have always found Coppermine to be clunky - that is, each new photo requires a new page load and as the photos are loading, the screen jumps all over the place. This is because the pages are based on tables (within tables, within tables). It is not an elegant solution.

There is a “slide show” feature in Coppermine, but the fade-in/fade-out feature only works in IE, not Firefox. The slideshow gives a better user experience than the normal pages, but you can’t see photo titles or photo descriptions as it proceeds.

One possibility I considered was to upload all the photos to Flickr (which has an excellent Flash photo viewer), but this would be time-consuming, tedious and I’m not sure that’s where I want them. And anyway, I enjoy challenges.

I have been toying with the idea of developing my own Flash-based gallery for a while. I looked at several open-source solutions, but I found none of them did what I wanted them to do. In particular, they were not robust for a large number of photos. Also, most of the ones I found did not pre-load images (you would choose an image, then you had to wait - looking at an empty screen - for the image to load before it would appear).

So over Chinese New Year holiday break I got started on a Flash-based photo viewer. You can see the current state of development showing my Taiwan Photos. (Flash version as at Feb06. The link at the top of this post is the most recent, Jun06.)

(For comparison with the Coppermine photo gallery, go to Taiwan Photos (Coppermine version).)

How it works

I am using the Coppermine’s mySQL database for the titles and descriptions of each photo. (This was another reason I didn’t want to completely change galleries - all the pix and info are already in there.) The Flash SWF is triggering a PHP file which in turn queries the database. The info is returned in the form:

&filename0="taiwan1.jpg"&title0="This is Taiwan"
&description0="It was great"&filename1=...

This is then read by the Flash file and the images with descriptions are displayed.

I did also work on an XML-based solution, but this was not satisfactory for this application since each time there was an update to the Coppermine gallery, I would need to re-generate the XML file. With the current solution, any updates in Coppermine are immediately reflected in the Flash-based gallery. (Update: I realise now I could regenerate the XML on the fly, but too late now…)

Future Development

Things I will be doing in the Flash version:

  • Tidy up the interface Done - 12 Feb 2006
  • Fix some timing issues Done - 12 Feb 2006
  • Add an option to see full-size images (1000×750 pixels) Done - 4 Jun 2006
  • Add clickable thumbnails Done - 4 Jun 2006
  • Add an option to view other albums within the Coppermine gallery Done - 4 Jun 2006
  • Attempt more efficient loading from the PHP file (This appears to be working fine - no need for further action)

It should keep me out of trouble… It did keep me out of trouble!

Update (4 Jun 2006): Finally this is finished! The clickable thumbnails were not that hard to do, but added a lot of complexity to the button behaviour. The buttons need to be ‘inactive’ when fadein.fadeouts are occuring, else loading errors would occur.

Moving the thumbnails was another interesting exercise. I wanted to have a smooth movement (which I achieved) but I had to abandon it when it was all put together - it just had too many possible user inputs and getting one thing to work meant 3 other things would break. Anyway, I feel the overall effect is still much more pleasing than Coppermine.

I decided on a PHP-based solution for choosing albums by clickable thumbnails. A Flash-based solution for this would have taken a lot longer, and not been any better, I felt. My gallery chooser also allows for restricted view galleries, also based on Coppermine’s restrictive view system. That bit was fun - the login info is passed to the Flash file via a GET so that when the user clicks to go back to the PHP album choice page, they are still logged in.

So, tell me how you like it…

30 Comments


Book-mark this post

Book-mark this post in Del.icio.us, Furl, Digg, Stumble Upon, whatever...
Mouse-over the image and choose your bookmark:


Related articles

30 Comments »

  1. squareCircleZ » Photo gallery - finally finished said,

    June 4, 2006 at 2:42 am

    [...] For the background and more technical details, see the original post on this: Flash-based photo gallery [...]

  2. alex said,

    June 22, 2006 at 7:19 pm

    Love your gallery.. anyways you can email me the script.. very clean design…

    i need flash version for myspace.

  3. Hans said,

    September 4, 2006 at 10:05 pm

    Just what I was looking for. I also hate the page refreshings of Coppermine.
    What if you upgrade Coppermine, will it still work?

  4. zac said,

    September 5, 2006 at 3:30 am

    Hi Hans. I can send you the Flash SWF and PHP files if you would like to try it out.

    If the developers upgrade Coppermine it should be fine, since my gallery is just reading from the Coppermine database and is otherwise independent. One potential problem is that they may add another field to the database and then I would need to make a small change.

  5. Trig said,

    September 7, 2006 at 2:52 pm

    Hi,

    absolutely brilliant, I’ve been trying to dig through what coppermine creates in mysql to try and achieve something like this. Do you have any plans to make the swf and php files available ? or create some kind of tutorial ?

    Trig

  6. zac said,

    September 11, 2006 at 1:18 am

    Hi Trig - As I mentioned in the mail to you, I am happy to supply the files for anyone to try it out. I am looking for feedback before I make it available for download. It’s best to fix things early…

  7. Lars said,

    September 19, 2006 at 7:59 pm

    NICE!

    Could you e-mail me this script ?

  8. zac said,

    September 25, 2006 at 9:38 am

    Hi Lars - Glad you like it. I have sent the files. I’m looking forward to seeing how your Coppermine site looks using the Flash gallery.

  9. scott said,

    October 3, 2006 at 5:20 pm

    i was also thinking of trying to develop a flash gui for coppermine, do you think i could take a look at the source files.

  10. zac said,

    October 12, 2006 at 2:07 pm

    Hi Scott - I have sent them via email. Let me know how it goes.

  11. Matt said,

    November 15, 2006 at 10:37 am

    Wow! this is exactly what I have been looking for! In many respects I hate coppermine and I would love to try your solution to give it more of a clean cut and professional edge.
    Any chance that I could have a play with it for our site ToastMonkey.co.uk?

    Cheers,

    Matt

  12. zac said,

    November 16, 2006 at 1:15 am

    Hi Matt I have sent you the files in a mail. Let me know how it goes.

    Regards.

  13. sounes said,

    January 22, 2007 at 12:54 pm

    Simply stunning, and what I have looked for in a long time. Could you email me the files, please? - is it easy to set up?

  14. zac said,

    January 22, 2007 at 1:36 pm

    Hi Sounes - I have sent the files to you via email. Looking forward to your feedback.

  15. Mike Z said,

    February 23, 2007 at 6:49 am

    Hey there I would like to take a look at this if it is ok to download :)

  16. VinVen said,

    October 29, 2007 at 1:41 am

    Simply Brilliant. Very clean and elagant interface. Can’t wait to create my own Family photo albums using this approach. Can you please send me the necessary files. Thank you for your time.

  17. zac said,

    October 30, 2007 at 9:41 pm

    Hi VinVen. I have sent you the script via email. Glad you like it.

  18. Jason said,

    December 13, 2007 at 3:37 am

    Great job! Can you send me the script also?
    Thanks

  19. zac said,

    December 13, 2007 at 2:54 pm

    Hi Jason. I sent you the script via mail.

    Please respond here once you have set it up - all feedback helps.

  20. Charlie said,

    December 29, 2007 at 8:43 am

    Hi,
    You’ve created a perfect slideshow… two questions, do you need the Flash program (the program, not the viewer) to build your slideshow? And if you don’t need Flash, would it be possible for you to send me the script? If I can get it to work, I’ll be happy to send you the results with all credit.
    Many thanks,
    Charlie

  21. zac said,

    December 29, 2007 at 9:31 am

    Hi Charlie

    You don’t need Flash program to build your own gallery.

    The files I send you are ready to connect to a Coppermine gallery.

    Regards

  22. SteveW said,

    January 11, 2008 at 9:12 pm

    This looks just awesome… any chance I can have a copy please?
    Thanks Steve

  23. zac said,

    January 11, 2008 at 9:39 pm

    Sure Steve - I’ll send it to your email.

    Please come back here and comment (and share your gallery, if you are game!) when you get it working.

  24. SteveW said,

    January 16, 2008 at 1:58 am

    works well… great support from the author… I think you need to seriously think about selling this!

  25. zac said,

    January 16, 2008 at 6:34 am

    Thanks for the feedback, Steve.

    I’m glad that it suited your purpose.

  26. Jay said,

    April 4, 2008 at 9:17 pm

    Would love to use this as front end to my photo site. Can you send code??

  27. zac said,

    April 6, 2008 at 7:22 am

    Hi Jay

    I have sent you the files by email. Good luck with it and tell me how it goes.

  28. Jay said,

    May 22, 2008 at 6:53 pm

    This is a great way to utilize flash slideshows in coppermine. Can you please send me the code.

  29. stalt said,

    May 24, 2008 at 12:12 am

    Have you try free image slideshow?
    Like some flash gallery

  30. zac said,

    May 24, 2008 at 3:40 pm

    Jay I have sent you the files via email. Let me know how it goes.

    Stalt Thanks for the recommendation - I like your gallery. It does not appear to have any connection with Coppermine, however.

Leave a Comment