JavaScript Feed Aggregator

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript Feed Aggregator相关的知识,希望对你有一定的参考价值。

jQuery(document).ready(function ($) {
	var rss = {
		opts: {
			api_key: 'ABQIAAAAgSDSZkmFmcfXVkedvQ1O4BQWxTxvm2SHpSfj9ig67_WVev8VKxTUB71M9UIuLpioGmFyK56GNCqnyQ',
			container: $('#rss'),
			duration: 600,
			height: 330,
			id: 'rssFeed_',
			isHidden: true,
			num: 7
		},
		feeds: [
			{"name": "CHIP Online", "href": "http://rss.chip.de/c/573/f/7440/index.rss", "feedClass": "grid_4 alpha"},
			{"name": "Engadget", "href": "http://www.engadget.com/rss.xml", 'feedClass': "grid_4 alpha omega"},
			{"name": "A1 Telekom", "href": "http://newsroom.a1telekom.at/feed/rss/", "feedClass": "grid_5 omega"}
		],
		tpl: {
			container: "<div id=\"${feedId}\" class=\"feedContainer ${feedClass}\"><p class=\"feedHeader\">${feedName} ↕</p></div>",
			item: "<p class=\"feedItem hidden\"><a target=\"_blank\" href=\"${feedHref}\">${feedTitle}</a></p>",
			register: function () {
				$.template("myFeeds", this.container);
				$.template("myItems", this.item);
			}
		},
		init: function () {
			var iHeight, oHeight, border;
			
			iHeight = $('footer').innerHeight();
			oHeight = $('footer').outerHeight();
			border = 2;
			
			this.tpl.register();
			
			this.aggregate();
			
			$('.feedHeader').click(function () {
				if (rss.opts.isHidden === true)
				{
					$('#main').animate({'padding-bottom': rss.opts.height}, rss.opts.duration);
					$('footer').animate({'height': rss.opts.height - border, 'margin-top': - rss.opts.height}, rss.opts.duration);
					
					$('.feedItem').removeClass('hidden');
					
					setTimeout(function () {
						$(window).scrollTo('max', rss.opts.duration);
					}, rss.opts.duration);
				}
				else
				{
					$('#main').animate({'padding-bottom': oHeight}, rss.opts.duration);
					$('footer').animate({'height': iHeight, 'margin-top': - oHeight}, rss.opts.duration);
					
					$('.feedItem').addClass('hidden');
				}
				
				rss.opts.isHidden = ! rss.opts.isHidden;
			});
		},
		aggregate: function () {
			this.opts.container.html('');
			
			$.each(this.feeds, function (i, e) {
				var data, entry, items, gurl, f;
				
				data = {
					feedId: rss.opts.id + i,
					feedClass: e.feedClass,
					feedName: e.name
				};
				
				$.tmpl("myFeeds", data).appendTo(rss.opts.container);
				
				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;
				
				$.getJSON(gurl, function(feedData) {
					f = feedData.responseData.feed.entries;
					
					if ( ! f)
					{
						return false;
					}
					
					$.each(f, function (index, element) {
						items = {
							feedHref: element.link,
							feedTitle: element.title
						};
						
						$.tmpl("myItems", items).appendTo('#' + data.feedId);
					});
				});
			});
		}
	};
	
	rss.init();
});

以上是关于JavaScript Feed Aggregator的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript Feed Aggregator

JavaScript JS:解析RSS Feed

javascript Google Analytics RSS Feed跟踪

JavaScript 使用json / jquery获取twitter feed

JavaScript 使用ajax / jquery解析wordpress RSS feed

html 使用JavaScript和FB.UI Feed对话框向帖子添加操作链接。