// creates container
document.write('\
		<div id="widget-container" style="display:none">\
			<div id="widget-title-wrap">\
				<div id="widget-news-title"><h3>Soompi News</h3></div>\
				<div id="widget-contents-title"><h3>Elsewhere on Soompi</h3></div>\
				<div id="widget-buy-title"><h3>Featured Album</h3></div>\
			</div>\
			<div id="widget-wrap">\
				<div id="widget-news" class="widget-box"><div id="widget-news-image"></div><ul></ul></div>\
				<div id="widget-contents" class="widget-box"><div id="widget-contents-body"><ul id="widget-videos"></ul><ul id="widget-images"></ul></div><div id="widget-fanclub"></div></div>\
				<div id="widget-buy" class="widget-box"><div id="widget-buy-image"></div><div id="widget-buy-label"></div></div>\
			</div>\
		</div>\
');

var WidgetItemHandler = {
	imageItemError : function(image, itemName) {
                return false;
		//var item = $(image).parentsUntil(".widget-item").parent(); // can over jquery 1.4
		var item = jQuery(image).parent().parent();
		if(item.hasClass("widget-item-first")) {
			item.next(".widget-item-" + itemName).addClass('widget-item-first');
		}
		WidgetRenderer._counts[itemName]--;
		item.remove();			
		//jQuery(".widget-item-" + itemName + ":hidden:first").show();
	}
}

var WidgetRenderer = {
		_isAddedRecentItems : false,
		_html : {image : '', video : '', news : '', fanclub: null},
		_counts : {image : 0, video : 0, news : 0},
		_adsItems : [
			 {title : "Wonder Girls: Black Eyes", image : "http://soompi_images.s3.amazonaws.com/661ca855f8c6a8987888d58265dd26fa_small.jpg", link : "http://bit.ly/twnjZ3"},
			 {title : "Troublemaker: Troublemaker", image : "http://soompi_images.s3.amazonaws.com/eeb2ef7081560cdde58459473296255f_small.jpg", link : "http://bit.ly/sgNL1T"},
			 {title : "T-ara: Cry Cry", image : "http://soompi_images.s3.amazonaws.com/570cd22d3c543002c4ffd7a2ce00b35c_small.jpg", link : "http://bit.ly/urlY0M"},
			 {title : "IU: Last Fantasy", image : "http://soompi_images.s3.amazonaws.com/755a7b0673421fc7ee51e283be23f9e5_small.jpg", link : "http://bit.ly/tTckSV "},					 
			 {title : "2NE1 1st Live Concert: Nolza", image : "http://soompi_images.s3.amazonaws.com/57e62ed15f55061726f04ca2e0bdb4a3_small.jpg", link : "http://bit.ly/ttijzf"},
			 {title : "SNSD Vol. 3 (Mr. Taxi Ver.)", image : "http://soompi_images.s3.amazonaws.com/cb1ef2a9544b54026d95367848756f7b_small.jpg", link : "http://bit.ly/sQp1Zq"}
					],
		_render : function(res) {
			
			jQuery(res.responseData.feed.entries).each(function(index) {
				// getting attributes
				var attrs = {link : "", content: "", author: "", categories: "", pubdate: "", title: "", media: ""};
				for(attr in attrs) {
					if(attr == 'media') {
						if(this.mediaGroups) {
							attrs.media = this.mediaGroups[0].contents[0].url;
						} else {
							attrs.media = jQuery(res.responseData.xmlString).find("enclosure:eq(" + (index) + ")").attr("url");
						}
					} else {
						attrs[attr] = this[attr];
					}
				}

				var extra = "";
				// render a item
				switch (attrs.categories[0]) {
				case 'image':
					WidgetRenderer._counts.image++;
					if(WidgetRenderer._counts.image == 1) {
						extra = ' widget-item-first';
					} else if(WidgetRenderer._counts.image > 5) {
						//extra = ' widget-item-hidden';
					}
					WidgetRenderer._html.image += '<li class="widget-item widget-item-image' + extra + '"><a href="' + attrs.link + '" title="' + attrs.title + '"><img src="' + attrs.media.replace("_small.", "_tiny.") + '" alt="' + attrs.title + '" onerror="WidgetItemHandler.imageItemError(this,\'image\')"/></a></li>';
					break;

				case 'video':
					WidgetRenderer._counts.video++;
					if(WidgetRenderer._counts.video == 1) {
						extra = ' widget-item-first';
					} else if(WidgetRenderer._counts.video > 4) {
						//extra = ' widget-item-hidden';
					}
					WidgetRenderer._html.video += '<li class="widget-item widget-item-video' + extra + '"><a href="' + attrs.link + '" title="' + attrs.title + '"><img src="' + attrs.media + '" alt="' + attrs.title + '" onerror="WidgetItemHandler.imageItemError(this,\'video\')"/></a></li>';
					break;

				case 'news':
					WidgetRenderer._counts.news++;
					
					if(WidgetRenderer._counts.news < 6) {
						if(!jQuery("#widget-news-image").html() && attrs.media.indexOf("/static/images/default/content/small.png") == -1) {
							jQuery("#widget-news-image").html('<a href="' + attrs.link + '" title="' + attrs.title + '"><img src="' + attrs.media + '" alt="' + attrs.title + '"/></a>');
						}
						
						WidgetRenderer._html.news += '<li class="widget-item widget-item-news' + extra + '"><p><a href="' + attrs.link + '" title="' + attrs.title + '">' + (attrs.title.length > 32 ? attrs.title.substring(0, 29) + "..." : attrs.title) + '</a></p></li>';
					}
					break;
				case 'fanclub':
					if(!WidgetRenderer._html.fanclub) {
						WidgetRenderer._html.fanclub = '<a class="button" href="' + attrs.link + '" title="' + attrs.content + '">Join Our ' + attrs.title + ' Fan Club!</a>';
					}
					break;			
				}
			});
			jQuery("#widget-news ul").html(WidgetRenderer._html.news);
			jQuery("#widget-videos").html(WidgetRenderer._html.video);
			jQuery("#widget-images").html(WidgetRenderer._html.image);
			jQuery("#widget-fanclub").html(WidgetRenderer._html.fanclub ? WidgetRenderer._html.fanclub : '<a class="button" href="http://www.soompi.com/fanclubs">Check Out Our Fan Clubs!</a>');
			if(!WidgetRenderer._isAddedRecentItems && (!jQuery("#widget-news-image").html() || WidgetRenderer._counts.news < 5 || WidgetRenderer._counts.video < 4 || WidgetRenderer._counts.image < 5)) {
				WidgetRenderer.renderRecentItems();
			}
			jQuery("#widget-container").show();
		},
		renderTaggedItems : function() {
			// loads rss
			jQuery.ajax({
					url: 'http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&output=json_xml&num=100&callback=?&q=' + encodeURI('http://www.soompi.com/rss/contents/tagged/' + encodeURI(document.title)),
					success:  WidgetRenderer._render,
					error : WidgetRenderer.renderRecentItems,
					dataType: 'jsonp'
			});
		},
		renderRecentItems : function() {
			// loads rss
			WidgetRenderer._isAddedRecentItems = true;
			jQuery.ajax({
				url: 'http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&output=json_xml&num=100&callback=?&q=' + encodeURI('http://feeds.feedburner.com/soompi-contents'), 
				success : WidgetRenderer._render,
				dataType: 'jsonp'
			});
		},
		renderAds : function() {
			var item = WidgetRenderer._adsItems[Math.floor(Math.random()* WidgetRenderer._adsItems.length)];
			jQuery("#widget-buy-image").html('<div class="album-cover"><a href="' + item.link + '" target="_blank" title="' + item.title + '"><img src="' + item.image + '" alt="' + item.title + '"/></a></div>');
			jQuery("#widget-buy-label").html('<a href="' + item.link + '" target="_blank" title="' + item.title + '"><p>' + item.title + '</p></a>');
		},
		init : function() {
			WidgetRenderer.renderTaggedItems();
			WidgetRenderer.renderAds();			
		}
}
WidgetRenderer.init();
//css
jQuery('<style>\
#widget-container {height:215px;overflow:hidden;width:100%;}\
#widget-container a:hover {color:#006A8F;}\
#widget-title-wrap {clear:both;background-color: #223d5a;-moz-border-radius: 5px 5px 0 0;-webkit-border-top-left-radius: 5px;-webkit-border-top-right-radius: 5px;padding:0;margin:0;overflow: hidden;}\
#widget-wrap {clear:both;background-color:#E4E6E9;border-style: solid;border-color: #DDDDDD;border-width: 0 1px 1px 1px;height:170px;}\
#widget-title-wrap h3 {color: #FFF; text-align:center;}\
#widget-container .widget-box {background-color:#fff;height:168px;border-right:1px solid #DDDDDD;padding-top:2px;}\
#widget-container p {display: inline;font-size:13px;font-weight:bold;}\
#widget-container h3 {margin: 0;padding:0; font-size:13px;font-weight:bold;padding:6px 0;}\
#widget-container a {color:black;text-decoration:none;}\
#widget-container ul {padding:0;margin:0;list-style: none;}\
#widget-container #widget-news, #widget-container #widget-news-title {float: left; width: 40%;overflow:hidden;}\
#widget-container #widget-news ul {margin-top:10px;}\
#widget-container #widget-news li {vertical-align : middle;line-height:2;}\
#widget-container #widget-news .widget-item {white-space: nowrap;}\
#widget-container #widget-news-image {float:left;width:150px;background-color:white;margin:5px 10px 5px 5px;height:150px;}\
#widget-container #widget-contents, #widget-container #widget-contents-title {float: left; width: 40%;overflow:hidden;}\
#widget-container #widget-contents #widget-contents-body {clear:both; text-align: center;}\
#widget-container #widget-contents #widget-images, #widget-container #widget-contents #widget-videos {display:inline-block;width:80%;height:50px;overflow:hidden;margin: 5px 0;}\
#widget-container #widget-contents .widget-item {overflow:hidden;display:inline-block;display:-moz-inline-stack;*display: inline;}\
#widget-container #widget-contents .widget-item-first {margin-left: 0;}\
#widget-container #widget-contents .widget-item-video {margin: 0 12px;width: 68px; height:50px;}\
#widget-container #widget-contents .widget-item-video img {width: 68px; height:50px;}\
#widget-container #widget-contents .widget-item-image {margin: 0 10px; width: 50px; height:50px;}\
#widget-container #widget-contents .widget-item-image img {width: 50px; height:50px;}\
#widget-container #widget-contents .widget-item-hidden {display: none;}\
#widget-container #widget-contents #widget-fanclub {text-align:center;margin: 6px 0;}\
#widget-container #widget-contents #widget-fanclub a {width:80%; background-color: #eee;color:#fff;font-weight:bold;display:inline-block;padding:5px;text-decoration: blink;}\
#widget-container #widget-buy {float: left; width: 19%;background-color:#E4E6E9;text-align: center; border-right:0;}\
#widget-container #widget-buy #widget-buy-image {display:inline-block;padding: 3px;border: 1px solid #DDD;background-color: #FFF; margin-top:10px;}\
#widget-container #widget-buy #widget-buy-image .album-cover {max-height:120px; max-width:120px; overflow:hidden;}\
#widget-container #widget-buy #widget-buy-label {padding:9px 0;}\
#widget-container .widget-item-first img {width:120px;}\
</style>').appendTo("head");