/*!
 * AAhtml5Player Library v0.1
 * codecanyon.net/user/AA-Team/portfolio
 *
 * Copyright 2011, AA-Team
 *
 * Date: 23.10.2011
 */

var AAhtml5Player = function (elm, options) {
	var defaults = {
		running: false,
		control_size: 140,
		animationStart: function () {},
		animationComplete: function () {}
	};
	var option = $.extend({}, defaults, options);
	return elm.each(function () {
		var $t			= $(this),
			video 		= $t[0],
			content		= null,
			w			= $t.width(),
			h			= $t.height(),
			video_wrap 	= null,
			controls	= {},
			time		= 0,
			navigation	= null,
			thumbs		= $("a.video-play"),
			seeksliding	= false,
			loadMarker 	= 0,
			one_step 	= 0,
			progress	= 0;
			
		var plugin = {
			isiPhone: function(){
				return (
					(navigator.platform.indexOf("iPhone") != -1) ||
					(navigator.platform.indexOf("iPad") != -1) ||
					(navigator.platform.indexOf("iPod") != -1)
				);
			},
			
			// detect if browser is IE 6, 7, 8
			isiOldIe: function(){
				var isIE = false;
				if ( $.browser.msie ){
					if($.browser.version == '6.0') isIE = true;
					else if($.browser.version == '7.0') isIE = true;
					else if($.browser.version == '8.0') isIE = true;
				}
				
				return isIE;
			},

			init: function () {
				if(!plugin.isiPhone() && !plugin.isiOldIe()){
					video.load();
					plugin.initTheme(); 
				}
				if(plugin.isiOldIe()) {
					jQuery("#flash_fallback").css({
						'display': 'block'
					});
				}
			},
			
			initTheme: function() {
				// generate html skins
				// palyer main wrapper
				video_wrap = jQuery('<div />')
							.addClass('AA-html5-player')
							.width(w)
							.height(h + option.control_size);
							
				// navigation
				navigation = "\
							<a href='javascript: void(0);' id='changeVolume' class='gui'><div id='volumeWrapper'><span id='holder' class='gui'></span></div></a>\
							<a href='#' id='volume' class='gui'></a>\
							<a href='#' id='play' class='gui'></a>\
							<a href='#' id='pause' class='gui'></a>\
							<a href='#' id='equalizer'></a>\
							<div id='slidebar-wrapper' class='gui'>\
								<span id='progress' class='gui'></span>\
								<a href='#' id='cursor' class='gui'></a>\
							</div>";
				
				video_wrap.append(navigation);
				
				// wrapp video tag
				$t.wrap(video_wrap);
				
				plugin.reInitControllers();
			},
			
			reInitControllers: function() {
				// reinit content
				content = $t.parent('div');
				
				// reassing controls
				controls = {
					'volume': content.find('#volume'),
					'changeVolume': content.find('#changeVolume'),
					'volumeWrapper': content.find('#volumeWrapper'),
					'holder': content.find('#holder'),
					'play': content.find('#play'),
					'pause': content.find('#pause'),
					'slidebarWrapper': content.find('#slidebar-wrapper'),
					'equalizer': content.find('#equalizer'),
					'progress': content.find('#progress'),
					'cursor': content.find('#cursor')
				}
				
				// remove curent video controls
				$t.removeAttr('controls');
				
				loadMarker = window.setInterval(function() {
					
					if (video.duration > 0) {
						// end video
						window.clearInterval(loadMarker);
						
						one_step = w / video.duration;
						
						// call player triggers
						plugin.playerTriggers();
					}
				}, 10);
			},
			
			seek: function() {
				if(video.readyState) {
					var video_duration = video.duration;
					controls.slidebarWrapper.slider({
						value: 0,
						step: 0.01,
						orientation: "horizontal",
						range: "min",
						max: video_duration,
						animate: true,					
						slide: function(){		
						},
						stop:function(e, ui){					
							video.currentTime = ui.value;
						}
					});				
				}
			},
			
			volume_control: function() {
				if(video.readyState) {
					var curr_volume = video.volume;
					
					// init volume
					controls.holder.css('bottom', (curr_volume * 100)  + "%");
		
					controls.volumeWrapper.slider({
						value: 0,
						step: 0.01,
						orientation: "vertical",
						max: 1,
						animate: true,					
						slide: function(e, ui){	
							if(ui.value < 1) {
								controls.holder.css('bottom', (ui.value * 100)  + "%");
							}
						},
						stop:function(e, ui){
							if(ui.value < 1) {
								controls.holder.css('bottom', (ui.value * 100)  + "%");
								video.volume = ui.value;
							}
						}
					});					
				}
			},
			
			startCount: function() {
				time = window.setInterval(function() {
					if (video.ended != true) {
						
						var toWidth = (one_step * video.currentTime);
						controls.cursor.css('width', Math.round(toWidth) + "px");
					} else {
						// end video
						window.clearInterval(time);
						controls.cursor.css('width', "0px");
					}
				}, 1000);
			},
			
			loaded: function() {
				var r = video.buffered;
				var total = video.duration;

				var start = r.start(0);
				var end = r.end(0);
				controls.progress.css('width', Math.round(one_step * end) + "px");  
			},
			
			readyState: function(){
				if(video.attr('paused') == false) {
					video.pause();					
				} else {					
					video.play();				
				}
			},
			
			playerTriggers: function() {
			
				// play
				controls.play.bind('click', function() {
					video.play();
					
					jQuery(this).css('display', 'none');
					controls.pause.css('display', 'block');
					controls.equalizer.css('display', 'block');
					return false;
				});
				
				// pause
				controls.pause.bind('click', function() {
					video.pause();
					
					jQuery(this).css('display', 'none');
					controls.play.css('display', 'block');
					controls.equalizer.css('display', 'none');
					return false;
				});
				
				thumbs.live('click', function() {
					var videohis = jQuery(this),
						src	  = videohis.attr('rel').split('##'),
						source = {
							ogv: src[0],
							mp4: src[1]
						};
					
					// change src
					if($.browser.mozilla) {
						video.src = source.ogv;
					}else{
						video.src = source.mp4;
					}
					video.load();
				
					controls.pause.click();
					controls.play.click();
					return false;
				});
				
				// create counter marker
				plugin.startCount();
				
				// seek bar
				plugin.seek();
				
				// buffered progress bar
				$t.bind('progress', function(){
					plugin.loaded();
				});
				
				// show / hide video control
				controls.volume.click(function() {
					if(controls.changeVolume.css('display') == 'none') {
						controls.changeVolume.css('display', 'block');
					}else{
						controls.changeVolume.css('display', 'none');
					}
					
					return false;
				})
				// volume controllers
				plugin.volume_control();
			}
		};
		
		plugin.init();
	});
};