/* Binds thickbox / colorbox for projects page and homepage slider/ */
var bindThickbox = function(target){
	$(target).colorbox({ 
		current:"", 
		previous:"<span>&lt; </span>", 
		next:"<span>&gt;</span>",
		fragment: " #inner-content",
		onComplete: function() { bindPlayer(); },
		width: '855px',
		scroll: false
    });
};

/* Binds flowplayer elements. First checks to see if elements is on the page. */
var bindPlayer = function(){
	var activebox = 0;	
	$('#twitter-video').click(function(){ 
		$('#box2').click(); 
	});
	
	$('#crop').click(function(){ 
		$('#box2').click(); 
	});
	
	$('#player').click(function(){ 
		$('#box2').click();	
	 });
    
    //set up varible
	var duration = 1000;
	
	//set up jquery settings
	//jQuery.easing.def = "easeOutBounce";	
	var Short = '80px';
	var Tall = '260px';
	var Wide = '690px';
	var Thin = '80px';
	var PositionLeftFar = '715px';
	var PositionLeftClose = '105px';
	var activebox = 0;
	
	//helper functiotions
	function resetClass(){
		$("#box1, #box2, #box3, #box4").removeAttr("class");
	}
	
	//disable the links for selecting, enable them within the box.	
	$("#box4 a").click(function(){ 
		if(activebox == 4){  
			var url = $(this).attr("href");
			window.location = url;  
		}
	});
	
	$("#box3 a").click(function(){ 	
		if(activebox == 3){  
			var url = $(this).attr("href");
			window.location = url;  
		}
	});
	
	$("#box1").click( function(){
		if (!$(this).is(':animated')) { 
			activebox = 1;
			resetClass();
			$(this).find('.box-content a').click(function(){ return true; });
			$(this).addClass('active');		
			$(this).animate({ width: Wide, height: Tall, opacity: '1' }, duration);
			$("#box2").animate({ width: Thin, left: PositionLeftFar, height: Tall, top: '-280px' }, duration);
			$("#box3").animate({ width: Wide, height: Short, top: '-275px' }, duration);
			$("#box4").animate({ width: Thin, left: PositionLeftFar, height: Short }, duration);
			//removeFlash();
		}
		return false;
	});

	$("#box2").click( function(){
		if (!$(this).is(':animated')) { 
			activebox = 2;
			resetClass();
			$(this).addClass('active');
			$(this).animate({ width: Wide, left: PositionLeftClose, height: Tall, top: '-280px', opacity: '1'}, duration);
			$("#box1").animate({ width: Thin, height: Tall}, duration);	
			$("#box3").animate({width: Thin, height: Short, top: '-275px' }, duration);
			$("#box4").animate({ width: Wide, left: PositionLeftClose, height: Short}, duration);
			
		}
		return false;	
	});

	$("#box3").click( function(){
		if (!$(this).is(':animated')) { 
			activebox = 3;
			resetClass();
			$(this).addClass('active');		
			$(this).animate({ width: Wide, height: Tall, top: '-95px', opacity: '1' }, duration);
			$("#box1").animate({ width: Wide, height: Short}, duration);	
			$("#box2").animate({ width: Thin, left: PositionLeftFar, top: '-100px', height: Short}, duration);
			$("#box4").animate({ width: Thin, left: PositionLeftFar, height: Tall }, duration);
			//removeFlash();
		}
		return false;	
	});
	
	$("#box4").click( function(){
		if (!$(this).is(':animated')) { 
			activebox = 4;
			resetClass();
			$(this).addClass('active');	
			$(this).animate({ height:Tall, left:PositionLeftClose, top:'-375px', width: Wide, opacity: '1' }, duration);
			$("#box1").animate({ width: Thin, height: Short }, duration);	
			$("#box2").animate({ width: Wide, left: PositionLeftClose,top: '-100px', height: Short }, duration);
			$("#box3").animate({ height:Tall, top:'-95px', width:Thin }, duration);
			//removeFlash();
			return false;
		}	
	});
	
	var player = $('#player').length;
	var twitter = $('#twitter-video').length;
	var crop = $('#crop').length;

	if(	player !== 0 ){
		//console.log('bind');
        flowplayer("player", "/flowplayer/flowplayer-3.1.5.swf", { 
            clip:  { 
                autoPlay: false, 
                autoBuffering: true 
            }
        });
    }
    
    if(	twitter !== 0 ){
        flowplayer("twitter-video","/flowplayer/flowplayer-3.1.5.swf",{ 
            clip:  { 
                autoPlay: false, 
                autoBuffering: true 
            }
        });
	}
	
	if(	crop !== 0 ){
        flowplayer("crop", "/flowplayer/flowplayer-3.1.5.swf", { 
            clip:  { 
                autoPlay: false, 
                autoBuffering: true 
            }
        });
	}
}

/* function to handle redirect JS enabled users form the full content page */
function singleProjectRedirect(url) {      
    if($('body').attr('class') == 'projects-single'){
        window.location = url.attr('href').replace('labs/','labs#')
    }     
}	
    
/* function to control the layout of the google reader feed imported though JS. */
function buildContent (blog) {
	if (!blog || !blog.items) return;
	var code="<ul>";
	for (var i = 0; i < blog.items.length; i++) {
		var item = blog.items[i];
		code=code + "<li><a href='"+item.alternate.href+"'>"+ item.title+ "</a></li>";
	}
	code=code + "</ul>"
	$(code).appendTo('#feed-content');
}

function buildTwitter (blog) {
	if (!blog || !blog.items) return;
	
	var code="<ul>";
	for (var i = 0; i < blog.items.length; i++) {
		var item = blog.items[i];
		code=code + "<li><a href='"+item.alternate.href+"'>"+ item.title+ "</a></li>";
	}
	code=code + "</ul>"
	//console.log('hello');
	
	$(code).appendTo('#feed-twitter');
}



/* function to pull the google maps API in for the contact page */
function initialize() {
    if (GBrowserIsCompatible()) {
        var map = new GMap(document.getElementById("map_canvas")); 
        var point = new GLatLng(51.517765, -0.123905);
        map.setCenter(new GLatLng(51.517765, -0.123905), 17);
        var marker = new GMarker(point);
        map.addOverlay(marker);
        map.setMapType(G_HYBRID_MAP);
        map.setUIToDefault();
    }
}

var addBoxesCSS = function() {
    var headtg = document.getElementsByTagName('head')[0];
    if (!headtg) {
        return;
    }
    var linktg = document.createElement('link');
    linktg.type = 'text/css';
    linktg.rel = 'stylesheet';
    linktg.href = '/styles/boxs.css';
    linktg.title = 'Boxes';
    headtg.appendChild(linktg);
}

/* Action blocks, makes things happen when the Dom is ready. */
$(document).ready(function() {
	//singleProjectRedirect($(location));
	//bindThickbox(".project-excerpt a");
	//bindThickbox(".homepage .slide a");
	if($('body').hasClass('homepage') || $('body').hasClass('projects')) {
	   addBoxesCSS();
	   $("#slider").slider();
	   $numLinks = $('a[href*="labs/"]').length;
	   $('a[href*="labs/"]').each(function(i){
	       var url = $(this).attr('href');
	       var new_url = url.replace(/\/([^\/]+)$/, "#$1");
    	   $(this).attr('href', new_url);
	       if(((i+1 != $numLinks && $('body').hasClass('homepage')) && (i+1 != $numLinks-1 && $('body').hasClass('homepage'))) || $('body').hasClass('projects')) {
	           if($(this).find('img').length != 0) {
	               $(this).attr('rel', 'sliderGroupImgs');
	           } else {
	               $(this).attr('rel', 'sliderGroup');
	           }
	       }
	       $(this).colorbox({
                href: url,
                current:"", 
                previous:"<span>&lt;</span>", 
                next:"<span>&gt;</span>",
                fragment: " #inner-content",
                onComplete: function() {bindPlayer();},
                width: '855px',
                scroll: false,
                returnFocus: false
            });
	   });
    }
    
    if(location.hash) {
        $('a[href*="labs'+$(location).attr('hash')+'"]').click();
    }
	
	$('#mainContent a[href*=twitter.com/]').each(function() {
	   var $item = $(this);
	   if($item.html() == 'twitter' || $item.find('img[alt*=twitter]')) {
	       $item.addClass('twitter-anywhere-user-url');
	       $username = $item.attr('href').replace(/http:\/\/twitter.com\//,'');
	       $item.attr('title',$username);
	   } else {
	       $item.addClass('twitter-anywhere-user');
	   }
    });
    
    twttr.anywhere(function(twitter) {
        twitter.hovercards();
        twitter(".twitter-anywhere-user-url").hovercards({
            username: function(node) {
                if(node.nodeName != 'A'){
                    return node.parentNode.title;
                } else {
                    return node.title;
                }
            }
        });
    });
    
    var imagePath = [];
    imagePath[0] = '/images/backgrounds/brickOptimised.jpg';
    imagePath[1] = '/images/backgrounds/ManHoleOptimised.jpg';
    imagePath[2] = '/images/backgrounds/PavementOptimised.jpg';
    imagePath[3] = '/images/backgrounds/ChevronOptimised.jpg';
    imagePath[4] = '/images/backgrounds/Cheveron2Optimised.jpg';
    imagePath[5] = '/images/backgrounds/windowOptimised.jpg';
    imagePath[6] = '/images/backgrounds/booksOptimised.jpg';
    
    $imageToUse = Math.floor(Math.random()*(imagePath.length-1));
    
    var bgImg = document.createElement('img');
    bgImg.setAttribute('src', imagePath[$imageToUse]);
    bgImg.setAttribute('id', 'bgFake');
    bgImg.setAttribute('style', 'display:none;');
    
    $('body').append(bgImg);
    $('body').append('<div id="backgroundImage" style="height: '+document.body.scrollHeight+'px;"></div>');
    $bgFake = $('#bgFake');
    $bgFake.load(function(){
        $('body').addClass('image_'+$imageToUse);
        var mobile = (/iphone|ipad|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));  
        if (!mobile) {  
             $('body').addClass('notMobile');
        } 
        $bgFake.remove();
        $('#backgroundImage').fadeOut(function(){
            $('#backgroundImage').remove();
        });
    });

});

//Set Paramaters for other plugins
var disqus_developer = false;