var Media = {
	group : null,
	groupContainer : null,
	btnPrev : null,
	btnNext : null,
	totalPage : null,
	currentIndex : 0,
	
	init : function() {
		 $(function () {
			Media._init();
		});
    },
	
	_init : function () {
		Media.group = $(".multiplePage .groupContainer .group");
		Media.groupContainer = $(".multiplePage .groupContainer");
		
		if ($(".multiplePage .prev a") != null) {
			Media.btnPrev = $(".multiplePage a.prev");
			Media.btnPrev.css({opacity: 0.2});
		}
		
		if ($(".multiplePage .next a") != null) {
			Media.btnNext = $(".multiplePage a.next");
			if(Media.group.size() < 2) {
				Media.btnNext.css({opacity: 0.2});
			}
		}
		
		if (!Media.group || !Media.groupContainer || !Media.btnPrev || !Media.btnNext) return;
		
		Media.totalPage = Media.group.size();
		Media.groupContainer.css("width",432 * Media.totalPage);
		
		Media.btnPrev.attr('rel','prev');
		Media.btnPrev.click(Media.onImageMoveClick);
		Media.btnNext.attr('rel','next');
		Media.btnNext.click(Media.onImageMoveClick);
	},
	
	onImageMoveClick : function(event) {
		event.preventDefault();
		
		var nextIndex;
		var position;
		
		if ($(this).attr('rel') == 'next')
			Media.currentIndex = (Media.currentIndex + 1 > Media.totalPage - 1)?0:Media.currentIndex + 1;
		else
			Media.currentIndex = (Media.currentIndex - 1 < 0)?0:Media.currentIndex - 1;
		
		var start = (8 * Media.currentIndex) + 1;
		var end = start + $(Media.group[Media.currentIndex]).children(".mediaBox").size() - 1;
		$('#itemCount').html(start + ' - ' + end);
		
		if ($(this).attr('rel') == 'next') {
			
			Media.btnPrev.css({opacity: 1});
			
			if(Media.currentIndex == Media.totalPage - 1) {
				Media.btnNext.css({opacity: 0.2});
			}
			
			position = (-1 * 432 * Media.currentIndex);
			
			Media.groupContainer.animate({marginLeft: position}, 1500 );
			
		} else {
			
			Media.btnNext.css({opacity: 1});
			
			if(Media.currentIndex == 0) {
				Media.btnPrev.css({opacity: 0.2});
			}
			
			position = -1 * 432 * Media.currentIndex;
			
			Media.groupContainer.animate({marginLeft: position}, 1500 );
			
		}
		return false;
	}
}

Media.init();