// some checks
function checkForPreAndroid2_3() {
	useragentstring = navigator.userAgent.toLowerCase();
	var isPreAndroid2_3 = false;
	var androidpos = useragentstring.search("android");
	if (androidpos > -1) {
		var remstr = useragentstring.slice(androidpos+8);
		var sempos = remstr.search(";");
		if (sempos > 0) {
			var versionstring = remstr.slice(0, sempos);
			var versiondigits = versionstring.split(".");
			if ((Number(versiondigits[0]) < 2) || ((Number(versiondigits[0]) == 2) && (Number(versiondigits[1]) <= 3)))
				isPreAndroid2_3 = true;
		}
	}
	return isPreAndroid2_3;
}

var isMobileBrowser = !!navigator.userAgent.toLowerCase().match(/(iphone|ipod|ipad|mobile|android)/);
var isPreAndroid2_3 = checkForPreAndroid2_3();




function checkVideoSupport() {
	$('div.moviecontainer').jmeControl({
		addThemeRoller: false,
		volumeSlider: {
			range: 'min',
			//changeing the volume will unmute the player
			mutestate: true
		},
		timeSlider: {
			range: 'min'
		}
	})
	// add some UI behavior
	//if video starts to play, make controls invisible on userinactivity
	.bind('play', function(){
		$(this)
			.unbind('.useridle')
			//useractive/userinactive event is provided by utils/useractivity.js plugin
			.bind('useractive.useridle', function(){
				//for keyboard users: prevent scrollInToView, we handle this with animation
				var that = this;
				setTimeout(function(){
					$('div.media-controls', that).scrollTop(0);
				}, 0);
				$('div.media-controls-box', this).stop().animate({
					opacity: 1, 
					bottom: 0
				});
			})
			//set idletime to 1200ms (defaults to 2500) and assume that control isn't idled initially (idle defaults to true) 
			.bind('userinactive.useridle', {idletime: 2500, idle: false}, function(){
				$('div.media-controls-box', this).stop().animate({
					opacity: 0, 
					bottom: $('div.media-controls-box', this).outerHeight() * -1
				});
			})
		;
	})
	//if video is paused/ended make video controls always visible
	.bind('pause ended', function(){
		$(this).unbind('.useridle');
		$('div.media-controls-box', this).stop().animate({
			opacity: 1, 
			bottom: 0
		});
	});
}



$(document).ready(function() {
	// pic thumbnails
	$("#content div.thumbnails a.pic").colorbox({opacity: 0.8, initialWidth: 50, initialHeight: 50, maxWidth: "90%", maxHeight: "90%", returnFocus: false, title:function() {
		return ("<b>"+$(this).attr("title")+"</b> "+$(this).attr("data-description"));
	}, current: "pic {current} of {total}", preloading: true});
	// video thumbnails
	$("#content div.thumbnails a.clip").colorbox({opacity: 0.8, initialWidth: 50, initialHeight: 50, width: 500, height: 500, returnFocus: false, scrolling: false, href:function() {
		return ($(this).attr("href")+"&ajax=true");
	}, title:function() {
		return ("<b>"+$(this).attr("title")+"</b> "+$(this).attr("data-description"));
	}, current: "clip {current} of {total}", preloading: false, onComplete: function(e) {
			var tx = 0;
			var ty = 0;
			// window
			var ww = $(window).width()-10-tx;
			var wh = Math.max(1, $(window).height()-30-ty);
			var wa = ww/wh;
			// size
			//var img = $(this).children("img");
			var iw = $(this).attr("data-width");//img.width();
			var ih = Math.max(1, $(this).attr("data-height"));//img.height());
			var ia = iw/ih;
			// target video
			var vw = ww*0.9;
			var vh = vw/ia;
			if (ia < wa) {	// by height
				vh = wh*0.9;
				vw = vh*ia;
			}
			vw = Math.min(iw, Math.round(vw));
			vh = Math.min(ih, Math.round(vh));
			$.colorbox.resize({innerWidth: vw+"px", innerHeight: vh+"px"});
			$("#cboxContent video, #cboxContent object").width(vw-tx).height(vh-ty);
			checkVideoSupport();
		}
	});
	// thumbnails hover
	$("#content div.thumbnails a").hover(function(e) {
		$("#content div.thumbnails a").not(this).addClass("dim");
	}, function() {
		$("#content div.thumbnails a").removeClass("dim");
	});
	
	// home hover
	$("#homecontent a").hover(function(e) {
		$("#homecontent a").not(this).addClass("dim");
	}, function() {
		$("#homecontent a").removeClass("dim");
	});
	
	// project picscroller
	$("#projects div.files").css("overflow", "hidden").scrollTo(0);
	$("#projects div.fileselector span").click(function() {
		var project = $(this).parent().parent();
		var i = $(this).parent().children().index(this);
		gotoProjectFile(project, i);
	});
	$("#projects div.navleft").click(function() {
		var project = $(this).parent();
		var n = Number(project.children("div.files").data('currentfile'));
		if (isNaN(n)) n = 0;
		else n = Math.max(0, n-1);
		gotoProjectFile(project, n);
	});
	$("#projects div.navright").click(function() {
		var project = $(this).parent();
		var f = project.children("div.files");
		var n = Number(f.data('currentfile'));
		if (isNaN(n)) n = 1;
		else n = Math.min(f.children("div").length-1, n+1);
		gotoProjectFile(project, n);
	});
	
	checkVideoSupport();
});

function pauseAllVideos() {
	$("div.moviecontainer").each(function(e) {
		var v = $(this).children("video");
		if (v.length > 0) {
			var ve = v.get(0);
			if (!ve.paused)
				ve.pause();
			var img = $(this).children("img.placeholder");
			if (img.length > 0) {
				img.show();
				v.hide();
			}
		}
	});
}

function playVideo(video) {
	if (video.length < 1) return;
	video.parent().children("img.placeholder").hide();
	video.show().get(0).play();
}

function gotoProjectFile(project, num) {
	var f = project.children("div.files");
	if (f.data('currentfile') == num) return;	// nothing to do
	f.data('currentfile', num);

	if (num == (f.children("div").length-1))
		project.children("div.navright").hide();
	else
		project.children("div.navright").show();
	if (num == 0)
		project.children("div.navleft").hide();
	else
		project.children("div.navleft").show();

	var target = f.children("div:eq("+num+")");
	f.scrollTo(target, {axis: "x", duration: 500, easing: "easeInOutCubic", offset: -480, over: 0.5});
	project.children("div.fileselector").children("span").removeClass("active");
	project.children("div.fileselector").children("span:eq("+num+")").addClass("active");
	
	// stop all playing videos
	pauseAllVideos();
	// start playing current video
	playVideo(target.children("video").first());
}