var startseite_slideShowTimer;
var startseite_slideShowPos = 0;
var customFonts = Modernizr.fontface;

var topSlideshow_animSpeed = 2000;
var topSlide_intervalSpeed = 7000;
var slideElements;

var isSliding = false;
var activeSlideshow = false;

var activateTopSlides = false;
var activeOverlay = false;

// ---- // Returns the version-# of MSIE or "0" if it's a good browser
function detectBrowser()
{
  var ua = window.navigator.userAgent
  var msie = ua.indexOf ( "MSIE " )
  if ( msie > 0 )      // If Internet Explorer, return version number
    return parseInt (ua.substring (msie+5, ua.indexOf (".", msie )))
  else                 // If another browser, return 0
    return 0
}

function addCustomStyles() {
    // --[] CSS3-FONTS------

    if (customFonts == true) {
        // menu
        jQuery('#mainNav li a').addClass('menu_alternate_first'); // Schriftart ersetzen wenn CSS3 vorhanden
        jQuery('#mainNav li ul li a').addClass('menu_alternate_second'); // Schriftart ersetzen wenn CSS3 vorhanden

        if (jQuery('body').attr('id') == 'startseite') {
            // Head-Slides
            jQuery('.startseite_headSlideshow_addContainer h2').addClass('startseite_headSlideshow_addContainer_altFont'); // Schriftart ersetzen wenn CSS3 vorhanden
            // Dreispaltigen Bereich stylen
            jQuery('.startseite_threeColumn_element h3').addClass('startseite_threeColumn_element_altFont'); // Schriftart ersetzen wenn CSS3 vorhanden
            // BOTTOM-Bereich stylen
            jQuery('#startseite_bottom h3').addClass('startseite_bottom_elementLeft_altFont'); // Schriftart ersetzen wenn CSS3 vorhanden
            jQuery('.startseite_bottom_elementLeft_addInfo').addClass('startseite_bottom_elementLeft_altFont'); // Schriftart ersetzen wenn CSS3 vorhanden
        } // Startseite
        else {
            jQuery('h1, h2, h3').addClass('heading_altFont');
            // Zebra-Table styles
            jQuery('table').each(function() {
                jQuery(this).find('tr:odd td').addClass('oddTD')
            });
        }
    } // CustomFonts
    
    // --[] ADDITIONAL LOGIC FOR STYLING

    if (jQuery('body').attr('id') == 'startseite') {
            jQuery('.startseite_threeColumn_element').filter(
            function(index) { jQuery('.startseite_threeColumn_element:eq('+index+') p:not(:first)').addClass('startseite_threeColumn_divider'); }
        );
    } // Startseite
}

function doHeadSlideShow() {
    isSliding = true; // indicate the the top slideshow is currently active
    
    jQuery('#detailsTop_silhouette, #detailsTop_red, #detailsTop_smallLight, #detailsTop_whiteProductShot, #detailsTop_largeLight, .startseite_headSlideshow_addContainer').css({opacity: 0, display: 'none'});
    if ((startseite_slideShowPos+1) < slideElements) {
        jQuery('#startseite_headSlideshow .active img').animate({opacity: 0}, topSlideshow_animSpeed);
        jQuery('#startseite_headSlideshow .active').removeClass('active');
    
        startseite_slideShowPos++;
        jQuery('#startseite_headSlideshow li:eq('+(startseite_slideShowPos)+') img').animate({opacity: 1}, topSlideshow_animSpeed, function() {
            isSliding = false;    
        });
        jQuery('#startseite_headSlideshow li:eq('+(startseite_slideShowPos)+') .startseite_headSlideshow_element').addClass('active');
    } else {
        jQuery('#startseite_headSlideshow li:eq('+(startseite_slideShowPos)+') img').animate({opacity: 0}, topSlideshow_animSpeed);
        jQuery('#startseite_headSlideshow li:eq('+(startseite_slideShowPos)+') .startseite_headSlideshow_element').removeClass('active');
        
        jQuery('#startseite_headSlideshow li:eq(0) img').animate({opacity: 1}, topSlideshow_animSpeed, function() {
            isSliding = false;    
        });
        jQuery('#startseite_headSlideshow li:eq(0) .startseite_headSlideshow_element').addClass('active');
        
        startseite_slideShowPos = 0;
    }
}

function startseite_headSlideshow() {
    slideElements = jQuery('#startseite_headSlideshow li').length;
    jQuery('#startseite_headSlideshow li img').css({opacity: 0});
    jQuery('#startseite_headSlideshow li:first img').css({opacity: 1});
    if (slideElements > 1) { // if more than 1 element(s) reside within the splash-container: do the magic
        startseite_slideShowTimer = setInterval (doHeadSlideShow, topSlide_intervalSpeed);
    }
}

function startseite_headSlideshow_attachHover() {

    if ( detectBrowser() == 0 )
    {

        var animSpeed = 200;
        var animEasing = 'easeInQuart';
    
        /*
        jQuery('#mainNav').hover(
            function () {
                    jQuery('#overlayController').css('display', 'none');
                    jQuery('#detailsTop_silhouette, #detailsTop_red, #detailsTop_smallLight, #detailsTop_whiteProductShot, #detailsTop_largeLight, .startseite_headSlideshow_addContainer').css({opacity: 0, display: 'none'});
                    activeOverlay = false;
            }, function() {
                if (activeSlideshow == false)
                    startseite_slideShowTimer = setInterval (doHeadSlideShow, topSlide_intervalSpeed);
            }
        );
        */
    
        // handler function if the user exited too fast for the relTarg to identify the source
        jQuery('#overlayController').hover(
            function () {
                if (activeOverlay == true) {
                    jQuery('.startseite_headSlideshow_addContainer').css('z-index', '2000');
                    jQuery('#overlayController').css('display', 'none');
                    jQuery('#detailsTop_silhouette, #detailsTop_red, #detailsTop_smallLight, #detailsTop_whiteProductShot, #detailsTop_largeLight, .startseite_headSlideshow_addContainer').css({opacity: 0, display: 'none'});
                    startseite_slideShowTimer = setInterval (doHeadSlideShow, topSlide_intervalSpeed);
                    activeOverlay = false;
                    activeSlideshow = true;
                }
            }
        );
    
        jQuery('.startseite_headSlideshow_element').hover(
            function () {
    
                if (activateTopSlides == true) { // only activate if the user hovered this section at least once
                    if (activeOverlay == false) {
                        if (isSliding == false) { // only active is the top slideshow is not currently active
                            activeOverlay = true;
                            activeSlideshow = false;
                            jQuery('#overlayController').css('display', 'block');
                            var myContainer = jQuery(this).parent().children('.startseite_headSlideshow_addContainer');
                            
                            clearInterval(startseite_slideShowTimer); // clear the animation-interval at the top
                            
                            // set opacity of elements to 0
                            jQuery('#detailsTop_silhouette, #detailsTop_red, #detailsTop_smallLight, #detailsTop_whiteProductShot, #detailsTop_largeLight, .startseite_headSlideshow_addContainer').css({opacity: 0});
                            // set display-style of elements to block
                            jQuery('#detailsTop_silhouette, #detailsTop_red, #detailsTop_smallLight, #detailsTop_whiteProductShot, #detailsTop_largeLight, .startseite_headSlideshow_addContainer').css({display: 'block'});
                            
                            jQuery('#detailsTop_silhouette').animate({opacity: 1}, 2000);
                            jQuery('#detailsTop_red').animate({opacity: 1}, animSpeed, animEasing);
                            jQuery('#detailsTop_smallLight').animate({opacity: 1}, animSpeed*2, animEasing);
                            jQuery('#detailsTop_whiteProductShot').animate({opacity: 1}, animSpeed*3, animEasing);
                            jQuery('#detailsTop_largeLight').animate({opacity: 1}, animSpeed*4, animEasing);
                            
                            myContainer.css({'z-index': 3000});
                            myContainer.animate({opacity: 1}, animSpeed*4, animEasing);
                        }
                    }
                }
            
            },
            function (event) {
                activateTopSlides = true;
                var e= event;
                
                if (!e) var e = window.event;
                var relTarg = e.relatedTarget || e.toElement;
                
                if (relTarg.id == 'overlayController') {
                    jQuery('.startseite_headSlideshow_addContainer').css('z-index', '2000');
                    jQuery('#overlayController').css('display', 'none');
                    jQuery('#detailsTop_silhouette, #detailsTop_red, #detailsTop_smallLight, #detailsTop_whiteProductShot, #detailsTop_largeLight, .startseite_headSlideshow_addContainer').css({opacity: 0, display: 'none'});
                    startseite_slideShowTimer = setInterval (doHeadSlideShow, topSlide_intervalSpeed);
                    activeOverlay = false;
                    activeSlideshow = true;
                }
            }
        );

    } // only active Hover-Function if it's not an IE

}


var bottomIsAnimating = false;
function startseite_bottom_animate(animateWhat) {
    var animSpeed = 1000;

    if (jQuery(animateWhat).hasClass('activeBottom'))
    {
    }
    // only animate the slide if it's not the same one
    else
    {
        jQuery('.activeBottom').stop().animate({opacity: 0}, animSpeed); // fadeout current slide
        jQuery('.activeBottom').removeClass('activeBottom'); // remove z-index class from current slide
        jQuery(animateWhat).addClass('activeBottom'); // add z-index class to desired slide
        jQuery(animateWhat).stop().animate({opacity: 1}, animSpeed); // fadein desired slide
    }
}

var injectedGoogle = false;
function startseite_bottom_attachHover() {
    
    if (detectBrowser() == 0) {
        jQuery('.startseite_bottom_element:not(:first)').css({opacity:0}); // hide all slides except the first one
    }
    
    jQuery('.startseite_bottom_navigationElement a').hover( // attach hover-functionality to all nav-links
            function () {
                clearInterval(startseite_slideShowTimer); // clear the animation-interval at the top to save precious ressources
                var callbackFrom = jQuery(this).parent().attr('id'); // get id of nav-element

                switch (callbackFrom) { // animate desired slide
                case 'startseite_bottom_ihrTeam':
                        startseite_bottom_animate('#startseite_ihrTeam');
                        break;
                case 'startseite_bottom_beautyLexikon':
                        startseite_bottom_animate('#startseite_beautyLexikon');
                        break;
                case 'startseite_bottom_anfahrt':
                        if (injectedGoogle == false) // if googleMaps hasn't already been injected
                        {
                            // inject googleMaps iFrame -- startseite_googleMaps
                            jQuery('#startseite_anfahrt .startseite_bottom_elementRight').html('<iframe id="startseite_googleMaps" width="652" height="382" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.de/maps?f=q&amp;source=s_q&amp;hl=de&amp;geocode=&amp;q=kosmetikzentrum+paderborn&amp;aq=&amp;sll=51.151786,10.415039&amp;sspn=26.242583,57.744141&amp;ie=UTF8&amp;hq=kosmetik+zentrum&amp;hnear=Paderborn,+Nordrhein-Westfalen&amp;ll=51.722828,8.740396&amp;spn=0.020311,0.055876&amp;z=14&amp;iwloc=A&amp;output=embed"></iframe><br /><small><a href="http://maps.google.de/maps?f=q&amp;source=embed&amp;hl=de&amp;geocode=&amp;q=kosmetik+zentrum+paderborn&amp;aq=&amp;sll=51.151786,10.415039&amp;sspn=26.242583,57.744141&amp;ie=UTF8&amp;hq=kosmetikzentrum&amp;hnear=Paderborn,+Nordrhein-Westfalen&amp;ll=51.722828,8.740396&amp;spn=0.020311,0.055876&amp;z=14&amp;iwloc=A" style="color:#0000FF;text-align:left">Grš§ere Kartenansicht</a></small>');

                            jQuery('#startseite_googleMaps').hover(
                                function() {
                                },
                                function() { // if mouse leaves googleMaps-hoverZone, remove z-index class
                                    jQuery('#startseite_anfahrt').removeClass('showBottom');
                                }
                            );
                            injectedGoogle = true;
                        }
                        startseite_bottom_animate('#startseite_anfahrt');
                        break;
                }
            },
            function () {
                if (slideElements > 1) {  // setTimer for the animation at the top if user leaves the hover-link
                    startseite_slideShowTimer = setInterval (doHeadSlideShow, topSlide_intervalSpeed);
                }
            }
    );
    
    // If googleMaps is the current slide and the user hovers above the googleMaps-hoverZone, show it above all elements
    jQuery('#startseite_googleMapsHoverZone').hover(
        function() {
            if (jQuery('.activeBottom').attr('id') == 'startseite_anfahrt') {
                jQuery('#startseite_anfahrt').addClass('showBottom'); // add z-index class
            }
        }
    );
    
}

// Foldable Tables
function addFoldableTableHandler() {
    if(jQuery('table').length != 0) { // if there are any tables in our DOM

        jQuery('table tr.tabelleFoldable').each(function() {
            jQuery(this).parent().parent().children('tbody').hide(); // hide the tbody of foldable tables
            jQuery(this).parent().css('cursor','pointer'); // attach pointer-cursor to smybolize clickability (is that even a word?)
            jQuery(this).find('td:first-child').prepend('<div class="foldableIcon foldableIcon_folded"></div>'); // prepend foldable icon (status indicator)
            
            jQuery(this).parent().click( // attach show/hide click-handler
                function() {
                    if (jQuery(this).parent().children('tbody').hasClass('table_unfolded') == true) { // --> hide
                        jQuery(this).children().children().find('.foldableIcon_unfolded').addClass('foldableIcon_folded');
                        jQuery(this).children().children().find('.foldableIcon_unfolded').removeClass('foldableIcon_unfolded');
                        jQuery(this).parent().children('tbody').removeClass('table_unfolded');
                        jQuery(this).parent().children('tbody').hide(500);
                    } else { // --> show
                        jQuery(this).children().children().find('.foldableIcon_folded').addClass('foldableIcon_unfolded');
                        jQuery(this).children().children().find('.foldableIcon_folded').removeClass('foldableIcon_folded');
                        jQuery(this).parent().children('tbody').addClass('table_unfolded');
                        jQuery(this).parent().children('tbody').show(500);
                    }
                }
            );
        });
    }
}

function initStartseite() {
    startseite_headSlideshow();
    addCustomStyles();
    startseite_headSlideshow_attachHover();
    startseite_bottom_attachHover();
}

function initSubPage() {
    addCustomStyles();
    addFoldableTableHandler();
}