Admitted I know next to nothing about scripting, but after a straight
24hrs of sitting at my desk at work pounding my head against my array
of four 24" monitors (yeah that's 8' worth of screens) on my monster
dual quad-core xeon workstation, blah, blah, blah....I finally figured
out how to change whole 10 lines of javascript! I think I'll go to
disney land now.
Anyhow here it is, how to flix the Google Feeds Slideshow API
(gfslideshow.js) to work with Flickr RSS2 feeds so that you can get
any of the available thumbnails instead of the stupid 16x16 thumbnail
that for whatever reason above my head the API gets by default.
Here are the various thumbnail/images that are available, notice that
in order to get the original file you'll have to use an alternate
method which I'll post at the end.
Possible Sizes:
_s = 75x75 square
_t = 100 wide
_m = 240 wide
_d = 500 wide
_b = 1024 wide
_o = original file *must be coded differently
###Assumptions
1) you have already downloaded the GFSlideShow.js
2) you have already attempted to setup this feed in your site and
have working slideshow just with the small thumbnails problem
remaining.
###References
Google Code Play Ground:
http://code.google.com/apis/ajax/playground/#slideshow_of_photo_feed
Google SlideShow Reference:
http://www.google.com/uds/solutions/slideshow/reference.html
Flickr Misc URLs Reference:
http://www.flickr.com/services/api/misc.urls.html
With all that said, open your local copy of the gfslideshow.js and
make the following changes and additions:
(1 - changes)
Find the line:
thumbnailUrlResolver : null,
Change it to:
thumbnailUrlResolver : GetURLFullSize,
(2 - additions)
Scroll down to then end of the "GFslideShow.prototype.parseOptions"
function you just altered in step 1, find the close bracket that will
look like like }; located at the end of that function on line by
iteself (line #151 in my editor). In the blank lines BETWEEN that
close bracket and the comments for the next function insert the
following code:
/**
*
* Flickr thumbnail fixer
*/
function GetURLFullSize(entry)
{
var content = entry.content;
var start = content.indexOf("<img src=")+10;
var stop = content.indexOf(".jpg",start)+4;
var thumburl = content.substring(start,stop);
thumburl=thumburl.replace("_m","_d");
return(thumburl);
}
That's it, you just did in 5 minutes what took me litterally 24hrs
without sleep and only one meal to teach myself. Now here's how to
customize your thumbnail size:
On the line:
thumburl=thumburl.replace("_m","_d");
Change the _d with one of the other thumbnail sizes that are
available, execpt for _o.
Of course there are other options like scaleImages that you might want
to play with and you can learn about them in the Google reference
links.
Okay now for the last part, how to get the orginal file (that's if you
could come up a reason to even want to display images that large in an
simple slideshow like this, I suppose there are a few good image
toolkits out there that you could add cool effects like reflections
with and whatnot, but why? before you answer that was a rhetorical
question lol) Ready for the hardpart? Now forget everything I just
told you from above, and make these changes:
(1)
I'll say again, Remove any modifications from the first process above.
(2)
Change this line:
GFslideShow.MRSS_THUMBNAIL_TAG = "thumbnail";
To:
GFslideShow.MRSS_THUMBNAIL_TAG = "content";
Take a deep break and your done.
V/R
Chris LaRue
caveats: I did not directly invent this process. I pulled from several
similar examples I was able to find online. None of which matched
perfectly with what I was trying to do, so from those examples I came
up with this. If it wasn't for building upon other peoples work I'd
still be sucking my thumb looking at this foreign code. I'm by no
means an expert at this so if you ask me complicated questions I'm
just going to look at you funny then go get a bear.
--
You received this message because you are subscribed to the Google Groups
"Google AJAX APIs" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-ajax-search-api?hl=en.
