The site uses Ajax, PHP & MySQL to manage images and control Monoslideshow. Users can personalize the site, create their own private selection of photo sets, email any image with a logo burned in, communicate about multiple images (useful for client discussions), search by keyword, tags or client, trackback their viewing history as well as other features. There is a powerful but easy-to-use admin backend that manages images, sets, users and clients. Two sizes of thumbnails are created. Image sets can be either public or private. Access to private sets can be granted to individuals or to groups (which makes it easy to assign a set to a client team in one step). There is a drag-and-drop interface to order photos in any set and other administrative controls. Photos can appear in any number of sets. The site is designed to handle and present large numbers of images, though it would work just as well with small groups of images.
Clicking on any photo presents more information about that image and links to explore related sets and images. (However, clicking on any book cover in the main Books section presents a set of photos from that book.)
I'm currently adapting this architecture for a newspaper, which has extensive photo archives and wants to make available hundreds of new sports, news and events photos each week.
I've enjoyed working with Monoslideshow. It's a great tool!
The PHP code which creates the virtual xml file pulls the image information from a database as well as display and personalization settings from the Ajax environment. On the admin side, sets can be created with any combination of images and images can appear in any number of sets. (Allowing images to appear in multiple sets allows for creative groupings, for promotion and to respond to specific requests, among other uses.) There is no "images" folder necessarily related to any given set.
Once the photographer uploads his/her photos, the rest is taken care of on the admin side where the top goals are saving time and being flexible.
If you are looking to display all images in a single folder as a single set or Monoslideshow album, you can use PHP to scan through that directory and create the xml. You can go further and create Monoslideshow albums for subdirectories. It is critical that the paths to your images and thumbnails are correct. And you don't need a database for this basic image presentation.
Still without a database, you can increase the power of your PHP script by creating some albums based on some aspect of the image file, no matter where in the scanned folder hierarchy it may be. For example, you could search for images with a certain date (e.g. filectime or filemtime) and with a certain prefix (e.g. "NationalGallery") and assemble a virtual album that way. The key part of that is including the correct paths in the image tag. I find great flexibility in being able to assign Monoslideshow settings within the image tag, if I need to.
As for the xml itself, the Monoslideshow demo is a great place to start if you're uncertain about the structure. The manual is an absolute must, too.
In the architecture that I've designed, the xml is created on the fly for each request. I'm not scanning directories to create the xml since all of the image information is stored in a database. (The images themselves don't exist in the database.)
You could scan a directory on the fly for each page request. However, I would suggest determining how many images might be in the directory (and subdirectories, if applicable) you're scanning and how much traffic to your images pages you anticipate. There are performance issues to consider. It could take some trial and error with your client's server to determine that.
If the performance hit is going to be big for substantial directory scanning by many users, you could also set up a cronjob to monitor the directories and writing out an actual xml file into each directory (or a parent directory) whenever there is a new upload.
I'm sorry, but I'm not familiar with MODx. I just glanced at their site to get a sense of that that is.
Please let me know if this is pointing you in the right direction.
I'm not too bothered about server performance. My client's site doesnt get huge amounts of traffic.
My client has the ability to upload (by ftp) files into a directory, so I'd want a php script to recreate the xml file for monoslideshow on each page request.
That example script at topxml writes an actual xml file to the server. Your needs are actually a bit simpler (separate from your script to scan the directory and assemble the tags).
My first suggestion is to focus on creating the xml file that Monoslideshow needs, rather than being concerned about xml in general. By using the online demo, you can download a variety of different example xml files. This will help you get a clear picture of what kind of virtual file that Monoslideshow requires. You could start by writing some scripts which simply duplicate those sample xml files (using your own images, paths, etc.) and passing them to Monoslideshow.
The key trick here is that those scripts are not writing the xml code to a file, but using echo or print_r (for example) to output the lines in the xml file.
$filter = ".jpg"; // path to the directory you want to scan $directory = "/images";
// read through the directory and filter files to an array @$d = dir($directory); if ($d) { while($entry=$d->read()) { $ps = strpos(strtolower($entry), $filter); if (!($ps === false)) { $items[] = $entry; } } $d->close(); sort($items); }
// third, the playlist is built in an xspf format // we'll first add an xml header and the opening tags .. header("content-type:text/xml;charset=utf-8"); echo " <?xml version="1.0" encoding="utf-8"?>\n"; echo " <slideshow>\n"; echo " <album>\n";
// .. then we loop through the file list .. for($i=0; $i<sizeof($items); $i++) { echo " <img src=".$items[$i]."/>\n"; }
// .. and last we add the closing tags echo " </album>\n"; echo "<slideshow>\n"; ?>
Would I just use this as the monoslideshow xml feed? How would I get monoslideshow to "see" this?
Just use your script as if it was an xmlfile for Monoslideshow. The manual describes how to assign the variable "datafile".
You look like you've generally got a good basic script going. Just make sure you've got your image and thumbnail paths set correctly in your album tag. Your loop goes through the /images directory but you haven't yet told the album tag about the /images directory. Since your img tags just use the filenames in src, they won't be found without the path directives in the album tag.
I'd also suggest trying the script with and without the header call.
A little trial and error to get comfortable and you should be on your way.
Glad to hear your scripts are working to your satisfaction.
To display the thumbnails below the main image, just use
thumbnailWindowAlign = "bottomCenter"'
You'll have to determine your margins, how big the thumbnail window is, etc, then account for that in your viewport setting. In other words, reduce your viewport height setting to accommodate for your thumbnail window.
I too am using MODx, but have been manually editing the xml each time a file is added. Would you mind sharing your solution. It looks as to be a great time saver.
Hey - Nice setup... One question though if you see this.... After you click on the image and go to the details screen, How did you get back to the same image in the set? I have a similar thing and no issue apart from when I click back it starts the whole set again.... I notice the back arrow, so what are you doing with that to restart on that specific image?
I've placed many markers throughout my architecture so that the user's current view can be tracked (where possible). In the situation you are asking about, the back arrow makes use of the startWithImageID setting.
The site is database-driven, with no limits on the number of images (currently over 10,000, mainly in private client sets), sets or private groups. URLs can be generated to link directly to a specific image in any set. You can see that in action if you try the "email this set" feature. "Email this set" turns any image on the site into a branded e-mail postcard.
Whacks myself in the head (rtfm always works hey)... I missed that "startWithImageID" value..... Yeah mine is all DB driven with the XML generated [or static XML regened on a schedule for some of it to save me the sync database IO - pardon an old DB programmer, I had to put something fun in there :-)] & I have the internal key marked as the ID in the image XML, so I'm all set to go. I have the drill down on the image... yet to turn it into an email card but that was my intention on one site and on the other, just a bookmarkable detail screen with more desc & what not. All still a work in progress like most sites :-) Thx for the info!!
Your way ahead of me in how you have implemented mss.
I'm not sure if you are aware but there is a flaw in how the thumbnails work in firefox.I wanted to point out to you that I have posted a discussion on problems with thumbnails (do a search for "important news".) Hope that this is of help as you have obviously have put a lot of work in for your clients site to work correctly.