var Video = {
	findVideos: function() {
		var videos = document.getElementsByTagName("video");
		var len = videos.length;
		for (var i = 0; i < len; i++) {
			if (videos[i].className.match(/(^klatcher\s)|(\sklatcher$)|(^klatcher$)|(\sklatcher\s)/gm)) {
				Video.showVideo(videos[i]);
				try {
					videos[i].className = videos[i].className.replace(/(^klatcher\s)|(\sklatcher$)|(^klatcher$)|(\sklatcher\s)/gm, "");
				} catch(e){};
			}
		}		
	},
	showVideo: function(video) {
		// first hide the video element
		video.style.display = "none";
		var id = video.parentNode;
		var server = video.getAttribute("host");
		var file = video.getAttribute("poster").replace(".jpg", "").replace(server, "");
		Video.render({id: id, video: video, server: server, file: file, width: video.getAttribute("width"), height: video.getAttribute("height")});
	},
	render: function(obj) {
		obj.id.style.position = "relative";
		obj.id.style.width = obj.width+"px";
		obj.id.style.height = obj.height+"px";
		obj.id.style.display = "inline-block";
		var video = document.createElement("video");
		if (!video.play || navigator.userAgent.indexOf("Gecko") >= 0) {
			Video.renderFallback(obj);
		} else {
			Video.renderHTML5(obj);
		}
	},
	renderFallback: function(obj) {
		var c = obj.id;
		p = '<param name="movie" value="'+obj.server+'player.swf?file='+obj.server+obj.file+'.m4v&image='+obj.server+obj.file+'.jpg&frontcolor=ffffffff&lightcolor=B4C91A&backcolor=414141&screencolor=ffffff"/>'+
			'<param name="wmode" value="opaque"/>'+
			'<param name="flashvars" value="file='+obj.server+obj.file+'.m4v&image='+obj.server+obj.file+'.jpg&frontcolor=ffffffff&lightcolor=B4C91A&backcolor=414141&screencolor=ffffff"/>';
		c.innerHTML = '<object width="'+obj.width+'" height="'+obj.height+'" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">'+p+
					  '<object width="'+obj.width+'" height="'+obj.height+'" data="'+obj.server+'player.swf" type="application/x-shockwave-flash">'+p+
					  '<p><a href="http://get.adobe.com/flashplayer">Get Flash</a> to see this video.</p></object></object>';	
	},
	renderHTML5: function(obj) {
		var poster = document.createElement("img");
		poster.src = obj.server + obj.file + ".jpg";
		poster.width = obj.width;
		poster.height = obj.height;
		obj.id.appendChild(poster);
		var play = document.createElement("span");
		play.className = "play-button";
		play.onclick = function() {
			this.style.display = "none";
			poster.style.display = "none";
			obj.video.style.display = "inline";
			obj.video.play();
			Video.initControls(obj);
		};
		obj.id.appendChild(play);
	},
	initControls: function(obj) {
		var container = document.createElement("div");
		container.className = "controls-container";

		// init fullscreen button
		var full = document.createElement("a");
		full.className = "fullscreen-button"+(obj.id.style.position == "fixed" ? " shrink" : "");
		full.obj = obj;
		full.href = "javascript:";full.onclick = function() {
			if (this.obj.id.style.position == 'fixed') {
				this.obj.id.parentNode.removeChild(this.obj.id);
				return;
			}
			if (this.obj.video.pause) {
				Video.pause(this.obj);
				v = this.obj.id.cloneNode(true);
				v.setAttribute('style', 'background-color:#000000;width:100%;height:100%;z-index:1000000;position:fixed;top:0;left:0;');
				var vid = v.getElementsByTagName("video")[0];
				vid.setAttribute('style', 'background-color:#000000;width:100%;height:100%;');
				document.body.appendChild(v);
				var container = v.getElementsByTagName("div")[0];
				container.parentNode.removeChild(container);
				Video.initControls({id: v, video: vid});
				vid.play();
			}
			this.blur();
		};
		container.appendChild(full);

		// init duration time
		var dur = document.createElement("div");
		dur.className = "duration-time";
		dur.innerHTML = Video.renderTime(obj.video.duration);
		container.appendChild(dur);
		dur.obj = obj;
		var d = dur;
		dur.refreshInt = setInterval(function() {
			d.innerHTML = Video.renderTime(d.obj.video.duration);
		}, 1000);
		
		// init play button
		var play = document.createElement("a");
		play.className = "play-button-small playing";
		play.obj = obj;
		play.href = "javascript:";play.onclick = function() {
			var vid = this.obj.video;
			if (vid.paused) {
				Video.play(this.obj);
			} else {
				Video.pause(this.obj);
			}
			this.blur();
		};
		container.appendChild(play);
		
		// init current position time
		var pos = document.createElement("div");
		pos.className = "current-time";
		pos.innerHTML = Video.renderTime(obj.video.currentTime);
		container.appendChild(pos);
		pos.obj = obj;
		var p = pos;
		pos.refreshInt = setInterval(function() {
			p.innerHTML = Video.renderTime(p.obj.video.currentTime);
		}, 1000);

		// init progress bar
		var bar = document.createElement("div");
		bar.className = "progress-bar";
		container.appendChild(bar);
		
		// init buffer bar
		var buffer = document.createElement("div");
		buffer.className = "buffer-bar";
		buffer.obj = obj;
		var b = buffer;
		b.refreshInt = setInterval(function() {
			var v = b.obj.video;
			if (v.buffered && v.duration > 0) {
					b.style.width = ((v.buffered.end(0) / v.duration) * 100)+"%";
					if (((v.buffered.end(0) / v.duration) * 100) >= 100.0) {
						clearInterval(b.refreshInt);
					}
			}
		}, 250);
		bar.appendChild(buffer);
		
		// init current progress indicator 
		var progress = document.createElement("div");
		progress.className = "play-bar";
		progress.obj = obj;
		var r = progress;
		setInterval(function() {
			var pos = r.obj.video.currentTime / r.obj.video.duration;
			r.style.width = (pos * 100) + "%";
		}, 250);
		bar.appendChild(progress);
		
		var clear = document.createElement("div");
		clear.style.clear = "both";
		container.appendChild(clear);
		obj.id.appendChild(container);

		obj.id.onmouseover = function() {
			container.className = "controls-container";
		};
		obj.id.onmouseout = function() {
			container.className = "controls-container hidden";
		};
	},
	pause: function(obj) {
		obj.video.pause();
		var controls = obj.id.getElementsByTagName("a");
		for (var i = 0; i < controls.length; i++) {
			if (controls[i].className.indexOf("play-button-small") >= 0) {
				controls[i].className = "play-button-small paused";
				break;
			}
		}
	},
	play: function(obj) {
		obj.video.play();
		var controls = obj.id.getElementsByTagName("a");
		for (var i = 0; i < controls.length; i++) {
			if (controls[i].className.indexOf("play-button-small") >= 0) {
				controls[i].className = "play-button-small playing";
				break;
			}
		}
	},
	renderTime: function(sec) {
		var numSecs = Math.round(sec);
		var mins = Math.floor(numSecs / 60.0);
		var secs = numSecs % 60;
		if (!mins) {
			mins = 0;
		}
		if (!secs) {
			secs = 0;
		}
		return mins+":"+(secs < 10 ? "0" : "")+secs;
	},
	
	controlsImage: "data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAZCAQAAABamYz0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAB5JREFUCFtjYNjM4PuK6e4fJgYGpv8w9A+VgYtERQCohRjXSe7wEwAAAABJRU5ErkJggg==",	
	playImage: "data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAPCAQAAAB+HTb/AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAOBJREFUGFdjYGB5H8DAwoADCP/9//n8NXcGZmySGl/+f/v/6//7I5dsGZjQJQ3e/AfBD/+//3+97ZQJqgKDx/9h8NX/r/+frT6sxcAIl7z1Hxk++f/h95NFOxQgCgwu/EeFF//f///m435HkAUGx/6jwiP/+q8Y5TIogTxosPc/Mux4qLWAIZ3BgkEYrHPLfxjsema4jCGbwYFBnoELauea/yDY/cpsDUMBgwuDIgM3kmuX/e95Z7uZoZjBg0GFgRfVnxqBsxjKGXwY1Bj4MENImMGAQZNBAHvYsjCw44oVANQokWzvpX9JAAAAAElFTkSuQmCC",
	pauseImage: "data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAuUlEQVR42n3MIQ6DQBCFYaCWnqCWJpU1CyxuHXdpehV6CxQSi0WjsVgkCjOdmXSTScV7yW/mSybhpV3X3ehvfM+h8bK2bd15nmQSLKDxLk3ThOM4yCT4hBZx33cyKUIT9N6HbdvIpAhNsK7rsK4rmRShRVyWhUyK0ASrqgrzPJNJEVrEaZrIpAhNsCzLMI4jmRShCTrnwjAMZFKEFrHve7IpYksy7sG9uc+vF1dA46XclbvrJ00hR/YFjkJwQji/lbwAAAAASUVORK5CYII=",
	bigPlayImage: "data:image/png;charset=utf-8;base64,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",
	zoomImage: "data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAA3UlEQVR42pXRLw+CQBgGcBMEmAGD00wQKQSas+tnodDpEJwzMCDATBiY5WaTuTkChbkRLHwbfW67cLO8eNtv9+7dnvs7wdCHYfjI2raN0FcmxDDlUJIkN/Rc0KigIwfzPH+gZ4EyKhgEwTsMwxev67pOxwStOI4ZZh+8oiieVVVdUBtUcA4urGANe9iOCSqgiVmFGUcdlVy067qI4zXX9/1xzKIGY+wsHiyGlNfoL8gg7LIsu8tfJt6CvL9dlmXzE3SooNo0zVUE/gpOYQM+HOAEHpjkjrAEGxzBBP0LvzKMy22qRcIAAAAASUVORK5CYII=",
	shrinkImage: "data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAABaUlEQVR42qWTMUvDQBTHW6FWappJRRyEliBoCZQIIhTEwY9QHOLi7qKTUyHiUIpgMnRzyNCpDv0EDoE0RULikEiTIS4ZnIp+BP0/uEIpFq/twY977x33y+Vxl8HI9nq9SpIkL6Zp7lKepinVV+M4btJM+SwmhxAEwSuKP1EUJYZhlFDLDwYDg2qIt3lFG4qiXHqeN6KNw+Hww7KsJ4qZ6IBXVABHkiTdu677NRZMiKq8oiwQwWmn0/EWFrFkzXGcLm1c5kR53/eZZDmRCGrgGjwAfYIrIHGfCOyACqhOIQGBt0f/QrJZv4623GE9xyuS/pLg8naxdgjWeUXVaUmr1XJRvwAlkFtYhGc1UlX1jN4iyMwtajQa7/1+/5tiPOpU1/U9utRziTRNcxDflsvlx/FzCsPwbZ4e7bfb7WfWExmcyLLctG37s16v3yDf5BVtAQWUWE9EcAzO2VzkFeVAgWaWZ4HAPlAEK79e8pYbP7Jl/wAAAABJRU5ErkJggg==",
	trackImage: "data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAICAAAAAAdccqdAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABZJREFUCB1jsGfiYOJh4gJCdiY2JlYABfcAiC/XwOEAAAAASUVORK5CYII=",
	bufferedImage: "data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAICAIAAAC3eAIWAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAACFJREFUeNpiyMrKYvrz5w/Tr1+/wPjnz59w/Pv3b4AAAwBFtxXP00sbFwAAAABJRU5ErkJggg==",
	progressImage: "data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAICAAAAAAdccqdAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABdJREFUCB1j+M/0g+kr02emj0D4mekrAD41B7hJ9Jz5AAAAAElFTkSuQmCC"
};

(window.Video.convert = function() {
	if ((!document.all || window.opera) && !document.getElementById("klatcher_video_stylesheet")) {
		var style = document.createElement("style");
		style.type = "text/css";
		style.id = "klatcher_video_stylesheet";
		var txt = document.createTextNode("span.play-button{background:url("+Video.bigPlayImage+") center center no-repeat;	position:absolute; left:0px; right:0px;	top:0px; bottom:0px; cursor:pointer;}"+
						  "div.controls-container{position:absolute;left:0px;right:0px;bottom:0px;padding:5px;background:url("+Video.controlsImage+") repeat-x;}"+
						  "div.controls-container.hidden{display:none;}"+
						  "div.controls-container a{display:block;float:left;height:16px;width:16px}"+
						  "div.controls-container a.fullscreen-button{float:right;}"+
						  "div.current-time{float:left;margin-left:15px;height:16px;font-size:11px;font-family:Arial,Helvetica,sans-serif;color:#fff;line-height:16px;vertical-align:middle;}"+
						  "div.duration-time{float:right;margin-right:15px;height:16px;font-size:11px;font-family:Arial,Helvetica,sans-serif;color:#fff;line-height:16px;vertical-align:middle;}"+
						  "a.fullscreen-button{background: url("+Video.zoomImage+") center center no-repeat;}"+
						  "a.fullscreen-button.shrink{background: url("+Video.shrinkImage+") center center no-repeat;}"+
						  "a.play-button-small.playing{background:url("+Video.pauseImage+") center center no-repeat;}"+
						  "a.play-button-small.paused{background:url("+Video.playImage+") center center no-repeat;}"+
						  "div.progress-bar{float:left;position:absolute;left:70px;right:70px;top:9px;background:url("+Video.trackImage+") repeat-x;height:8px;-moz-border-radius:8px;-webkit-border-radius:8px;}"+
						  "div.buffer-bar{position:absolute;height:8px;background:url("+Video.bufferedImage+") repeat-x;-moz-border-radius:8px;-webkit-border-radius:8px;}"+
						  "div.play-bar{position:absolute;height:8px;background:url("+Video.progressImage+") repeat-x;-moz-border-radius:8px;-webkit-border-radius:8px;}");
		if (!style.styleSheet) {
			style.appendChild(txt);
		} else {
			style.styleSheet.cssText = txt.text;
		}
		document.body.appendChild(style);
	}

	if (document.all && !window.opera && !window.Video.pageLoaded) {
		window.attachEvent("onload", function() {
			window.Video.pageLoaded = true;
			Video.findVideos();
		});
	} else {
		Video.findVideos();
	}
})();

