var slider_active;
var slider_data = new Array();
var animation_running = false;
var slider_interval = false;
jQuery(document).ready(function(){
	
	jQuery("#slider_stage").append('<div id="slider_image"></div><div id="slider_bgimage"></div><div id="slider_nav"></div><div id="slider_categories"></div>');
	jQuery("#slider_image").append('<div id="slider_subimages"></div>');
	jQuery("#slider_categories").append('<div id="slider_category_1" class="slider_category" onclick="location.href=\'/shop/taschen\';"><div id="slider_category_text_1" class="slider_text">Taschen</div></div>');
	jQuery("#slider_categories").append('<div id="slider_category_2" class="slider_category" onclick="location.href=\'/shop/guertel\';"><div id="slider_category_text_2" class="slider_text">G&uuml;rtel</div></div>');
	jQuery("#slider_categories").append('<div id="slider_category_4" class="slider_category" onclick="location.href=\'/shop/lederaccessoires\';"><div id="slider_category_text_3" class="slider_text">Accessoires</div></div>');
	jQuery("#slider_categories").append('<div id="slider_category_3" class="slider_category" onclick="location.href=\'/shop/kleinleder\';"><div id="slider_category_text_4" class="slider_text">Geldbörsen</div></div>');
	jQuery("#slider_categories").append('<div id="slider_category_5" class="slider_category" onclick="location.href=\'/shop/schluesselanhaenger\';"><div id="slider_category_text_5" class="slider_text">Anh&auml;nger</div></div>');
	
	jQuery.ajax({
		url: "/oss/skin/xml/slider.xml",
		success: function(data){
			var count = 0;
	        jQuery(data).find('element').each(function(){
		        count = count + 1;
	        	var header = jQuery(this).find('attribute#header').text();
	        	var image = jQuery(this).find('attribute#image').text();
	        	var imagecaption = jQuery(this).find('attribute#imagecaption').text();
	        	var altText = jQuery(this).find('attribute#altText').text();
	        	var titleText = jQuery(this).find('attribute#titleText').text();
	        	var longdescURL = jQuery(this).find('attribute#longdescURL').text();
	        	var flexformFields = jQuery(this).find('attribute#flexformFields').text();
	        	var image2 = jQuery(this).find('attribute#image2').text();
	        	
	        	jQuery("#slider_image").append('<div class="slider_image" id="slider_image_' + count + '" style="display:none;background-image: url(' + image + ');" title="' + imagecaption + '"></div>');

	        	jQuery("#slider_subimages").append('<div id="slider_subimage_' + count + '" style="display:none;background-image: url(' + image2 + ');" onclick="location.href=\'' + longdescURL + '\';" class="slider_subimage"><div class="slider_subimage_text">' + header + '</div></div>');

				jQuery("#slider_nav").prepend('<div class="slider_nav_item" id="slider_nav_item_' + count + '" onclick="slider_change(' + count + ');"></div>');
	        	
				slider_data[count] = new Array();
				slider_data[count][1] = header;
				slider_data[count][2] = image;
				slider_data[count][3] = imagecaption;
				slider_data[count][4] = altText;
				slider_data[count][5] = titleText;
				slider_data[count][6] = longdescURL;
				slider_data[count][7] = flexformFields;
				slider_data[count][8] = image2;
				
				//var src = jQuery(this).find('src').text();
				//var link = jQuery(this).find('link').text();			
				//jQuery("#gallery1").append("<a href=\"" + link + "\"><img src=\"" + src + "\" alt=\"\" title=\"\" /></a>");
			});	
	        jQuery("#slider_image_1").show();
	        jQuery("#slider_subimage_1").show();
	        jQuery("#slider_nav_item_1").addClass('active');
			slider_active = 1;		
			slider_startinterval();	
		}
	});
});
function slider_startinterval() {
	if(slider_interval != false) {
		slider_next();
		clearInterval(slider_interval);
	}
	slider_interval = setInterval("slider_startinterval()", slider_data[slider_active][5]);
}
function slider_prev() {
	if(slider_active == 1) {
		prev = jQuery(".slider_image").size();
	}else{
		prev = slider_active - 1;
	}
	slider_change(prev);
}
function slider_next() {
	if(slider_active == jQuery(".slider_image").size()) {
		next = 1;
	}else{
		next = slider_active + 1;
	}
	slider_change(next);
}
function slider_change(to) {
	if(animation_running == false) {
		animation_running = true;
		var animation_image = true;
		var animation_text = true;
		jQuery("#slider_nav_item_" + slider_active).removeClass('active');
		
		jQuery("#slider_bgimage").css('background-image', jQuery("#slider_image_" + to).css("background-image"));
		
		jQuery("#slider_image_" + slider_active).fadeOut(2000, function() {
			jQuery("#slider_image_" + to).show();
			animation_image = true;
			if(animation_text == true) {
				animation_running = false;
			}				
		});	
		/*
		jQuery("#slider_subimage_" + slider_active).fadeOut("slow", function() {
			jQuery("#slider_subimage_" + to).fadeIn("slow", function() {
				animation_text = true;
				if(animation_image == true) {
					animation_running = false;
				}
			});
		});	
		*/
		jQuery("#slider_nav_item_" + to).addClass('active');
		slider_active = to;
	}		
}