var CorrieVideo = Class.create({
	initialize : function(obj, options) {
		QueryString.init();
		this.obj = Element.extend(document.getElementById(obj));
		this.name = this.obj.id; //name set for testing scope and binding
		
		this.options = {
			templateName: 'corrie_street_fullplayer',
			playerName: 'corrie_street_fullplayer',
			clipId: '',
			bgColor: '#2d031b',
			playerType: 'olympicsLargeSinglePlaylist'
		};
		
		Object.extend(this.options, options || {});
		Event.observe(window,'load', this.start.bind(this));
		new PeriodicalExecuter(swapAd, 120);
	},
	
	start : function() {
		if(QueryString.hasQueryString()) {
			if(QueryString.hasParameter('clipId')) {
				clipId = QueryString.getParameter('clipId');
			}
		}
		else if(this.options.clipId != '' || this.options.clipId != null) {
			clipId = this.options.clipId;
		}
		else
			clipId = '';
			
		loadVideoPlayer(this.options.templateName, this.options.playerName, clipId, this.options.bgColor, this.options.playerType, this.obj);	
	}
});

var CorrieCal = Class.create({					 
	dateColours : ['#e4c296','#f28919','#19f2ad','#6fad23','#ff0066'],
	
	initialize : function(obj, options) {
		this.obj = Element.extend(document.getElementById(obj));
		this.obj.setStyle({position: 'relative'});
		this.name = this.obj.id; //name set for testing scope and binding
		
		this.options = {
			dataSrc: 'calendarData.js',
			dataType: 'json',
			width: 971,
			height: 314
		};
		Object.extend(this.options, options || {});
		Event.observe(window,'load', this.start.bind(this));
	},
	
	start : function() {
		var buildCalendar = this.buildCalendar.bind(this);
		this.obj.insert(Builder.node('div', {id:'calContainer', style:'width:'+this.options.width+'px, height:'+this.options.height+'px, overflow:hidden'}));
		Element.extend(document.getElementById('calContainer'));
		
		new Ajax.Request(this.options.dataSrc+'?'+(Math.round(Math.random()*100000)), {
			method: 'get',
			onSuccess: function(request) {
				d = eval('('+request.responseText+')');
				buildCalendar(d);
			}
		});
	},
	
	buildCalendar : function(d) {
		today = new Date();

		if(today.getDay() >= 1 && today.getDay() <= 5)
			tmpToday = today;
		else {
			tmpToday = new Date();
			switch(today.getDay()) {
				case 6 : tmpToday.setDate(today.getDate()-5); break;
				case 0 : tmpToday.setDate(today.getDate()-6); break;
			}
		}
		
		todayData = d.dates.find(function(date) {if(tmpToday.getDate() == date.day && tmpToday.getMonth()+1 == date.month && tmpToday.getFullYear() == date.year) return true;});
		inPoint = d.dates.indexOf(todayData) - tmpToday.getDay() + 1;
		
		//build the calendarMenu div, the container for all the calendar boxes
		calendarMenu = Builder.node('div', {id:'calendarMenu', style: 'width: 971px; height:180px; position: absolute; right:0; bottom:0; z-index:100; overflow: hidden;'});
		$('calContainer').insert(calendarMenu);
		//add default slide
		slide = Builder.node('div', {className:'slide', style: 'width:'+this.options.width+'px; height:'+this.options.height+'px; background: transparent url(images/defaultBanner.jpg) 0 0 no-repeat; position: absolute; display: none;'});
		$('calContainer').insert(slide);
		calendarMenu = Element.extend(document.getElementById('calendarMenu'));
		calendarMenu.insert(Builder.node('div', {style:'float: left; width:71px; height: 13px; position: relative; left:0; top:167px; background: transparent url(images/synopses.jpg) 0 0 no-repeat;'}));
		
		//add all the calendar boxes to calendarMenu
		for(i=0;i<5;i++) {
			tempDate = new Date();
			tempDate.setDate(today.getDate()-today.getDay()+1+i);
			
			//get the day of the week in written form
			dayOfWeek = '';
			
			//SPECIAL CASE FOR NEW YEAR 2009
			weekStart = new Date(2008, 11, 29);
			weekEnd = new Date(2009, 0, 4);
			wsMilli = weekStart.getTime();
			weMilli = weekEnd.getTime();
			tdMilli = today.getTime();
			
			if(tdMilli >= wsMilli && tdMilli <= weMilli) {
				['monday','tuesday','thursday','thursday','friday'].each(function(day, index) {if(index+1 == tempDate.getDay()) dayOfWeek = day;}, dayOfWeek);
			}
			else {
				['monday','tuesday','wednesday','thursday','friday'].each(function(day, index) {if(index+1 == tempDate.getDay()) dayOfWeek = day;}, dayOfWeek);
			}
			
			(d.dates[i+inPoint].month < 10) ? theMonth = '0' + d.dates[i+inPoint].month : theMonth = d.dates[i+inPoint].month;
			(d.dates[i+inPoint].day < 10) ? theDay = '0' + d.dates[i+inPoint].day : theDay = d.dates[i+inPoint].day;
			
			//build the calendar box for the current day
			calendarDate = Builder.node('div', {className:'calendarDate', style: 'float: left; width: 180px; height: 180px; position: relative; left:0; top:167px; cursor:pointer;'},[
					Builder.node('div', {className:'calendarDateBG', style: 'width:180px; height:180px; position: absolute; left:0; top:0; z-index:1; background:'+this.dateColours[i]+';'}),
					Builder.node('div', {className:'calendarDateInfo', style: 'width:160px; height:160px; position: absolute; left:10px; top:11px; z-index:2; color: #2d031b; font-style: Helvetica, Arial, sans-serif;'},[
						Builder.node('span', {style: 'font-size: 30px; line-height: 32px; font-weight: bold;'}, dayOfWeek), Builder.node('br'),
						Builder.node('span', {style: 'font-size: 45px; line-height: 55px; font-weight: bold;'},theMonth+'/'+theDay), Builder.node('br'),
						Builder.node('span', {style: 'font-size: 11px; line-height: 11px; margin: 0;'},[
							Builder.node('strong', d.dates[i+inPoint].time + ' pm'),
							Builder.node('br'),
							(d.dates[i+inPoint].episode != "") ? Builder.node('strong', 'episode ' + d.dates[i+inPoint].episode) : Builder.node('strong', 'pre-empted'),
							Builder.node('br'),
							d.dates[i+inPoint].description
						])
					])
			]);
			
			//add the calendar box to the calendarMenu
			calendarMenu.insert(calendarDate);
			
			if(today.getDay() >= 1 && today. getDay() <= 5) {
				(tempDate.getDay() == today.getDay()) ? calendarDate.state = 'on' : calendarDate.state = 'off';
			}
			else {
				calendarDate.state = 'off';
			}
			
			(tempDate.getDay() == today.getDay()) ? $('calendarMenu').getElementsByClassName('calendarDate')[i].onmouseover = null : $('calendarMenu').getElementsByClassName('calendarDate')[i].onmouseover = menuUp;
			if($('calendarMenu').getElementsByClassName('calendarDate')[i].state != 'selected') $('calendarMenu').getElementsByClassName('calendarDate')[i].onmouseup = menuSelected;
		}

		//show the calendarMenu
		Effect.Appear($('calContainer').childNodes[0]);

		//- load the default background image
		//- slide up the appropriate calendar box: all boxes are open during the weekend, or the the corresponding one to the current day of the week
		
		Effect.Appear($('calContainer').childNodes[1], {
			   afterFinish: function() {
		
				   //monday - friday
				   if(today.getDay() >= 1 && today.getDay() <= 5) {
					   new Effect.Move($('calendarMenu').getElementsByClassName('calendarDate')[today.getDay()-1], {x:0, y:-36, duration:0.1});
				   }
				}
			}
		);
		
	}
});



// EVENT LISTENERS --- NEED TO FIND A WAY TO INCORPORATE THEM IN THE CLASS ---
function menuUp() {
	var oldSelected = null;
	for(i=0;i<5;i++) {
		currentDate = $('calendarMenu').getElementsByClassName('calendarDate');
		if(currentDate[i].state == 'on') {
			oldSelected = i;
			currentDate[i].state = 'off';
			currentDate[i].onmouseover = menuUp;
		}
	}
	
	if(this.state != 'selected') {
		this.onmouseover = null;
		if(oldSelected != null) {
			new Effect.Parallel([
				new Effect.Move(this, {sync: true, x:0, y:-36}),
				new Effect.Move(currentDate[oldSelected], {sync: true, x:0, y:36})
			], {duration:0.1, queue: {position:'end', scope: 'menu'}});
		}
		else {new Effect.Move(this, {x:0, y:-36, duration:0.1, queue: {position:'end', scope: 'menu'}});}
		this.state = 'on';
	}
	else {if(oldSelected != null) new Effect.Move(currentDate[oldSelected], {x:0, y:36, duration:0.1, queue: {position:'end', scope: 'menu'}});}
}

function menuClose() {
	for(i=0;i<5;i++) {
		currentDate = $('calendarMenu').getElementsByClassName('calendarDate');
		if(currentDate[i].state == 'selected') {
			new Effect.Parallel([
					new Effect.Move(this, {sync: true, x:0, y:131}),
					new Effect.Opacity(this.getElementsByClassName('calendarDateBG')[0], {from:0.8, to:1.0})
			   ], {duration:0.5, queue: {position:'end', scope: 'menu'}});
			this.state = 'on';
			this.onmouseover = null;
			this.onmouseup = menuSelected;
		}
	}
}



function menuSelected() {
	currentDate = $('calendarMenu').getElementsByClassName('calendarDate');
	var oldSelected = null;
	for(i=0;i<5;i++) {
		if(currentDate[i].state == 'selected') {
			oldSelected = i;
			currentDate[i].state = 'off';
			currentDate[i].onmouseover = menuUp;
		}
		if(currentDate[i] == this) {
			newSelected = i;
		}
	}
	
	if(oldSelected != null) {
		new Effect.Parallel([
			new Effect.Move(this, {sync: true, x:0, y:-131}),
			new Effect.Opacity(this.getElementsByClassName('calendarDateBG')[0], {from:1.0, to:0.8}),
			new Effect.Move(currentDate[oldSelected], {sync: true, x:0, y:167}),
			new Effect.Opacity(currentDate[oldSelected].getElementsByClassName('calendarDateBG')[0], {from:0.8, to:1.0})
	   ], {duration:0.5, queue: {position:'end', scope: 'menu'}});
		currentDate[oldSelected].onmouseup = menuSelected;
	}
	else {
		new Effect.Parallel([
			new Effect.Move(this, {sync: true, x:0, y:-131}),
			new Effect.Opacity(this.getElementsByClassName('calendarDateBG')[0], {from:1.0, to:0.8})
	   ], {duration:0.5, queue: {position:'end', scope: 'menu'}});
	}
	this.state = 'selected';
	this.onmouseup = menuClose;
	this.onmouseover = menuUp;
}