$j = jQuery;

var CompareList = {
	cookieName : 'Town[ClipList]',
	cookieOptions : {path:'/',expires:7},
	jumpTarget : '#compareList',
	imageList : {"\/img\/black-skyblue\/ico-favorite.gif":"\/img\/black-skyblue\/ico-favorite_on.gif","\/img\/black-skyblue\/btn-favorite.gif":"\/img\/black-skyblue\/btn-favorite_on.gif"},

	initialize :function(){
		var listCookie = $j.cookie(this.cookieName);
		var list = (listCookie) ? listCookie.split('_') : [];
		var l = list.length;
		for(var i=0; i<l; i++){
			this.clipped(list[i]);
		}
		if(listCookie) $j.cookie(this.cookieName, listCookie, this.cookieOptions);
		this.refresh(listCookie);
	},

	refresh : function(listCookie){
		listCookie = listCookie || $j.cookie(this.cookieName);
		if(listCookie){
			$j('#compareList').load('/clips/view/'+listCookie);
		}
	},

	add : function(self, id){
		$j(self).effect('transfer', { to:this.jumpTarget, className: 'ui-effects-transfer' });
		this.clipped(id);

		var listCookie = $j.cookie(this.cookieName);
		var list = (listCookie) ? listCookie.split('_') : [];

		if($j.inArray(id, list)==-1) list.push(id);
		listCookie = list.join('_');

		$j.cookie(this.cookieName, listCookie, this.cookieOptions);
		this.refresh(listCookie);

		$j.get("/clips/logging/"+id);
	},

	clipped : function(id){
		$j('.btnCompareClip'+id).each(function(i, el){
			el = $j(el);
			el.attr('onclick', '')
			var img = $j("img", el);
			img.attr("src", CompareList.imageList[img.attr("src")])
				.attr("alt", "")
				.attr("title", "")
				.css("cursor", "default");
		});
	},

	del : function(id){
		var listCookie = $j.cookie(this.cookieName);
		if(listCookie){
			var list = listCookie.split('_');
			var newList = [];
			var l = list.length;
			for(var i=0; i<l; i++){
				if(list[i]!=id) newList.push(list[i]);
			}
			$j.cookie(this.cookieName, newList.join('_'), this.cookieOptions);
		}

		$j("#clipBox"+id).fadeOut(400, function(){$j("#clipBox"+id).remove();});
	}

}

$j(function(){CompareList.initialize()});