/**
 * @author David Siegfried, Creature Works Labs
 */

var changeTime;
var flag;


(function($){
	$.fn.simpleSlide = function(options){
	var itemIndex = 0;	
		
		var defaults = {
	 		//for plugin use
		};
			
		var options = $.extend(defaults, options);
		
		var numberOfItems = 0;
		
        function parseXml(xml) {  
            if (jQuery.browser.msie) {  
                var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");  
                xmlDoc.loadXML(xml);  
                xml = xmlDoc;  
            }
            return xml;  
        }  
        
		return this.each(function(){
			$.ajax({
				type: "GET",
				url: "./products-EN.xml",
				dataType: ($.browser.msie) ? "text" : "xml" ,
				success: function(oldXml){
					var xml = parseXml(oldXml);
			
					//find the total number of products
					var totalItems = 0;
					$(xml).find('product').each(function(){
						totalItems++;
					});
					
					//place them on the page
					var slideLength = 40;
					var slidePosition = (40 - 4*167);
					
					for(var i = -4; i < 9; i++){
						var image = $(xml).find('product:eq(' + ((i<0)?totalItems-Math.abs(i%totalItems):Math.abs(i%totalItems)) + ')').attr('image');
						var linkLoc = $(xml).find('product:eq(' + ((i<0)?totalItems-Math.abs(i%totalItems):Math.abs(i%totalItems)) + ')').attr('linkLoc');
						var name = $(xml).find('product:eq(' + ((i<0)?totalItems-Math.abs(i%totalItems):Math.abs(i%totalItems)) + ')').attr('name');
						$('.slide').append('<li><a href="'+ linkLoc +'"><img src="' + image + '" width="150" height="150" /></a><p>'+ name +'</p></li>');
						slideLength = slideLength + (150 + 15);
					}
					//x-length of the slider
					$('ul.slide').css({"width" : slideLength})
					$('ul.slide').css({"left" : slidePosition})
					
					//styles set via xml
						//background
					var backgroundColor = $(xml).find('background').attr('color');
					$('.simpleSlide').css({"background-color" : backgroundColor});
						//imagebox
					var hoverColor = $(xml).find('imagebox').attr('hovercolor');
					$('.slide li').css({"background-color" : hoverColor});
					var hoverOpacity = $(xml).find('imagebox').attr('opacity');
					var borderColor = $(xml).find('imagebox').attr('bordercolor');
					$('.slide li').css({"border-color" : borderColor});
					var borderHover = $(xml).find('imagebox').attr('borderhover');
						//textbox
					var fontColor = $(xml).find('textbox').attr('fontcolor');
					var textBackground = $(xml).find('textbox').attr('backgroundcolor');
					$('.slide li p').css({"color" : fontColor});
					
						//motion
					var scrollSpeed = parseInt($(xml).find('motion').attr('speed'));
					var timerDelay = parseInt($(xml).find('motion').attr('delay')) + 1000;
					
					//left and right arrows
					var right = $(xml).find('arrows').attr('right');
					var rightHover = $(xml).find('arrows').attr('righthover');
					var left = $(xml).find('arrows').attr('left');
					var leftHover = $(xml).find('arrows').attr('lefthover');
					
					//buttons created here
					$('.simpleSlide').prepend('<div class="left"><div class="controlPlacer"><a href="#"><img src="' + left + '" width="12" height="23" /></a></div></div>');
					$('.left a').hover(function(){
						$(this).children().attr({'src' : leftHover});
					},function(){
						$(this).children().attr({'src' : left});
					});
					$('.simpleSlide').append('<div class="right"><div class="controlPlacer"><a href="#"><img src="' + right + '" width="12" height="23" /></a></div></div>');
					$('.right a').hover(function(){
						$(this).children().attr({'src' : rightHover});
					},function(){
						$(this).children().attr({'src' : right});
					});
					$('.left').add('.right').css({"background-color" : backgroundColor});
					
					
					//controls the scrolling
					var xPos = (40 - 4*167);
					
					$('.right a').click( function(){
						//disable button
						$('.simpleSlide').append('<div class="imageCoverRight"></div>');
						
						$('.slide').animate({'left' : (slidePosition - 4 * 167)}, scrollSpeed, function(){	
							itemIndex += 4;
							for(var i = 0; i < 4; i++){
								var image = $(xml).find('product:eq(' + ((itemIndex+5+i<0)?totalItems-Math.abs((itemIndex+6+i)%totalItems)-1:Math.abs((itemIndex+5+i)%totalItems)) + ')').attr('image');
								var linkLoc = $(xml).find('product:eq(' + ((itemIndex+5+i<0)?totalItems-Math.abs((itemIndex+6+i)%totalItems)-1:Math.abs((itemIndex+5+i)%totalItems)) + ')').attr('linkLoc');
								var name = $(xml).find('product:eq(' + ((itemIndex+5+i<0)?totalItems-Math.abs((itemIndex+6+i)%totalItems)-1:Math.abs((itemIndex+5+i)%totalItems)) + ')').attr('name');
								$('.slide').append('<li><a href="'+ linkLoc +'"><img src="' + image + '" width="150" height="150" /></a><p>'+ name +'</p></li>');
								$('.slide li:nth-child(1)').remove();
							}
							$('ul.slide').css({"left" : slidePosition});
							$('.slide li p').css({"color" : fontColor});
							$('.slide li').css({"border-color" : borderColor, 'background-color' : textBackground});			
							
							//image hover
							$('.slide li a').hover(function(){
								$(this).animate({opacity : hoverOpacity}, 200).stop(true,true);
								$(this).parent().css({'border-color' : borderHover});
								flag = 1;
							}, function(){
								$(this).animate({opacity : '1'}, 200).stop(true,true);
								$(this).parent().css({'border-color' : borderColor})
								flag = 0;
							});
									
							$('.simpleSlide .imageCoverRight').remove();
						});
						return false;
					});
					$('.left a').click( function(){
						
						$('.simpleSlide').append('<div class="imageCoverLeft"></div>');
						
						$('.slide').animate({'left' : (slidePosition + 4 * 167)}, scrollSpeed, function(){
							itemIndex -= 4;
							for(var i = 0; i < 4; i++){
								var image = $(xml).find('product:eq(' + ((itemIndex-i-1<0)?totalItems-Math.abs((itemIndex-i)%totalItems)-1:Math.abs((itemIndex-1-i)%totalItems)) + ')').attr('image');
								var linkLoc = $(xml).find('product:eq(' + ((itemIndex-i-1<0)?totalItems-Math.abs((itemIndex-i)%totalItems)-1:Math.abs((itemIndex-1-i)%totalItems)) + ')').attr('linkLoc');
								var name = $(xml).find('product:eq(' + ((itemIndex-i-1<0)?totalItems-Math.abs((itemIndex-i)%totalItems)-1:Math.abs((itemIndex-1-i)%totalItems)) + ')').attr('name');
								$('.slide').prepend('<li><a href="'+ linkLoc +'"><img src="' + image + '" width="150" height="150" /></a><p>'+ name +'</p></li>');
								$('.slide li:last-child').remove();
							}
							$('ul.slide').css({"left" : slidePosition});
							$('.slide li p').css({"color" : fontColor});
							$('.slide li').css({"border-color" : borderColor, 'background-color' : textBackground});
							
							//image hover
							$('.slide li a').hover(function(){
								$(this).animate({opacity : hoverOpacity}, 200).stop(true,true);
								$(this).parent().css({'border-color' : borderHover})
								flag = 1;
							}, function(){
								$(this).animate({opacity : '1'}, 200).stop(true,true);
								$(this).parent().css({'border-color' : borderColor})
								flag = 0;
							});
							$('.simpleSlide .imageCoverLeft').remove();
						});
						return false;
					});
					
					//this section controls the timer
					flag = 0;
					timer();
					function timer(){
						setInterval('changeTime()', timerDelay);
					}
					changeTime = function(){
						if (flag == 0){
							$('.right a').click();
						}
					};
					//stop timer by clicking on a label
					$('.slide li a').hover(function(){
						$(this).animate({opacity : hoverOpacity}, 200).stop(true,true);
						$(this).parent().css({'border-color' : borderHover})
						flag = 1;
					}, function(){
						$(this).animate({opacity : '1'}, 200).stop(true,true);
						$(this).parent().css({'border-color' : borderColor})
						flag = 0;
					});
					//stop timer after clicking arrow	
					$('.right').add('.left').mousedown(function(){
						flag = 1;
					});
				}
			});
		});
	};
})(jQuery);