<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}">

  {{ partial "head.html" . }}

  <body>

    <div id="all" style="overflow-x:hidden;">

        {{ partial "nav.html" . }}

       {{ partial "LP_components/hero.html" . }} 

       {{ partial "LP_components/use_cases.html" . }}

       {{ partial "LP_components/steps.html" . }}

       {{ partial "LP_components/features.html" . }}

       {{ partial "LP_components/blogs_tab.html" . }}

       {{ partial "LP_components/action.html" . }}

       {{ partial "LP_components/Footer.html" . }}

      

    </div>
    <!-- /#all -->

    {{ partial "scripts.html" . }}
    <script>
      function tabLP () {
            console.log('pass');
            if(('.m-tabs').length){
                  // Show the first tab by default
              $('.blog-tabs-stage>div').hide();
              $('.blog-tabs-stage>div:first').show();
              $('.blog-tabs-nav li:first').addClass('blog-tab-active');

              // Change tab class and display content
              $('.blog-tabs-nav a').on('click', function(event){
                  event.preventDefault();
                  $('.blog-tabs-nav li').removeClass('blog-tab-active');
                  $(this).parent().addClass('blog-tab-active');
                  $('.blog-tabs-stage>div').hide();
                  $($(this).attr('href')).show();
              });
            }
        }
        tabLP();

        function debounce(func, wait = 20, immediate = true) {
          var timeout;
          return function() {
            var context = this, args = arguments;
            var later = function() {
              timeout = null;
              if (!immediate) func.apply(context, args);
            };
            var callNow = immediate && !timeout;
            clearTimeout(timeout);
            timeout = setTimeout(later, wait);
            if (callNow) func.apply(context, args);
          };
      };
      const featuresBlock = document.querySelectorAll('.features-block');
      const featuresRow = document.querySelectorAll('.sec-features .row');
      function checkSlide() {
        console.log('pass');
        featuresRow.forEach((block, i) => {
        // half way through the image
        const slideInAt = (window.scrollY + window.innerHeight) - block.offsetHeight / 2;
        console.log(slideInAt);
        console.log(block.offsetTop);
        // bottom of the image
        const isHalfShown = slideInAt > block.offsetTop;
        if (isHalfShown) {
          console.log('active');
          featuresBlock[i].classList.add('active');
        }
      });
      }
      window.addEventListener('scroll', debounce(checkSlide));

      $('.navbar-nav .dropdown:nth-of-type(2)').click(function() {
        $('html, body').animate({
            scrollTop: $("#sec-features").offset().top
        }, 1000);
      })
    </script>

  </body>
</html>
