$(function(){
	var topBanner = {};				
	    topBanner = {
	 		container : $('#bannerSlideContainer'), 
	 		selected : null,
	      	
	    	// size increment
	    	maxWidth : 555,
	    	maxHeight : 355,
	    	
	    	numOfItems : 0,
	    	
	    	// current item
	    	previousRel : 0,
	    	currentRel : 1,
	    	isAnimating : false,
	    	// shape
	    	circleHeight : 25,
	    	
	    	/* timeout */
	    	t: null,
	    	intervalTime : 5000,
	    	 
			init : function(){
				var that = this;
				this.selected = $('div.selected',this.container);
				this.numOfItem = this.container.children('.banner-item').length;
				
				this.event();
				that.t = setInterval(function(){that.nextNavigate();},that.intervalTime);
			},
			scaleIn : function(elem,callback){
				var that = this;
				var viewPort = $('.banner-viewport',elem);
				viewPort.stop().delay(0).animate({
					height : this.maxHeight+'px',
					width : this.maxWidth+'px'
				},{
					step : function(now,fx){
						// 300 is right position
						var shift = 300 - now/2 ;
						viewPort.css('right',shift+'px');
					},
					duration : 900,
					easing : 'easeInOutBack'
				});
				// 300 - 584/2		
				/* viewPort.css('right','8px');	 */
			},
			scaleOut : function(elem,callback){
				var that = this;
				var viewPort = $('.banner-viewport',elem);
				viewPort.stop().animate({
					height : '1px',
					width : '1px',
					right : '+='+this.maxWidth/2+'px'
				},1000,'easeOutBack');	
			},
			//animate command center
			animate : function(nextItem){
				var that = this;
				this.isAnimating = true;
				//animation combo 
				this.scaleOut(this.selected);
				$('.banner-viewport',nextItem).css('top',0);
				// slideUp
				nextItem.css('z-index',999).show('slide',{ 
					direction: "down",
					easing:"easeOutQuart" ,
					duration : 650,
					complete : function(){
						nextItem.css('z-index',1);
						that.update(nextItem);		
					}
				});
				setTimeout(function(){
					// arrow update
					$('#navigation li.currentNavItem').removeClass('b'+that.previousRel);
					$('#navigation li.currentNavItem').addClass('b'+that.currentRel);
				},540);
				this.scaleIn(nextItem);
			},
			navigate : function(rel){
				var that = this;
				if (rel <= 0 || rel > this.numOfItem) return;
				if (this.currentRel == rel) return;
				else { 
					this.previousRel = this.currentRel;
					this.currentRel = rel;
					var nextItem = that.container.children('.banner-item:nth-child('+ this.currentRel +')');
					// NB >_<
					$('#bannerDots a.selected').removeClass('selected');
					$('#bannerDots a[rel='+this.currentRel+']').addClass('selected');
					
					this.animate(nextItem);
				}		
			},
			// callback when animation is finished
			update : function(newItem){
				// hide the current item
				this.selected.removeClass('selected').hide();
				newItem.addClass('selected');
				this.selected = newItem;
				
				this.isAnimating = false;
			},
			
			nextNavigate : function(){
				var rel = this.currentRel;
				if(rel >= 3)rel = 1;
				else rel++;
				this.navigate(rel);
				
			},
			
			event : function(){
				var that = this;
				
				if (!is_ie6()) {
					$('.banner-item a').bind('mouseenter', function() {
						$('p.clearfix img', $(this).parent()).attr('src', '/img/homepage-spl-btn-white.png');
					});
					$('.banner-item a').bind('mouseleave', function() {
						$('p.clearfix img', $(this).parent()).attr('src', '/img/homepage-spl-btn-black.png');
					});	
				}
				
				$('#bannerDots a').bind('click',function(){
					if(that.isAnimating) return;
					clearInterval(that.t);
					that.navigate($(this).attr('rel'),true);
					
					//continue the autoplay

					that.t = setInterval(function(){that.nextNavigate();},that.intervalTime);
					
					return false;
				});
							
				$('#bannerButtons a').bind('click',function(){
				
					if(that.isAnimating) return;
					
					clearInterval(that.t);
					
					if ($(this).is('#bannerPrev')) {
						that.navigate(parseInt(that.currentRel) - 1);
					}
					else {
						that.navigate(parseInt(that.currentRel) + 1);
					}
					
					//continue the autoplay
					that.t = setInterval(function(){that.nextNavigate();},that.intervalTime);
					
					return false;
				});
			}	
		}
		topBanner.init();
});