Flickr Live Feed [zip, screens]

[lookslikepat]

Hey guys,

Just finished an RSS grabber for a friend of mine.
He wanted some inspiring daily images from Flickr on his personal startpage. Reading CSS-Tricks that same day I mashed up some different How-To’s and wound up with this.

Basically it’s a combo of Simple-Pie, FancyBox, Chris’s article "FeedSmusher AJAX", a copy of his "Gradient Body Border" and some help from a guide on the Flickr RSS feed for Simple Pie found here. See the bottom footer on the site for all the links.

Warning, this is purely made for Safari 3+ and uses a lot of -webkit css. My friend’s a real die hard Safari fan so I made it explicitly for that browser. It looks "ok" in Firefox and works just barely in IE8.
I should also mention that it looks best in a 1024*768 maximized window.

Grab a copy here*. And here’s the preview url.
* Includes Simple Pie (simplepie.inc) which can be found here.
* Also includes a slightly modified version of FancyBox.

Notice! Both the site and the zip is setup to grab feeds for the keywords "landscape", "mountains", "nature" and "scotland". Those urls can be changed in "feed.php" on lines 8-11. There is also a limit in effect to only grab 15 of the avaliable 20 feed items. This is because I wanted 15*4 to match the 60 thumbnails.

Hope you like it! :)

edit: oops.. forgot to mention that it updates itself every 60 seconds, for the impatient one’s. But maybe that was implied when I mentioned "Feed Smusher AJAX" :P

[img]http://elundmark.se/flickr-live-feed/flickr-live-feed_screenshot-viewing.jpg[/img] [img]http://elundmark.se/flickr-live-feed/flickr-live-feed_screenshot.jpg[/img] [img]http://elundmark.se/flickr-live-feed/flickr-live-feed_screenshot-loading.jpg[/img]

[TheDoc]

This is very cool! I might just have to give this a shot with some different keywords when I get home.

[lookslikepat]

"TheDoc" wrote:

This is very cool! I might just have to give this a shot with some different keywords when I get home.

Thanks!
Glad you like it :D

[lookslikepat]

Somehow the zoom effect with FancyBox stopped working while I wasn’t looking.
I think it’s because I changed the pure <a><img /></a> to a text-link within a div with the thunbnail as it’s background. I guess the script doesn’t know where it’s coming from, and so doesn’t zoom properly. Plus you can’t close the open image by clicking outside the image, only by clicking the actual image.
I changed it because it rendered faster…

I’ll make some changes and edit the post when I get back from wöörk.

[Rob MacKay]

hehe very funkey :)

[Chris Coyier]

Fantastic work man, thanks for sharing! Always cool when folks zip up the code and give it away too, sharing is caring =)

[Soh Tanaka]

Looks awesome, I don’t have any complaints!

[tomwalters5678]

Wow! You obviously have some talent man! That is one nice webpage, only improvement is I suppose compatibility, but who cares, it looks good either way.

Keep up the good work!

[lookslikepat]

Big thanks for the kind words :)

I was supposed to fix the bugs I mentioned earlier, but time and focus hasn’t been my friend the last few days. I’ll make sure I get that fixed this weekend.

I have another site I’m working on that I’ll post here soon, this time a little more (non Safari) browser friendly…

[AshtonSanders]

Great work Pat, That looks fantastic. I really need to learn more about flicker and API’s in general. I just haven’t spent any time with them.

I guess I can thank the spammer for bringing this post to my attention… go figure…

[Author]

Posts