HEX
Server: Microsoft-IIS/8.5
System: Windows NT YDAWBH120 6.3 build 9600 (Windows Server 2012 R2 Standard Edition) AMD64
User: tentjecom_web (0)
PHP: 7.4.14
Disabled: NONE
Upload Files
File: D:/HostingSpaces/SBogers57/topsluchtfilters.nl/wwwroot/public/js/tops_home.js
/**
 * Define objects
 */

var $cta = $('#cta');
var $slider = $('#slider');

/**
 * Call Functions
 */
prepare();
buildHome();
$slider.slider(
    {
        nav: '#slider_nav',
        loop : 3000,
        speed : 750
    }
);

$window.resize(onResize);
$window.scroll(onWindowScroll);

/*
 * Check for bottom page
 */
var st = $window.scrollTop();
var bottomPage =  $main.height() - ($window.height() - $header.height() - $cta.height() - showFooter);
isAtBottom = (st > bottomPage-100); // 100px marge

var ctaSwitchHeight = 1035;
var ctaToggle;
if($window.height() > ctaSwitchHeight){ ctaToggle = 1; } else{ ctaToggle = 0; }

var altViewToggle;
if($window.width() > 1000){ altViewToggle = 1; } else{ altViewToggle = 0; }


/**
 * define Functions
 */

/*
 * Prepare
 */
function prepare()
{
    // Set mains "auto-height" in the data attribute
    $main.attr('data-height',$main.height());
}

/*
 * What to do on resize
 */
function onResize()
{
    // Reset main.height()
    if((altViewToggle == 0 && $window.width() > 1000) || (altViewToggle == 1 && $window.width() <= 1000))
    {
        $main.height('auto');
        $main.attr('data-height',$main.height());
        if($window.height() > 1000){ altViewToggle = 1; } else{ altViewToggle = 0; }
        buildHome();
    }


    buildHome();
    $('#slider').data('slider').adjust();
}

/*
 * What to do on scroll
 */
function onWindowScroll()
{
    // Reset main.height()
    if((ctaToggle == 0 && $window.height() > ctaSwitchHeight) || (ctaToggle == 1 && $window.height() <= ctaSwitchHeight))
    {
        $main.height('auto');
        $main.attr('data-height',$main.height());
        if($window.height() > ctaSwitchHeight){ ctaToggle = 1; } else{ ctaToggle = 0; }
        buildHome();
    }

    // Resize page
    if ( ! isTouch  && ! smallView() )
    {
        // Scroll main on scroller
        var st = $window.scrollTop();
        var sl = $window.scrollLeft();
        $main.css({ top: -st+'px', left: -sl+'px' });

        var ctaH = $cta.height();
        if( altView() || $window.height() <= ctaSwitchHeight) ctaH = 0;

        // When page reaches the bottom
        var bottomPage =  $main.height() - ($window.height() - $header.height() - ctaH - showFooter);
        isAtBottom = (st > bottomPage); // 100px marge
        if ( ! footerClicked)
        {
            if(isAtBottom)
            {
                // Change height of the footer
                difFooter = st - bottomPage;
                $footer.height(difFooter + showFooter);

                // Footer button
                $footerBtn.css({ bottom: (difFooter + showFooter - 11) + 'px' });

                // Lift the ambiance photo and pattern
                if( ! altView() && $window.height() > ctaSwitchHeight){
                    $cta.css({ bottom: $footer.height() + 'px'});
                }
                else
                {
                    $cta.css({ bottom: 0 });
                }
            }
            else
            {
                // Reset changes
                difFooter = 0;
                $footer.height(showFooter);
                if( ! altView() && $window.height() > ctaSwitchHeight)
                {
                    $cta.css({ bottom: showFooter });
                }
                else
                {
                    $cta.css({ bottom: 0 });
                }
                $footerBtn.css({ bottom: '19px' });
            }
        }
    }
}

/*
 * Build template relatively to the browser window
 */
function buildHome()
{
    var ctaH = $cta.height();
    if( altView() || smallView() || ($window.height() <= 1035) )
    {
        ctaH = 0;
    }

    if ( ! isTouch && ! smallView() )
    {
        // Make sure main == 100%
        var minH = $window.height() - $header.height() - ctaH - showFooter;
        if($main.attr('data-height') < minH) $main.height(minH)

        // Make scroller as high as main
        var scrH = $main.height() + $footer.children('.inner').height() + ctaH + $header.height();
        $scroller.height(scrH);

        // Resize Mask
        var wrH = $window.height() - $header.height() - ctaH - showFooter; // show 30px from footer
        $wrapper.height(wrH);
    }
    else
    {
        var minH = $window.height() - $header.height() - ctaH - $footer.height();
        if($main.attr('data-height') < minH)
        {
            $main.height(minH)
            $scroller.height(minH)
            $wrapper.height(minH)
        }
        else
        {
            reset();
        }
    }

    if($window.width() > 1000)
    {
        if($window.height() <= 1035)
        {
            $slider.height($main.height()-$cta.height());
        }
        else
        {
            $slider.height('100%');
        }
    }
    else
    {
        $slider.height('');
    }
}


function reset()
{
    // Reset values
    $main.height('auto');
    $cta.css('bottom',0);
    $main.css({top: 0});
    $scroller.height('auto');
    $wrapper.height('auto');
}