jQuery.noConflict();
jQuery(document).ready(function($) {

	

	$("#da-vinci-carousel").CloudCarousel( { 
		reflHeight: 45,
		reflGap:2,
		titleBox: $('#da-vinci-title'),
		altBox: $('#da-vinci-title'),
		buttonLeft: $('#but1'),
		buttonRight: $('#but2'),
		yRadius:70,
		xPos: 456,
		yPos: 50,
		bringToFront:true,
		autoRotate: 'left',
		autoRotateDelay: 2000,
		speed:0.2,
		mouseWheel:true
	});
	
	$('#nav > ul > li > a').click(function(){
		var subnav = $(this).parent().find('div.subnav');
		
		if(subnav.length > 0){
			
			var others = $('#nav > ul > li.open').not($(this).parent());
			if(others.length > 0){
				others
					.removeClass('open')
					.find('div.subnav').slideUp();
			}
			
			if($(this).parent().hasClass('section')){
				$('#nav > ul > li.open')
					.removeClass('open')
					.find('div.subnav').slideUp();
			}else{
				subnav.slideToggle();
				$(this).parent().toggleClass('open');
			}
			
			if($('#nav > ul > li.open').length > 0){
				$('#nav > ul > li.section').addClass('section-behind');
			}else{
				$('#nav > ul > li.section').removeClass('sectionc-behind');
			}
			
			return false;
		}
	});	

	var BottomBanner = function(){
		
		var _baseElm;
		
		var _itemMax;
		var _itemTotal;
		var _itemWidht;
		var _wrapperWidth;
		
		var self = {
			init : function(max,width,selector){
				_baseElm = $(selector);
				_itemMax = max;
				_itemWidth = width;
				_itemTotal = $('li',_baseElm).length;
				_wrapperWidth = _itemWidth * _itemTotal;
				
				// cek sisa
				var sisa = 0;
				if((_itemTotal%_itemMax) > 0){
					sisa = _itemWidth * (_itemMax - (_itemTotal%_itemMax));
				}
				
				self.createNav();
				
				$('ul',_baseElm)
					.width(_wrapperWidth)
					.css({
							'position':'absolute',
							'top':'1px',
							'left':0
						 })
					.data('containerWidth',_itemWidth*_itemMax)
					.data('sisa',sisa);;
			},
			createNav: function(){
				// generate nav
				var templateNav = '<a href="#" class="active">1</a>';
				var paging = Math.ceil(_itemTotal/_itemMax);
				for(var i=2;i<paging+1;i++){
					templateNav += '<a href="#">'+i+'</a>';
				}
				$('.banner-header span',_baseElm).html(templateNav);
				
				// setup nav event
				$('.banner-header span a',_baseElm).bind('click',self.handleNavClick);
			},
			handleNavClick:function(){
				var clickedPaging = $(this).html();
				var ul = $(this).parents('.banner-header').siblings('.banner-content').find('ul');
				
				$(this).siblings().removeClass('active');
				$(this).addClass('active');
				
				var newLeft = (clickedPaging - 1) * Number(ul.data('containerWidth'));
				
				if(Number(clickedPaging) == Number($(this).siblings().length + 1)){
					newLeft = newLeft - Number(ul.data('sisa'));
				}
				
				
				ul.animate({
					left: '-'+newLeft+'px'
				},1000);
				
				return false;
			}
		};
		return self;
	}();
	
	BottomBanner.init(2,152,'.banner-left');
	BottomBanner.init(3,202,'.banner-right');
});