var project;
if (!project) {
	project = {}
}
$.extend(project, {
	VERSION: 'Release 0.1',
	SPEED: 800,
	
    // called onload
    init: function(){
		var sliderLarge = $('.slider-large'),
			sliderSmall = $('.slider-small')
			
		project.setSliderWidth(sliderLarge)
		project.setSliderWidth(sliderSmall)
		
		project.setSliderControls(sliderSmall, sliderLarge)
    },
    setSliderWidth: function(slider){
    	var w = 0
    		ul = slider.find('ul')
    	ul.find('img').each(function(){
    		w += $(this).width()
		})
		ul.css({width: w})
    },
    setSliderControls: function(sliderSmall, sliderLarge){
    	var buttonPrev = sliderSmall.find('.prev'),
    		buttonNext = sliderSmall.find('.next'),
    		position = 0,
    		sliderSmall = sliderSmall.find('.slider'),
    		sliderLarge = sliderLarge.find('.slider'),
			smallImagesWidths = project.collectWidths(sliderSmall),
			largeImagesWidths = project.collectWidths(sliderLarge),
			factor = (largeImagesWidths[position] / smallImagesWidths[position]) * 0.3
		
		sliderSmall.find('li').each(function(i){
			var ul = $(this).parents('ul'),
				li = $(this)
				
			li.click(function(){
				sliderLarge.scrollTo( 'li:eq('+i+')', project.SPEED )
				position = i
			})
			li.hover(function(){
				li.addClass('hover')
				li.siblings().stop().animate({
					opacity: 0.6
				}, 200);

			}, function(){
				li.removeClass('hover')
				li.siblings().stop().animate({
					opacity: 1
				}, 200);
			})
		})
			
    	buttonPrev.click(function(){
    		rotateR()
    	})
    	buttonNext.click(function(){
    		rotateF()
    	})
    	
    	sliderSmall.bind('mousewheel', function(event, delta){
			if (delta > 0) {
				rotateF()
			}
			else {
				rotateR()
			}
			return false
		})
		
		function rotateF(){
    		var maxpositionSmall = project.calculateMaxPosition(position, smallImagesWidths)
    		var maxpositionLarge = project.calculateMaxPosition(position, largeImagesWidths)
    		
    		if(maxpositionLarge < sliderSmall.find('img').size()){
    			position++
    			sliderLarge.stop().scrollTo( 'li:eq('+position+')', project.SPEED )
    		}
    		if(maxpositionSmall - 1 < sliderSmall.find('img').size()){
    			sliderSmall.stop().scrollTo( 'li:eq('+position+')', project.SPEED*factor )
    		}
    	}
    	
    	function rotateR(){
    		if(position>0){
    			position--
    			sliderLarge.stop().scrollTo( 'li:eq('+position+')', project.SPEED )
    			sliderSmall.stop().scrollTo( 'li:eq('+position+')', project.SPEED*factor )
    		}
    	}
    },
    collectWidths: function(slider){
    	var widths = []
    	slider.find('img').each(function(){
    		widths.push($(this).width())
    	})
    	return widths
    },
    calculateMaxPosition: function(position, widths){
    	var maxwidth = 0;
    	for(i=position; i<widths.length; i++){
    		maxwidth += widths[position]
    		if(maxwidth>=830){
    			return i
    		}
    	}
    	return i
    }
})
$(project.init)
