var SS = new Object();
var i = 0;
var thumbArray = new Array();
var fullArray = new Array();
//Slideshow animation
var fadeid;
var current = 1;
var last = 4;
var thisItem = 1

//Select the directory by ID and list each Directory in it
function _ajaxBuildSlideshow(config) {
	innerHTML = [];
	$.ajax({
		async: false,
	    type: "GET",
	    url: "/ohcms/cores/files/xml.php?method=listDirectory&path=" + config.path,
	    dataType: "xml",
		success: function(xml) {
			$(xml).find('File').each(function(){
					SS.Id = $(this).attr('Id');
					SS.name = $(this).attr('Name');
					SS.thumb = $(this).find('Small').text();
					SS.embed = $(this).find('Embed').text();
					//Create Array of Thumbs
					thumbArray.push('<li val="'+thisItem+'"><a onclick="runStage(' + thisItem + ');" id="featureitem' + thisItem + '"><img src="' + SS.embed + '" width="100" height="75" alt="" /></a></li>');
					
					//Create Array of Normal sizes
					fullArray.push('<div id="b' + thisItem + '" class="panel"><a href="#" title=""><img src="' + SS.embed + '" width="445" class="clip-full" alt="" title="" /></a><span><p><strong>'+SS.Id+'</strong></p></span></div>');
					thisItem++
			});
			
			for (i=0;i<config.limit;i++) {
				$("#feature-list").append(thumbArray[i]);
				$("#feature-main").append(fullArray[i]);
			}
			

			
			},
			complete: function() {
				$('#b1').fadeIn(); 
				$('#b2').fadeOut(); //$('#featureitem2').fadeTo(0,0.7);
				$('#b3').fadeOut(); //$('#featureitem3').fadeTo(0,0.7);
				$('#b4').fadeOut(); //$('#featureitem4').fadeTo(0,0.7);
				fadeid = setInterval("loopfade()", 5000);
			}
	
	});
}

function runStage(id) {
	if(current == id) {
		$('#featureitem'+id).unbind('click');
		clearInterval(fadeid);
		return false;
	} else {
		fadeStage(id);
		clearInterval(fadeid);
		current = id;
		GTPItem(id);
		fadeid = setInterval("loopfade()", 5000);
		}
}

function fadeStage(id) {
	//fade all panels
	for (a=1;a<=4;a++) {
		$('#b'+a).hide();
	}
	
	//show current panel
	$('#b'+id).show();
	//$('#b'+id).animate({ opacity: 1 }, 0);
	
	//fade all each time
	for (i=1;i<=4;i++) {
		//$('#featureitem'+i).animate({ opacity: 0.7 }, 150);
	}
	
	//fade in side item
	//$('#featureitem'+id).animate({ opacity: 1 }, 150);
}

function GTPItem(id) {

    if(id == 1) {
        topmar = '0px';
    }
    if(id == 2) {
        topmar = '83px';
    }
    if(id == 3) {
        topmar = '167px';
    }
    if(id == 4) {
        topmar = '250px';
    }

    $('#feature-hover').animate({"marginTop": topmar}, "normal");
   
}


function loopfade() {

	if (current == 4) {
		current = 1;
		last = 4;
	} else {
		last = current;
		current++;
	}
	
	fadeStage(current);
	GTPItem(current);
	
}