function toggleContent() {
	// Get the DOM reference
	var contentId = document.getElementById("browseOptions");
	
	// Toggle 
	contentId.style.display == "block" ? contentId.style.display = "none" : 
	contentId.style.display = "block"; 
}

function removeWhiteSpace(val)
{
     return val.replace(/^\s*|\s*$/g,'');
}

String.prototype.endsWith = function(str) 
{return (this.match(str+"$")==str)}

String.prototype.startsWith = function(str) 
{return (this.match("^"+str)==str)}

function toggleSearchField() {
	// Get the DOM reference
	var contentId = document.getElementById("searchFieldBox");
	
if($("#searchFieldBox").hasClass("searchBoxClosed"))
$("#searchFieldBox").addClass("searchBoxOpen").removeClass("searchBoxClosed");
else
$("#searchFieldBox").addClass("searchBoxClosed").removeClass("searchBoxOpen");

}

function toggleImageEnlarge() {
	
	var contentId = document.getElementbyId("thumbnailImageBox");
}
//OVERLAY**************
var OVERLAY_NONE = 0;
var OVERLAY_SEARCH = 1;
var OVERLAY_BROWSE = 2;


function setOverlayState(state)
{
	
	var currentState = getOverlayState();
	
	if(currentState == state)
		return;
	
	var showBrowse = false;
	var showSearch = false;
	
	switch(state)
	{
		case OVERLAY_SEARCH:
			showSearch = true;
			break;
		case OVERLAY_BROWSE:
			showBrowse = true;
			break;
	}
	
	if(showBrowse)
	{
		$("#optionsBlockOverlay").data("state", OVERLAY_BROWSE);
		$("#optionsBlockOverlay").addClass("browse");
		$("#browseOptionsBlock").css({'display' : 'block'});
		
		//handle swap images
		var id = $.data($("#browseButton img")[0]);
		if($.swapImage.data[id].src.endsWith("_o.png"))
		{
			$.swapImage.data[id].src = "imagesX/nav_BrowseClose_o.png";
			$("#browseButton img").attr("src", "imagesX/nav_BrowseClose.png");		
		}
		else
		{
			$.swapImage.data[id].src = "imagesX/nav_BrowseClose.png";
			$("#browseButton img").attr("src", "imagesX/nav_BrowseClose_o.png");
		}
	}
	else
	{
		$("#optionsBlockOverlay").removeClass("browse");
		$("#browseOptionsBlock").css({'display' : 'none'});
		//handle swap images
		var id = $.data($("#browseButton img")[0]);
		if($.swapImage.data[id].src.endsWith("_o.png"))
		{
			$.swapImage.data[id].src = "imagesX/nav_Browse_o.png";
			$("#browseButton img").attr("src", "imagesX/nav_Browse.png");		
		}
		else
		{
			$.swapImage.data[id].src = "imagesX/nav_Browse.png";
			$("#browseButton img").attr("src", "imagesX/nav_Browse_o.png");
		}
	}
	
	if(showSearch)
	{
		$("#optionsBlockOverlay").data("state", OVERLAY_SEARCH);
		$("#optionsBlockOverlay").addClass("search");
		$("#searchOptionsBlock").css({'display' : 'block'});
		
		//handle swap images
		var id = $.data($("#searchButton img")[0]);
		if($.swapImage.data[id].src.endsWith("_o.png"))
		{
			$.swapImage.data[id].src = "imagesX/nav_SearchClose_o.png";
			$("#searchButton img").attr("src", "imagesX/nav_SearchClose.png");		
		}
		else
		{
			$.swapImage.data[id].src = "imagesX/nav_SearchClose.png";
			$("#searchButton img").attr("src", "imagesX/nav_SearchClose_o.png");
		}

	}
	else
	{
		$("#optionsBlockOverlay").removeClass("search");
		$("#searchOptionsBlock").css({'display' : 'none'});
		var id = $.data($("#searchButton img")[0]);
		if($.swapImage.data[id].src.endsWith("_o.png"))
		{
			$.swapImage.data[id].src = "imagesX/nav_Search_o.png";
			$("#searchButton img").attr("src", "imagesX/nav_Search.png");		
		}
		else
		{
			$.swapImage.data[id].src = "imagesX/nav_Search.png";
			$("#searchButton img").attr("src", "imagesX/nav_Search_o.png");
		}
	}			
	
	if(!showSearch && !showBrowse)
	{
		$("#optionsBlockOverlay").data("state", OVERLAY_NONE);
	}	
}

function getOverlayState()
{
	var currentState = $("#optionsBlockOverlay").data("state");
	if(currentState == null)
		currentState = OVERLAY_NONE;
	return currentState;
}
//BROWSE**************
function browseNavLinkClick(event)
{
	window.location = "http://www.o2creativesolutions.com/v4/list.php?a=browse&i=-1";
}

function browseNavClick(event)
{
	if(getOverlayState() == OVERLAY_BROWSE)
		setOverlayState(OVERLAY_NONE);
	else
		setOverlayState(OVERLAY_BROWSE)	
}

var clickFromAwesome = false;
function everythingChecked(isChecked)
{
	
	
    if (isChecked) 
	{
		 var selector = ".browse_cb.dynamic" + (clickFromAwesome ? "":",.browse_cb.awesome"); //don't uncheck awesome if our click came from it
		 $(selector).each(function(i, o){
			$("img[aria-controls='"+o.id+"'][aria-checked='true']").click();
		 });
    }
    
    clickFromAwesome = false;
}

function awesomeChecked(isChecked)
{	
    if (isChecked) 
	{
		 $(".browse_cb.dynamic").each(function(i, o){
			$("img[aria-controls='"+o.id+"'][aria-checked='true']").click();
		 });
		 $(".browse_cb.everything").each(function(i, o){
			$("img[aria-controls='"+o.id+"'][aria-checked='false']").each(function(i2,o2){clickFromAwesome = true;$(o2).click();});
		 });
    }
}

function dynamicChecked(isChecked)
{	
    if (isChecked) 
	{
		 $(".browse_cb.everything,.browse_cb.awesome").each(function(i, o){
			$("img[aria-controls='"+o.id+"'][aria-checked='true']").click();
		 });
    }
}

function browseFilterButtonClick()
{
	var ids = "";
	var sep = "";
	$(".browse_cb").each(function(i,o){
		if(o.checked)
		{
			ids += sep+o.value;
			sep = ",";
		}
	});	
	
	//this has to be absolute url because of IE8
	//the hteml base tag is not respected with IE8 and window.location
	window.location = "http://www.o2creativesolutions.com/v4/list.php?a=browse&i="+ids;
}

//SEARCH***************
function searchNavClick(event)
{
	if(getOverlayState() == OVERLAY_SEARCH)
		setOverlayState(OVERLAY_NONE);
	else
		setOverlayState(OVERLAY_SEARCH)	
}

function searchIconClick()
{
	executeSearch($('#SearchTerms').val());
	return false;
}
function searchKeyPressed(e)
{
	var code = (e.keyCode ? e.keyCode : e.which);
	if(code == 13){
       executeSearch($('#SearchTerms').val());
   }
}
function searchFocus()
{
	if($('#SearchTerms').val() == "keyword")
		$('#SearchTerms').val("");
}
function searchBlur()
{
	if(removeWhiteSpace($('#SearchTerms').val()) == "")
		$('#SearchTerms').val("keyword");
}
function executeSearch(searchTerm)
{
	//this has to be absolute url because of IE8
	//the hteml base tag is not respected with IE8 and window.location
	window.location = "http://www.o2creativesolutions.com/v4/list.php?a=search&s="+escape(searchTerm);
}


//Project QuickView, Image Navigation Clicked for first time
function imageNavInitialClick(event)
{
	var projectPane = $(event.currentTarget).closest('.contentPane');

	if(!projectPane.allImagesLoaded)
	{
	  var imageView = $(projectPane).find(".projectQuickviewImages")[0];
	  var imageViewContainer = $(projectPane).find(".projectQuickviewImagesContainer")[0];
	  
	  //determine which direction to move after the images are loaded
	  if($(event.currentTarget).hasClass("nextImageQuickView"))
	  	$(projectPane).attr("goNextAfterImageLoaded", true);
	  else
	    $(projectPane).attr("goNextAfterImageLoaded", false);
	    
	  	 
	  $($(projectPane).find(".nextImageQuickView")[0]).unbind("click");
	  $($(projectPane).find(".prevImageQuickView")[0]).unbind("click");
	  $($(projectPane).find(".nextImageQuickView")[0]).click(function(){return false;});
	  $($(projectPane).find(".prevImageQuickView")[0]).click(function(){return false;});
		 
	  var projectID = $($(projectPane).find(".projectID")[0]).html();
	  $(imageViewContainer).load("list.php", {a:"getImages",pid:projectID}, imagesLoaded);
	  
	}
	
	return false;
}





//Project QuickView, Scroll Images loaded after quickview
function imagesLoaded()
{
 	var projectPane = $(this).closest('.contentPane')[0];
 	
	//put the project links on the thumbnails
	$('span.thumbnailImage.projectLink').click(thumbnailImageProjectClick);

	
 	
 	//set the width on all to equal the first div
 	// alows divs with only one or two images scroll correctly
	var divs = $(projectPane).find(".projectThumbnailImageRow");
	$(divs).width($(divs[0]).width());

 	var nextButton = $(projectPane).find(".nextImageQuickView")[0];
 	var prevButton = $(projectPane).find(".prevImageQuickView")[0];
	$(nextButton).unbind("click");
	$(prevButton).unbind("click");
	
	$(this).cycle({ 
			fx:     'scrollHorz', 
	     	prev:   prevButton, 
    		next:   nextButton, 
			timeout: 0 
					 });
	 if($(projectPane).attr("goNextAfterImageLoaded") == "true")
		 $(nextButton).click();	 
	 else
		 $(prevButton).click();

}



function toggleProjectImagesClick(event)
{	
	var imageType;	
	if($('#imageSpans').data("isShowingProcessImages"))
	{
		$('#imageSpans').data("isShowingProcessImages", false);
		$(this).find('img').attr("src","http://www.o2creativesolutions.com/v4/imagesX/browse_ProcessView_Toggle_off.gif");
		imageType = "0";
	}
	else
	{
		$('#imageSpans').data("isShowingProcessImages", true);
		$(this).find('img').attr("src","http://www.o2creativesolutions.com/v4/imagesX/browse_ProcessView_Toggle_on.gif");
		imageType = "1";
	}
	
	 $('#imageSpans').load("project.php", {a:"getImageSpans",p:$(".projectID").html(), t:imageType}, projectImagesToggled);
}

function projectImagesToggled()
{
	$('span.thumbnailImage.slimBoxLink').click(thumbnailImageSlimBoxClick);
	$('span.thumbnailImage.projectLink').click(thumbnailImageProjectClick);
}


function thumbnailImageProjectClick(event)
{	
	var temp = 	$(this);
	var contentPane = $(this).closest('.contentPane')[0]
	var projectLink = $($(contentPane).find(".projectLink")[0]).html();	
	
	window.location = projectLink;
}

function thumbnailImageSlimBoxClick(event)
{	
	if($("#lb").data("isDisplayed"))
		return;
	
	$("#lb").data("isDisplayed", true);
		
	var temp = 	$(this);
	var contentPane = $(this).closest('.contentPane')[0]
	var projectID = $($(contentPane).find(".projectID")[0]).html();
	var projectTitle = $($(contentPane).find(".projectTitle")[0]).html();

	//find the index of the thumbnail clicked
	var thumbnails = $(contentPane).find("span.thumbnailImage");
	var i = 0;
	for(var i = 0; i<thumbnails.length; i++)
		if(thumbnails.get(i) == this)
			break;	
	$('#lb').data("imageIndex", i);
	
	//Determine if we are showing process images
	
	var imageSpans = $('#imageSpans');
	var imageType = "0";
	
	if(imageSpans != null && imageSpans.data("isShowingProcessImages"))
		imageType = "1";
	
	
	$('#lb').load("project.php", {a:"getSlideShowImages",p:projectID, t:imageType}, lbImagesLoaded);
	$('#lb').data("projectTitle", projectTitle);
	$('#lb').data("projectID", projectID);
	$('#lb').data("autoPlayIsRunning", false);
	$('#lb').data("autoPlayDelay", 2000);
	$('#lb').data("displayAutoPlayControls", true);
}

function watchClicked(event)
{	
	if($("#lb").data("isDisplayed"))
		return;
	
	$("#lb").data("isDisplayed", true);
	
	//Determine if we are showing process images
	
	var imageSpans = $('#imageSpans');
	var imageType = "0";
	
	if(imageSpans != null && imageSpans.data("isShowingProcessImages"))
		imageType = "1";
	
	
	$('#lb').load("project.php", {a:"getSlideShowImages",p:0, t:0}, lbImagesLoaded);
	$('#lb').data("projectTitle", "o2 creative solutions");
	$('#lb').data("projectID", 0);
	$('#lb').data("imageIndex", 0);
	$('#lb').data("autoPlayIsRunning", true);
	$('#lb').data("autoPlayDelay", 2000);
	$('#lb').data("displayAutoPlayControls", true);

}



function lbImagesLoaded()
{
	$('#lb a').prettyPhoto({
				animationSpeed: 'slow', /* fast/slow/normal */
				padding: 0, /* padding for each side of the picture */
				opacity: 0.90, /* Value betwee 0 and 1 */
				showTitle: true, /* true/false */
				allowresize: false, /* true/false */
				counter_separator_label: ' / ', /* The separator for the gallery counter 1 "of" 2 */
				theme: 'light_square', /* light_rounded / dark_rounded / light_square / dark_square */
				callback: function(){$("#lb").data("isDisplayed", false); }
			});

	var ref = $($('#lb').find('a')[$('#lb').data("imageIndex")]);
	$($('#lb').find('a')[$('#lb').data("imageIndex")]).click();
		
}

function pagerNextClicked()
{
	var newPage = $('#footerSystemPager').data('currentPage') + 1;
	if(newPage > $('#footerSystemPager').data('totalPages'))
		return false; //do nothing, on last page
	
	$('#footerSystemPager').data('currentPage', newPage);

	showPage(newPage, $('#footerSystemPager').data('itemsPerPage'), $('#footerSystemPager').data('projectList'));
	return false;
}
function pagerPrevClicked()
{
	var newPage = $('#footerSystemPager').data('currentPage') - 1;
	if(newPage == 0)
		return false; //do nothing, on last page
	
	$('#footerSystemPager').data('currentPage', newPage);
	showPage(newPage, $('#footerSystemPager').data('itemsPerPage'), $('#footerSystemPager').data('projectList'));
	return false;
}


function showPage(pageNum, itemsPerPage, idList)
{
	var projectIDs = "";

	for(var i = 0; i<itemsPerPage; i++)
		if(i < idList.length)
		 	projectIDs += (i==0?"":",")+idList[(pageNum-1)*itemsPerPage+i];
	
	//TODO: CACHE PAGES
	
	$('.content').load("list.php", {a:"getProjects",pids:projectIDs}, showPageComplete);
	setPageNavPositionImage(pageNum);
}

function showPageComplete(event)
{
	$.swapImage(".content .swapImage"); 
	$('span.thumbnailImage.projectLink').click(thumbnailImageProjectClick);
	$(window).scrollTop(0); 
}
function setPageNavPositionImage(pageNum)
{
	$('#pageNavPositionImage').attr("src",$('#footerSystemPager').data('pagePosImageSrcTemplate').replace("{page}", pageNum));
	updateURLPageNum(pageNum);
}

function fbs_click(projName) 
{
	u=location.href;
	t='o2\'s ' + projName;
	window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&amp;t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');
	return false;
}

function bookmark_site(url, title)
{

    // user agent sniffing is bad in general, but this is one of the times 
    // when it's really necessary
    var ua=navigator.userAgent.toLowerCase();
    var isKonq=(ua.indexOf('konqueror')!=-1);
    var isSafari=(ua.indexOf('webkit')!=-1);
    var isMac=(ua.indexOf('mac')!=-1);
    var buttonStr=isMac?'Command/Cmd':'CTRL';

    if(window.external && (!document.createTextNode ||
      (typeof(window.external.AddFavorite)=='unknown'))) {
        // IE4/Win generates an error when you
        // execute "typeof(window.external.AddFavorite)"
        // In IE7 the page must be from a web server, not directly from a local 
        // file system, otherwise, you will get a permission denied error.
        window.external.AddFavorite(url, title); // IE/Win
    } else if(isKonq) {
      alert('You need to press CTRL + B to bookmark '+title+'.');
    } else if(window.opera) {
     		var elem = document.createElement('a');
			elem.setAttribute('href',url);
			elem.setAttribute('title',title);
			elem.setAttribute('rel','sidebar');
			elem.click();
    } else if(window.home || isSafari) { // Firefox, Netscape, Safari, iCab
      alert('You need to press '+buttonStr+' + D to bookmark '+title+'.');
    } else if(!window.print || isMac) { // IE5/Mac and Safari 1.0
      alert('You need to press Command/Cmd + D to bookmark '+title+'.');    
    } else {
      alert('In order to bookmark '+title+' you need to do so manually '+
        'through your browser.');
    }
}

function initPagingSystem(totalPages, projectsPerPage, projectList)
{				
				//New Page Num is grabbed before the hash is reset in setPageNavPositionImage
				var newPage = -1;	
				if(window.location.hash.length > 0)
					newPage = parseInt(window.location.hash.substring(1));

				$('#footerSystemPager').data('totalPages',totalPages);
				$('#footerSystemPager').data('currentPage',1);
				$('#footerSystemPager').data('itemsPerPage',projectsPerPage);
			    $('#footerSystemPager').data('projectList', projectList.split(','));
			    $('#footerSystemPager').data('pagePosImageSrcTemplate', "fontImage/file.drawtext2.php?text='{page} / "+ totalPages +"'&font='Verlag-Light.ttf'&size=10&color=0x22274a&bgcolor=0xCCCCCC&bgtrans=true&palette=1024");
			   	setPageNavPositionImage(1);
			    
			    //initialize next/prev
			    $('#footerSystemPager #pageNext').click(pagerNextClicked);
				$('#footerSystemPager #pagePrevious').click(pagerPrevClicked);
				
				
				//handle has page saving
				if(newPage > 1) //only need to perform the load if the page is greater than page 1, which is already loaded
				{					
					if(newPage > $('#footerSystemPager').data('totalPages'))
						newPage = $('#footerSystemPager').data('totalPages'); //if past the last page, show the last page 
				
					$('#footerSystemPager').data('currentPage', newPage);
						showPage(newPage, $('#footerSystemPager').data('itemsPerPage'), $('#footerSystemPager').data('projectList'));
				}
				

}

function updateURLPageNum(pageNum)
{
//	var currentQueryString = window.location.search.substr(1);
//	var stringElements = currentQueryString.split('#');
//	var newQueryString = "";
//	var pageNumFound = false;
//	for (var i = 0; i < stringElements.length; i++)
//	{
//		if(stringElements[i].substr(8) == 'pageNum')
//		{
//			stringElements[i] = "pageNum="+pageNum;
//			pageNumFound = true;
//		}
//		newQueryString += (newQueryString.length == 0 ?"?":"&") + stringElements[i];
//	}
//	
//	if(!pageNumFound)
//		newQueryString += (newQueryString.length == 0 ?"?":"&") + "pageNum="+pageNum;
		
	window.location.hash = pageNum;
}

// Image Rollover Script
$(document).ready(function() {
	
	//Preload images
	//$.preloadCssImages();
	
	//Search Navigation
	$('#searchButton').click(searchNavClick);
	$('#SearchTerms').keypress(searchKeyPressed);
	$("#SearchTerms").focus(searchFocus);
	$("#SearchTerms").blur(searchBlur);
	$("#SearchIconButton").click(searchIconClick);
	
	//Browse Navigation
	$('#browseButton.browseoverlay').click(browseNavClick);
	$('#browseButton.browselink').click(browseNavLinkClick);
	$('.browse_cb.everything').simpleImageCheck({
	  image: 'imagesX/ui_checkbox_empty.gif',
	  imageChecked: 'imagesX/ui_checkbox_full.gif',
 	  afterCheck: everythingChecked  });
	$('.browse_cb.awesome').simpleImageCheck({
	  image: 'imagesX/ui_checkbox_empty.gif',
	  imageChecked: 'imagesX/ui_checkbox_full.gif',
 	  afterCheck: awesomeChecked  });
	$('.browse_cb.dynamic').simpleImageCheck({
	  image: 'imagesX/ui_checkbox_empty.gif',
	  imageChecked: 'imagesX/ui_checkbox_full.gif',
 	  afterCheck: dynamicChecked  });
	$('#filterButton').click(browseFilterButtonClick);

	//Watch Navigation	
	$('#watchButton').click(watchClicked);
		
	//Quick View
	$('a.nextImageQuickView').click(imageNavInitialClick);
	$('a.prevImageQuickView').click(imageNavInitialClick);
	
	//Thumbnails
	$('span.thumbnailImage.slimBoxLink').click(thumbnailImageSlimBoxClick);
	$('span.thumbnailImage.projectLink').click(thumbnailImageProjectClick);

	//Project view
	$('div.projectProcess').click(toggleProjectImagesClick);

	//Rollovers
	$('img.Rollover').imghover({fade:true, fadeSpeed:200});
	$.swapImage(".swapImage");  
	
	
	
	//General
	$('.ellipsisOverflow').ellipsis();//this is for firefox
	$('a.newWindowLink').click( function() {
        window.open( $(this).attr('href') );
        return false;
    });


	//Browse Labels for IE
	//Labels are not clickable for checkboxes if the element inside the label is an image
	  if(document.all && navigator.appVersion.indexOf("MSIE")>-1 && navigator.appVersion.indexOf("Windows")>-1)
	  {
	    var a = document.getElementsByTagName("label");
	    for(var i=0,j=a.length;i<j;i++){
	      if(a[i].hasChildNodes && a[i].childNodes.item(0).tagName == "IMG")
	      {
	        a[i].childNodes.item(0).forid = a[i].htmlFor;
	        a[i].childNodes.item(0).onclick = function(){
	          var e = document.getElementById(this.forid);
	          e.click();
	          /*
	          switch(e.type){
	            case "radio": e.checked|=1;break;
	            case "checkbox": e.checked=!e.checked;break;
	            case "text": case "password": case "textarea": e.focus(); break;
	          }
	          */
	        }
	      }
	    }
	  }
});