$j(document).ready(function() {
	if ($j('#thumbs img').length > 0) {
		$j('#thumbs img').each(function(i) {
			thumbs.arr.push($j(this).attr('id').replace('thumb_', ''));
			$j(this).click(function() {
				var id = $j(this).attr('id').replace('thumb_', '');
				thumbs.show(id);
				
				
				if (thumbs.interval != null) {
					clearInterval(thumbs.interval);
					thumbs.interval = null;
				}
			});
		});
		var first = $j('#thumbs img:first').attr('id').replace('thumb_', '');
		thumbs.current = first;
		thumbs.show(first);
		thumbs.showpage(0);
		thumbs.interval = setInterval(function() {
			var next = ++thumbs.index;
			if (next >= thumbs.arr.length) {
				next = thumbs.index = 0;
			}
			thumbs.show(thumbs.arr[next]);
		}, 5000);
	}
	
	if (thumbs.arr.length > 3) {
		$j('.thumbnav.l').click(function() {
			thumbs.showpage(thumbs.page-1);	
		});
		$j('.thumbnav.r').click(function() {
			thumbs.showpage(thumbs.page+1);	
		});
	}
});

var thumbs = {
	arr: [],
	index: 0,
	z: 3,
	page: 0,
	current: '',
	interval: null,
	show: function(name) {
		$j('#thumbs img').css('borderColor', 'transparent');
		$j('#thumb_'+name).css('borderColor', 'yellow');
		if (this.current == name) return;
		$j('#image_'+name).hide().css('zIndex', ++this.z).fadeIn();
		this.current = name;
		
	},
	showpage: function(id) {
		if (id < 0) return;
		if (id > (thumbs.arr.length / 3)-1) return;
		
		$j('.thumbs_holder').hide();
		var active = $j('.thumbs_holder:nth-child('+(id+1)+')').show();
		
		if (id == thumbs.page) return;
		thumbs.page = id;
		
		var name = active.children('img:first').attr('id').replace('thumb_', '');
		thumbs.show(name);
		
		if (id != 0) {
			if (thumbs.interval != null) {
				clearInterval(thumbs.interval);
				thumbs.interval = null;
			}
		}
	},
	next: function() {
		
	}
}