Feed Aggregator


/ Published in: JavaScript
Save to your folder(s)



Copy this code and paste it in your HTML
  1. jQuery(document).ready(function ($) {
  2. var rss = {
  3. opts: {
  4. api_key: 'ABQIAAAAgSDSZkmFmcfXVkedvQ1O4BQWxTxvm2SHpSfj9ig67_WVev8VKxTUB71M9UIuLpioGmFyK56GNCqnyQ',
  5. container: $('#rss'),
  6. duration: 600,
  7. height: 330,
  8. id: 'rssFeed_',
  9. isHidden: true,
  10. num: 7
  11. },
  12. feeds: [
  13. {"name": "CHIP Online", "href": "http://rss.chip.de/c/573/f/7440/index.rss", "feedClass": "grid_4 alpha"},
  14. {"name": "Engadget", "href": "http://www.engadget.com/rss.xml", 'feedClass': "grid_4 alpha omega"},
  15. {"name": "A1 Telekom", "href": "http://newsroom.a1telekom.at/feed/rss/", "feedClass": "grid_5 omega"}
  16. ],
  17. tpl: {
  18. container: "<div id=\"${feedId}\" class=\"feedContainer ${feedClass}\"><p class=\"feedHeader\">${feedName}&nbsp;&#8597;</p></div>",
  19. item: "<p class=\"feedItem hidden\"><a target=\"_blank\" href=\"${feedHref}\">${feedTitle}</a></p>",
  20. register: function () {
  21. $.template("myFeeds", this.container);
  22. $.template("myItems", this.item);
  23. }
  24. },
  25. init: function () {
  26. var iHeight, oHeight, border;
  27.  
  28. iHeight = $('footer').innerHeight();
  29. oHeight = $('footer').outerHeight();
  30. border = 2;
  31.  
  32. this.tpl.register();
  33.  
  34. this.aggregate();
  35.  
  36. $('.feedHeader').click(function () {
  37. if (rss.opts.isHidden === true)
  38. {
  39. $('#main').animate({'padding-bottom': rss.opts.height}, rss.opts.duration);
  40. $('footer').animate({'height': rss.opts.height - border, 'margin-top': - rss.opts.height}, rss.opts.duration);
  41.  
  42. $('.feedItem').removeClass('hidden');
  43.  
  44. setTimeout(function () {
  45. $(window).scrollTo('max', rss.opts.duration);
  46. }, rss.opts.duration);
  47. }
  48. else
  49. {
  50. $('#main').animate({'padding-bottom': oHeight}, rss.opts.duration);
  51. $('footer').animate({'height': iHeight, 'margin-top': - oHeight}, rss.opts.duration);
  52.  
  53. $('.feedItem').addClass('hidden');
  54. }
  55.  
  56. rss.opts.isHidden = ! rss.opts.isHidden;
  57. });
  58. },
  59. aggregate: function () {
  60. this.opts.container.html('');
  61.  
  62. $.each(this.feeds, function (i, e) {
  63. var data, entry, items, gurl, f;
  64.  
  65. data = {
  66. feedId: rss.opts.id + i,
  67. feedClass: e.feedClass,
  68. feedName: e.name
  69. };
  70.  
  71. $.tmpl("myFeeds", data).appendTo(rss.opts.container);
  72.  
  73. gurl = "http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&callback=?&q=" + e.href + "&num=" + rss.opts.num + "&key=" + rss.opts.api_key;
  74.  
  75. $.getJSON(gurl, function(feedData) {
  76. f = feedData.responseData.feed.entries;
  77.  
  78. if ( ! f)
  79. {
  80. return false;
  81. }
  82.  
  83. $.each(f, function (index, element) {
  84. items = {
  85. feedHref: element.link,
  86. feedTitle: element.title
  87. };
  88.  
  89. $.tmpl("myItems", items).appendTo('#' + data.feedId);
  90. });
  91. });
  92. });
  93. }
  94. };
  95.  
  96. rss.init();
  97. });

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.