Tweaking the Image Uploader

For fun I went trolling through the images people have uploaded via the YUI Uploader implementation I wrote a while ago. When it took my browser a solid 30 seconds to even be remotely responsive and start rendering images it struck me that perhaps it was time to paginate the images instead of just dumping them all out onto one page.

So I added pagination. It’s currently super simple which makes for easy explanation. The PHP still collects and sorts every single image in the directory by date. I don’t think there’s any other way to do that. Afterwards it checks to see if the “o” query param was set and is an integer (thanks for adding filter_input to PHP5, PHP devs!). Once there’s an offset to start from, it slices the array at that point and takes the next 50 images.

After that there’s just some simple logic around drawing the pagination numbers and figuring out which one is the current page. The numbers are centered and boxed using a variation on Hedger’s inline-block work (Item List Grid : Practice with display:inline block across browsers) that I worked on for the next VYC release. It solves the problem with a minimum amount of code in a really semantic way that just makes my web developer brain as happy as can be. Granted the CSS is not what I would call “pretty” but it works everywhere and is not impossible to understand, so I’m not too bothered by it.

So here’s how it turned out. Be forewarned that I don’t control what is uploaded here, and as such there might be NSFW content on this page!

http://tivac.com/upload/images/

Comments are closed.