function makePortfolio(){
	var $numberOfCols = 5;
	var $numberOfRows = 3;
	var $imageWidth = 150;
	var $imageHeight = 125;
	var $fullWidth = 940;
	var $fullHeight = 500;
	var $myDiv = $('#portLoad');
	var $sidePad = 0;
	var $leftPad = 0;
	var $topPad = 0;
	var $perImagePadding = 0;
	var $nodeArray = [];
	var $generatedText = "";
	var $posts = [];
	var $that = {};
	var $dialog = $('#dialog');
	$('#sorts').find('a').click(setFilter);
	function makeMe(){
		$leftPad = $myDiv.position().left;
		$topPad = $myDiv.position().top;
		$sidePad = $('.panel').css('padding-left');
		$sidePad = parseFloat($sidePad.replace(/\D+/,""));
		$fullWidth = $('.panel').innerWidth();
		var insidePanel = $fullWidth - $sidePad*2;
		var allPadding = insidePanel - ($numberOfCols * $imageWidth);
		$perImagePadding = allPadding / ($numberOfCols - 1);
		
		$fullHeight = $('.panel').innerHeight();
		insidePanel = $fullHeight - $sidePad - $topPad;
		allPadding = insidePanel - ($numberOfRows * $imageHeight);
		$perImageYPadding = allPadding / ($numberOfRows-1);
		
		if($generatedText == ""){
			$('#portLoad').html("<i>Loading</i>");
			$.getJSON('http://www.amberdigital.com/wordpress/?callback=?&json=1&orderby=modified&custom_fields=PortfolioImage,PortfolioLink',jsonLoaded);
		} else {
			renderTable("all");
		}
		
		
	}
	$dialog.dialog({
		autoOpen: false,
		width: 600,
		draggable:false,
		resizable:false,
		modal:true
	}
	);
	function showModalWith(o){
		var dialogHTML = "";
		var link = getFullURL(o.link);
		var txt = "<a href='" + link + "' target='_blank'><img id='dialogImg' src='" + o.imageURL + "'/></a>";
		txt += "<div class='textPanel'><div class='textContent'><p>" + o.blurb + "</p>";
		txt += "<p><a href='" + link +"'><img src='images/viewExample.png' alt='View Example'/></a></p></div></div>";
		$dialog.empty();
		$dialog.append(txt);
		$dialog.dialog('option','title',o.title);
		
		$dialog.dialog('open');
	}
	function setFilter(e){
		e.preventDefault();
		$(this)
            .parents('#sorts')
                .find('a')
                    .removeClass('selected')
                .end()
            .end()
            .addClass('selected');
		var filterString = $(this).attr('href').substr(1);
		for(var i in $nodeArray){
			var cats = $nodeArray[i]["categories"];
			var is = false;
			for(var j in cats){
				
				if(cats[j].slug==filterString){
					is = true;
				}
			}
			if(is || filterString == "all"){
				showItem(i);
			} else {
				hideItem(i);
			}
		}
	}
	function showItem(id){
		// find Item with this id.
		var item = $myDiv.find('div[id$="' + id + '"]').get(0);
		$(item).fadeTo(200,1);
		
		//var el = $('#slider .navigation').find('a[href$="' + data.id + '"]').get(0);
	}
	function hideItem(id){
		var item = $myDiv.find('div[id$="' + id + '"]').get(0);
		$(item).fadeTo(200,.25);
	}
	
	function jsonLoaded($json,status){
		$posts = $json.posts;

		renderTable("all");

	}
	function renderTable(whichKind){
		clearMe();
		$generatedText = "";
		for(var i = 0;i<$posts.length;i++){
			doNode($posts[i],i);
		}
		
		$myDiv.append($generatedText);
		$('#portLoad>div').each(positionDiv);
		$('img.loadedImage').hide();
		$('img.loadedImage').bind('load', function (e) {
			
			$(this).fadeIn(1000,function(){$(this).unbind();});
		});
		$('a.imageLink').click(doImageClick);
		
	}
	function doImageClick(e){
		e.preventDefault();
		var z = $(this).find('img')[0];
		var ind =  parseInt($(this).find('img')[0].id.substr(5));
		showModalWith($nodeArray[ind]);
	}

	function positionDiv(index,el){
		var col = (index % $numberOfCols);
		var row = Math.floor(index / $numberOfCols);
		var xPos = $leftPad + (($imageWidth+ (col==0?0:$perImagePadding)) * col);
		
		
		var yPos = $topPad + row * ($imageHeight + (row == 0 ? 0 : $perImageYPadding));
		if(yPos != 0){
			
		}
		$(this).css({position:"absolute",left:xPos,top:yPos});
		
	
	}
	function doNode(o,i)
	{
		var txt = "";
		//if(i%$numberOfCols==0){ txt += '<tr>'}
		var imageURL =getFullURL(o["custom_fields"].PortfolioImage[0]);
		var linky = o["custom_fields"].PortfolioLink[0];
		txt += ('<div class="gridItem" id="grid' + i + '"><a class="imageLink" title="'+o['title']+'" href="#index' + i + '"><img class="loadedImage" id="index'+ i +'" width="' + $imageWidth + '" height="'+$imageHeight+'" src="' + imageURL + '" /></a></div>');
		//if(i%$numberOfCols==$numberOfCols-1){ txt += '</tr>';}
		var item = {imageURL:imageURL,link:linky,blurb:o["content"],title:o["title"],categories:o["categories"]};
		$nodeArray[i] = item;
		$generatedText += txt;
		
	}
	function getFullURL(URL){
		console.log("URL is " + URL);
		if (!URL.match(/http/)) {
			console.log("URL DOESN'T MATCH HTTP://");
			URL = "http://www.amberdigital.com" + URL;
		} 
		return URL;
	}
	function clearMe(){
		
		$myDiv.empty();
	
	}
	$that.clearMe = clearMe;
	$that.makeMe = makeMe;
	return $that;
	
}
