Obviously I’ve been doing a lot of web work this week, getting ogre3d.org back to how I want it. In a lot of cases that’s meant changing the software wholesale – something you really don’t want to be rushed into, but in this case I had no choice.
It’s been one of those weeks where I feel like I’m desperately doing a headlong sprint, only to run into an invisible brick wall two feet from the finish line. A number of the pieces of software I’ve tried using have been in the ‘almost, but not quite’ bracket. We used Gallery for years for example, but had never upgraded past version 1.5. Given that I’m making sure we’re not languishing on any old versions any more, I obviously picked up Gallery 2.3, spent a fair amount of time re-importing all of our galleries with the metadata attached, integrating it with WordPress via WPG2, and styling / configuring it the way I wanted, only to find that when I put it on the live site, the memory usage was completely unacceptable, even with all non-essential plugins disabled and full optimisation turned on. We’re a reasonably high-traffic site; nothing compared to some of course, but still higher than a lot of places), and it was clear fairly quickly that Gallery 2.x was going to be a dead weight – literally as soon as I enabled it the server’s available memory would plummet like a stone. I wish I had a representative performance testing set up to try these things out beforehand – sometimes I miss having the resources of a larger organisation to tap into in cases like this!
Rather annoyed at the time I’d wasted, I then tried NextGEN Gallery for a little while, but found that inadequate too. Again it was almost good enough, but unfortunately the navigation between albums was not very good, and would require some modding to make it work well. And that was even before I knew how it would perform – I suspected better than Gallery, since it’s a lot less functional, but still, it was an unknown, and I didn’t want to spend time fixing it up the way I wanted (like I did with Gallery) only to find I have to toss it out.
So finally, I settled on hosting our gallery on Flickr instead of self-hosting, and exposing them on the main site via Slickr Gallery. Slickr has a really nice navigation mode and looks very slick (it’s aptly named), and using Flickr for hosting obviously has bandwidth and performance advantages.
The one problem with this solution though was that the lightbox that Slickr uses is a bit weak. It can only handle a fixed-size window (although it will resize to the aspect ratio of the picture), which means the image is almost always too small on a decent sized screen. You can increase the size, but then it’s too large for smaller screens and you have to scroll, so it just ends up feeling unsatisfactory. So, instead I wanted to use Shadowbox.js, which resizes dynamically to the client area of the web page, which is ideal. Unfortunately Slickr doesn’t have an option to change the lightbox, and there wasn’t much information online about it. So, after some tinkering, I discovered how to do it:
- You should have Slickr, Lightbox-2 and Shadowbox.js installed.
- In wp-content/plugins/slickr-gallery/slickr/slickr.php, replace all instances of ‘lightbox’ with ’shadowbox’
- In wp-content/plugins/slickr-gallery/slickr/slickr.js, replace “initLightbox();” with “Shadowbox.setup();”
That’s it. It’s fairly simple, but it took me a bit of trial and error to get completely right even though the end result was trivial (Shadowbox’s code is a little hard to read). I originally made more changes thinking I had to do more than this, but ended up breaking things in IE, or in certain navigation cases. This simple change seems to work in all reasonable cases (IE7, FF3, Opera9, haven’t tried Safari yet). You could probably make more changes to remove the Lightbox-2 dependency entirely (disabling the plugin breaks Slickr still), but I have other things to be getting on with for now. Like uploading and tagging all the old screenshots!
Edit: here’s the result. Yes, I know the page title says ‘Page Not Found’ (something to do with the way Slickr redirects page entries), will try to figure out how to fix that later.
February 9th, 2009 at 9:55 am
I like it. The thumbnails give you a nice overview, and browsing is easy, responsive, and has a snazzy “open window” animation. It’s certainly nice to have non-fixed resolution as well.
There’s sure been a lot of cool ogre projects. The Book of Unwritten Tales is one of my personal favs among the newer screenshots.
Thanks for getting the site back online so fast. It reminded me how absolutely invaluable the forums are as a learning and problem-solving resource. And how key the website is as a hang-out for the thriving ogre community, even if it’s occasionally to bicker about the best physics engine or GUI on the market.
February 9th, 2009 at 10:46 am
Thanks. It’s been a hell of a lot of work to get it back to normal so I’m glad it’s appreciated
Now I need to figure out a good system to ensure I keep up with security fixes of web components more often (core OS updates are handled already).
February 9th, 2009 at 12:07 pm
Thanks for sharing your experience Simbad… I’m setting up my new site with wordpress also
I’ve seen 3 ogre site rebuilds and it always have the same look and feel wich is nice for us (the users). Did you create a brand new theme or you modified an existing one?
February 9th, 2009 at 2:07 pm
I created the theme mostly from scratch although I based it on the old Joomla theme and the base WP templates as an example.
BTW – it’s ‘Sinbad’
Or Steve of course.
February 9th, 2009 at 3:15 pm
I’m sorry to say, but it seems really slow. I timed it, and it took exactly 1 minute before the outline of the page came up, and another 15 seconds after that to show the albums. On the other hand when I clicked on the featured projects album it started loading the thumbnails right away.
February 9th, 2009 at 3:21 pm
I’m not keen on this – too many thumbnails on one page that took too long. I don’t like sites that display an image in that overlay window. It takes control away from me, the reader.
February 9th, 2009 at 3:39 pm
@Chris: just tried it, it took 3 seconds to display the album page, and another 3-4 seconds to display the images once I clicked on one. My browser cache probably helps, but I cleared it and it only took 5 seconds, and the thumbs progressively paged in so it looked ok. You may just have hit it at a busy time, the server is still under load as lots of people (and bots) hammer the new version. Or, maybe Flickr was being slow.
@Stodge: sorry mate, but lightboxes are the norm these days an IMO makes the navigation much more appealing (no back & forth between pages). I can reduce the number of thumbnails per page, but I set it that high because I found it easier to scan a large selection than having to flip pages more often. Time to load one page of thumbs is low here (< 5 seconds) – and this is on a pretty basic broadband, and they fill in progressively.
If you’re using IE7 its Javascript engine is a bit slower, so that’s probably a factor. Use a better browser or wait for IE8 which is faster. Even so, on IE7 it only upped the time to about 10 seconds per page, again progressively populated.
February 9th, 2009 at 3:49 pm
yes I made a mistake… I dont know exactly the origin of you nickname be it seems that in spanish (my languaje) it is with ‘m’:
http://es.wikipedia.org/wiki/Simbad:_La_leyenda_de_los_siete_mares
but in english it is with ‘n’:
http://en.wikipedia.org/wiki/Sinbad_of_the_Seven_Seas
February 9th, 2009 at 3:53 pm
Ah, well at least that explains why so many people make the same ‘mistake’
February 10th, 2009 at 6:18 am
Is there anyway we can see the comments describing the shot in the “lightbox” (I hate those things too)? Its nice to have the context that the older gallery provided. I noticed they are included on the flickr page for the each picture, so at least the information is there.
February 10th, 2009 at 11:39 am
On my TODO, yes. I’ll have to do more modding for that, but I have other things to be getting on with for now.
February 10th, 2009 at 5:01 pm
I was using the latest Chrome, but the slowdown may have been our corporate firewall – maybe it was scanning all downloaded images for virii etc.
I’ll use it but I don’t have to like it!
February 10th, 2009 at 11:33 pm
In spanish grammar, there’s the “mb nv” rule:
The letter N can never precede the letter B
The letter M can never precede the letter V
That’s why “Sinbad” is often spelled “Simbad”.
Grammar rules shouldn’t apply for names or foreign rules.
But I guess the name Sinbad is reaaaallly old, probably it has been adopted as “Simbad”.
Now Steve, you truly know why your nickname is often misspelled
Cheers
PS: Who writes these Captcha things? Mine says “Repairs $27.50″ (and don’t tell me that’s what they charge you for formatting the server!)
They’re funny, makes me write more comments to see what the next captcha will say hahahaha
March 23rd, 2009 at 3:03 am
Having a bit of problem here- hopefully you can help. I tried following the above, and everything looks ok on loading the first page of the gallery- but if you click an album or “next 3 albums” nothing is themed. It’s acting like it’s not picking up the slickr.js and loading the content in the div.
The shadowbox fix does work for the widget though.
May 10th, 2009 at 10:33 pm
Hi Just trying the slickr gallery and wondering if you figured out a fix at all for the “page not found” which appears in the tab on slickr galleries?
cheers