/***********************************************************
* [xmlSlide make with jQuery]
*			   since = {
*				   date	: "2008-09-11",
*				   author  : "akato",
*				   contact : "akato@vitalify.jp"
*			   };
*			   lastmodified = {
*				   date	: "2009-02-26",
*				   author  : "akato",
*				   contact : "akato@vitalify.jp"
*			   };
***********************************************************/
(function() {
	jQuery.fn.xmlSlide = function(config){
		//default
		config = jQuery.extend({
			xml: "./api/data.xml",
			before: '<<',
			after: '>>',
			boxWidth: 190,
			boxHeight: 250,
			speed: 20,
			basemover: 25
		},config);

		var target = this;
		var animating;
		var xmlNodeNum;
		var totalListWidth;
		
		//DOM cached
		var $target = $(this);
		var $xmlSlideNavBefore;
		var $xmlSlideNavAfter;
		var $xmlSlideBody;

		var xmlNodeCount = function(xml) {
			var i = 0;
			$(xml).find("work").each(function() {
				i++;
			});
			return i;
		};
		var xmlSetStyle = function() {
			$target
				.css("width",config.boxWidth+"px")
				.css("position","relative")
				.css("overflow","hidden");
			
			$("div#xmlSlideBox")
				.css("position","relative")
				.css("top","22px")
				.css("left","0")
				.css("height",config.boxHeight+"px")
				.css("width","100%");

			$xmlSlideBody
				.attr("class","clearfix")
				.css("width",totalListWidth+"px")
				.css("position","absolute")
				.css("top","0")
				.css("left","0px");
			$("ul#xmlSlideBody li")
				.css("width",config.boxWidth+"px")
				.css("float","left");
			
			$("div#xmlSlideNav p")
				.css("cursor","pointer");
		};
		var animationStop = function() {
			$xmlSlideNavBefore.attr("rel","stopped");
			$xmlSlideNavAfter.attr("rel","stopped");
			clearInterval(animating);
		}
		var xmlAnimation = function(flag) {
			var moveFar = $xmlSlideBody.css("left").replace(/px|pt|%/,"")-0;
			var nextStop;
			var maxLeft = config.boxWidth-totalListWidth;
			if(flag === "before") nextStop = moveFar+config.boxWidth;
			else nextStop = moveFar-config.boxWidth;
			//animation loops
			animating = setInterval(function(){
				//stopping rules
				if(flag === "before" && moveFar >= 0) {//start point
					$xmlSlideBody.css("left",0);
					animationStop();
					hideArrow("prev");
					return;
				}else if(flag === "after" && moveFar <= maxLeft){//end point
					$xmlSlideBody.css("left",maxLeft);
					animationStop();
					hideArrow("next");
					return;
				}else if(flag === "before" && moveFar >= nextStop) {//next entry
					$xmlSlideBody.css("left",nextStop);
					animationStop();
					return;
				}else if(flag === "after" && moveFar <= nextStop) {//previous entry
					$xmlSlideBody.css("left",nextStop);
					animationStop();
					return;
				}
				//move
				if(flag === "before") {
					moveFar = moveFar+config.basemover;
				}else {
					moveFar = moveFar-config.basemover;
				}
				$xmlSlideBody.css("left",moveFar+"px");
			},config.speed);
		};
		var hideArrow = function(whitch) {
			if(whitch === "reset") {
				$xmlSlideNavBefore.show();
				$xmlSlideNavAfter.show();
			}else if(whitch === "prev") {
				$xmlSlideNavBefore.hide();
			}else if(whitch === "next") {
				$xmlSlideNavAfter.hide();
			}else if(whitch === "all") {
				$xmlSlideNavBefore.hide();
				$xmlSlideNavAfter.hide();
			}else {
				return false;
			}
			return true;
		};
		var xmlHandlr = function() {
			$xmlSlideNavBefore.click(function() {
				if($xmlSlideNavBefore.attr("rel")=="moving"||
					$xmlSlideNavAfter.attr("rel")=="moving")
						return;
				$xmlSlideNavBefore.attr("rel","moving");
				xmlAnimation("before");
					hideArrow("reset");
			});
			$xmlSlideNavAfter.click(function() {
				if($xmlSlideNavBefore.attr("rel")=="moving"||
					$xmlSlideNavAfter.attr("rel")=="moving")
						return;
				$xmlSlideNavAfter.attr("rel","moving");
				xmlAnimation("after");
					hideArrow("reset");
			});
		};
		var xmlNavigationWrite = function() {
			var tmplBefore = '<p id="xmlSlideNavBefore">'+config.before+'</p>';
			var tmplAfter  = '<p id="xmlSlideNavAfter">'+config.after+'</p>';
			$("div#xmlSlide").append('<div id="xmlSlideNav" class="clearfix"></div>');
			$("div#xmlSlideNav")
				.html(tmplBefore)
				.append(tmplAfter);
			$xmlSlideNavBefore = $("#xmlSlideNavBefore");
			$xmlSlideNavAfter = $("#xmlSlideNavAfter");
			return;
		};
		var xmlContentWrite = function(xml) {
			target.html('<div id="xmlSlideBox"></div>');
			$("div#xmlSlideBox").html('<ul id="xmlSlideBody"></ul>');
			xmlNavigationWrite();
			
			var title;
			var image;
			var comment;
			var permalink;
			var publishTag;
			var linkHead;
			
			$(xml).find("work").each(function(i) {
				linkHead = '<a href="'+$(this).find("permalink").text()+'">';
				if(i === 0) {
					title = '<div class="text">\n<h4>'+linkHead+$(this).find("title").text()+'</a><img src="/shared/images/icon_new.gif" alt="NEW" height="10" width="25" /></h4>\n';
				}else {
					title = '<div class="text">\n<h4>'+linkHead+$(this).find("title").text()+'</a></h4>\n';
				}
				image	 = '<p>'+linkHead+'<img src="'+$(this).find("thumb").text()+'" width="189" height="133" /></a></p>\n';//size
				comment   = '<p>'+$(this).find("body").text()+'</p>\n';
				permalink = '<p class="tar">'+linkHead+'詳細を見る&gt;&gt;</a></p>\n</div>\n';
				
				publishTag = '<li id="xmlSlideEntry_'+i+'" rel="'+i+'">'+image+title+comment+permalink+'</li>\n';
				$xmlSlideBody = $("#xmlSlideBody");
				$xmlSlideBody.append(publishTag);
			});
			xmlSetStyle();
			xmlHandlr();
			hideArrow("prev");
			return;
		};
		$.ajax({
			'type': "GET",
			'url': config.xml,
			'dataType': 'xml',
			'success': function(xml) {
				xmlNodeNum = xmlNodeCount(xml);
				totalListWidth = config.boxWidth * xmlNodeNum;
				xmlContentWrite(xml);
			},
			'error': function(message,status) {
				target.html("xml unload");
				return false;
			}
		});
	};
})(jQuery);