VideoPlayer = new Class({
// Video Player Class, Uses ChromelessYoutube.js for youtube api calls
	Implements: Options,
	options: {
		container: false,
		width: false,
		height: false,
		autoStart: false,
		defaultVideo: false,
		id: 'VideoPlayer',
		posterFrame: false,
		duration: false,
		autohideControls: true
	},
	initialize: function(options){
		this.setOptions(options);
		this.isPlaying = false;
		this.duration = this.options.duration;
		this.videoContainer = $(this.options.container);
		this.videoContainer.addClass('videoContainer')
		//this.videoContainer.inject($(this.options.container));
		this.createYoutubePlayer();
		this.createControls();
		if(this.options.autohideControls){
			this.controlsContainer.setStyle('opacity','0');
			this.videoContainer.addEvents({
				'mouseover': function(){
					this.controlsContainer.tween('opacity',1);
				}.bind(this),
				'mouseout': function(){
					this.controlsContainer.tween('opacity',0)
				}.bind(this)
			});
		}
		this.updatePlayhead.periodical(100, this);
		if(this.options.autoStart){
			this.isPlaying=true;
			this.startTrackingPlayhead();
		}
	},
	
	createYoutubePlayer: function(){
		this.player = new ChromelessYoutube({
			container: this.options.container,
			defaultVideo: this.options.defaultVideo,
			autoStart: this.options.autoStart,
			width: this.options.width,
			height: this.options.height,
			hasPlayerSkin: true
		});
		
		this.player.updateExternal = function(){
			this.play();
		}.bind(this);
	},
	
	
	createControls: function(){
		this.controlsContainer = new Element('div',{
			'class': 'videoPlayer controlsContainer',
			'styles': {
			//	'width': this.options.width+'px'
			}
		});
		this.controlsContainer.inject(this.videoContainer);
		
		this.buttonsContainer = new Element('div',{
			'class': 'videoPlayer playerButtons'
		});
		this.buttonsContainer.inject(this.controlsContainer);
		
		this.playButton = new Element('a',{
			'class': 'videoPlayer play',
			'href': '#PlayVideo',
			'events': {
				click: function(event){
					event.preventDefault();
					this.play();
				}.bind(this)
			}
		});
		this.playButton.inject(this.buttonsContainer);
		
		this.pauseButton = new Element('a',{
			'class': 'videoPlayer pause',
			'href': '#PauseVideo',
			'events': {
				click: function(event){
					event.preventDefault();
					this.pause();
				}.bind(this)
			}
		});
		this.pauseButton.inject(this.buttonsContainer);

		this.rewindButton = new Element('a',{
			'class': 'videoPlayer rewind',
			'href': '#RewindVideo',
			'events': {
				click: function(event){
					event.preventDefault();
					this.rewind();
				}.bind(this)
			}
		});
		this.rewindButton.inject(this.buttonsContainer);

		this.seekBar = new Element('div', {
			'class':'videoPlayer seekBar',
			'styles': {
				'width': this.controlsContainer.scrollWidth-(this.buttonsContainer.scrollWidth)-25+'px'
			}
		});
		this.seekBar.inject(this.controlsContainer);

		this.playhead = new Element('div', {
			'class':'videoPlayer playhead'
		});
		this.playhead.inject(this.seekBar);
		
		this.seekBarWidth = this.seekBar.scrollWidth;
		this.playheadWidth = this.playhead.scrollWidth;
		
		
		var playheadTransition = new Fx.Transition(Fx.Transitions.Bounce,1);
		var playheadReset = new Fx.Tween(this.playhead,{
			'transition': playheadTransition.easeOut
		});
		
		// Init Dragging for the Playhead
		var playheadDrag = new Drag.Move(this.playhead,{
			container: this.seekBar,
			onStart: function(){
				this.stopTrackingPlayhead();
			}.bind(this),
			onComplete: function(){
				if(this.isPlaying){
					this.seekPercent(this.calculatePlayheadPercent());
				} else {
					playheadReset.start('left','0px');
				}
			}.bind(this)
		});
	},
	
	play: function(){
		this.player.play(this.options.video,0);
		this.startTrackingPlayhead();
		this.isPlaying = true;
	},
	
	pause: function(){
		this.player.pause();
		//this.isPlaying = false;
		//this.stopTrackingPlayhead();
	},
	
	rewind: function(){
		this.player.seek(0);
		this.playhead.setStyle('left','0px');

	},
	
	calculatePlayheadPercent: function(){
		var playheadPosition = this.playhead.getStyle('left').toInt();//-(this.playhead.scrollWidth/2);
		var playheadPercent = (playheadPosition/this.seekBarWidth.toInt())*100;
		return playheadPercent;
	},
	
	seekPercent: function(percent){
		var time = this.duration*(percent/100);
		this.player.seek(time);
		this.startTrackingPlayhead();
	},
	
	getPlayheadPercent: function(){
		var currentTime = this.player.getTime();
		value = currentTime/this.duration;
		return value;
	},
	
	startTrackingPlayhead: function(){
		this.isTrackingPlayhead = true;
	},
	
	stopTrackingPlayhead: function(){
		this.isTrackingPlayhead = false;
	},
	
	updatePlayhead: function(){
		value = this.getPlayheadPercent()*100;
		if(this.isTrackingPlayhead){
			if(isNaN(value)){
				value = 0;
				this.seekProgressPx = 0;
				
			} else {
				this.seekProgressPx = ((this.seekBarWidth/100)*value)-this.playheadWidth;
				if(this.seekProgressPx < 0){
					this.seekProgressPx = 0;
				}
				this.playhead.setStyle('left',this.seekProgressPx+'px');
			}
			if(value >= 100){
				this.pause;
			}
		}
	}
	
});

