(function($) {
	$(function() {
			$(".autoimagenavitop").viewer({
				speed: 2000,
				wait: 5000					
			});
		$(".autoimagenavitop").viewer();
	});
	$.fn.viewer = function(options) {
		var config = {
				speed: 2000,
				speed2: 0,
				wait: 5000
			};
		var mainnavi_top = this.find(".mainnavi_top li");
		var childimg_top = this.find(".childimg_top li");
		var mainnavi_top_btn = this.find(".mainnavi_top_btn li");  /* for linkBtn  */
		var mainnavi_top_btn2 = this.find(".mainnavi_top_btn2 li");  /* for linkBtn  */
		var i = 0;
		var timerId = 0;
		var changeImage = function(i) {
			childimg_top
				.find(".current").stop(true).fadeTo(config.speed, 0).end()
				.eq(i).find(".current").stop(true).fadeTo(config.speed, 1);
			mainnavi_top
				.filter(function(index) { return index != i; }).fadeOut(config.speed).end()
				.eq(i).fadeIn(config.speed, function(){
					i = i === mainnavi_top.length - 1 ? 0 : i + 1;
					clearTimeout(timerId);
					timerId = setTimeout(function(){
						changeImage(i);
					}, config.wait);
				});
			mainnavi_top_btn
				.filter(function(index) { return index != i; }).fadeOut(config.speed2).end()
				.eq(i).fadeIn(config.speed2, function(){
					clearTimeout(timerId);
					timerId = setTimeout(function(){
						changeImage(i);
					}, config.wait);
				});
			mainnavi_top_btn2
				.filter(function(index) { return index != i; }).fadeOut(config.speed2).end()
				.eq(i).fadeIn(config.speed2, function(){
					clearTimeout(timerId);
					timerId = setTimeout(function(){
						changeImage(i);
					}, config.wait);
				});
		};
		$.extend(config, options);
		childimg_top.each(function() {
			var $current = $("<div>", { "class": "current" });
			$(this).append($current);
		}).click(function() {
			clearTimeout(timerId);
			changeImage($(this).index());
		}).hover(function() {
			$("img", this).css("opacity", 1);
		}, function() {
			$("img", childimg_top).css("opacity", 0);
		});
		changeImage(i);
		return this;
	};

})(jQuery);

