// JavaScript Document
$(function() {
	//slide Course
	var divimage = $('div[class=oneimage]');
	divimage.hide();
	divimage.each(function(){
		var thisid = this.id;
		var thisid_ret = thisid.split("_");
		if(parseInt(thisid_ret[1])<5){
			$(this).show();
		}
	});	
	$('.next').click(function(){
									  
		var thefirst = $('div[class=oneimage]:visible:first'); 
		var thefirstid = thefirst.attr("id");
		var thefirstid_ret = thefirstid.split("_");
		var nextshow = parseInt(thefirstid_ret[1])+4;
		if(nextshow>numbercourse)
			return false;
		else{
			thefirst.animate({ width: 'hide', opacity: 'hide' }, 'slow'); 
			$('div[id=oneimage_'+nextshow+']').animate({ width: 'show', opacity: 'show' }, 'slow'); 
		}
	});		
	$('.prev').click(function(){
		var thefirst = $('div[class=oneimage]:visible:last'); 
		var thefirstid = thefirst.attr("id");
		var thefirstid_ret = thefirstid.split("_");
		var nextshow = parseInt(thefirstid_ret[1])-4;
		//alert(nextshow);
		if(nextshow<1)
			return false;
		else{
			thefirst.animate({ width: 'hide', opacity: 'hide' }, 'slow'); 
			$('div[id=oneimage_'+nextshow+']').animate({ width: 'show', opacity: 'show' }, 'slow'); 
		}
	});	
	$(".oneimage a").click(function() {
		
		var mainImage = $(this).attr("href"); //Find Image Name
		$("#main_view img").attr({ src: mainImage });
		return false;		
	});

	$(".oneimage a").hover(function() {
		var href =this.href;
		var returnhref = $(this).find('img').attr("src");
		
		$(this).css({'z-index' : '10'});
		$(this).parent().css({'z-index' : '10'});
		$(this).find('img').attr("src", href).addClass("hover").stop()
			.animate({
				marginTop: '-168px', 
				marginLeft: '-100px',
				width: '578px', 
				height: '438px' 
			}, 800);
		
		} , function() {
		$(this).css({'z-index' : '1'});
		$(this).parent().css({'z-index' : '1'});
		var returnhref = $(this).find('img').attr("alt");
		$(this).find('img').attr("src", returnhref).removeClass("hover").stop()
			.animate({
				marginTop: '0', 
				marginLeft: '0',
				top: '0', 
				left: '0', 
				width: '119px', 
				height: '90px'
			}, 800);
	});


});