/*--------------------------------------------------------------------------*
 *  image preload 
 *--------------------------------------------------------------------------*/
$(function() {
	$("img[src*='_off']").each(function(){
		this.offSrc = this.src;
		this.onSrc = this.offSrc.replace("_off.", "_on.");
		preloadImage(this.onSrc);
	});
});
preloadImages = [];
function preloadImage(url){
	var p = preloadImages;
	var l = p.length;
	p[l] = new Image();
	p[l].src = url;
};


/*--------------------------------------------------------------------------*
 *  roll over  
 *--------------------------------------------------------------------------*/
$(document).ready(function() {
  $("img[src*='_on']").addClass("current");
  $("img, input").not("#controls img").mouseover(function() {
    if ($(this).attr("src")) {
      $(this).attr("src",$(this).attr("src").replace("_off.", "_on."));
    }
  });
  $("img[class!='current'], input").not("#controls img").mouseout(function() {
    if ($(this).attr("src")) {
      $(this).attr("src",$(this).attr("src").replace("_on.", "_off."));
    }
  });
});


/*--------------------------------------------------------------------------*
 *  slideshow  
 *--------------------------------------------------------------------------*/

$(document).ready(function() {
	
	if(0 < $('#slideshow').size()){

		// var
		var $slides = $('#slides');
		var $slide = $slides.find('li');
		var $controls = $('#controls');
		var $control = $controls.find('li');
		var $controlList = $controls.find('ul');;
		var controlWidth = $control.first().width();
		var controlsWidth = 750;
		var length = $control.size();
		var index = 0;

		// function
		function selectImg() {
			$control
				.not(':eq(' + index + ')').find('img').each(function(){
					$(this).attr('src', $(this).attr('src').replace('_on.', '_off.'));
				});
			$control
				.eq(index).find('img').attr('src', $control.eq(index).find('img').attr('src').replace('_off.', '_on.'));
			$slide
				.eq(index).fadeIn(300).end()
				.not(':eq(' + index + ')').fadeOut(300);
		}

		// default setting
		if (length < 6) {
			controlsWidth = (controlWidth + 8) * length;
			$controlList.css({
				marginLeft: ((770 - controlsWidth) / 2) - 8
			});
		}
		selectImg();

		/* CarouFredSel */
		$controlList.carouFredSel({
			width: controlsWidth,
			items: {
				minimum: 1,
				visible: "variable"
			},
			scroll: {
				pauseOnHover: false,
				items: 1,
				onAfter: function() {
					if (index >= (length - 1)) {
						index = index - length;
					}
					index = index + 1;
					selectImg();
				}
			},
			auto: {
				play: true,
				pauseDuration: 3000,
				duration: 600
			}
		});

		// event
		$control.hover(
			function(){
				index = $control.index(this);
				selectImg();
				$controlList.trigger('pause');
			},
			function() {
				$controlList.trigger('resume');
			}
		);
		$slide.hover(
			function(){
				$controlList.trigger('pause');
			},
			function() {
				$controlList.trigger('resume');
			}
		);
	
	}
});

