﻿
    var categories = new Array();
    var flyData = new Array();
    var pBuckets = new Array();
    var dontIncludeCategories = new Array();
    
    var pageSize = 15; // THIS CAN CHANGE...BUT SHOULD BE DEFAULTED TO 15 (5 PER ROW, 3 ROWS)
    var currentPage = 0;
    var rowSize = 5; //this has to stay fixed...KEEP YOUR PAWS OFF IT
    var cIndex = 0;
    var tItems = 0;
    
    var pContainer = null;
    var pData = null;
    var pItems = null;
    var cItems = null;
    var loadedCategories = false;
	var chosenCategory = 'featured';
	
    //LOAD FUNCTION..STARTS EVERYTHING
    $(document).ready(function(){
        pContainer = $(".portfolioThumbs");
        retrievePortfolio();
    });
    
    function retrievePortfolio(){                
        //$("#portContainer").html('Loading...please be patient...very patient');
        $.ajax({
            type: "GET",
            url: "/services/tacchandler.ashx?action=portfolio",
            data: "",
            dataType: "json",
            success: function(jsonData){
                pData = jsonData;
                loadPortfolio();
            }
        });
    }    
	
	function loadPortfolio(){                
        pContainer.html('');
        flyData = new Array(); //clear it out each time                
        loadCategories();
        
        var i = 0;                                
        pItems = new Array();
        //loop through the clients per category
        $.each(pData.clients, function (i, item){
            $.each(item.thumbnails, function (j, thumb){    
				if (chosenCategory == 'featured'){
	                if (thumb.featured)	pItems.push(new portfolioItem(item, thumb));					
				}
				else if (chosenCategory == 'all'){					
					pItems.push(new portfolioItem(item, thumb));
				}
				else {
	                if (thumb.category == chosenCategory) pItems.push(new portfolioItem(item, thumb));					
				}                
            });
        });
        
        pages = Math.ceil(pItems.length / pageSize);                                
      
        currentPage = 0; //we default to this on all portfolio refreshes
        movePage(0);                                
    }
    
    function toggleCategory(obj, uid){        
        clearToggles();
		$(obj).attr("class","active portCategory");
		
		chosenCategory = uid;
		
		loadPortfolio();
    }
    
	function clearToggles(){
		$.each($(".portCategory"), function (i, item){
            $(item).attr("class","nonactive portCategory");
        });
	}
	   
    function loadCategories(){
        if (loadedCategories) return false;              
		var t = '';
				
        $.each(pData.categories, function(i, item){
            categories[item.uid] = item;
			if (i % 4 == 0 && i != 0) t += '</td><td>';
			if (i == 0) t += '<td>';
			t+= "<a href='javascript: void(0);' onclick='toggleCategory(this, \"" + item.uid + "\");' id='" + item.uid + "' class='nonactive portCategory'>&bull; " + item.title + "</a>";
        });
		
		if (t.substring(t.length - 4, 4) != '<td>') t+= '</td>';
	       
        var finalTxt = '<tr>';
		
		finalTxt += '<td>';
		finalTxt += '<h1>I WANT TO SEE:</h1>(select one)';
		finalTxt += '</td>';
		
		finalTxt += '<td>';
        finalTxt += '<a href="javascript: void(0);" class="active portCategory"  onclick="toggleCategory(this, \'featured\');" id="featured">Featured Work</a>';
        finalTxt += '<a href="javascript: void(0);" class="nonactive portCategory"  onclick="toggleCategory(this, \'all\');" id="all">All Categories</a>';
		finalTxt += '</td>';			
		
		finalTxt += t;
	
		finalTxt += '</tr>';
    	
		
        $(".sortBy").html(finalTxt);
                
        loadedCategories = true;
    }
	                             
    function movePage(k){
		
		$("#pageLeft").show();
		$("#pageRight").show();
		
		$("#pageLeft").unbind("click").click(function(){movePage(-1);});
		$("#pageRight").unbind("click").click(function(){movePage(1);});
		
		$("#pageLeft").find("img").attr("src","/images/masterpage_templates/arrow-portLeft.png");
		$("#pageRight").find("img").attr("src","/images/masterpage_templates/arrow-portRight.png");
		
		
		if ((currentPage + k) >= 0 && (currentPage + k) <= pages){
			//we are within the good range
			currentPage += k;			
		}
		//BB7F0E
		if (currentPage == 0){
			//we are on the first item
			$("#pageLeft").unbind("click");
			$("#pageLeft").find("img").attr("src","/images/masterpage_templates/arrow-offportLeft.png");
		}
		
		if (currentPage == (pages - 1)){
			//we are on the first item
			$("#pageRight").unbind("click");
			$("#pageRight").find("img").attr("src","/images/masterpage_templates/arrow-offportRight.png");
		}
		
		
		var cPage = currentPage;
        
		
		var tmpPageCount = 0;
		try { if (pages > 0){ tmpPageCount = cPage + 1;}} catch(E){}
        var pageCounter = $("#pageCounter").html((tmpPageCount) + ' of ' + pages);
        var start = 0;
        var stop = 0;
        
        if (cPage == 0) stop = pageSize;
        
        if (cPage > 0){
            start = pageSize * cPage;
            stop = start + pageSize;
        }                               
        
        var temp = '';
        
        for (i = start; i < stop; i++){
            var cItem = pItems[i];
            if (cItem != null){
                temp+= cItem.generateThumbText();
            }
        }                     
                
        pContainer.html(temp);
        
        //don't call until you have all the html loaded               
        finalizePortfolio();           
    }
               
    function findCategory(id){    
        return categories[id].title;
    }

    function finalizePortfolio(){
        $(".pItem").hover(
            function(){  
                var portfolioFlyout = $(".portfolioFlyout");
                var id = $(this).attr("id");
                var txt = flyData[id];

				var x = (eval($(this).position().left) + (eval($(this).outerWidth()) * 2.6)) + 'px';
                var y = (eval($(this).offset().top) + 6) + 'px';
                portfolioFlyout.html(txt);
                portfolioFlyout.css("left", x);
                portfolioFlyout.css("top", y);                        
                portfolioFlyout.show();
            },
            function(){
                var portfolioFlyout = $(".portfolioFlyout");
                portfolioFlyout.html('').hide();                        
            }
        );
    }

    function loadItems(clientid, categoryid){   
		$(".portPage").fadeOut(100);
        var mStack = new Array();
        
        $.each(pData.items, function(i, item){
            if ($.inArray(categoryid, item.categories)>=0) {
                if ($.inArray(clientid, item.clients)>=0){
                    mStack.push(item);
                }
            }
        });
        
        //do the rest of the stuff
        loadGallery(mStack);
    }
    
    function loadGallery(items){
        //galleryFrame
        cIndex = 0;
        tItems = items.length;
        cItems = items;
        move(0);
    }

    function closeFrame(){    
        $(".portfolioWindow").attr("src", "").fadeOut(function(){
	
		});
		alreadyLoaded=false;
				$(".portPage").fadeIn(100);
        return false;
    }

	var alreadyLoaded = false;

    function move(i){			
		$("#arrowLeft").show();
		$("#arrowRight").show();
		
		if ((cIndex + i) >= 0 && (cIndex + i) <= tItems){
			//we are within the good range
			cIndex += i;			
		}
		
		if (cIndex == 0){
			//we are on the first item
			$("#arrowLeft").hide();
		}
		
		if (cIndex == (tItems - 1)){
			//we are on the first item
			$("#arrowRight").hide();
		}

        var cItem = cItems[cIndex];
        var portfolioWindow = $(".portfolioWindow");
        var url = cItem.url;
		
		$(".company-img").unbind("click");
		$(".company-img").css("cursor", "arrow");
		if (!cItem.url.contains(".jpg")){
			url = '/media/defaultImages/videoImageLarge.jpg';
			$(".company-img").click(function(){ window.open('http://www.youtube.com/thundertechvideo', 'yPage');});
			$(".company-img").css("cursor", "pointer");
		}
		
        $(".company-img").attr("src", url);
        $("#companyNameSpan").html(cItem.title);
        $(".portfolioText").html(cItem.text);
        
        //show and position      
		if (alreadyLoaded == false)         portfolioWindow.fadeIn(); 
		alreadyLoaded = true;

        var x = (portfolioWindow.position().left + (portfolioWindow.outerWidth() / 2) );// + jQuery(window).scrollLeft();
        var y = (($(window).height() / 2) - (portfolioWindow.outerHeight() / 2) + jQuery(window).scrollTop()); 
		portfolioWindow.css("top", "125px");
		
		$("#itemCategory").html(findCategory(cItem.categories[0]));
        return false;
    }

    String.prototype.contains = function(txt){
        if (this.indexOf(txt) >= 0) return true;
        return false;
    }
    
    function portfolioItem(tItem, tThumb){
        this.item = tItem;
        this.thumb = tThumb;
        
        this.generateThumbText = function(){
            var txt = this.item.title + '<br/>' + findCategory(this.thumb.category); 			
			var tid = this.item.uid + '-' + this.thumb.category;
			
            flyData[tid]=txt;            
//            return '<td class="pItem" id="' + tid + '"><a href="javascript: loadItems(\'' + this.item.uid + '\', \'' + this.thumb.category + '\')"><img src="' + this.thumb.url + '" /></a></td>';			
            return '<a class="pItem"  id="' + tid + '" href="javascript: loadItems(\'' + this.item.uid + '\', \'' + this.thumb.category + '\')"><img src="' + this.thumb.url + '" /></a>';
        };
    }