jQuery(function(){
	// 给 li 添加 hover 样式 (ie）
	if(jQuery('#epg_wrapper').length < 1){
		return
	}
	
	addHoverForIE(jQuery('#epg_channel_nav li').add('#epg_timeline li'));
	
	function addHoverForIE(els){
		if(jQuery.browser.msie && els.hover){
				els.hover(function(){ 
						jQuery(this).addClass("hover");
					},
					function(){
						jQuery(this).removeClass("hover");
					}
				);
		}
	}
	
	// 频道选择栏 滚动
	var channelNavWrapper= jQuery('#epg_channel_nav_list > ul');
	// 频道按钮
	var channelNavBtns= channelNavWrapper.children('li'),
		channelNavBtnNum= channelNavBtns.length;
	
	var totalNavBarMoveTime= channelNavBtns.length* 200;//每个频道按钮滚动 0.2 s 。 1 s 能滚动 5 个
	var lastChannelNavBtn= channelNavBtns[channelNavBtns.length- 1];
	var channelNavBarWidth= lastChannelNavBtn.offsetLeft+ lastChannelNavBtn.offsetWidth;
	var displayAreaWidth= channelNavWrapper.parent()[0].offsetWidth;
	//var minChannelNavBarLeft= channelNavWrapper.parentNode.offsetWidth- channelNavBarWidth -5;
	//console.log(minChannelNavBarLeft);
	function getMinChannelNavBarLeft(){
		return (displayAreaWidth - (lastChannelNavBtn.offsetLeft + lastChannelNavBtn.offsetWidth) - 5);
	}
	function isChannelNavBtnAllVisible(btn){//btn 是 elm
		var elLeft= Math.abs(parseInt(channelNavWrapper.css('left')) || 0);
		var btnLeft= btn.offsetLeft,
			btnRight= btnLeft + btn.offsetWidth;
		return ((btnLeft >= elLeft) && (btnRight <= (displayAreaWidth + elLeft)));
	}
	function getFirstAllVisibleBtnIndex(){
		var btn;
		for(var i= 0; i < channelNavBtnNum; i++){
			btn= channelNavBtns[i];
			if(isChannelNavBtnAllVisible(btn)){
				return i;
			}
		}
		return -1;
	}
	function getLastAllVisibleBtnIndex(){
		var btn;
		for(var i= getFirstAllVisibleBtnIndex(); i < channelNavBtnNum; i++){
			btn= channelNavBtns[i];
			if(!isChannelNavBtnAllVisible(btn)){
				return (i - 1);
			}
		}
		return -1;
	}
	var channelNavBarMoveSpeed= totalNavBarMoveTime/getMinChannelNavBarLeft();// 单位 ms/px
	var channelNavBarMoveDuration= 1200;//Math.abs(channelNavBarMoveSpeed * displayAreaWidth);
	
	// 翻页按钮
	var channelNavTurnBtns= jQuery('#epg_channel_nav > button');
	
	function getPositionLeftByBtnIndex(i){
		return channelNavBtns[i].offsetLeft;
	}
	
    function scrollNavBtnVisible(navBtnIndex){
        //channelNavBtns.get(navBtnIndex)
        var btn = channelNavBtns[navBtnIndex];
        if(isChannelNavBtnAllVisible(btn)){
            return;
        }
        var tl = -(btn.offsetLeft + btn.offsetWidth - displayAreaWidth + 5);
        channelNavWrapper.css("left", tl);
        (tl < 0) && (channelNavTurnBtns[0].className = 'prev');
        (tl <= getMinChannelNavBarLeft()) && (channelNavTurnBtns[1].className = 'next_dis');
    }
    
	function channelNavTurnBtnPrevClick(){
		var elLeft= parseInt(channelNavWrapper.css('left')) || 0;
		if(elLeft < 0){
			channelNavWrapper.stop();
			var btn= channelNavBtns[getFirstAllVisibleBtnIndex()];
			var tl = displayAreaWidth - (btn.offsetLeft + btn.offsetWidth);
			(tl > 0) && (tl = 0);
			var duration= Math.abs(Math.round((tl - elLeft) * channelNavBarMoveSpeed));
			channelNavWrapper
					.animate({left: tl},
							 {"duration": channelNavBarMoveDuration,
							 "easing": "easeIn",
							 'complete': function(){
							 	if((parseInt(channelNavWrapper.css('left')) || 0) >= 0){
									channelNavTurnBtns[0].className='prev_dis';
								}
							}});
			channelNavTurnBtns[1].className='next';
		}
	}
	function channelNavTurnBtnNextClick(){
		var elLeft= parseInt(channelNavWrapper.css('left')) || 0;
		var minLeft = getMinChannelNavBarLeft();
		if(elLeft > minLeft){
			channelNavWrapper.stop();
			var tl= -(channelNavBtns[getLastAllVisibleBtnIndex()].offsetLeft);
			var duration= Math.abs(Math.round((tl - elLeft) * channelNavBarMoveSpeed));
			channelNavWrapper
					.animate({left: tl}, 
							 {"duration": channelNavBarMoveDuration,
							 "easing": "easeIn",
							 'complete': function(){
							 	if((parseInt(channelNavWrapper.css('left')) || 0) <= minLeft){
									channelNavTurnBtns[1].className='next_dis';
								}
							}});
			channelNavTurnBtns[0].className='prev';
		}
	}
	jQuery(channelNavTurnBtns[0]).click(channelNavTurnBtnPrevClick);
	jQuery(channelNavTurnBtns[1]).click(channelNavTurnBtnNextClick);
	
	function loadData(url, onComplete){
		jQuery.get(url, _onload);
		elLoading.css('display', '');
		function _onload(data){
			showsWrapper.html(data);
			elLoading.css('display', 'none');
			addHoverForIE(showsWrapper.find('ol > li'));
			if(onComplete && (typeof(onComplete) === 'function')){
				onComplete(data);
			}
		}
	}
	
	// 频道选择 事件
	function channelNavBtnClick(ev){
		if((ev.target.tagName.toLowerCase() != 'img') && (ev.target.tagName.toLowerCase() != 'li')){return}
		var _i= parseInt(this.i) || 0;
		channelNavBtns.each(function(i, btn){
								if(parseInt(btn.i) == _i){
									var b= jQuery(btn);
									b.addClass('cur');
									var img= b.children('img')[0];
									img.src= img.src.replace('/logo/cctv_', '/logo/cur/cctv_');
								}else{
									var b= jQuery(btn);
									b.removeClass('cur');
									var img= b.children('img')[0];
									img.src= img.src.replace('/logo/cur/cctv_', '/logo/cctv_');
								}
							});
		loadData(this.title, onDataLoad);
		
		function onDataLoad(data){
			hlShowToTime(new Date());
		}
	}
	
	function hlCurHourShow(){
		hlShowToTime(new Date(), true);
	}
	// 把时间表（滚动）显示到给定的时间段 date
	function scrollShowToTime(date){
		var hour= date.getHours();
		if(hour < 6){
			moveTimelineTo(0);
		}else if(hour < 12){
			moveTimelineTo(1);
		}else if(hour < 18){
			moveTimelineTo(2);
		}else{
			moveTimelineTo(3);
		}
	}
	// 给下面的 3 个按钮调用的。
	window.viewEpgToday= function(){
		moveTimelineTo(0);
	};
	window.viewEpgNow= function(){
		scrollShowToTime(new Date());
	};
	window.viewEpgTonight= function(){
		moveTimelineTo(3);
	};
	window.viewEpgToAm= function(){
		moveTimelineTo(1);
	};
	window.viewEpgToFm= function(){
		moveTimelineTo(2);
	};
	// 高亮时间表里面某一列，由 date 的 hour 决定。第二个参数如果为 true，则滚动到那一类所在的时间段
	function hlShowToTime(date, scrollTo){
		try{
			var hour= date.getHours();
			jQuery(showsWrapper.children('li')[hour]).addClass('cur_hour');
			if(scrollTo){
				scrollShowToTime(date)
			}
		}catch(ex){
			//console.trace()
			//console.log(ex);
		}
	}
	
	// 节目时间滚动 事件
	var showsWrapper= jQuery('#epg_shows_wrapper > ul');
	var elLoading= jQuery('#epg_shows_wrapper > div.loading');
	elLoading.css('display', 'none');
	
	channelNavBtns.each(function(i, btn){
							btn.i= i;
							if(btn.className.indexOf('cur') != -1){
								var img= jQuery(btn).children('img')[0];
								img.src= img.src.replace('/logo/cctv_', '/logo/cur/cctv_');
								scrollNavBtnVisible(i);
                                loadData( btn.title,
										  function(){
												showWidth= showsWrapper.children('li')[0].offsetWidth;
												showPageWidth= showWidth* 6;
												showMoveSpeed= 300/showWidth;
												hlShowToTime(new Date(), true);
											});
							}
							jQuery(btn).click(channelNavBtnClick);
						});
	var showWidth,
		showPageWidth,
		showMoveSpeed;
	
	
	var timeBtns= jQuery('#epg_timeline > ul > li');
	
	// 滚动时间表到第 _i 个时间段（共 4 个时间段）
	function moveTimelineTo(_i){
		timeBtns.each(function(j, btn){
									 if(parseInt(btn.i) == _i){
										 jQuery(btn).addClass('cur');
									 }else{
										 jQuery(btn).removeClass('cur');
									 }
								 });
		showsWrapper.stop();
		var targetLeft= -(_i* showPageWidth);
		var duration= 1200;//Math.abs(parseInt(el.css('left'))- targetLeft)* showMoveSpeed;
		showsWrapper.animate({left: (''+ targetLeft+ 'px')}, 
							 {'duration': duration, 'easing': 'easeIn'});
	}
	
	function timeBtnClick(){
		// 避免重复点击
		if(this.className.indexOf('cur') != -1){
		 return;
		}
		var _i= parseInt(this.i) || 0;
		moveTimelineTo(_i);
	}
	timeBtns.each(function(i, btn){
									btn.i= i;
									jQuery(btn).click(timeBtnClick);
								});
});