Excellent Mike. I've started using it in my application as a feed reader, was very easy to implement with a backend for defining feeds, I just loop them out and include the JS :)
Tane On 4/20/07, Mike Alsup <[EMAIL PROTECTED]> wrote:
> To view the api example, you can open the file from the browser (no need to > have a API key and put it on a server). Also, If someone has the time, a > cool plugin idea is an RSS viewer. Here's a quick and dirty plugin to convert anchors into feed divs. Modify it to suit your needs: (function($) { $.fn.toFeed = function(options) { return this.each(function() { var opts = jQuery.extend({ url: this.href, max: 5 }, options || {}); var $this = $(this); var feed = new google.feeds.Feed(opts.url); feed.load(function(result) { if (!result.error) { var max = Math.min(result.feed.entries.length, opts.max); var f = $('<div class="feed"></div>'); f.append('<h1 class="feed">'+result.feed.title+'</h1>'); for (var i = 0; i < max; i++) { var entry = result.feed.entries[i]; var title = entry.title; var snip = entry.contentSnippet; var link = entry.link; var date = entry.publishedDate; f.append('<h2 class="feeditem"><a href="'+link+'">'+title+'</a></h2>') .append('<div class="feeddate">'+date+'</div>') .append('<div class="feedsnip">'+snip+'</div> '); } $this.after(f).remove(); } }); }); }; })(jQuery); Here's a page that uses the above plugin: <html><head> <style type="text/css"> #main { width: 300px } body { font-family: 'trebuchet ms'; color: #555; font-size: small; } div.feed { margin: 20px; padding: 20px; border: 1px dashed #ddd; background: #ffd } div.feeddate { font-size: smaller; color: #aaa } h1.feed { font-size: large; padding: 5px; margin: 2px 0; text-align: center } h2.feeditem { font-size: medium; padding: 0; margin: 2px 0 } </style> <script type="text/javascript" src="../rel/jquery-1.1.2.js"></script> <script type="text/javascript" src="feed-from-above.js"></script> <script type="text/javascript" src="http://www.google.com/jsapi?key=[your key]"></script> <script type="text/javascript"> google.load("feeds", "1"); $(function() { $('a.feed').toFeed(); }); </script> </head> <body><div id="main"> <a class="feed" href="http://jquery.com/blog/feed/">jQuery</a> <a class="feed" href="http://feeds.feedburner.com/JohnResig">Resig</a> <a class="feed" href="http://www.learningjquery.com/feed/">Learning jQuery</a> </div></body> </html>