// PORTFOLIO STUFF
var currentPosition;
var slideWidth = 1029;
var numberOfSlides = 0;

//TO TRACK WHICH PROJECTS HAVE BEEN LOADED FOR VIEW ALL MODE
var currentProjIndex = 0;

//TO TELL WHETHER VIEW ALL HAS BEEN CLICKED OR NOT
var selected = 0;

var projTot = 0;

var masterData;

var currCaption = "";

var captionArray = new Array();

var initLoad = true;

var fadeToTgt = .15;

$(function(){
	//GETS THE DATA FOR THE ALL PROJECTS
	//$.getJSON('/work/index.json', buildSlideShow);

	//GETS SPECIFIC PROJECT
	//$.getJSON('/work/view/1.json', function(data){console.log(data)});
	//$.getJSON('/work/view/'+ data[0]['PortfolioProject']['id']+".json", function(data){ console.log(data) });

	//GETS PROJECTS FROM A SPECIFIC TAG
	//$.getJSON('/work/index/tag_limit:18/index.json', buildSlideShow);

	if(pageID == 11) {
		$.getJSON('/work/index/tag_limit:18/index.json', buildSlideShow);
	//} else if (pageID == 65){
		//$.getJSON('/work/index.json', buildSlideShow);
	} else {
		if(pageSlideShow){
			$.getJSON('/work/index/project_ids:'+ pageSlideShow + "/index.json", buildSlideShow);
		}
	}

	if (pageID == 65){
		$.getJSON('/work/index.json', setUpTaglist);
	}
});

var buildSlideShow = function(theData) {
	currentPosition = 0;

	$(document).ready(function() {
	projTot = theData.length;


	$('#content-wrapper').prepend("<div id='interactive-tour'><div class='container'><div id='slideInner'></div>")
		if(pageID == 11) {
			masterData = theData;
			$.getJSON('/work/view/'+ theData[0]['PortfolioProject']['id']+ '.json', loadProject);
			$('#interactive-tour .container').append("<div id='tour-footer'><p class='header'>PHOTO CATEGORIES</p></div>");
			$('#interactive-tour .container .header').after("<ul id='tour-categories'></ul>");
			$('#tour-categories').append("<li class='tour-category-item' id='tour-project-0'>SEE ALL PHOTOS</li>");
			$.each(theData, function(i, proj){
				$('#tour-categories').append("<li class='tour-category-item' id='tour-project-"+(i+1)+"'>"+proj.PortfolioProject.title+"</li>");
			});
			$('#tour-categories').append("<li class='tour-category-item' id='see-production'>SEE PRODUCTION PHOTOS</li>");


			$('.tour-category-item')
		    .bind('click', function(){
					if($(this).attr('id') != 'see-production'){
						var tempArray = $(this).attr('id').split("-");
						$('.tour-category-item-active').attr('class', 'tour-category-item');
						$(this).attr('class', 'tour-category-item-active');
						removeSlides(tempArray[2]);
					} else {
						window.location = "/65";
					}
				});

			$('#tour-project-0').attr('class', 'tour-category-item-active');
		} else {
			$.getJSON('/work/view/'+ theData[0]['PortfolioProject']['id']+ '.json', loadProject);
			//ADDS THE TAGS/TAG GROUPS
			if(pageID == 65) {
				//$.getJSON('/work/index.json', setUpTaglist);
				//setUpTaglist(theData);
			}
		}
		});

		openCloseSlideshow("open");

	$('#interactive-tour .container')
	    .append('<div class="control" id="rightControl">Move right</div>')
			.append('<div class="control" id="leftControl">Move left</div>')
			.append('<div id="loading"><img src="/media/img/ajax-loader.gif"><br>loading project</div>')
			.append('<div id="view-caption"><img src="/media/img/view_caption.png"></div>')
			.append('<div id="caption"><div id="caption-text"></div></div>');

	$('.control')
    	.bind('click', function(){
				// Determine new position
		      currentPosition = ($(this).attr('id') == 'rightControl') ? currentPosition+1 : currentPosition-1;

			 	//IF IN VIEW ALL MODE LOAD IN THE NEXT PROJECT
					if(selected == 0 && currentPosition == numberOfSlides -2 && currentProjIndex < projTot-1) {
							$("#loading").show();
							currentProjIndex++;
							$.getJSON('/work/view/'+ theData[currentProjIndex]['PortfolioProject']['id']+ '.json', loadProject);
					}

				//PUTS OPACITY ON ALL SLIDE BUT THE ONE BEING VIEWED
				$('.slide').fadeTo("fast", fadeToTgt);

		    // Hide / show controls
		      manageControls(currentPosition);
					$('#slideInner').animate({ 'marginLeft' : slideWidth*(-currentPosition) }, 250, function(){
						$('.slide').eq(currentPosition).fadeTo('fast', 1);
					});
					$('#caption').hide();
			});

	$('#close-caption-btn')
		.bind('click', function(){
			$('#caption').hide();
			manageControls(currentPosition);
		});

	$('#leftControl').hide();
	$('#slideInner').hide();
	$('#view-caption').hide();
	$('#caption').hide();

	$('#caption').bind ('mouseover', function(){
		$(this).show();
		$(this).css('cursor', 'pointer');
	})
	/*$('#view-caption')
		.bind('mouseover', function(){
			$(this).show();
		});

	$('#view-caption')
		.bind('click', function(){
			$(this).hide();
			slideClick(captionArray[currentPosition].id);
		});*/
}



var removeSlides = function(theID) {
	selected = theID;
	currentPosition = 0;
	currentProjIndex = 0;
	numberOfSlides = 0;
	captionArray = new Array();
	$('#leftControl').hide();
	$('#rightControl').hide();
	$("#loading").show();
	$('#slideInner').remove();
	$('#interactive-tour .container').prepend("<div id='slideInner'><div>");
	if(pageID == 11){
		var tempID = theID-1;
		tempID < 0 ? tempID = 0 : tempID = tempID;
		$.getJSON('/work/view/'+ masterData[tempID]['PortfolioProject']['id']+ '.json', loadProject);
	} else {
		$.getJSON('/work/view/'+ theID + '.json', loadProject);
	}
}

var loadProject = function(theData){
	$.each(theData.PortfolioSlide, function(i, slide){
		var tempArray = new Array();
		tempArray['id'] = slide.Asset.id;
		tempArray['slide_text'] = slide.slide_text;
		captionArray.push(tempArray);
		$('#slideInner').append('<div class="slide" id="slide_'+ slide.Asset.id +'"><img src="/media/assets/'+slide.Asset.file_name+'"></div>')
		numberOfSlides++;
		if(initLoad) {
			initLoad = false;
		} else {
			if(i != 0){
				$('#slide_'+ slide.Asset.id).fadeTo('fast', fadeToTgt);
			}
		}
	});

	$('.slide').bind('mouseover', function(){
		var thisID = $(this).attr('id').split("_");
		if(thisID[1] == captionArray[currentPosition].id && captionCheck(captionArray[currentPosition].id) == true){
			$(this).css('cursor', 'pointer');
			$(".slide").not(this).css('cursor', 'default');
			//slideOver();
			slideClick(captionArray[currentPosition].id);
		}
	});

	$('.slide').bind('mouseout', function(){
		slideOut();
	});

	$('#slideInner').css('width', numberOfSlides*slideWidth);
	$('#rightControl').show();
	$("#loading").hide();
	adjBG();
}

var slideOver = function(){
	/*if($('#caption').is(':hidden')) {
		$('#view-caption').show();
	}*/
}

var captionCheck = function(){
		var isCaption = false;
		$.each(captionArray, function(i, proj){
			if(proj.id == captionArray[currentPosition].id && proj.slide_text != "") { isCaption = true; }
		});
		return isCaption;
}

var slideOut = function(){
	//$('#view-caption').hide();
	$('#caption').hide();
}

var slideClick = function(theID){
	if($('#caption').is(':hidden') && captionCheck(theID) == true) {
		$.each(captionArray, function(i, proj){
			if(proj.id == theID) { currCaption = proj.slide_text }
		});
		$('#caption-text').text(currCaption);
		$('#caption').show();
	}
}

var manageControls = function (position){
	// Hide left arrow if position is first slide
  if(position==0) {
		$('#leftControl').hide();
	} else {
		$('#leftControl').show();
	}
  // Hide right arrow if position is last slide
  if(position==numberOfSlides-1){
		$('#rightControl').hide();
	} else {
		$('#rightControl').show();
	}
}

var openCloseSlideshow = function(dir) {
	  var buttonText = "";
	  var arrowImg = "";
	  var tgtMargin = "";
	  var tgtHt = 0;
	  dir == "open" ? buttonText = "Close" : buttonText = "Get an Inside Look";
	  dir == "open" ? arrowImg = "icn-arrow-u.png" : arrowImg = "icn-arrow-d.png";
	  dir == "open" ? tgtMargin = "+=444" : tgtMargin = "-=444";
	  dir == "open" ? tgtHt = 444 : tgtHt = 0;
	  if(dir != "open") {
			$("#interactive-tour .container").hide();
		}

	  $(".link-interactive").text(buttonText);
	  $(".link-interactive").css('background', 'url(/media/img/'+arrowImg+') right 3px no-repeat');

		var wrapperID = "";
		//pageID == 11 ? wrapperID = "#section-wrapper2" : wrapperID = "#interior-wrapper1";
		wrapperID = "#section-wrapper2";

		$(wrapperID).animate ({ marginTop:  tgtMargin }, 250, function() { });

	 	$("#interactive-tour").animate({ height:  tgtHt }, 250, function() {
			if(dir == "open") {
				$("#interactive-tour .container").show();
				$("#slideInner").show();
			} else {
				$('#slideInner').css('margin-left', 0);
				$('.slide').eq(currentPosition).fadeTo('fast', fadeToTgt);
				currentPosition = 0;
				$('.slide').eq(currentPosition).fadeTo('fast', 1);
				$('#leftControl').hide();
				$('#rightControl').show();
			}
		});
}



var setUpTaglist = function(theData) {
	masterData = theData;

	$('#projects-tags').prepend('<div class="tag-column" id="projects"><div class="header">SLIDESHOWS</div><ul id="project-list"></ul></div>');
	$('#projects-tags').prepend('<div class="tag-column" id="tag-groups"></div>');


	var tag_group1_data = new Array();
		tag_group1_data['id'] = 1;
		tag_group1_data['title'] = 'General';
	var tag_group2_data = new Array();
		tag_group2_data['id'] = 5;
		tag_group2_data['title'] = 'Past Production Photo Archive';
	var tag_groups_data = new Array(tag_group1_data, tag_group2_data);


	//GET THE TAG GROUPS FROM THE PROJECT DATA
	var tagGroupsArr = new Array();
	var tagsArr = new Array();
	$.each(theData, function(i, proj){
		$.each(proj.PortfolioTag, function(i, tag){
			tagGroupsArr.push(tag.portfolio_tag_group_id);
			var tempArr = new Array();
			tempArr['tag_id'] = tag.PortfolioTaggedProject.portfolio_tag_id;
			tempArr['title'] = tag.title;
			tempArr['tag_group_id'] = tag.portfolio_tag_group_id;
			if(!tagCheck(tempArr['tag_id'], tagsArr)){
				tagsArr.push(tempArr);
			}
		})
	});


	tagGroupsArr = RemoveDuplicates(tagGroupsArr.sort());

	//tagsArr.reverse();
	//ADD THE TAG GROUPS TO THE #projects-tags DIV
	$.each(tag_groups_data, function(i, group){
		$('#tag-groups').append("<div class='tag-group' id='group_"+group.id+"'><div class='header'>"+group.title+"</div><ul class='tag-list' id='list_"+group.id+"'></ul></div>");
	})

	tagsArr = tagsArr.sort(sortTagsByID);
	//RUN THROUGH THE DATA AGINA AND ASSIGN THE TAGS TO THE APPROPRIATE TAG GROUP
	$.each(tagsArr, function(i, proj){
		$('#list_'+proj.tag_group_id).append("<li class='taglist-item' id='tag_"+proj.tag_id+"'>"+proj.title+"</li>");
		if(proj.tag_group_id != 1){
			$('#group_'+proj.tag_group_id).css('margin-top', '5px');
		}
	});

	// TAG CLICK
	$('.taglist-item').bind('click', function(){
		var tempArr = $(this).attr('id').split('_');
		createProjectList(tempArr[1]);
		$(this).attr('class', 'taglist-item-active');
		$(this).css({
			'color': '#1752cd',
			'text-decoration': 'underline'
		});
		$('.tag-list li').not(this).attr('class', 'taglist-item');
		$('.tag-list li').not(this).css({
			'color': '#F26522',
			'text-decoration': 'none'
		});
	});

	//TAG OVER
	$('.taglist-item').bind('mouseover', function(){
		if($(this).attr('class').split('-')[2] != "active"){
			$(this).css({
				'color': '#1752cd',
				'text-decoration': 'underline'
			});
		}
	});

	//TAG OUT
	$('.taglist-item').bind('mouseout', function(){
		if($(this).attr('class').split('-')[2] != "active"){
			$(this).css({
				'color': '#F26522',
				'text-decoration': 'none'
			});
		}
	});

	//VIEW ALL BUTTON
	$('.tag-group:last').append('<div id="tag_0" class="view-all">VIEW ALL</div>');

	$('.view-all').bind('click', function(){
		$('.tag-list li').css({
			'color': '#F26522',
			'text-decoration': 'none'
		});
		createProjectList(0);
	});

	createProjectList(0);
}



var tagCheck = function(theValue, theArray){
	var returnVal = false;
	$.each(theArray, function(i, proj){
		if(proj['tag_id'] == theValue) { returnVal = true; }
	});
	return returnVal;
}

var createProjectList = function(theID){
	$('#project-list').remove();
	$('#projects .header').after('<ul id="project-list"></ul>');
	if(theID < 1) {
		$.each(masterData, function(i, proj){
			$('#project-list').append('<li id="project_'+ proj.PortfolioProject.id +'" class="project-item">'+proj.PortfolioProject.title+'</li>')
		});
	} else{
		$.each(masterData, function(i, proj){
			$.each(proj.PortfolioTag, function(i, tag){
				if(tag.id == theID){
					$('#project-list').append('<li id="project_'+ proj.PortfolioProject.id +'" class="project-item">'+proj.PortfolioProject.title+'</li>')
				}
			});
		});
	}

	$('.project-item').bind('click', function(){
		var tempArr = $(this).attr('id').split("_");
		removeSlides(tempArr[1]);
		$(this).attr('class', 'project-item-active');
		$(this).css({
			'color': '#1752cd',
			'text-decoration': 'underline'
		});
		$('#project-list li').not(this).attr('class', 'project-item');
		$('#project-list li').not(this).css({
			'color': '#F26522',
			'text-decoration': 'none'
		});
			$('html, body').animate({scrollTop: '0px'}, 400);
	});

	//PROJECT OVER
	$('.project-item').bind('mouseover', function(){
		if($(this).attr('class').split('-')[2] != "active"){
			$(this).css({
				'color': '#1752cd',
				'text-decoration': 'underline'
			});
		}
	});

	//PROJECT OUT
	$('.project-item').bind('mouseout', function(){
		if($(this).attr('class').split('-')[2] != "active"){
			$(this).css({
				'color': '#F26522',
				'text-decoration': 'none'
			});
		}
	});
}

var sortTagsByID = function(a, b) {//using objects
	return b.tag_id - a.tag_id;
}