$(function() {


    var EPGREF = ".EPG";
    var DATESCROLLBUTTONSREF = ".EPGDates .scroller";
    var DATESCROLLER = ".dateScroller";
    var PROGRAMSREF = ".EPGPrograms";
    var PREVIOUSWEEKSAVAILABLE = 4;
    var DATESSCROLLACTIONWIDTH = "364";
    var PROGRAMSCROLLBUTTONSREF = PROGRAMSREF+" .scroller";
    var PROGRAMSCROLLERREF = ".EPGMainView";
    var EPGTIMESREF = ".EPGTimes";
    var LOADERREF = PROGRAMSREF+" .loading";
    var PROGRAMSCROLLWIDTH = "255";
    var LISTVIEWTOGGLEREF = ".toggleViews";
    var LISTVIEWCLASS = "EPGList";
    var TEASERVIEWCLASS = "EPGTeaser";
    var SELECTEDTIMEREF = "selected";
    var DESELECTEDTIMEREF = "deselected";
    
    
    var iLastElementHiddenOnLeft = null;
    
    var init = function() {
        if($(".EPG").length > 0)
        {
        
            	setUpDateScroller();
            	setUpProgramScroller();

           	$(DATESCROLLER+ " a").click(dayChangeController);
           	$(EPGTIMESREF+" a").click(timesChangeController);
           	
           	$(PROGRAMSCROLLBUTTONSREF).bind("scroller.checkScrollButtonState", changeCurrentTimeController);
           	$(LISTVIEWTOGGLEREF).click(toggleListView);
           
           	$(EPGREF).bind("epgView.changeDays", updateDayHighlight);
          	$(EPGREF).bind("epgView.changeDays", showProgramLoader);
           
           	$(EPGREF).bind("epgView.updateTime", updateTimeHighlight);
           	$(EPGREF).bind("epgView.updateTime", scrollProgramsToCurrentTime);
           	
            
           	$(EPGREF).bind("epgView.updateProgramData", replaceProgramData);
           	$(EPGREF).bind("epgView.updateProgramData", resizeProgramsHolder);
           	$(EPGREF).bind("epgView.updateProgramData", hideProgramLoader);
           	$(EPGREF).bind("epgView.updateProgramData", scrollDayToCenter);
	   	$(EPGREF).bind("epgView.updateProgramData", timesChange_DayDefault); 
		   
		//scroll immediatly to the former selected epgarticle
		articletime = $("#curtime").html();	
		var iPosItem = $(".time:contains('Jetzt')").parent().parent().prev();
			 
		posSelectedProgramTeaserView(iPosItem, 300);
		iPosItem.trigger("epgView.updateTime");

		var iTimeOfDay = $(".time:contains('Jetzt')").attr("title");
	        if(iTimeOfDay) {
           
	            var eCorrespondingTimeOfDay = $(EPGTIMESREF+" a:contains('"+iTimeOfDay+"')");
	            updateTimeHighlight(null, eCorrespondingTimeOfDay);
            
	        }

		
		$(DATESCROLLER + " ul").width($("#curwidth").text()+"px");
       }
    };
    
    
   
    // setup dates scroller
    var setUpDateScroller = function() {
        
        $(DATESCROLLBUTTONSREF).newHorizontalScroller(DATESCROLLER, DATESSCROLLACTIONWIDTH, 300);
        centerCurrentDay();
        
    };
    
    // setup program scroller
    var setUpProgramScroller = function() {
        
        $(PROGRAMSCROLLBUTTONSREF).newHorizontalScroller(PROGRAMSCROLLERREF, PROGRAMSCROLLWIDTH, 150);
        resizeProgramsHolder();
        posCurrentProgram();
        
    };
    
    // setup time period scroller
    var changeCurrentTimeController = function(event) 
    {
        iLastItemHiddenOnLeft = $(PROGRAMSCROLLERREF).scrollLeft()/PROGRAMSCROLLWIDTH;
	var eFirstVisibleItem = $(PROGRAMSCROLLERREF+" ol li").eq(iLastItemHiddenOnLeft).find(".time");
        var iTimeOfDay = eFirstVisibleItem.attr("title");
        if(iTimeOfDay) {
            
            var eCorrespondingTimeOfDay = $(EPGTIMESREF+" a:contains('"+iTimeOfDay+"')");
            updateTimeHighlight(null, eCorrespondingTimeOfDay);
            
        }
        
    };
   
   
   
    
    // switch date trigger
    var dayChangeController = function(event) {
        
        event.preventDefault();
        $.get(event.target.href, function(data) {
            $(EPGREF).trigger("epgView.updateProgramData", [data, event.target]);
        });
        $(EPGREF).trigger("epgView.changeDays", [event.target]);
        
    };
 
    // switch time period trigger
     var timesChangeController = function(event) {

         event.preventDefault();
         var selectedTime = $(event.target).text();
         var firstProgram = getFirstProgramOfTime(selectedTime);
	 $(PROGRAMSCROLLERREF).find(".current").removeClass("current");
	 $(firstProgram).next().addClass("current");
	 doAnalytics(firstProgram.next());

         $(EPGREF).trigger("epgView.updateTime", [event.target, firstProgram]);
 	
         
     };


    
 	
    var timesChange_DayDefault = function(event, newProgramData, selectedItem) {
    
        event.preventDefault();
		iLastItemHiddenOnLeft = $(PROGRAMSCROLLERREF).scrollLeft()/PROGRAMSCROLLWIDTH;
		var eFirstVisibleItem = $(PROGRAMSCROLLERREF+" ol li").eq(iLastItemHiddenOnLeft).find(".time").eq(0);
		
		var iTimeOfDay = $(".EPGTimes .selected").eq(0).attr("id");
	        var firstProgram = getFirstProgramOfTime(iTimeOfDay);
	        $(EPGREF).trigger("epgView.updateTime", [event.target, firstProgram]);
		
		var eCorrespondingTimeOfDay = $(EPGTIMESREF+" a:contains('"+iTimeOfDay+"')");
		updateTimeHighlight(null, eCorrespondingTimeOfDay); 

	};
    

    var toggleListView = function(event) {
        event.preventDefault();
        var programContainer = $(PROGRAMSREF);
        if(programContainer.hasClass(TEASERVIEWCLASS))
        {
            programContainer.addClass(LISTVIEWCLASS).removeClass(TEASERVIEWCLASS);
            $(EPGTIMESREF).toggleClass("inv");
            $("span", this).eq(0).hide().end().eq(1).show();
            scrollToListViewToTime();
            
        } else {
            
            programContainer.addClass(TEASERVIEWCLASS).removeClass(LISTVIEWCLASS);
            $(EPGTIMESREF).toggleClass("inv");
            $("span", this).eq(1).hide().end().eq(0).show();
            scrollToTeaserViewToTime();
        }
        resizeProgramsHolder();
    };
    
    /* view methods */
   
    var centerCurrentDay = function() {
        //var sInitialDateLeftPositionReset = DATESSCROLLACTIONWIDTH*(PREVIOUSWEEKSAVAILABLE-1);
	// Set the Default value to set the current date in middle on page load.
        $(DATESCROLLER).scrollLeft(1040);
        
        
    };
    
    var posCurrentProgram = function() {
        
        var iPosItem = $(PROGRAMSCROLLERREF + " .current");
        if(iPosItem.length > 0)
        {
            
            posSelectedProgramTeaserView(iPosItem, 0);

    
        }
        
    };
    
    var scrollProgramsToCurrentTime = function(event, selectedItem, firstProgram) {
        if(firstProgram) {
            
            posSelectedProgramTeaserView(firstProgram, 300);
        
        }
        
    };
    
    
    
    var posSelectedProgramTeaserView = function(programToCenter ,iAnimationTime) {
	if ($(programToCenter).position())
	{
		var iNewPosition = $(programToCenter).position().left + $(PROGRAMSCROLLERREF).scrollLeft(); // left side
		$(PROGRAMSCROLLERREF).animate({
				scrollLeft : iNewPosition
		}, iAnimationTime);
        }
	
    };
    
    var getCurrentSelectedTimePeriod = function() {
        var selectedTime = $(EPGTIMESREF+" ."+SELECTEDTIMEREF).text();
        return selectedTime;
        
    };
    
    var getFirstProgramOfTime = function(selectedTime) 
    {
        return $(".time[title='"+selectedTime+"']").eq(0).closest("li");
    };
    
    var scrollToListViewToTime = function() {

        var selectedTime = getCurrentSelectedTimePeriod();
        if(selectedTime) {
            
            var firstProgram = getFirstProgramOfTime(selectedTime);
			if (firstProgram.html() != null) {
			 var horizontalPosition = firstProgram.position().top;
            $(PROGRAMSCROLLERREF).animate({
                scrollTop : horizontalPosition
            }, 0);
		}
        }
        
    };
    
    var scrollToTeaserViewToTime = function() {
        var selectedTime = getCurrentSelectedTimePeriod();
        if(selectedTime) {
            var firstProgram = getFirstProgramOfTime(selectedTime);
            posSelectedProgramTeaserView(firstProgram, 0);
        }
    };
    
    var resizeProgramsHolder = function() {
        var programContainer = $(PROGRAMSREF);
        if(programContainer.hasClass(TEASERVIEWCLASS)) {
            
            var scrollerContainer = $(PROGRAMSCROLLERREF+ " ol");
            var iWidthOfScrollContents = scrollerContainer.children().length*PROGRAMSCROLLWIDTH-20;
            scrollerContainer.css({width : iWidthOfScrollContents});
        
        } else {
            
            $(PROGRAMSCROLLERREF+ " ol").css({width : ""});
            
        }
    };
        
    var updateDayHighlight = function(event, selectedItem) {
        $(DATESCROLLER).find(".highlighted").removeClass("highlighted");
        $(selectedItem).parent().addClass("highlighted");
        
    };
    
    var updateTimeHighlight = function(event, itemSelected) {
        if(!$(itemSelected).hasClass(SELECTEDTIMEREF)) 
        {
            $(EPGTIMESREF).find("."+SELECTEDTIMEREF).removeClass(SELECTEDTIMEREF).addClass(DESELECTEDTIMEREF);
            $(itemSelected).removeClass(DESELECTEDTIMEREF).addClass(SELECTEDTIMEREF);

	    iLastItemHiddenOnLeft = $(PROGRAMSCROLLERREF).scrollLeft()/PROGRAMSCROLLWIDTH;
        }
    };
    
    var showProgramLoader = function(event) {
        $(PROGRAMSCROLLERREF).css("opacity", 0.5);
        $(LOADERREF).show();
        
    };
    
   var hideProgramLoader = function(event) {
        $(LOADERREF).hide();
        $(PROGRAMSCROLLERREF).css("opacity", 1);
        
    };
    
    var scrollDayToCenter = function(event, newProgramData, selectedItem) {
        var iNewScrollPosition = ($(selectedItem).parent().position().left)-DATESSCROLLACTIONWIDTH;
        $(DATESCROLLER).animate({scrollLeft: iNewScrollPosition});
    };
    
    var replaceProgramData = function(event, newProgramData) {
        $(PROGRAMSCROLLERREF).html(newProgramData);
        
    };
	
	var centerHighlightedDay = function() {

		if ($('.dateScroller li.highlighted').length) {
			var iNewScrollPosition = ($('.dateScroller li.highlighted').position().left) - DATESSCROLLACTIONWIDTH;
		} else {
			var iNewScrollPosition = ($('.dateScroller li.heute').position().left) - DATESSCROLLACTIONWIDTH;
			$('.dateScroller li.heute').addClass('highlighted');
		}
		$(DATESCROLLER).animate({scrollLeft: iNewScrollPosition});	
		
	};
 
 
      
  // webtrends analytics
  var doAnalytics = function(currentEPG) {
 
 	var title = '#' + $(currentEPG).attr("id") + ' div h3 a' ;
 	var t = '#' + $(currentEPG).attr("id") + ' div span.time' ;
 	t = jQuery.trim($(t).text());
 	if (t.length > 0)
 	     t =  ' ('  + t + ')';
 	 
 	cg_5 = jQuery.trim($(title).text() + t);
 	dcsMultiTrack(	'dcsid','8cltpg000004nolchq2401_3g8g',
 			'WT.ti', 'TV-Programm',
 			'DCSext.path', '%2FTV-Programm',
 			'DCSext.aid', '1259088496194',
 			'WT.cg_n', 'General',
 			'WT.cg_5', cg_5   
 		);
 
 
 
     };
     
    
   init(); 

});






















var EPGREF = ".EPG";
    var DATESCROLLBUTTONSREF = ".EPGDates .scroller";
    var DATESCROLLER = ".dateScroller";
    var PROGRAMSREF = ".EPGPrograms";
    var PREVIOUSWEEKSAVAILABLE = 4;
    var DATESSCROLLACTIONWIDTH = "364";
    var PROGRAMSCROLLBUTTONSREF = PROGRAMSREF+" .scroller";
    var PROGRAMSCROLLERREF = ".EPGMainView";
    var EPGTIMESREF = ".EPGTimes";
    var LOADERREF = PROGRAMSREF+" .loading";
    var PROGRAMSCROLLWIDTH = "255";
    var LISTVIEWTOGGLEREF = ".toggleViews";
    var LISTVIEWCLASS = "EPGList";
    var TEASERVIEWCLASS = "EPGTeaser";
    var SELECTEDTIMEREF = "selected";
    var DESELECTEDTIMEREF = "deselected";
    
    
    var iLastElementHiddenOnLeft = null;
    
    
    var setUpDateScroller = function() {
        
        $(DATESCROLLBUTTONSREF).newHorizontalScroller(DATESCROLLER, DATESSCROLLACTIONWIDTH, 300);
        centerCurrentDay();
        
    };
    
    var setUpProgramScroller = function() {
        
        $(PROGRAMSCROLLBUTTONSREF).newHorizontalScroller(PROGRAMSCROLLERREF, PROGRAMSCROLLWIDTH, 150);
        resizeProgramsHolder();
        posCurrentProgram();
        
    };
    
    /* controller methods */

    var dayChangeController = function(event) {
        
        event.preventDefault();
        $.get(event.target.href, function(data) {
            $(EPGREF).trigger("epgView.updateProgramData", [data, event.target]);
        });
        $(EPGREF).trigger("epgView.changeDays", [event.target]);
        
    };
    
    var changeCurrentTimeController = function(event) {
        iLastItemHiddenOnLeft = $(PROGRAMSCROLLERREF).scrollLeft()/PROGRAMSCROLLWIDTH;
        // centered EPG
        setCurrentEPG($('#teaserItem' + (iLastItemHiddenOnLeft + 2)));
	var eFirstVisibleItem = $(PROGRAMSCROLLERREF+" ol li").eq(iLastItemHiddenOnLeft).find(".time");
        var iTimeOfDay = eFirstVisibleItem.attr("title");
        if(iTimeOfDay) {
            
            var eCorrespondingTimeOfDay = $(EPGTIMESREF+" a:contains('"+iTimeOfDay+"')");
            updateTimeHighlight(null, eCorrespondingTimeOfDay);
            
        }
        
    };
    
	
	var timesChange_DayDefault = function(event, newProgramData, selectedItem) {
		event.preventDefault();
		iLastItemHiddenOnLeft = $(PROGRAMSCROLLERREF).scrollLeft()/PROGRAMSCROLLWIDTH;
		var eFirstVisibleItem = $(PROGRAMSCROLLERREF+" ol li").eq(iLastItemHiddenOnLeft).find(".time");
		var iTimeOfDay = $(".EPGTimes .selected").eq(0).attr("id");
		
		
		
        var firstProgram = getFirstProgramOfTime(iTimeOfDay);
        $(EPGREF).trigger("epgView.updateTime", [event.target, firstProgram]);
		
		var eCorrespondingTimeOfDay = $(EPGTIMESREF+" a:contains('"+iTimeOfDay+"')");
		updateTimeHighlight(null, eCorrespondingTimeOfDay); 
	};
    
    var toggleListView = function(event) {
        event.preventDefault();
        var programContainer = $(PROGRAMSREF);
        if(programContainer.hasClass(TEASERVIEWCLASS))
        {
            programContainer.addClass(LISTVIEWCLASS).removeClass(TEASERVIEWCLASS);
            $(EPGTIMESREF).toggleClass("inv");
            $("span", this).eq(0).hide().end().eq(1).show();
            scrollToListViewToTime();
            
        } else {
            
            programContainer.addClass(TEASERVIEWCLASS).removeClass(LISTVIEWCLASS);
            $(EPGTIMESREF).toggleClass("inv");
            $("span", this).eq(1).hide().end().eq(0).show();
            scrollToTeaserViewToTime();
        }
        resizeProgramsHolder();
    };
    
    /* view methods */
   
    var centerCurrentDay = function() {
        //var sInitialDateLeftPositionReset = DATESSCROLLACTIONWIDTH*(PREVIOUSWEEKSAVAILABLE-1);
		// Set the Default value to set the current date in middle on page load.
        $(DATESCROLLER).scrollLeft(1040);
        
    };
    
    var posCurrentProgram = function() {
        
        var iPosItem = $(PROGRAMSCROLLERREF + " .current");
        if(iPosItem.length > 0)
        {
            
            posSelectedProgramTeaserView(iPosItem, 0);
    
        }
        
    };
    
    var scrollProgramsToCurrentTime = function(event, selectedItem, firstProgram) {
        
        if(firstProgram) {
            
            posSelectedProgramTeaserView(firstProgram, 300);
        
        }
        
    };
    
    var posSelectedProgramTeaserView = function(programToCenter ,iAnimationTime) {
        
        //var iNewPosition = $(programToCenter).position().left - PROGRAMSCROLLWIDTH + $(PROGRAMSCROLLERREF).scrollLeft(); // center position
		if ($(programToCenter).position())
		{
			$(programToCenter).parent().addClass("current");
			var iNewPosition = $(programToCenter).position().left + $(PROGRAMSCROLLERREF).scrollLeft(); // left side
			$(PROGRAMSCROLLERREF).animate({
					scrollLeft : iNewPosition
			}, iAnimationTime);
        }
    };
    
    var getCurrentSelectedTimePeriod = function() {
        
        var selectedTime = $(EPGTIMESREF+" ."+SELECTEDTIMEREF).text();
        return selectedTime;
        
    };
    
    var getFirstProgramOfTime = function(selectedTime) {
        
        return $(".time[title='"+selectedTime+"']").eq(0).closest("li");
        
    };
    
    var scrollToListViewToTime = function() {
        
        var selectedTime = getCurrentSelectedTimePeriod();
        if(selectedTime) {
            
            var firstProgram = getFirstProgramOfTime(selectedTime);
			if (firstProgram.html() != null) {
			 var horizontalPosition = firstProgram.position().top;
            $(PROGRAMSCROLLERREF).animate({
                scrollTop : horizontalPosition
            }, 0);
		}
        }
        
    };
    
    var scrollToTeaserViewToTime = function() {

        var selectedTime = getCurrentSelectedTimePeriod();
        if(selectedTime) {
            var firstProgram = getFirstProgramOfTime(selectedTime);
            posSelectedProgramTeaserView(firstProgram, 0);
        }
    };
    
    var resizeProgramsHolder = function() {
        var programContainer = $(PROGRAMSREF);
        if(programContainer.hasClass(TEASERVIEWCLASS)) {
            
            var scrollerContainer = $(PROGRAMSCROLLERREF+ " ol");
            var iWidthOfScrollContents = scrollerContainer.children().length*PROGRAMSCROLLWIDTH-20;
            scrollerContainer.css({width : iWidthOfScrollContents});
        
        } else {
            
            $(PROGRAMSCROLLERREF+ " ol").css({width : ""});
            
        }
    };
        
    var updateDayHighlight = function(event, selectedItem) {
        
        $(DATESCROLLER).find(".highlighted").removeClass("highlighted");
        $(selectedItem).parent().addClass("highlighted");
        
    };
    
    var updateTimeHighlight = function(event, itemSelected) {
        if(!$(itemSelected).hasClass(SELECTEDTIMEREF)) {
            
            $(EPGTIMESREF).find("."+SELECTEDTIMEREF).removeClass(SELECTEDTIMEREF).addClass(DESELECTEDTIMEREF);
            $(itemSelected).removeClass(DESELECTEDTIMEREF).addClass(SELECTEDTIMEREF);
            
        }
    };
    
    
    
    var showProgramLoader = function(event) {
        
        $(PROGRAMSCROLLERREF).css("opacity", 0.5);
        $(LOADERREF).show();
        
    };
    
   var hideProgramLoader = function(event) {
        
        $(LOADERREF).hide();
        $(PROGRAMSCROLLERREF).css("opacity", 1);
        
    };
    
    var scrollDayToCenter = function(event, newProgramData, selectedItem) {
        
        var iNewScrollPosition = ($(selectedItem).parent().position().left)-DATESSCROLLACTIONWIDTH;
        $(DATESCROLLER).animate({scrollLeft: iNewScrollPosition});
    };
    
    var replaceProgramData = function(event, newProgramData) {
        
        $(PROGRAMSCROLLERREF).html(newProgramData);
        
    };
	
	var centerHighlightedDay = function() {
		if ($('.dateScroller li.highlighted').length) {
			var iNewScrollPosition = ($('.dateScroller li.highlighted').position().left) - DATESSCROLLACTIONWIDTH;
		} else {
			var iNewScrollPosition = ($('.dateScroller li.heute').position().left) - DATESSCROLLACTIONWIDTH;
			$('.dateScroller li.heute').addClass('highlighted');
		}
		$(DATESCROLLER).animate({scrollLeft: iNewScrollPosition});	
		
	};
        
 
 
     
 // webtrends analytics
 var doAnalytics = function(currentEPG) {
	var title = '#' + $(currentEPG).attr("id") + ' div h3 a' ;
	var t = '#' + $(currentEPG).attr("id") + ' div span.time' ;
	t = jQuery.trim($(t).text());
	if (t.length > 0)
	     t =  ' ('  + t + ')';
	 
	cg_5 = jQuery.trim($(title).text() + t);
	dcsMultiTrack(	'dcsid','8cltpg000004nolchq2401_3g8g',
			'WT.ti', 'TV-Programm',
			'DCSext.path', '%2FTV-Programm',
			'DCSext.aid', '1259088496194',
			'WT.cg_n', 'General',
			'WT.cg_5', cg_5   
		);



    };
    
    
     // set current epg (represented as li element)
     var setCurrentEPG = function(programToCenter) {
 	$(PROGRAMSCROLLERREF).find(".current").removeClass("current");
 	$(programToCenter).next().addClass("current");
 	doAnalytics(programToCenter);
     };