var Videoplayer = Class.create({

	initialize: function(){
		this.defaultOptions = $H({
		  autoPlay: true,
		  wrapper: 'video'
		});
		this.getSource();
		this.video();
		this.startObserving();
	},
	getSource: function () {
		this.srcOne = '/_Pics/LC.mp4';
		this.srcTwo = '/_Pics/LC.ogg';
	},
	video: function () {
		
		var dimensions = this.getVideoDimensions();
		
		this.video = new Element('video',{width:dimensions[0],height:dimensions[1]});
		this.video.preload = true;this.video.autoplay = true; this.video.loop = true;this.video.autobuffer = true;this.video.poster = '/_Uploads/UtilsMedia/3.jpg';
		var srcOne = new Element('source',{src:this.srcOne,type:'video/mp4; codecs=\"avc1.42E01E, mp4a.40.2\"'});
		var srcTwo = new Element('source',{src:this.srcTwo,type:'video/ogg; codecs=\"theora, vorbis\"'});
		this.video.insert(srcOne);this.video.insert(srcTwo); $('video').insert(this.video);
	},
	startObserving: function () {
		Event.observe(window, 'resize', function(e){
			dimensions = this.getVideoDimensions();
			this.video.width = dimensions[0];
			this.video.height = dimensions[1];
		}.bind(this));
		
		this.loopVideo();
		
		$$('.playControl').first().observe('click',this.playControl.bindAsEventListener(this));
	},
	
	
	
	getVideoDimensions: function () {
		var windowWidth = document.viewport.getWidth(); var windowHeight = $('content').getHeight(); windowProportion = windowWidth / windowHeight;
		var origWidth = 480; origHeight = 270; var origProportion = origWidth / origHeight;
		var newWidth = 0; var newHeight = 0;
		if (windowProportion >= origProportion) {
			proportion = windowWidth / origWidth;
		} else {
			proportion = windowHeight / origHeight;
		}
		newWidth = proportion * origWidth; newHeight = proportion * origHeight;
		//console.log('Window Height:%s, newWidth: %s, newHeight: %s',windowHeight,newWidth,newHeight);
		return [newWidth,newHeight]
	},
	
	playControl: function () {
		if (this.video.paused == false) {
			this.video.pause();
			$$('.playControl').first().innerHTML = "<p>Play<br>video</p>";
		} else {
			this.video.play();
			$$('.playControl').first().innerHTML = "<p>Pause<br>video</p>";
		}
	},
	
	loopVideo: function () {
		this.t = window.setInterval(function() {
			if (this.video.ended == true) {
				this.video.play();
			}
		}.bind(this),500);
	}

});
