$(document).ready(function() {		

	$('#ja_header_jsfade').before('<div id="nav" style="top: 560px;"><span id="resumeButton">Play</span> | <span id="pauseButton">Pause</span>').cycle({ 

		speed:  2000, 

		timeout: 8500,

		slideHeight: 360

	});

	

	var beingShown = false;

    var shown = false;

	/* Tai danh sach anh nho*/

    ipro_preload_slideshow_homepage () ;

	$('#slideshow').hover(

		function () {

			if (beingShown || shown) {

				return;

			} else {

				beingShown = true;

				$('#nav').animate({ 

					top: "330px",

					opacity: 1

				}, 800, null, function(){

					beingShown = false;

	          		shown = true;

				}); 

			}

		},

		function () { 

			if(!beingShown){

				$('#nav').animate({ 

					top: "490px"

				}, 500, null, function(){

					shown = false;

				});

			}

		}

	);

	

	$('#pauseButton').click(function() { 

		$('#ja_header_jsfade').cycle('pause'); 

	});

	$('#resumeButton').click(function() { 

		$('#ja_header_jsfade').cycle('resume'); 

	});

	

	$("#nav").ready(function() {

		changeStyleHover("#resumeButton", "yellowText");

		changeStyleHover("#pauseButton", "yellowText");	

		ipro_preload_slideshow_homepage();

	});

});

function ipro_preload_slideshow_homepage() {

	$("#slide_show_hidden > input").each(function () {

		var img_link = $(this).attr("value");	

		var img_onclick = $(this).attr("link_img");	

		var img_value = $(this).attr("id");

		$("#ja_header_jsfade").append("<img src="+img_link+" id='"+img_value+"' style='cursor:pointer' title='xem ảnh' onclick='window.open(\""+img_onclick+"\", \"_self\");'/>");

	});

	$('#ja_header_jsfade').cycle({ 

		speed:  2000, 

		timeout: 8500,

		slideHeight: 360,

		pager:  '#nav' ,

		pagerAnchorBuilder: function(idx, slide) {

			return '<span class="SSsmallImg"><a href="#"><img src="' + slide.id + '" width="50" height="50" /></a></span>'; 

		}

	});

}