/***************************/
// Services Tabs JS					
/***************************/

$(document).ready(function(){
	$(".nav-prop > li").click(function(e){
		switch(e.target.id){
			case "meridian":
				//change status & style menu
				$("#meridian").addClass("active");
				$("#equator").removeClass("active");
				$("#equinox").removeClass("active");
				$("#latitud").removeClass("active");
				//display selected division, hide others
				$("div.meridian").fadeIn();
				$("div.equator").css("display", "none");
				$("div.equinox").css("display", "none");
				$("div.latitud").css("display", "none");
			break;
			case "equator":
				//change status & style menu
				$("#meridian").removeClass("active");
				$("#equator").addClass("active");
				$("#equinox").removeClass("active");
				$("#latitud").removeClass("active");
				//display selected division, hide others
				$("div.equator").fadeIn();
				$("div.meridian").css("display", "none");
				$("div.equinox").css("display", "none");
				$("div.latitud").css("display", "none");
			break;
			case "equinox":
				//change status & style menu
				$("#meridian").removeClass("active");
				$("#equator").removeClass("active");
				$("#equinox").addClass("active");
				$("#latitud").removeClass("active");
				//display selected division, hide others
				$("div.equinox").fadeIn();
				$("div.meridian").css("display", "none");
				$("div.equator").css("display", "none");
				$("div.latitud").css("display", "none");
			break;
			case "latitud":
				//change status & style menu
				$("#meridian").removeClass("active");
				$("#equator").removeClass("active");
				$("#equinox").removeClass("active");
				$("#latitud").addClass("active");
				//display selected division, hide others
				$("div.latitud").fadeIn();
				$("div.meridian").css("display", "none");
				$("div.equator").css("display", "none");
				$("div.equinox").css("display", "none");
			break;
		}
		//alert(e.target.id);
		return false;
	});
});

/***************************/
// Slider				
/***************************/

$(window).load(function() {
    $('#slider').nivoSlider({
    effect:'fade', // Specify sets like: 'fold,fade,sliceDown'
    animSpeed: 500, // Slide transition speed
    pauseTime: 5000, // How long each slide will show
    startSlide: 0, // Set starting Slide (0 index)
    directionNav:true, // Next & Prev navigation
    directionNavHide:true, // Only show on hoverv
    controlNav:true, // 1,2,3... navigation
    controlNavThumbs:false, // Use thumbnails for Control Nav
    controlNavThumbsFromRel:false, // Use image rel for thumbs
    controlNavThumbsSearch: '.jpg', // Replace this with...
    controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src
    keyboardNav:true, // Use left & right arrows
    pauseOnHover:true, // Stop animation while hovering
    manualAdvance:false, // Force manual transitions
    captionOpacity:0.8, // Universal caption opacity
    prevText: 'Prev', // Prev directionNav text
    nextText: 'Next', // Next directionNav text
    beforeChange: function(){}, // Triggers before a slide transition
    afterChange: function(){}, // Triggers after a slide transition
    slideshowEnd: function(){}, // Triggers after all slides have been shown
    lastSlide: function(){}, // Triggers when last slide is shown
    afterLoad: function(){} // Triggers when slider has loaded
  });	
});
   

  // wrap as a jQuery plugin and pass jQuery in to our anoymous function
    (function ($) {
        $.fn.cross = function (options) {
            return this.each(function (i) { 
                // cache the copy of jQuery(this) - the start image
                var $$ = $(this);
                
                // get the target from the backgroundImage + regexp
                var target = $$.css('backgroundImage').replace(/^url|[\(\)'"]/g, '');
 
                // nice long chain: wrap img element in span
                $$.wrap('<span style="position: relative;"></span>')
                    // change selector to parent - i.e. newly created span
                    .parent()
                    // prepend a new image inside the span
                    .prepend('<img>')
                    // change the selector to the newly created image
                    .find(':first-child')
                    // set the image to the target
                    .attr('src', target);
 
                // the CSS styling of the start image needs to be handled
                // differently for different browsers
                 if ($.browser.msie) {
                  $$.css({
                	'position' : 'absolute', 
               		'left' : 0,
                	'background' : ''
           		 });
        		}

        		else if ($.browser.mozilla) {
            	 $$.css({
                	'position' : 'absolute', 
                	'left' : 0,
                	'background' : '',
                	'top' : this.offsetTop
            	});
                } else if ($.browser.opera && $.browser.version < 9.5) {
                    // Browser sniffing is bad - however opera < 9.5 has a render bug 
                    // so this is required to get around it we can't apply the 'top' : 0 
                    // separately because Mozilla strips the style set originally somehow...                    
                    $$.css({
                        'position' : 'absolute', 
                        'left' : 0,
                        'background' : '',
                        'top' : "0"
                    });
                } else { // Safari
                    $$.css({
                        'position' : 'absolute', 
                        'left' : 0,
                        'background' : ''
                    });
                }
 
                // similar effect as single image technique, except using .animate 
                // which will handle the fading up from the right opacity for us
                $$.hover(function () {
                    $$.stop().animate({
                        opacity: 0
                    }, 250);
                }, function () {
                    $$.stop().animate({
                        opacity: 1
                    }, 250);
                });
            });
        };
        
    })(jQuery);
    
    // note that this uses the .bind('load') on the window object, rather than $(document).ready() 
    // because .ready() fires before the images have loaded, but we need to fire *after* because
    // our code relies on the dimensions of the images already in place.
    $(window).bind('load', function () {
        $('img.fade').cross();
    });



$(document).ready(function() {

	// Init basevalues
	currentPage = "main";
	caseOpen = false;
	globalWorkPageHeight = 0;
	
	$('#works').height("0px");
	$('.servicebox-hover').css({ opacity: 0 });
	$('.hover').css({ opacity: 0 });
	
	$('.servicebox-hover').mouseenter(function() {

		$(this).find($('li')).css({ opacity: 0, marginTop:15});
		$(this).css({ opacity: 1 });
			$(this).find($('li')).each(function(index) {
				tweenTime = index * 50 + 200;
				delayTime = index * 250;
   				$(this).delay(delayTime).animate({opacity: 1, marginTop:0}, {queue: false, duration:tweenTime, easing:"easeOutQuad"});
  			});
	});
	
	$('.servicebox-hover').mouseleave(function() {
		$(this).animate({ opacity: 0 }, {duration:150, easing:"easeOutQuad"});
	});
	
});






