/**
 * Copyright 2012, Digital Fusion
 * Licensed under the MIT license.
 * http://teamdf.com/jquery-plugins/license/
 *
 * @author Sam Sehnert
 * @desc A small plugin that checks whether elements are within
 *       the user visible viewport of a web browser.
 *       can accounts for vertical position, horizontal, or both
 */
var $w=$(window);
$.fn.visible = function(partial,hidden,direction,container){

    if (this.length < 1)
        return;

      // Set direction default to 'both'.
      direction = direction || 'both';
    
      var $t          = this.length > 1 ? this.eq(0) : this,
					isContained = typeof container !== 'undefined' && container !== null,
					$c				  = isContained ? $(container) : $w,
					wPosition        = isContained ? $c.position() : 0,
          t           = $t.get(0),
          vpWidth     = $c.outerWidth(),
          vpHeight    = $c.outerHeight(),
          clientSize  = hidden === true ? t.offsetWidth * t.offsetHeight : true;

      if (typeof t.getBoundingClientRect === 'function'){

          // Use this native browser method, if available.
          var rec = t.getBoundingClientRect(),
              tViz = isContained ?
											rec.top - wPosition.top >= 0 && rec.top < vpHeight + wPosition.top :
											rec.top >= 0 && rec.top < vpHeight,
              bViz = isContained ?
											rec.bottom - wPosition.top > 0 && rec.bottom <= vpHeight + wPosition.top :
											rec.bottom > 0 && rec.bottom <= vpHeight,
              lViz = isContained ?
											rec.left - wPosition.left >= 0 && rec.left < vpWidth + wPosition.left :
											rec.left >= 0 && rec.left <  vpWidth,
              rViz = isContained ?
											rec.right - wPosition.left > 0  && rec.right < vpWidth + wPosition.left  :
											rec.right > 0 && rec.right <= vpWidth,
              vVisible   = partial ? tViz || bViz : tViz && bViz,
              hVisible   = partial ? lViz || rViz : lViz && rViz,
	vVisible = (rec.top < 0 && rec.bottom > vpHeight) ? true : vVisible,
              hVisible = (rec.left < 0 && rec.right > vpWidth) ? true : hVisible;

          if(direction === 'both')
              return clientSize && vVisible && hVisible;
          else if(direction === 'vertical')
              return clientSize && vVisible;
          else if(direction === 'horizontal')
              return clientSize && hVisible;
      } else {

        var viewTop 				= isContained ? 0 : wPosition,
            viewBottom      = viewTop + vpHeight,
            viewLeft        = $c.scrollLeft(),
            viewRight       = viewLeft + vpWidth,
            position          = $t.position(),
            _top            = position.top,
            _bottom         = _top + $t.height(),
            _left           = position.left,
            _right          = _left + $t.width(),
            compareTop      = partial === true ? _bottom : _top,
            compareBottom   = partial === true ? _top : _bottom,
            compareLeft     = partial === true ? _right : _left,
            compareRight    = partial === true ? _left : _right;

        if(direction === 'both')
            return !!clientSize && ((compareBottom <= viewBottom) && (compareTop >= viewTop)) && ((compareRight <= viewRight) && (compareLeft >= viewLeft));
        else if(direction === 'vertical')
            return !!clientSize && ((compareBottom <= viewBottom) && (compareTop >= viewTop));
        else if(direction === 'horizontal')
            return !!clientSize && ((compareRight <= viewRight) && (compareLeft >= viewLeft));
    }
};

// disable hover for specific elements on touchscreen
var hasTouch = true;
if (!("ontouchstart" in document.documentElement)) {
    document.documentElement.className += "no-touch";
    hasTouch = false;
} else {
    document.documentElement.className += "has-touch";
}

// debounce
function bindWindowSizeEvent(func)
{
    $(window).on("debouncedresize", func);
    $(window).on("orientationchange", function(){ setTimeout(func, 150);});
    func();
}
function bindIntereactionEvent(func)
{
    $(window).on("debouncedresize scroll touchstart touchmove touchend", func);
    $(window).on("orientationchange", function(){ setTimeout(func, 150);});
    func();
}

// white fade behind desktop dropdown
function shadowOn() {$('.wrapper').addClass('shadow');}
function shadowOff() {$('.wrapper').removeClass('shadow');}
function desktopMenu() {
    $("body").on("mouseenter", ".nav-main .has-dropdown", shadowOn);
    $("body").on("mouseleave", ".nav-main .has-dropdown", shadowOff);
}

// Set the heights of dropdown 2nd level links
function ddLinkHeight() {
    bindWindowSizeEvent(function() {
        $(".nav-desktop > .nav-main > li > .subnav").each(function(){
            $(this).children('li').children('a').css("height","auto");
            var e = $(this).children('li').children('a');
            var elementHeights = $(e).map(function() {
                return $(this).height();
            }).get();			
			
            var maxHeight = Math.max.apply(null, elementHeights);			
			
			if(maxHeight > 10) // Make sure we don't set the height to 0 and cause the line to appear in the middle of the text.
				$(e).height(maxHeight);			
        });
    });
}

//false file input control
/* // Disabled because this is taken care of on the page //
if($("#file-submit").length > 0) {
	window.setInterval(function(){
		var imgVal = $('#upload-photo').val();
		if (imgVal == ""){
		  //do nothing
		}
		else{
			$(".false-input").text(imgVal);
			console.log(imgVal);
		}
	}, 1000);
}
//swap form and thank you notice
$("#file-submit").click(function() {
  $(".commercial .mpbl .submitted").css("display","block");
  $(".commercial .form-mpbl").addClass("hidden");
});
*/

// creates mobile nav
function mobileMenu() {

    $(".nav-main").clone().appendTo(".nav-mobile");

    var mobileCount = 0;
    $(".nav-mobile .subnav").each(function(){
        var $parentAnchor = $(this).siblings('a');
        $(this).attr('data-link-id', mobileCount);
        $parentAnchor.attr('data-link-id', mobileCount).addClass("linked");
        $(this).appendTo(".nav-mobile");
        mobileCount++;
    });

    $(".nav-mobile ul a.linked").click(function(e){
        e.preventDefault();
        var linkID = $(this).data('link-id');
        $(".nav-mobile .nav-main").addClass("offscreen");
        $(".mobile-back").css("display","block");
        $(".mobile-btns").css("display","none");
        $(".mobile-utility").css("display","none");
        $(".nav-mobile .subnav[data-link-id='" + linkID + "']").addClass("visible");
    });

    $(".nav-mobile .subnav a.linked").click(function(e){
        e.preventDefault();
        var linkID = $(this).data('link-id');
        $(this).closest("ul").addClass("offscreen");
        $(".mobile-back").css("display","block");
        $(".mobile-btns").css("display","none");
        $(".mobile-utility").css("display","none");
        $(".nav-mobile .subnav[data-link-id='" + linkID + "']").addClass("visible");
    });

    $(".mobile-back a.back").on("click", function(){
        $(".nav-mobile").children("ul.visible:last").removeClass("visible");
        $(".nav-mobile").children(".offscreen:last").removeClass("offscreen");
        if(!$(".nav-mobile .nav-main").hasClass("offscreen")) {
            $(".mobile-back").css("display","none");
            $(".mobile-btns").css("display","block");
            $(".mobile-utility").css("display","block");
        }
    });

    $(".nav-utility ul").clone().appendTo(".mobile-utility");

    function toggleMobileNav() {
        if($(".nav-mobile ul").hasClass("visible")) {
            $(".nav-mobile .subnav").removeClass("visible offscreen");
        }
        if($(this).hasClass("toggle")) {
            $(".nav-toggle .toggle").toggleClass("visible").removeClass("offscreen");
            $(".nav-mobile .nav-main").addClass("visible").removeClass("offscreen");
            $(".mobile-back").css("display","none");
            $(".mobile-btns").css("display","block");
            $(".mobile-utility").css("display","block");
            $(".nav-mobile .subnav").removeClass("visible offscreen");
            $("#scrollable").toggleClass("nav-open");
            $(".nav-mobile-container").toggleClass("visible");
        }
    }

    $(".header .toggle").on("click", toggleMobileNav);

    $(".header-mobile").on("click", function(e){
        e.stopPropagation();
    });

}

// displays desktop or mobile nav depending on window width
function checkWindowSize() {
    bindWindowSizeEvent(function() {
        if(window.innerWidth > 768){
//             desktopMenu();
        } else if(window.innerWidth < 768){
            $("body").off("mouseenter", ".nav-main .has-dropdown", shadowOn);
            $("body").off("mouseleave", ".nav-main .has-dropdown", shadowOff);
        }
    });
}

// adds class if contact block is full width
function checkContactBlockWidth() {
    bindWindowSizeEvent(function() {
        if($(".callout-blocks.three .contact-block").width() == $(window).width()){
            $(".callout-blocks.three .contact-block").addClass("wide");
        } else {
            $(".callout-blocks.three .contact-block").removeClass("wide");
        }
    });
}

// detects when elements are in view
function isScrolledIntoView(elem){
    if(window.innerWidth > 768){
        var scrollPoint = 200;
    } else if(window.innerWidth < 768){
        var scrollPoint = 100;
    }
    var docViewTop = $(window).scrollTop();
    var docViewBottom = docViewTop + $(window).height();
    var elemTop = $(elem).offset().top + scrollPoint;
    var elemBottom = elemTop + $(elem).height();
    return ((elemTop <= docViewBottom) && (elemBottom >= docViewTop));
}

// elements animate in when scrolled into view
function loadOnScroll(){
    var scrolledElement = '.sustainability .scroll-trig';
    $(scrolledElement).each(function () {
        if (isScrolledIntoView(this)) {
            $(this).addClass("load");
        }
    });
    $('.sustainability .part-5').each(function () {
        if (isScrolledIntoView(this)) {
            setTimeout(function(){
                $('.sustainability .part-5 .title').addClass("load");
            }, 300);
        }
    });
    $('.sustainability .part-3 .landing-intro .section .sprite').each(function () {
        if (isScrolledIntoView(this)) {
            //setTimeout(function(){
            $(this).addClass("load");
            //}, 300);
        } else {
            $(this).removeClass("load");
        }
    });

    // Jump button
    var docViewTop = $(window).scrollTop();
    var h =  $(window).height() / 2;

    if(docViewTop > h)
        $('.btn-jump').css('opacity','1');
    else
        $('.btn-jump').css('opacity', '0');


    if(docViewTop > h)
        $('.header').addClass('scrolled');
    else
        $('.header').removeClass('scrolled');
}
loadOnScroll();
$(window).scroll(function() {
    loadOnScroll();
});


$(window).load(function() {

    checkWindowSize();
    checkContactBlockWidth();
//     ddLinkHeight();

});


$(document).ready(function() {

    mobileMenu();

    checkWindowSize();

    checkContactBlockWidth();

//     ddLinkHeight();

    // select dropdown
    try {
        $('.contact select').niceSelect();

        // slider
        $(".single-slider").slick({
            dots: true,
            slide: 'div',
            autoplay: true,
            autoplaySpeed: 5000,
            infinite: true,
            arrows: false,
            pauseOnHover: false,
            fade: true,
            speed: 500
        });

        $(".single-slider-arr").slick({
            dots: false,
            slide: 'div',
            autoplay: true,
            autoplaySpeed: 5000,
            infinite: true,
            arrows: true,
            pauseOnHover: false,
            fade: true,
            speed: 500
        });

        $(".product-slider").slick({
            dots: true,
            slide: 'div',
            autoplay: true,
            autoplaySpeed: 5000,
            infinite: true,
            arrows: true,
            pauseOnHover: false,
            pauseOnFocus: false,
            fade: true,
            speed: 500
        });

        $('.multi-slider').slick({
            dots: false,
            infinite: true,
            slide: 'div',
            speed: 300,
            autoplay: true,
            autoplaySpeed: 5000,
            arrows: true,
            pauseOnHover: false,
            slidesToShow: 5,
            slidesToScroll: 1,
            responsive: [
                {
                    breakpoint: 1160,
                    settings: {
                        slidesToShow: 4
                    }
                },
                {
                    breakpoint: 1060,
                    settings: {
                        slidesToShow: 3
                    }
                },
                {
                    breakpoint: 768,
                    settings: {
                        slidesToShow: 2
                    }
                },
                {
                    breakpoint: 480,
                    settings: {
                        slidesToShow: 1
                    }
                }
            ]
        });

    } catch(err) {}

    if (!("ontouchstart" in document.documentElement)) {
        document.documentElement.className += " no-touch";
    }

    if (!$('html').hasClass('no-touch')) {

        $('.nav-desktop .nav-main > li.has-dropdown > a').bind('touchstart', function(e) {
            if ($(this).parent().hasClass("active")) {
                $('.nav-desktop .nav-main > li.has-dropdown').removeClass("active");
                $(this).toggleClass("opened");
                $(this).siblings("li").find("ul").toggleClass("hidden");
                shadowOff();
                e.stopPropagation();
            } else {
                $('.nav-desktop .nav-main > li.has-dropdown').removeClass("active");
                $(this).parent().addClass("active");
                shadowOn();
                e.stopPropagation();
            }
        });

    }

    // Nav stuff
    let $scrollable = $('#scrollable');
    let $firstSub = $scrollable.find('.nav-desktop .nav-main > li > ul.subnav');

    $.each($firstSub, function(index, fsub) {

      if (!$(fsub).visible(false, false, 'horizontal')) {
        $(fsub).addClass('left');
      }

      $(window).resize(function () {
        if (!$(fsub).visible(false, false, 'horizontal')) {
          $(fsub).addClass('left');
        } else {
          $(fsub).removeClass('left');
          if (!$(fsub).visible(false, false, 'horizontal')) {
            $(fsub).addClass('left');
          }
        }
      });

      let $secondSub = $(fsub).find('li > ul.subnav');
      console.log($secondSub);
      $.each($secondSub, function(index, ssub) {
        if (!$(ssub).visible(false, false, 'horizontal')) {
          $(ssub).addClass('left');
          $(ssub).parent().parent().addClass('subleft');
        }

        $(window).resize(function () {
          if (!$(ssub).visible(false, false, 'horizontal')) {
            $(ssub).addClass('left');
            $(ssub).parent().parent().addClass('subleft');
          } else {
            $(ssub).removeClass('left');
            $(ssub).parent().parent().removeClass('subleft');
            if (!$(ssub).visible(false, false, 'horizontal')) {
              $(ssub).addClass('left');
              $(ssub).parent().parent().addClass('subleft');
            }
          }
        });

        if ($(ssub).offset().top < $(fsub).offset().top) {
          $(ssub).offset({ top: $(fsub).offset().top});
        }
      });
    });

/*
    $(".nav-desktop .nav-main > li, .nav-desktop .nav-main > li ul > li").hover(function() {
        $(this).toggleClass("opened");
        $(this).siblings("li").find("ul").addClass("hidden");
        $(this).find(".subnav").removeClass("hidden");
    });

*/
/*
    $(".header-top").hover(function(){
        $(".nav-desktop .nav-main > li ul").toggleClass("hidden");
    });
*/

    // tooltip
    $('.product-colors .size').click(function(e) {
        $(document).one('click touchstart', function (e) {
            $('.tooltip').removeClass("active");
            $('.tooltip').remove();
            e.stopPropagation();
        });
        if ($(this).children('.tooltip').hasClass("active")) {
            $('.tooltip').removeClass("active");
            $('.tooltip').remove();
        } else {
            $('.tooltip').removeClass("active");
            $('.tooltip').remove();
            var title = $(this).attr('data-title');
            $('<div class="tooltip">' + title + '</div>').appendTo($('.w2018').length == 0 ? $(this) : $(this).closest('.product-colors').find('.size-types'));
            var info = $(this).attr('data-info');
            $('<p>' + info + '</p>').appendTo($('.tooltip'));
            $('.tooltip').addClass("active");
            e.stopPropagation();
        }
    });

    // expandable grid
    var detailContainer = '<div class="detail"><div class="detail-content"></div></div>'

    bindWindowSizeEvent(function() {
        if(window.innerWidth > 1024) {
            $(".grid-expand .cell").removeClass("active");
            $(".detail").remove();

            if($('.w2018').length == 1) {                
                $(".cell:nth-of-type(5n), .cell:last-of-type").each(function() {
                    $(this).after(detailContainer);
                });
            }
            else {
                $(".cell:nth-of-type(3n), .cell:last-of-type").each(function() {
                    $(this).after(detailContainer);
                });
            }
        } else if(window.innerWidth < 1024 && window.innerWidth >= 768 && $('.w2018').length == 1) {
            $(".grid-expand .cell").removeClass("active");
            $(".detail").remove();

            $(".cell:nth-of-type(4n), .cell:last-of-type").each(function() {
                $(this).after(detailContainer);
            });
        } else if(window.innerWidth < 1024 && window.innerWidth > 640 && $('.w2018').length == 0) {
            $(".grid-expand .cell").removeClass("active");
            $(".detail").remove();

            $(".cell:nth-of-type(2n), .cell:last-of-type").each(function() {
                $(this).after(detailContainer);
            });
        } else if(window.innerWidth < 768 && window.innerWidth > 640 && $('.w2018').length == 1) {
            $(".grid-expand .cell").removeClass("active");
            $(".detail").remove();

            $(".cell:nth-of-type(2n), .cell:last-of-type").each(function() {
                $(this).after(detailContainer);
            });
        } else {            
            $(".grid-expand .cell").removeClass("active");
            $(".detail").remove();
            $(".cell").each(function() {
                $(this).after(detailContainer);
            });
        }
    });

    $(".grid-expand .cell").click(function() {
        if ($(this).hasClass("active")) {
            $(this).removeClass("active");
            $(".detail").removeClass("active").slideUp('fast');
            $(".detail").children(".detail-content").animate({opacity: "0"});
        } else {
			if($(this).find('.solutionsEmpty').length == 1) {
				var ul = $(this).find('.solutionsEmpty');
				$.ajax({
					type: "POST",
					async: false,
					url: '/Application/GetProducts',
					data: JSON.stringify({
						'MarketName': $(this).find('.solutionsEmpty').data('marketname'),
						'ApplicationID': $(this).find('.solutionsEmpty').data('applicationid')
					}),
					contentType: "application/json; charset=utf-8",					
					success: function (msg) {
						ul.after(msg);
						ul.remove();
					}
				});
			}
            $(".grid-expand .cell").removeClass("active");
            $(this).addClass("active");
            $(this).nextAll(".detail").children(".detail-content").css("opacity", "0");
            $(this).nextAll(".detail:first").children(".detail-content").empty().append($(this).children(".detail-info").children().clone());
            if (!$(this).nextAll(".detail:first").hasClass("active")) {
                $(".detail").removeClass("active").slideUp('fast');
                $(".detail").children(".detail-content").animate({opacity: "0"});
                $(this).nextAll(".detail:first").addClass("active");
                $(this).nextAll(".detail:first").slideDown('fast');
            };
            $(this).nextAll(".detail:first").children(".detail-content").animate({opacity: "1"}, 300);
        }
    });

    // filter dropdown
    $('.no-touch .dropdown > li').on('mouseenter', function() {
        $(this).children('ul').addClass('open');
    });
    $('.no-touch .dropdown > li').on('mouseleave', function() {
        $(this).children('ul').removeClass('open');
    });
    $('.dropdown > li > a').on('click', function() {
        $(this).children('ul').addClass('open');
    });
    $('.dropdown > li > a').on('click', function() {
        $(this).next('ul').toggleClass('open');
    });
    $('.dropdown > li li a').on('click', function() {
        $(this).parents('ul').toggleClass('open');
        $(this).parents('ul').siblings('a').html('');
        $(this).parents('ul').siblings('a').html($(this).text());
    });

    // sustainability sections
    $('.no-touch .sustainability .part-3 .landing-intro .section').on('mouseenter', function() {
        $(this).addClass('active');
    });
    $('.no-touch .sustainability .part-3 .landing-intro .section').on('mouseleave', function() {
        $(this).removeClass('active');
    });
    $('.sustainability .part-3 .landing-intro .section').on('click', function() {
        $(this).toggleClass('active');
    });

    // scroll to download
    $(".download-link").click(function() {
        $('html, body').animate({
            scrollTop: $("#download-form").offset().top -+ 40
        }, 1000);
    });

    // dimension tables
    $('.tab-links a').click(function (e) {
        e.preventDefault()
        var tabID = $(this).attr("data-id");
        var chartOptions = tabID + "Options";
        $(this).siblings("a").removeClass("active");
        $(this).parent(".tab-links").next(".tab-content").find(".tab-pane").removeClass("active");
        $(this).addClass("active");
        $("#" + tabID).addClass("active");
    })

    // performance bar graph
    $('.bar-graph .num').each(function () {
        var barNum = parseInt($(this).attr('data-id'));
        if (barNum > 0) {
            var barNum = Math.round(barNum / 10) * 10;
            $(this).addClass('num-' + barNum);
            $(this).next('.bar').addClass('bar-' + barNum);
            $(this).prev('.title').addClass('title-' + barNum);
        } else {
            $(this).addClass('num-neg');
            $(this).next('.bar').addClass('bar-neg');
            $(this).prev('.title').addClass('title-neg');
        }

    });

});