var renderedCategories = false;
	var cJSON = [];
	var aJSON = [];

	$(document).ready(function() {
	$.getJSON("categories.js", function(json) {
	    cJSON = json;
	    $.getJSON("apps.js", function(json) {
		aJSON = json;
		home();
	    });
	});
	$("#homeLink").click(function() { home(); });
	$("#searchtext").keyup(function(e) {
	    se($("#searchtext").val());
	});
	});        

	function home()
	{                            
	// Clear panel
	$("#mainPagePanel").html("");

	// Display categories
	$.each(cJSON.Categories, function(i, item) {

	    // Render categories
	    if (renderedCategories == false) {
		var cl = $("<a/>").attr("class", "leftNavLink").attr("href", "#").html(item.Title);
		cl.appendTo("#categories");
		cl.click(function() { sc(item) });
		$("<br/>").appendTo("#categories");
	    }

	    rendercat(item, "");

	});
	renderedCategories = true;
	}

	function se(searchText) {
	var searchTextUpper = searchText.toUpperCase();
	$(".searchresults").html("");
	if (searchText.length >= 3) {
	    $.each(aJSON.Applications, function(i, item) {
		if (item.Title.toUpperCase().indexOf(searchTextUpper) > -1 || item.Description.toUpperCase().indexOf(searchTextUpper) > -1) {
		    var cl = $("<a/>").attr("class", "leftNavLink").attr("title", item.Description).attr("href", "#").html(item.Title);
		    cl.click(function() { sa(item) }); 
		    cl.appendTo( $("<LI/>").appendTo(".searchresults") );
		}
	    });
	} 
	}

	function sa(item) {
	// Clear panel
	$("#mainPagePanel").html("");

	rendercat_byid( item.CategoryID, "categoryFullPage" );

	// Render apps
	$.each(aJSON.Applications, function(i, appitem) {
	    if (appitem.ApplicationID == item.ApplicationID) {
		renderapp(item);
	    }
	});
	}

	function sc(item) {
	// Clear panel
	$("#mainPagePanel").html("");

	rendercat(item, "categoryFullPage" );

	// Render apps
	$.each(aJSON.Applications, function(i, appitem) {
	    if (item.CategoryID == appitem.CategoryID) {
		renderapp(appitem);
	    }
	});
	}

	function rendercat_byid( categoryID, css )
	{
	$.each(cJSON.Categories, function( i, item ) {
	    if ( item.CategoryID == categoryID )
	    {
		rendercat( item, css );
	    }
	});
	}

	function rendercat(item, css)
	{
	    var divContainer = $("<div class='categoryContainer "+css+"'/>").attr("id", item.CategoryID);
	    $("<img/>").attr("src", "images/categories/" + item.Image).attr("align", "left").attr("style", "border: solid 1px #d0FFFF; margin: 0px 4px 4px 0px").appendTo(divContainer);
	    $("<a/>").attr("class", "categoryTitleLink").attr("href", "#").html(item.Title).appendTo(divContainer);
	    $("<br/>").appendTo(divContainer);
	    $("<span/>").attr("class", "categoryDescription").html(item.Description).appendTo(divContainer);
	    $("<br/><br/>").appendTo(divContainer);
	    $("<a/>").attr("class", "categoryLink").attr("href", "#").html("View apps in <strong>" + item.Title + "</strong>").appendTo(divContainer);
	    divContainer.appendTo($("#mainPagePanel"));
	    divContainer.children("A").click(function() { sc(item) });
	}

	function renderapp(item) {
	var divContainer = $("<div class='applicationContainer'/>");
	$("<a/>").attr("class", "applicationTitle").attr("href", item.Link).attr("target", "_blank").html(item.Title).appendTo(divContainer);
	$("<br/>").appendTo(divContainer);
	$("<span/>").attr("class", "applicationDescription").html(item.Description).appendTo(divContainer);
	$("<br/><br/>").appendTo(divContainer);
	$("<a/>").attr("class", "applicationLink").attr("href", item.Link).attr("target", "_blank").html("To download").appendTo(divContainer);
	divContainer.appendTo($("#mainPagePanel"));
	}