var html5Platforms = ["iPad", "iPhone", "BlackBerry"];
var html5 = false;
for (var i = 0; i < html5Platforms.length; i++) {
	if (navigator.platform.indexOf(html5Platforms[i]) >= 0) {
		html5 = true;
		break;
	}
}

$(document).ready(
	function() {
		$(window).resize(resize);
		
		$("#video-list .video-featured").bind("mouseenter", function() {
			$("#video-list .see-all .video-featured a").stop(true,false).animate({marginTop:0});
		});
		$("#video-list .video-featured").bind("mouseleave", function() {
			$("#video-list .see-all .video-featured a").stop(true,false).delay(500).animate({marginTop:-30});
		});
		$("#video-list .video-corporate").bind("mouseenter", function() {
			$("#video-list .see-all .video-corporate a").stop(true,false).animate({marginTop:0});
		});
		$("#video-list .video-corporate").bind("mouseleave", function() {
			$("#video-list .see-all .video-corporate a").stop(true,false).delay(500).animate({marginTop:-30});
		});
		$("#news .content, #news .see-all").bind("mouseenter", function() {
			$("#news .see-all a").stop(true,false).animate({marginTop:0});
		});
		$("#news .content, #news .see-all").bind("mouseleave", function() {
			$("#news .see-all a").stop(true,false).animate({marginTop:-30});
		});
	}
);

$(window).load(function() {
	resize();
});

function resize() {
	var videoWidth = $('#video').width();
	var videoMarginLeft = parseInt((videoWidth - 1260) / 2);
	if (videoMarginLeft < 0) {
  		$('#video object, #video embed, #video .container').css("margin", "0 0 0 " + videoMarginLeft + "px");
	} else {
  		$('#video object, #video embed, #video .container').css("margin", "0 auto");
	}
}

function playVideo(id, title) {
	if (html5) {
		$('#vimeoScript').remove();
		
		var scriptEle = document.createElement("script");
		scriptEle.src = "http://vimeo.com/api/v2/video/" + id + ".json?callback=vimeoCallback";
		scriptEle.type = "text/javascript";
		scriptEle.id = "vimeoScript";
		
		$('body').append(scriptEle);			
	} else {
		if ($('#video object, #video embed, #video .container').length > 0) {
			$('#video').flash(function() {
				this.loadVideo(id + "|" + title);
			});	
		} else {
			$('#video').flash(
				{
					name:'vimeoPlayer',
					swf:'/resources/swf/video.swf',
					allowFullScreen:true,
					allowScriptAccess:'always',
					wmode:'transparent',
					align:'',
					flashvars:{
						id:id,
						title:title
					}
				}
			);			
		}
	}
}

function vimeoCallback(obj) {
	$('#video').empty();
	
	var vimeoData = obj[0];
	var vimeoImage = vimeoData.thumbnail_large;
	var vimeoWidth = parseInt(vimeoData.width);
	var vimeoHeight = parseInt(vimeoData.height);
	
	var container = document.createElement("div");
	container.className = "container";
	$('#video').append(container);
	
	var canvas = document.createElement("canvas");
	canvas.width = 1260;
	canvas.height = 709;
	canvas.id = "grid";
	
	var vimeo = document.createElement("iframe");
	vimeo.src = "http://player.vimeo.com/video/" + vimeoData.id;
	vimeo.width = vimeoWidth;
	vimeo.height = vimeoHeight;
	vimeo.style.marginTop = parseInt((709 - vimeoHeight) / 2) + "px";
	vimeo.frameborder = 0;
	
	var backgroundImage = document.createElement("div");
	backgroundImage.className = "bg";
	
	$('#video .container').append(canvas);
	$('#video .container').append(backgroundImage);
	$('#video .container .bg').append(vimeo);		
	
	var grid = document.getElementById('grid');
	var context = grid.getContext('2d');
	
	$('#imageScript').remove();
	var server_url = "getImageData.php?url=" + escape(vimeoImage) + "&callback=imageCallback";

	var imageScript = document.createElement('script');
	imageScript.src = server_url;
	imageScript.id = "imageScript";
	$('body').append(imageScript);			
	
	resize();
}

function imageCallback(data) {
	var image = new Image();
	image.src = data.data;
	image.onload = function() {
		var grid = document.getElementById('grid');
		var context = grid.getContext('2d');
		context.drawImage(image, 0, 0, 42, 24);
		var canGetImageData = false;
		try {
			var imgd = context.getImageData(0, 0, 42, 24);
			canGetImageData = true;
		} catch(e) {
		}
		
		if (canGetImageData) {
			var imgd = context.getImageData(0, 0, 42, 24);
			var pix = imgd.data;

			// Loop over each pixel
			var indexCol = 0;
			var indexRow = 0;
			for (var i = 0, n = pix.length; i < n; i += 4) {
				var red = pix[i];
				var green = pix[i+1];
				var blue = pix[i+2];

				context.fillStyle = "rgb(" + red + "," + green + "," + blue + ")";
				context.fillRect(indexCol * 30, indexRow * 30, 30, 30);

				indexCol++;
				if (indexCol >= 42) {
					indexRow++;
					indexCol = 0;
				}
			}				
		} else {
			// size canvas and scale up
			grid.width = 42;
			grid.height = 24;
			context.drawImage(image, 0, 0, 42, 24);
		}
	};
}