/* targetting browsers with plain Javascript */
var ie6 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 6.0") != -1);
var ie7 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 7.0") != -1);
var ie8 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 8.0") != -1);

/* jQuery hover navigation animation */
$("li.animateNav a").each(function() {
 
        $(this).hover(function() {

                $(this).stop().animate({
                        marginTop: "-5px"
                }, 150, 'easeInOutQuad', function() {
 	    
                        $(e).animate({
                                marginTop: "-3px"
                        }, 200, 'easeInOutQuad');
                });
 	    
        },function(){
 	
                $(this).stop().delay(75).animate({
                        marginTop: "2px"
                }, 450, 'swing', function() {
 	    
                        $(e).animate({
                                marginTop: 0
                        }, 500, 'swing');
                });

        });
});

/* jQuery hover introBoxes anchor animations */
$("a.btnIntroBox").hover(function() {
 	
        var e = this;
        $(e).stop().animate({
                bottom: "30px"
        }, 150, 'easeInOutQuad', function() {
 	    
                $(e).animate({
                        bottom: "32px"
                }, 200, 'easeInOutQuad');
        });
 	    
},function(){
 	
        var e = this;
        $(e).stop().delay(75).animate({
                bottom: "39px"
        }, 300, 'swing', function() {
 	    
                $(e).delay(10).animate({
                        bottom: "35px"
                }, 450, 'swing');
        });
});

/* Standing lamp animation */
var lamp = $("div#headerContent div#lampTurnOn");
$("div#headerContent  div#lamp_Btn").hover(function() {
        // if the element is currently being animated (to a fadeOut)...
        if (lamp.is(':animated')) {
                // ...take it's current opacity back up to 1
                lamp.stop().fadeTo(100, 1);

        } else {
                // fade in
                lamp.delay(50).fadeIn(100);
        }
}, function() {
        // on hovering out, fade the element out    
        if (lamp.is(':animated')) {

                lamp.stop().fadeTo(500, 0);
        } else {
                // fade away
                lamp.delay(250).fadeOut(500);
        }
});

/* Giraffe animation */        
var giraffe = $("div#headerContent  div#giraffeTongue");               
$("div#headerContent  div#giraffe_Btn").hover(function() {

        if (giraffe.is(':animated')) {
                // ...take it's current opacity back up to 1
                giraffe.stop().fadeTo(100, 1);

        } else {

                giraffe.delay(50).fadeIn(100);
        }
},  function() {

        if (giraffe.is(':animated')) {

                giraffe.stop().fadeTo(500, 0);
        } else {

                giraffe.delay(250).fadeOut(500);
        }
});

/* No animated circles-PNG's for IE6 and IE7  */
if (!(jQuery.browser.msie && (ie6 || ie7))) {
        $("div#effect1").cycle({
                fx: 'fade',
                speed: 3500,  // speed of the transition (any valid fx speed value)
                timeout: 4500  // elapsetime between the start of each transition
        });

        $("div#effect2").cycle({
                fx: 'fade',
                speed: 5000,
                timeout: 6000
        });

}

/* IE6 and IE7 static circle png's in heading because of IE's Black-Border-Bug and no working solution found! */
if (jQuery.browser.msie && (ie6 || ie7)) {
        $("div#effect1, div#effect2").find("img").hide();
        $("div#effect1").find("img:first-child").show();
        $("div#effect2").find("img:nth-child(2)").show(); 
}

/* ## Apply Condition to generate Cufon and Cycle jQuery plugin
   ## on P-elements in div with id="headerContent" ## */
$('div#headerContent div#cycle').cycle({
        fx: 'fade',
        speed: 2500,
        timeout: 6500
});

/* Smooth scrolling to Anchor */
$("a[href*=#]").each(function(i){

        var url = $(this).attr("href");
        if (url) {
                
                if(url.indexOf("#") != -1 && url.indexOf("#") == 0) {
                        
                        var aParts = url.split("#", 2);
                        var anchor = $("a[id='"+aParts[1]+"']");
                }
                if(anchor) {
                        $(this).bind('click', function(event) {
                                
                                if($(document).height() - anchor.offset().top >= $(window).height() || anchor.offset().top > $(window).height()) {
                                        
                                        $("html:not(:animated), body:not(:animated)").animate( { 
                                                
                                                scrollTop: anchor.offset().top
                                        },  1500,  'easeInOutQuad');
                                        
                                        //console.log("smoothscroll trigered to: " + aParts + ".");
                                        //console.log("value of scrollTop is: " + anchor.offset().top + ".");
                                }
                                return false;
                        });
                }
        }
});

/* position link2Top div
 * @TODO  bij bij kleiner gelijk hoogte van viewport hoeft de link-div niet getoond te worden */

//Reposition Y-axis of fixed  div#link2Top
function repoDivLink2Top() {

        var divLeftPos = null;
        if (view.width() <=  1010) {
                divLeftPos = view.width()- $("div#link2Top").outerWidth();
                // console.log("<= 1010px");
        } else {
                divLeftPos=  (view.width() + 960)/2;
                // console.log("> 1010px");
        }
    
        $("div#link2Top").css({left: divLeftPos}); //Used css API, chrome gets offset wrong at load-event!
        //console.log("offset top is: " + $("div#link2Top").offset().top + " , offset links is: " + $("div#link2Top").offset().left + " en aantal px tot de top is: " + view.scrollTop());
}

var view = $(window);
//Reposition Y-axis  div#link2Top on load
view.bind('load', function() {
        repoDivLink2Top()
});
//Triggered every 100ms to prevent performance loss!
var resizeTimer = null;
view.bind('resize', function() {
        if (resizeTimer) clearTimeout(resizeTimer);
        resizeTimer = setTimeout(repoDivLink2Top, 100);
});

/*view.bind('scroll', function() {
        
        //@TODO code om div#link2Top naar 0 te faden bij scroll 
        $("div#link2Top").fadeTo(500, 0.2)
}, function() {
        
        $("div#link2Top").fadeTo(250,1)
});*/

/* jQuery hover link2Top animation */
$("div#link2Top").hover(function() {
 	
        var e = this;
        $(e).stop().animate({
                marginBottom: "-5px"
        }, 150, 'easeInOutQuad', function() {
 	    
                $(e).animate({
                        marginBottom: "-2px"
                }, 200, 'easeInOutQuad');
        });
       	    
},function(){
 	
        var e = this;
        $(e).stop().delay(75).animate({
                marginBottom: "2px"
        }, 300, 'swing', function() {
 	    
                $(e).delay(10).animate({
                        marginBottom: 0
                }, 450, 'swing');
        });
});

/* Fancybox */
var fancySpeedIn = 700;
var fancySpeedOut = 250;

$("a[rel=fancyWebdesign], a[rel=fancyDiversen]").fancybox({
        'transitionIn'            :	'elastic',
        'transitionOut'         :	'elastic',
        'speedIn'                  :	fancySpeedIn, 
        'speedOut'               :	fancySpeedOut, 
        'easingIn'                 :               'easeInQuad',
        'easingOut'              :               'easeOutQuad',
        'titlePosition' 	 :               'over',
        'titleFormat'             :               function(title, currentArray, currentIndex, currentOpts) {
                
                return '<span id="fancybox-title-over">Afbeelding ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? '   ' + title : '') + '</span>';
        }
});
 
/* Apply Cufon-fonts to elements */
var shadowColor = '#650a22';
var introShadow = '1px 1px';
var introShadowColor = '#85116a';
var smallShadow = '1px 2px';
var bigShadow = '2px 3px';
var scriptShadowColor = ' #5f0d4f';
var scriptShadow = '2px 2px';

Cufon.replace('ul#nav a', {
        fontFamily: "FranklinGothicLTBookCompressed", 
        fontWeight:400, 
        hover: true
})
('h1', {
        fontFamily: "FranklinGothicLTBookCompressed", 
        fontWeight:400, 
        textShadow: smallShadow + shadowColor,
        hover: false
})
('a.btnIntroBox', {
        fontFamily: "FranklinGothicLTBookCompressed", 
        fontWeight:400, 
        textShadow: introShadow + introShadowColor,
        hover: true
})
('div#headerContent h1', {
        fontFamily: "FranklinGothicLTMedium", 
        fontWeight:700, 
        textShadow: bigShadow + shadowColor, 
        hover: false
})
('h2', {
        fontFamily: "AvantGardeSTDBookCondensed", 
        fontWeight:300, 
        textShadow: smallShadow + shadowColor, 
        hover: false
})        
('h3', {
        fontFamily: "AvantGardeSTDBookCondensed", 
        fontWeight:300, 
        textShadow: smallShadow + shadowColor,
        hover: false
})
('div#headerContent p', {
        fontFamily: "AvantGardeSTDBookCondensedOblique", 
        fontWeight:300, 
        textShadow: smallShadow + shadowColor,
        hover: false
})
('div#headerContent  span#beta', {
        fontFamily: "AvantGardeSTDBookCondensedOblique", 
        fontWeight:300, 
        textShadow: smallShadow + shadowColor,
        hover: false
})
('div#headerContent div#lampTurnOn p', {
        fontFamily: "lobster", 
        fontWeight:400, 
        textShadow: scriptShadow + scriptShadowColor,
        hover: false
})
('div#headerContent div#giraffeTongue p', {
        fontFamily: "lobster",
        fontWeight:400, 
        textShadow: scriptShadow + scriptShadowColor,
        hover: false
});
     
/* jQuery Infields places labels in input */
$(function() { 
        $("label").inFieldLabels(); 
        $("input").attr("autocomplete","off");
});
 
 
 /* tooltip for webform. Webform currently disabled! 
   * Set div#tooltip to invisible  */
$("form#contactform").hover(function () {
        
        var errorMessage = 'Dit webformulier is ter bescherming van uw en mijn mailbox tijdelijk uitgeschakeld!'; 
        errorMessage += 'Mijn excuses voor het ongemak!<p><a href="mailto:raymond@myradon.nl">raymond[at]myradon<br />[punt]nl</p>';
        
        var tooltip = $(this).find("div#tooltip");
        tooltip.html(errorMessage);
        tooltip.css({display: 'block'}); //done with display and this position otherwise interfears with iepngfix.htc for IE8 injects also in DOM.
        
        if (tooltip.is(':animated')) {

                tooltip.stop().animate({opacity: 1}, 50);

        } else {
                
                tooltip.delay(50).animate({opacity: 1}, 250);
        }


}, function() {
        
        var tooltip = $(this).find("div#tooltip");
        if (tooltip.is(':animated')) {

                tooltip.stop().animate({opacity: 0}, 50);

        } else {
                
                tooltip.delay(50).animate({opacity: 0}, 750);
        }
});