/*
$('#raster a').attr("href", function () {
	this.attr("href","test.html");
}); */

function callback(hash)
{
    // do stuff that loads page content based on hash variable
    if(hash && hash != "0") {
		$.ajax({
			url: "content/"+hash+".html",
			cache: false,
			success: function(html){
				$("#details").html("");
				$("#details").append(html);
				$("#details").fadeIn("slow");
				$("#close").fadeIn("slow");
			}
		});
    } else if (hash == "0") {
    	$("#details").fadeOut("slow");
    	$("#close").fadeOut("slow");
		$.ajax({
			url: "raster.html",
			cache: false,
			success: function(html){
				$("#details").html("");
				$("#raster").html("");
				$("#raster").append(html);
				$("#raster").fadeIn("slow");
				$("#close").fadeOut("slow");
				create_grid();
			}
		});
    }
}

$(document).ready(function() {
    $.history.init(callback);
    $("#close").click(function(){
    	$.history.load("0");
    	$("#raster").fadeIn("slow");
    	return false;
    });
    create_grid();
});

function create_grid() {
    $("#raster a").click(function(){
    	var newhref = this.href.replace(/.*\?id=/, '');
	   	$.history.load(newhref);
        return false;
    });
    $("#raster a").mouseover(function(){
    	var id = $(this).text().replace(/ /, '_');
    	var meshtype = $(this).text().replace(/ .*/, '');
    	var meshcolor = $(this).text().replace(/.* /, '');
    	var newid = "#"+id;
    	var list = new Array("Gold","Silver","Bronze");
    	for(var i = 0; i < list.length;i++) {
    		if(list[i] == meshcolor) {
    			$("#"+meshtype+"_"+list[i]).css("display","block");
    		} else {
    			$("#"+meshtype+"_"+list[i]).css("display","none");
    		}
    	}
        return false;
    });
}

/*
function request_id(id) {
	var html = $.ajax({
		url: "content/"+id+".html",
		async: false
	}).responseText;
	$("details").html(html);
	
}*/