//pre-load loading.gif
loading_gif = new Image(24,24);
loading_gif.src = "img/ajax-loader.gif";

fullscreen_icon = new Image(24,36);
fullscreen_icon.src = "img/fullscreen.png";

moreinfo_icon = new Image(24,36);
moreinfo_icon.src = "img/moreinfo.png";

//detect scrollTop
function getScrollTop(){
    if(typeof pageYOffset!= 'undefined'){
        //most browsers
        return pageYOffset;
    }
    else{
        var B= document.body; //IE 'quirks'
        var D= document.documentElement; //IE with doctype
        D= (D.clientHeight)? D: B;
        return D.scrollTop;
    }
}	

window.BrowserDetect = {
	init: function () {
		this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
		this.version = this.searchVersion(navigator.userAgent)
			|| this.searchVersion(navigator.appVersion)
			|| "an unknown version";
		this.OS = this.searchString(this.dataOS) || "an unknown OS";
	},
	searchString: function (data) {
		for (var i=0;i<data.length;i++)	{
			var dataString = data[i].string;
			var dataProp = data[i].prop;
			this.versionSearchString = data[i].versionSearch || data[i].identity;
			if (dataString) {
				if (dataString.indexOf(data[i].subString) != -1)
					return data[i].identity;
			}
			else if (dataProp)
				return data[i].identity;
		}
	},
	searchVersion: function (dataString) {
		var index = dataString.indexOf(this.versionSearchString);
		if (index == -1) return;
		return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
	},
	dataBrowser: [
		{
			string: navigator.userAgent,
			subString: "Chrome",
			identity: "Chrome"
		},
		{ 	string: navigator.userAgent,
			subString: "OmniWeb",
			versionSearch: "OmniWeb/",
			identity: "OmniWeb"
		},
		{
			string: navigator.vendor,
			subString: "Apple",
			identity: "Safari",
			versionSearch: "Version"
		},
		{
			prop: window.opera,
			identity: "Opera"
		},
		{
			string: navigator.vendor,
			subString: "iCab",
			identity: "iCab"
		},
		{
			string: navigator.vendor,
			subString: "KDE",
			identity: "Konqueror"
		},
		{
			string: navigator.userAgent,
			subString: "Firefox",
			identity: "Firefox"
		},
		{
			string: navigator.vendor,
			subString: "Camino",
			identity: "Camino"
		},
		{		// for newer Netscapes (6+)
			string: navigator.userAgent,
			subString: "Netscape",
			identity: "Netscape"
		},
		{
			string: navigator.userAgent,
			subString: "MSIE",
			identity: "Explorer",
			versionSearch: "MSIE"
		},
		{
			string: navigator.userAgent,
			subString: "Gecko",
			identity: "Mozilla",
			versionSearch: "rv"
		},
		{ 		// for older Netscapes (4-)
			string: navigator.userAgent,
			subString: "Mozilla",
			identity: "Netscape",
			versionSearch: "Mozilla"
		}
	],
	dataOS : [
		{
			string: navigator.platform,
			subString: "Win",
			identity: "Win"
		},
		{
			string: navigator.platform,
			subString: "Mac",
			identity: "Mac"
		},
		{
			   string: navigator.userAgent,
			   subString: "iPhone",
			   identity: "iPhone/iPod"
	    },
		{
			string: navigator.platform,
			subString: "Linux",
			identity: "Linux"
		}
	]

};
BrowserDetect.init();

function findPosY(obj){
	var curtop = 0;
	if(obj.offsetParent)
		while(1){
		curtop += obj.offsetTop;
		if(!obj.offsetParent)
			break;
			obj = obj.offsetParent;
		}
	else if(obj.y)
		curtop += obj.y;
	return curtop;
}

function findPosX(obj){
	var curtop = 0;
	if(obj.offsetParent)
		while(1){
		curtop += obj.offsetLeft;
		if(!obj.offsetParent)
			break;
			obj = obj.offsetParent;
		}
	else if(obj.x)
		curtop += obj.x;
	return curtop;
}

$(window).load(function(){

	//fade in das imagens já disponíveis em cache [!]
	$('.img-loader-container .img-loader').each(function(){
		$(this).animate({
			'opacity':1
		}, 1000);	});
	$('.fade-image').each(function(){
		$(this).animate({
			'opacity':1
		}, 1000);
	});
});

$(document).ready(function(){

	//create overlayer for class add-hover-blog	
	$('.add-hover-blog').each(function(i){
		var width = 0;
		if ($(this).parent().parent().parent().hasClass('style-1') || $(this).parent().parent().hasClass('style-1') ) width = '504px';
		if ($(this).parent().parent().parent().hasClass('style-2') || $(this).parent().parent().hasClass('style-2') ) width = '582px';

		$(this).width(width);
		
		//add hover layer
		$(this).parent().append('<div class="add-hover-result"></div>');
		$(this).parent().children('.add-hover-result').css({
			'position': 'absolute',
			'width': width,
			'height': '226px',
			'z-index': 5,
			'background': '#FFF',
			'top': 4,
			'opacity': 0,
			'filter': 'alpha(opacity=0)',
			'margin': $(this).css('padding-left')
		});
		if ( $(this).hasClass('magnify-blog') ){
			$(this).parent().children('.add-hover-result').css({
				'position': 'absolute',
				'width': width,
				'height': '226px',
				'z-index': 5,
				'background': '#000',
				'top': 4,
				'opacity': 0,
				'filter': 'alpha(opacity=0)',
				'margin': $(this).css('padding-left')
			});
			$(this).parent().children('.add-hover-result').append('<div class="portfolio-lupa"><a href="#" rel="prettyPhoto"><img src="img/lupa-proj.png" alt=""></a></div>');
			$(this).parent().children('.add-hover-result').children('.portfolio-lupa').children('a').attr('href', $(this).attr('src') );
			$(this).parent().children('.add-hover-result').unbind('click');
			$(this).parent().children('.add-hover-result').click(function(){
				$(this).find('a').click();
			});
			var xPos = (parseInt(width) - 75) / 2 ;
			var yPos =  (226 - 75 ) /2 ;
			$(this).parent().children('.add-hover-result').children('.portfolio-lupa').css({
				'position': 'absolute',
				'top': yPos +'px',
				'left': xPos +'px'
			});
			//hover handlers
			$(this).parent().hover(function(){
				$(this).children('.add-hover-result').stop(true,true).animate({
					'opacity': .6
				}, 500);
				if ($(this).children('.add-hover-result').children('.portfolio-lupa')){
					$(this).children('.add-hover-result').children('.portfolio-lupa').stop(true,true).animate({
						'opacity': 1
					}, 500);
				}
			}, function(){
				$(this).children('.add-hover-result').stop(true,true).animate({
					'opacity': 0
				}, 500);
				if ($(this).children('.add-hover-result').children('.portfolio-lupa')){
					$(this).children('.add-hover-result').children('.portfolio-lupa').stop(true,true).animate({
						'opacity': 0
					}, 500);
				}
			});
			
		} else {
			$(this).parent().children('.add-hover-result').unbind('click');
			$(this).parent().children('.add-hover-result').click(function(){
				window.location = $(this).parent().children('a').attr('href');
			});
			//hover handlers
			$(this).parent().hover(function(){
				$(this).children('.add-hover-result').stop(true,true).animate({
					'opacity': .4
				}, 500);
				if ($(this).children('.add-hover-result').children('.magnify-blog')){
					$(this).children('.add-hover-result').children('.magnify-blog').stop(true,true).animate({
						'opacity': 1
					}, 500);
				}
			}, function(){
				$(this).children('.add-hover-result').stop(true,true).animate({
					'opacity': 0
				}, 500);
				if ($(this).children('.add-hover-result').children('.magnify-blog')){
					$(this).children('.add-hover-result').children('.magnify-blog').stop(true,true).animate({
						'opacity': 0
					}, 500);
				}
			});
			
		}
		$(".featured-image a[rel^='prettyPhoto']").prettyPhoto({
			show_title: false,
			custom_markup: '<div id="canvas"></div>',
			changepicturecallback: function(){
				var html = '<img alt="" src="';
					html += $('.featured-image img').attr('src');
					html += '">';
				$('#canvas').append(html);
				$('.pp_description').remove();
			}
		});
		
		$(".mini-image a[rel^='prettyPhoto']").prettyPhoto({
			show_title: false,
			custom_markup: '<div id="canvas"></div>',
			changepicturecallback: function(){
				var html = '<img alt="" src="';
					html += $('.featured-image img').attr('src');
					html += '">';
				$('#canvas').append(html);
				$('.pp_description').remove();
			}
		});
		
	});
	

	//menu stuff
	$('.jqueryslidemenu ul li').find('ul').hover(function(){
		$(this).parent().children('a').css('color','#3C97AB');
	}, function(){
		//$(this).parent().children('a').css('color','#FFF');	
	});
	
	$('.first_sub').parent().hover(function(){
		$(this).parent().children('a').css('color', '#3C97AB !important');
	}, function(){
		var $targetul=$(this).children("ul:eq(0)");
		if ($targetul.children('li:eq(0)').attr('class') === "first"){
			$targetul.parent().children('a').css('color', '#FFF');
		} else {
			$targetul.parent().children('a').css('color', '#3C97AB !important');
			$targetul.parent().hover(function(){
				$(this).children('a').css('color', '#3C97AB !important');	
			}, function(){
				$(this).children('a').css('color', '#919B9D !important');	
			})
		}
	});


	$('#top-panel2 .img-loader').each(function(){
		$(this).load(function(){
			$(this).animate({
				'opacity':1
			},1000);
		});
	});

	portfolio_effect();

	//menu handlers
		//first sub positioning arrows
		$('#menu-div').find('.first_sub').each(function(){
			$(this).append('<img class="subarrow" src="img/arrow-submenu.png" style="position:absolute;float:left;top:11px;left:-13px;">');
		});
		$('#menu-div').find('.first').each(function(){
			$(this).append('<img class="subarrow" src="img/arrow-menu.png" style="position:absolute;float:left;top:-11px;left:5px;">');
		});

	hover_projects();
	
	
	
	//img-loader onLoad
	$('.img-loader-container .img-loader').each(function(){
		$(this).load(function(){
			$(this).animate({
				'opacity':'1'
			}, 1000);
		});
	});
	
	//class fade-image (home) onLoad
	$('.fade-image').each(function(){
		$(this).load(function(){
			$(this).animate({
				'opacity':'1'
			}, 1000);
		});
	});
	
	//prevent text selection
	$('.no-text-selection').mousedown(function(){
		return false;
	});
	
	//top-slider stuff
	$('#top-slider-container #back-content .container_12').css({
		'margin-top': '-'+ ($('#top-slider-container #back-content').height() - 30) +'px'
	});
	var topOpen = false;
	
	$('#toggle-top-panel').click(function(){
		if (!topOpen){
			$('#top-slider-container #back-content .container_12').animate({
				'margin-top': 0
			}, {
				duration: 1000,
				easing: 'easeInOutExpo',
				complete: function(){
					$('#top-panel-plus').html('-');
				}				
			});
			topOpen = true;
		} else {
			$('#top-slider-container #back-content .container_12').animate({
				'margin-top': '-'+ ($('#top-slider-container #back-content').height() - 30) +'px'
			}, {
				duration: 1000,
				easing: 'easeInOutExpo',
				complete: function(){
					$('#top-panel-plus').html('+');
				}
			});
			topOpen = false;
		}
	});
	
	

	////flicker gadget
//	$('#flickr').jflickrfeed({
//			limit: 8,
//			qstrings: {
//				id: '69084066@N05'
//			},
//			itemTemplate: '<li>'+
//							'<a rel="prettyPhoto[gallery1]" href="{{image}}" title="{{title}}">' +
//								'<img src="{{image_s}}" alt="{{title}}" />' +
//							'</a>' +
//						  '</li>'
//		}, function(data) {
//			$('#flickr a').prettyPhoto({autoplay_slideshow:false, deeplinking: false, show_title: false, social_tools: ''});
//	});

});

//Optional parameter includeMargin is used when calculating outer dimensions
(function($) {
$.fn.getHiddenDimensions = function(includeMargin) {
    var $item = this,
        props = { position: 'absolute', visibility: 'hidden', display: 'block' },
        dim = { width:0, height:0, innerWidth: 0, innerHeight: 0,outerWidth: 0,outerHeight: 0 },
        $hiddenParents = $item.parents().andSelf().not(':visible'),
        includeMargin = (includeMargin == null)? false : includeMargin;
 
    var oldProps = [];
    $hiddenParents.each(function() {
        var old = {};
 
        for ( var name in props ) {
            old[ name ] = this.style[ name ];
            this.style[ name ] = props[ name ];
        }
 
        oldProps.push(old);
    });
 
    dim.width = $item.width();
    dim.outerWidth = $item.outerWidth(includeMargin);
    dim.innerWidth = $item.innerWidth();
    dim.height = $item.height();
    dim.innerHeight = $item.innerHeight();
    dim.outerHeight = $item.outerHeight(includeMargin);
 
    $hiddenParents.each(function(i) {
        var old = oldProps[i];
        for ( var name in props ) {
            this.style[ name ] = old[ name ];
        }
    });
 
    return dim;
}
}(jQuery));

$(document).ready(function() {

	// Custom sorting plugin // --- No Need to edit this ---\\
(function($) {
  $.fn.sorted = function(customOptions) {
    var options = {
      reversed: false,
      by: function(a) { return a.text(); }
    };
    $.extend(options, customOptions);
    $data = $(this);
    arr = $data.get();
    arr.sort(function(a, b) {
      var valA = options.by($(a));
      var valB = options.by($(b));
      if (options.reversed) {
        return (valA < valB) ? 1 : (valA > valB) ? -1 : 0;				
      } else {		
        return (valA < valB) ? -1 : (valA > valB) ? 1 : 0;	
      }
    });
    return $(arr);
  };
})(jQuery);


  // get the action filter option item on page load
  var $filterType = $('ul.splitter li.active a').attr('class');
	
  // get and assign the ourHolder element to the
	// $holder varible for use later
  var $holder = $('.projects ul.list');

  // clone all items within the pre-assigned $holder element
  var $data = $holder.clone();

  // attempt to call Quicksand when a filter option
	// item is clicked
	$('ul.splitter li a').click(function(e) {
		// reset the active class on all the buttons
		$('.splitter li').removeClass('active');
		
		// assign the class of the clicked filter option
		// element to our $filterType variable
		var $filterType = $(this).attr('class');
		$(this).parent().addClass('active');
		
		if ($filterType == 'proj-all') {
			// assign all li items to the $filteredData var when
			// the 'All' filter option is clicked
			var $filteredData = $data.find('li');
		} 
		else {
			// find all li elements that have our required $filterType
			// values for the data-type element
			var $filteredData = $data.find('li[rel=' + $filterType + ']');
		}
		$('.list li').css('margin-top', '0px !important');
		
		// call quicksand and assign transition parameters
		$holder.quicksand($filteredData, {
			duration: 800,
			easing: 'easeInOutQuad'
		}, function(){
    		
        	$(".img-loader-container img").removeClass("img-loader");
        	
        	portfolio_effect();
        	
        	$(".add-hover-result, .magnify, .more-info, .fullscreen-icon").remove();
        	
          	hover_projects();
        	
        	if (typeof initFS == 'function') { 
				initFS(); 
			}

        	
        	if (window.BrowserDetect.OS === "Mac"){
				if (window.BrowserDetect.browser === "Chrome" || window.BrowserDetect.browser === "Safari" || window.BrowserDetect.browser === "Firefox"){
					$('.fullscreen-icon, .more-info, .magnify').css('bottom',2);
				} 
			}
			if (window.BrowserDetect.OS === "Win"){
		
				if (window.BrowserDetect.browser === "Firefox" || window.BrowserDetect.browser === "Chrome"){
					$('.fullscreen-icon, .more-info, .magnify').css('bottom', 1);
				}
				if (window.BrowserDetect.browser === "Explorer" || window.BrowserDetect.browser === "Chrome" || window.BrowserDetect.browser === "Safari"){
					$('.fullscreen-icon, .more-info, .magnify').css('bottom', 2);
					if (navigator.appVersion.indexOf("MSIE") != -1)
				      // bah, IE again, lets downgrade version number
				      var version = parseFloat(navigator.appVersion.split("MSIE")[1]);
				      if (parseInt(version) == 8){
						$('.fullscreen-icon, .magnify, .more-info').each(function(){
							$(this).css('bottom',0)
						});
				      }
				}
				
			}
        	
        	$('.img-loader-container img').each(function(){	
        		if ($(this).css('opacity') != 1){
        			$(this).css('opacity',0);
        			$(this).load(function(){
		        		$(this).animate({
								'opacity':1
							}, 1000);
	        		});
        		}
			});
		});
		return false;
	});
});

function portfolio_effect(){


	/* FUNCTION FOR SHOW MORE INFO AND GO BACK ON PROJECTS PAGE .Designare.*/
	$(".openproject").css("display", "none");
	$("#projectmoreinfo").css("display", "none");
		
		$('.openproject div.project_content').each(function(){
		  $(this).css("display", "none");
		});
		
		$("ul.tj_gallery li").unbind("click");
	
	
		$('ul.tj_gallery li').click(function() {
		
						
		 	 var totalproject = 0;	
		  
			  //Hide projects thumbnails
			  $('.gallery_projects').css("display", "none");
			  
			  //Hide all projects info content
			  $('.openproject div.project_content').each(function(){
			  	$(this).css("display", "none");
			  	totalproject++;
			  });
				
	
			  //Show only the project content that as been clicked with fadein effect
			  if($(this).hasClass("project_0"))
			  		var projectid = "project_1";
			  else
				  	var projectid = $(this).attr('id');
			  var id = projectid.split('_');
			  var prevproj = parseInt(id[1])-1;
			  var nextproj = parseInt(id[1])+1;
			  
			  window.currentId = id[1];
		 	
		 	//get the fixed description thingy going
		 	if ($('body').hasClass('fixed-desc')){
		 		window.runOnce = 0;		 	
			 	window.interval = setInterval('monitorScrollTop()', 1 );
		 	}
		 	
		 	
		 	
		 	$('#divnavproject_'+window.currentId+' .img-loader-container').children('img').each(function(){

		 		$(this).animate({'opacity':1}, 1000);

				//add-hover-behaviors
				if ($('body').hasClass('pretty')){
					
					$(this).parent().append('<div class="portfolio-overlay"><div class="portfolio-lupa"></div></div>');
				}
				$(this).parent().children('.portfolio-overlay').css({
					'position': 'absolute',
					'width': '100%',
					'height': '100%',
					'top': 0,
					'left': 0,
					'background': '#000',
					'opacity': 0,
					'z-index': 3,
					'cursor': 'pointer'
				});
				
				//click function - simulate click on a
				$(this).parent().find('.portfolio-overlay').click(function(){
					$("#divnavproject_"+window.currentId+" a[rel^='prettyPhoto']").prettyPhoto({slideshow:5000, autoplay_slideshow:true});
					$(this).parent().find('.gallery-images').children('a:first').click();
				});			
				//hover function
				$(this).parent().find('.portfolio-overlay').hover(function(){
					$(this).stop(true,true).animate({
						'opacity': .7
					}, 500);
					$(this).children('.portfolio-lupa').stop(true,true).animate({
						'opacity': 1
					}, 500);
				}, function(){
					$(this).stop(true,true).animate({
						'opacity': 0
					}, 500);
					$(this).children('.portfolio-lupa').stop(true,true).animate({
						'opacity': 0
					}, 500);
				});
		 	});
		 	
		 	//Prepare the arrows to change to previous or next project
		 	if(prevproj <= 0){
		 		$('.proj_prev').css('display', 'none');
		 		$('span.css_prev2').css('display', '');
		 	}
		 	else{
		 		$('.proj_prev').css('display', '');
		 		$('span.css_prev2').css('display', 'none');
		 	}		  	

		  if(nextproj == (totalproject + 1)){
		 		$('.proj_next').css('display', 'none');
		 		$('span.css_next2').css('display', '');
		  }
		 	else{
		 		$('.proj_next').css('display', '');
		 		$('span.css_next2').css('display', 'none');
		 	}
		  
		  $(".proj_prev").attr("id", "project_"+prevproj);
		  $(".proj_next").attr("id", "project_"+nextproj);
		  
		  
		  //Open project
		  $("#divnav"+projectid).fadeToggle("slow", "linear");
		  $("#projectmoreinfo").css("display", "");
		  $("#proj_navigation").css("display", "");
		  $(".openproject").css("display", "");
		  
		  var height =  $("#divnav"+projectid+" .img-loader-container").height() ;
			 $("#divnav"+projectid).find('.portfolio-overlay').children('.portfolio-lupa').css({
					'position': 'relative',
					'width': 75,
					'height': 75,
					'margin': '0 auto',
					'margin-top': ( height - 75)/2,
					'background': 'url(img/lupa-proj.png)'
				});
				
		});
		
		$(".backthumbs").unbind("click");
		
		$('.backthumbs').click(function() {
				
		  $("#proj_navigation").css("display", "none");
		  $(".openproject").css("display", "none");
		  $("#projectmoreinfo").css("display", "none");
		  
		  $('.gallery_projects').fadeToggle("slow", "linear");
		  
			if ($('body').hasClass('fixed-desc')){
					//kill the scroll watcher
				  window.clearInterval(window.interval);				  	
			}
			
			if ($('body').hasClass('pretty')){
				$('.portfolio-overlay').each(function(){
			  		$(this).remove();
			  	});				  	
			}

		  
		});
		
		$(".projectnav a.css_prev, .projectnav a.css_next").unbind("click");
					  
		  $('.projectnav a.css_prev, .projectnav a.css_next').click(function() {
		  	var totalproject=0;
		  	
		  	//Hide all projects info content
			  $('.openproject div.project_content').each(function(){
			  	$(this).css("display", "none");
			  	totalproject++;
			  	
			  	if ($('body').hasClass('pretty')){
					$('.portfolio-overlay').each(function(){
				  		$(this).remove();
				  	});
				}
		  	
			  	
			  });
			  
			  var projectid = $(this).attr('id');
			  var id = projectid.split('_');
			  var prevproj = parseInt(id[1])-1;
		  	var nextproj = parseInt(id[1])+1;
		  	
		  	if ($('body').hasClass('fixed-desc')){
			  window.clearInterval(window.interval);
			}
			  
			 window.currentId = id[1];
			 
			 $('#divnavproject_'+window.currentId+' .img-loader-container').children("img").each(function(){
		 		$(this).animate({'opacity':1}, 1000);
		 		
		 		$(this).load(function(){
		 			$(this).animate({'opacity':1}, 1000);
		 		});

		 		//height fix
				$(this).find('.content_portfolio').height( $('.content_portfolio').find('.img-loader').height() );
				//alert( $('.content_portfolio .img-loader').height() );
				//add-hover-behaviors
				if ($('body').hasClass('pretty')){
					$(this).parent().append('<div class="portfolio-overlay"><div class="portfolio-lupa"></div></div>');			  		
			  	}

				$(this).parent().children('.portfolio-overlay').css({
					'position': 'absolute',
					'width': '100%',
					'height': '100%',
					'top': 0,
					'left': 0,
					'background': '#000',
					'opacity': 0,
					'z-index': 3,
					'cursor': 'pointer'
				});
				//click function - simulate click on a
				$(this).parent().find('.portfolio-overlay').click(function(){
					$("#divnavproject_"+window.currentId+" a[rel^='prettyPhoto']").prettyPhoto({slideshow:5000, autoplay_slideshow:true});
					$(this).parent().find('.gallery-images').children('a:first').click();
				});			
				//hover function
				$(this).parent().find('.portfolio-overlay').hover(function(){
					$(this).stop(true,true).animate({
						'opacity': .7
					}, 500);
					$(this).children('.portfolio-lupa').stop(true,true).animate({
						'opacity': 1
					}, 500);
				}, function(){
					$(this).stop(true,true).animate({
						'opacity': 0
					}, 500);
					$(this).children('.portfolio-lupa').stop(true,true).animate({
						'opacity': 0
					}, 500);
				});
		 	});
		 	
			  
		 	if(prevproj <= 0){
		 		$('.proj_prev').css('display', 'none');
		 		$('span.css_prev2').css('display', '');
		 	}
		 	else{
		 		$('.proj_prev').css('display', '');
		 		$('span.css_prev2').css('display', 'none');
		 	}		  	

		  if(nextproj == (totalproject + 1)){
		 		$('.proj_next').css('display', 'none');
		 		$('span.css_next2').css('display', '');
		  }
		 	else{
		 		$('.proj_next').css('display', '');
		 		$('span.css_next2').css('display', 'none');
		 	}
 	
	 		$(".proj_prev").attr("id", "project_"+prevproj);
		  $(".proj_next").attr("id", "project_"+nextproj);
		  
		  //Open project
		  $("#divnav"+projectid).fadeToggle("slow", "linear");
		  
		 	//get the fixed description thingy going
		 if ($('body').hasClass('fixed-desc')){
		 	window.runOnce = 0;		 	
			window.interval = setInterval('monitorScrollTop()', 1 );
		}
		  
		  $("#proj_navigation").css("display", "");
		  $(".openproject").css("display", "");
		  $("#projectmoreinfo").css("display", "");

			var height =  $("#divnav"+projectid+" .img-loader-container").height() ;
			//alert(height);
			 $("#divnav"+projectid).find('.portfolio-overlay').children('.portfolio-lupa').css({
					'position': 'relative',
					'width': 75,
					'height': 75,
					'margin': '0 auto',
					'margin-top': ( height - $(this).height())/2,
					'background': 'url(img/lupa-proj.png)'
				});

		  });

	/*END MORE INFO PROJECTS*/
}

function hover_projects(){
	//alert('fully.js hover_projects');
//add-hover handlers 
	//hover with magnifying glass
	$('.add-hover-magnify').each(function(){
		//add hover layer
		$(this).parent().append('<div class="add-hover-result"></div>');
		$(this).parent().children('.add-hover-result').css({
			'width': $(this).width()+'px',
			'height': $(this).height()+'px',
			'position': 'absolute',
			'z-index': 5,
			'background': '#000',
			'top': 0,
			'opacity': 0,
			'filter': 'alpha(opacity=0)',
			'margin': $(this).css('padding-left')
		});
		//add magnifying glass
		$(this).parent().append('<div class="magnify"><a href="#" rel="prettyPhoto"><img src="img/lupa.png" alt=""></a></div>');
		$(this).parent().children('.magnify').css({
			'position': 'absolute',
			'bottom': 3,
			'right': 5,
			'width': '24px',
			'height': '18px',
			'opacity': 0,
			'filter': 'alpha(opacity=0)',
			'z-index': 20,
			'overflow': 'hidden'
		});
		$(this).parent().children('.magnify').children('a').attr('href', $(this).attr('src') );
		$(this).parent().children('.magnify').children('a').children('img').css({
			'margin-top': '-18px'
		});
		$(this).parent().children('.magnify').children('a').children('img').hover(function(){
			$(this).css('cursor','pointer');
			$(this).stop(true,true).animate({
				'margin-top': 0
			}, 120);
		}, function(){
			$(this).css('cursor','arrow');
			$(this).stop(true,true).animate({
				'margin-top': '-18px'
			}, 120);
		});
		
		//add more-info icon
		$(this).parent().append('<div class="more-info"><img src="img/moreinfo.png" alt=""></div>');
		
		if ( !$('body').hasClass('fx')){
			//sem fx arch
			$(this).parent().append('<div class="more-info"><img src="img/moreinfo.png" alt=""></div>');
			$(this).parent().children('.more-info').unbind('click');
			$(this).parent().children('.more-info').children('img').click(function(){
				window.location = $(this).parent().parent().children('a').attr('href');
			});
		} 
		
		$(this).parent().children('.more-info').css({
			'position': 'absolute',
			'bottom': 3,
			'right': 30,
			'width': '24px',
			'height': '18px',
			'opacity': 0,
			'filter': 'alpha(opacity=0)',
			'z-index': 20,
			'overflow': 'hidden'
		});
		$(this).parent().children('.more-info').children('img').css({
			'margin-top': '-18px'
		});
		$(this).parent().children('.more-info').children('img').hover(function(){
			$(this).css('cursor','pointer');
			$(this).stop(true,true).animate({
				'margin-top': 0
			}, 120);
		}, function(){
			$(this).css('cursor','arrow');
			$(this).stop(true,true).animate({
				'margin-top': '-18px'
			}, 120);
		});
		
		//hover handlers
		$(this).parent().hover(function(){
			$(this).stop(true,true).children('.add-hover-result').animate({
				'opacity': .7
			}, 500);
			$(this).stop(true,true).children('.description').animate({
				'bottom': 0
			}, {
				duration: 300,
				easing: 'easeInOutExpo'
			});
			$(this).children('.magnify').stop(true,true).animate({
				'opacity': 1
			}, 500);
			$(this).children('.more-info').stop(true,true).animate({
				'opacity': 1
			}, 500);
		}, function(){
			$(this).children('.add-hover-result').stop(true,true).animate({
				'opacity': 0
			}, 500);
			$(this).children('.description').stop(true,true).animate({
				'bottom': -20
			}, {
				duration: 300,
				easing: 'easeInOutExpo'
			});
			$(this).children('.magnify').stop(true,true).animate({
				'opacity': 0
			}, 500);
			$(this).children('.more-info').stop(true,true).animate({
				'opacity': 0
			}, 500);
		});
	});
	
	//hover with fullscreen
	
		
	$(' .add-hover-fullscreen').each(function(index){
		//add hover layer
		$(this).parent().append('<div class="add-hover-result"></div>');
		$(this).parent().children('.add-hover-result').css({
			'width': $(this).width()+'px',
			'height': $(this).height()+'px',
			'position': 'absolute',
			'z-index': 5,
			'background': '#000',
			'top': 0,
			'opacity': 0,
			'filter': 'alpha(opacity=0)',
			'margin': $(this).css('padding-left')
		});
		//add fullscreen icon
		$(this).parent().append('<div class="fullscreen-icon"><a href="#" onclick="return false;"><img src="img/fullscreen.png" alt=""></a></div>');
		$(this).parent().children('.fullscreen-icon').css({
			'position': 'absolute',
			'bottom': 3,
			'right': 5,
			'width': '24px',
			'height': '18px',
			'opacity': 0,
			'filter': 'alpha(opacity=0)',
			'z-index': 20,
			'overflow': 'hidden'
		});
		//this pointed the fullscreen icon to the original img src
		//$(this).parent().children('.fullscreen-icon').children('a').attr('href', $(this).attr('src') );
		$(this).parent().children('.fullscreen-icon').children('a').children('img').css({
			'margin-top': '-18px'
		});
		$(this).parent().children('.fullscreen-icon').children('a').children('img').hover(function(){
			$(this).css('cursor','pointer');
				$(this).stop(true,true).animate({
					'margin-top': 0
				}, 120);
			}, function(){
				$(this).css('cursor','arrow');
				$(this).stop(true,true).animate({
					'margin-top': '-18px'
				}, 120);
		});
		
		//index do slideshow no fullscreen layer
		window.fsindex = 0;
		
		//unique classid 
		window.callertop = 0;
		window.callerleft = 0;
			
		//number of fullscreenable projects
		window.counter = $('.fullscreen-icon').length;

		
		//open the fullscreen.layer first time
		$(this).parent().children('.fullscreen-icon').unbind('click');
		$(this).parent().children('.fullscreen-icon').click(function(){
						
			//enable keypress listener
			if ($.browser.msie || $.browser.webkit) {
				$(document).unbind('keydown');
			    $(document).keydown(function(e){
					checkKey(e);
				});
			} else {
				$(document).unbind('keypress');
			    $(document).keypress(function(e){
					checkKey(e);
				});
			}
		
			//emulate mouseleave event
			$(this).parent().children('.add-hover-result').animate({
				'opacity': 0
			}, 500);
			$(this).parent().children('.description').animate({
				'bottom': -20
			}, {
				duration: 300,
				easing: 'easeInOutExpo'
			});
			$(this).parent().children('.fullscreen-icon').animate({
				'opacity': 0
			}, 500);
			///
		
			window.index = index;
			
			$('body').css('overflow','hidden');
			
			var maxWidth = $(window).width();
			var maxHeight = $(window).height();	
			
			$('.fullscreen-layer .item-index').html(index);
			
			//checkup
			updateNavButtons();
							
			//generate unique id for closing purposes
			var rand_id = parseInt(Math.random()*10000000);
			var rand_id = "FS-"+rand_id;
			$(this).addClass(rand_id.toString());
			window.caller = rand_id;
			//get the scrolltop value , to fixate the layer
			var offset = $(this).offset();
			var yPos = offset.top - window.pageYOffset;
			//alert(yPos);
			window.callertop = offset.top;
			window.callerleft = offset.left;		
			$('body').children('.fullscreen-layer').css({
				'z-index':99999,
				'position':'fixed',
				'top': yPos,
				'left': window.callerleft
			});
			
			//get the images 
			if ( $(this).parent().find('.images').children('img').length < 2 ){ //there's only one image
			
				$('.fullscreen-layer .content .top .indexer').hide();
				//hide arrows
				$('.fullscreen-layer .content .images-container .nav .FSprevious').hide();
				$('.fullscreen-layer .content .images-container .nav .FSnext').hide();
				$('.fullscreen-layer .content .images-container .nav .FSprevious').unbind('click');
				$('.fullscreen-layer .content .images-container .nav .FSnext').unbind('click');
				$('.fullscreen-layer .content .images-container .nav .FSprevious').unbind('hover');
				$('.fullscreen-layer .content .images-container .nav .FSnext').unbind('hover');
				
				//remove old stuff
				$('.fullscreen-layer .content .images-container .images').html('');
				$('.fullscreen-layer .background').html('');
				
				//append single image
				$(this).parent().find('.images').children('img').clone().appendTo('body .fullscreen-layer .content .images-container .images');
				$('.fullscreen-layer .content .images-container .images img').css({'opacity':0,'left':0});
				$('.fullscreen-layer .background').append('<ul><li></li></ul>');
				$(this).parent().find('.images').children('img').clone().appendTo('body .fullscreen-layer .background ul li');
				$('.fullscreen-layer .background ul li img').css('opacity',0);
				$('.fullscreen-layer .content .images-container .images img').load(function(){
					$(this).animate({'opacity':1}, 1000);
					$('.fullscreen-layer .background ul li img').animate({'opacity':1}, 1000)
				});
				
				//append text
				$('.fullscreen-layer .content .bottom .FSdescription').remove();
				$(this).parent().find('.FSdescription').clone().appendTo( $('.fullscreen-layer .content .bottom') );
			}
			else { //more than one image - slideshow mode
				$('.fullscreen-layer .content .top .indexer').show();
				//show arrows on hover 
				$('.fullscreen-layer .content .images-container .nav .FSprevious').show();
				$('.fullscreen-layer .content .images-container .nav .FSnext').show();
				$('.fullscreen-layer .content .images-container .nav .FSprevious').unbind('click');
				$('.fullscreen-layer .content .images-container .nav .FSprevious').click(function(){
					window.clearInterval(window.intFS);
					slidePrevious();
				});
				
				$('.fullscreen-layer .content .images-container .nav .FSnext').unbind('click');
				$('.fullscreen-layer .content .images-container .nav .FSnext').click(function(){
					window.clearInterval(window.intFS);
					slideNext();
				});
				//hover fullyslider arrows
				$('.fullscreen-layer .content .images-container .nav').hover(function(){
					$('.fullscreen-layer .content .images-container .nav .FSprevious').stop(true,true).animate({
						'margin-left': 0
					}, {
						duration: 200,
						easing: 'easeInOutExpo'
					});
					$('.fullscreen-layer .content .images-container .nav .FSnext').stop(true,true).animate({
						'margin-right': 0
					}, {
						duration: 200,
						easing: 'easeInOutExpo'
					});	
				}, function(){
					$('.fullscreen-layer .content .images-container .nav .FSprevious').stop(true,true).animate({
						'margin-left': '-29px'
					}, {
						duration: 200,
						easing: 'easeInOutExpo'
					});
					$('.fullscreen-layer .content .images-container .nav .FSnext').stop(true,true).animate({
						'margin-right': '-29px'
					}, {
						duration: 200,
						easing: 'easeInOutExpo'
					});
				});
				window.images = new Array();
				//append images and create events
				window.sliderindex = 0;
				window.slidermax = 0;
				//remove
				$('.fullscreen-layer .content .images-container .images').html('');
				$('.fullscreen-layer .background').html('');
				$('.fullscreen-layer .content .bottom .FSdescription').remove();
				//populate
				$(this).parent().find('.FSdescription').clone().appendTo( $('.fullscreen-layer .content .bottom') );
				$('.fullscreen-layer .content .images-container .images').append('<ul id="slides"></ul>');
				$('.fullscreen-layer .background').append('<ul></ul>');
				$(this).parent().find('.images').children('img').each(function(index){
					window.images[index] = $(this).attr('src');
					$('.fullscreen-layer .content .images-container .images #slides').append('<li><img class="slides" alt="" src="'+ window.images[index] +'"></li>');
					$('.fullscreen-layer .background ul').append('<li><img class="slides" alt="" src="'+ window.images[index] +'"></li>');
					//slice it up
					$('.fullscreen-layer .content .images-container .images #slides li').css({
						'position':'relative',
						'float':'left',
						'width': '125px',
						'height':'191px',
						'overflow-x':'hidden',
						'opacity': '.5'
					});
					
					
					$('.fullscreen-layer .content .images-container .images #slides li').eq(window.sliderindex).css({
						'opacity': 1
					});
					
					$('.fullscreen-layer .background ul li').children('img').css('opacity', 0);
					window.slidermax = index;
					window.sliderindex = 0;
				});
				
				if ( window.slidermax == 1){
					$('.fullscreen-layer .content .images-container .images #slides li').width(188);
					$('.fullscreen-layer .content .images-container .images').width(382);
				} else {
					$('.fullscreen-layer .content .images-container .images').css('width','383px');
				}
				
				$('.fullscreen-layer .content .top .indexer .who').html(window.sliderindex+1);
				$('.fullscreen-layer .content .top .indexer .howMany').html(window.slidermax+1);
				
				//alert(window.sliderindex);
				$('.fullscreen-layer .content .images-container .images #slides li').eq(window.sliderindex).css({
					'opacity': 1,
					borderColor: '#3fa8bf'
				});
				
				$('.fullscreen-layer .background ul li').eq(window.sliderindex).children('img').animate({
					'opacity': 1
				});
				
				window.clearInterval(window.intFS);
				window.intFS = window.setInterval("fullySlider()",5000);
			}
			
			$('body .navigation .title').html($(this).parent().find('.title').html());
			$('body').children('.fullscreen-layer').animate({
				'opacity': 1,
				'width': maxWidth,
				'height': maxHeight,
				'top': 0,
				'left': 0,
				'z-index': 99999
			}, {
				duration: 1500,
				easing: 'easeInOutExpo'
			});
			$('.fullscreen-layer').children('.close-btn').hover(function(){
				$(this).animate({
					'margin-right':'-45px'
				}, {
					duration: 200,
					easing: 'easeInOutExpo'
				});
			}, function(){
				$(this).animate({
					'margin-right':'-60px'
				}, {
					duration: 200,
					easing: 'easeInOutExpo'
				});
			});
			
			$(window).resize(function(){
			
				var width = $(window).width();
				var height = $(window).height();
				//adjust background
				$('.fullscreen-layer').children('.background').css({
					'width': width,
					'height': height
				});
				//adjust close button
				$('.fullscreen-layer').children('.close-btn').css({
					'position':'fixed'
				});
			});
		});
		
		//hover handlers
		$(this).parent().hover(function(){
			$(this).children('.add-hover-result').stop(true,true).animate({
				'opacity': .7
			}, 500);
			$(this).children('.description').stop(true,true).animate({
				'bottom': 0
			}, {
				duration: 300,
				easing: 'easeInOutExpo'
			});
			$(this).children('.fullscreen-icon').stop(true,true).animate({
				'opacity': 1
			}, 500);
		}, function(){
			$(this).children('.add-hover-result').stop(true,true).animate({
				'opacity': 0
			}, 500);
			$(this).children('.description').stop(true,true).animate({
				'bottom': -20
			}, {
				duration: 300,
				easing: 'easeInOutExpo'
			});
			$(this).children('.fullscreen-icon').stop(true,true).animate({
				'opacity': 0
			}, 500);
		});
		

	});
	
	//adjust icons for each browser 
	if (window.BrowserDetect.OS === "Mac"){
		if (window.BrowserDetect.browser === "Chrome" || window.BrowserDetect.browser === "Safari" || window.BrowserDetect.browser === "Firefox"){
			$('.fullscreen-icon, .more-info, .magnify').css('bottom', 2);
		} 
	}
	if (window.BrowserDetect.OS === "Win"){

		if (window.BrowserDetect.browser === "Firefox"){
			$('.fullscreen-icon, .more-info, .magnify').css('bottom', 1);
		}
		if (window.BrowserDetect.browser === "Explorer" || window.BrowserDetect.browser === "Chrome" || window.BrowserDetect.browser === "Safari"){
			$('.fullscreen-icon, .more-info, .magnify').css('bottom', 1);
			if (navigator.appVersion.indexOf("MSIE") != -1)
		      // bah, IE again, lets downgrade version number
		      var version = parseFloat(navigator.appVersion.split("MSIE")[1]);
		      if (parseInt(version) == 8){
				$('.fullscreen-icon, .magnify, .more-info').each(function(){
					$(this).css('bottom',1)
				});
		      }
		}
		
	}
	
	//initialize prettyPhoto home_rows
	$('.home_rows, .magnify').find("a[rel^='prettyPhoto']").prettyPhoto({autoplay_slideshow:false, deeplinking: false, markup: '<div class="pp_pic_holder"> \
      <div class="ppt">&nbsp;</div> \
      <div class="pp_top"> \
       <div class="pp_left"></div> \
       <div class="pp_middle"></div> \
       <div class="pp_right"></div> \
      </div> \
      <div class="pp_content_container"> \
       <div class="pp_left"> \
       <div class="pp_right"> \
        <div class="pp_content"> \
         <div class="pp_loaderIcon"></div> \
         <div class="pp_fade"> \
          <a href="#" class="pp_expand" title="Expand the image">Expand</a> \
          <div class="pp_hoverContainer"> \
           <a class="pp_next" href="#">next</a> \
           <a class="pp_previous" href="#">previous</a> \
          </div> \
          <div id="pp_full_res"></div> \
          <div class="pp_details"> \
           <a class="pp_close" href="#">Close</a> \
          </div> \
         </div> \
        </div> \
       </div> \
       </div> \
      </div> \
      <div class="pp_bottom"> \
       <div class="pp_left"></div> \
       <div class="pp_middle"></div> \
       <div class="pp_right"></div> \
      </div> \
     </div> \
     <div class="pp_overlay"></div>'});
}