/*================
 Template Name: AppBeats App Landing Page Template
 Description: AppBeats is app and product landing page template.
 Version: 1.0
 Author: https://themeforest.net/user/themetags
=======================*/

// TABLE OF CONTENTS
// 1. preloader
// 2. fixed navbar
// 3. closes the responsive menu on menu item click
// 4. back to top
// 5. magnify popup video
// 6. magnify gallery popup
// 7. client-testimonial one item carousel
// 8. client logo item carousel
// 9. wow js
// 10. Screenshots slider
// 11. countdown or coming soon

jQuery(function ($) {

  'use strict';

  //0. initializing
  Cookies.remove("exp_arr");


  //console.log("Hello");

  // 1. preloader
  $(window).ready(function () {
    $('#preloader').delay(200).fadeOut('fade');
  });

  // 2. fixed navbar
  $(window).on('scroll', function () {
    // checks if window is scrolled more than 500px, adds/removes solid class
    if ($(this).scrollTop() > 58) {
      $('.navbar').addClass('affix');
      $('.scroll-to-target').addClass('open');
    } else {
      $('.navbar').removeClass('affix');
      $('.scroll-to-target').removeClass('open');
    }
  });

  // 2. page scrolling feature - requires jQuery Easing plugin
  $(function () {
    $(document).on('click', 'a.page-scroll', function (event) {
      var $anchor = $(this);
      $('html, body').stop().animate({
        scrollTop: $($anchor.attr('href')).offset().top - 58
      }, 900, 'easeInOutExpo');
      event.preventDefault();
    });
  });

  // 3. closes the responsive menu on menu item click
  $(window).ready(function () {
    $(".navbar-toggler").addClass('collapsed');
    $(".navbar-collapse").addClass('collapse');
  });

  $(".navbar-nav li a").on("click", function(event) {
    if (!($(this).parent().hasClass('dropdown') || $(this).parent().parent().hasClass('sub-menu'))) {
      $(".navbar-collapse").collapse('hide');
    }
  });

  // 4. back to top
  if ($('.scroll-to-target').length) {
    $(".scroll-to-target").on('click', function () {
      var target = $(this).attr('data-target');
      // animate
      $('html, body').animate({
        scrollTop: $(target).offset().top
      }, 500);

    });
  }


  // 5. magnify popup video
  $('.popup-youtube, .popup-vimeo, .popup-gmaps').magnificPopup({
    disableOn: 700,
    type: 'iframe',
    mainClass: 'mfp-fade',
    removalDelay: 160,
    preloader: false,
    fixedContentPos: false
  });

  // 6. magnify gallery popup
  $('.popup-gallery').magnificPopup({
    delegate: 'a',
    type: 'image',
    tLoading: 'Loading image #%curr%...',
    mainClass: 'mfp-img-mobile',
    gallery: {
      enabled: true,
      navigateByImgClick: true,
      preload: [0, 1] // Will preload 0 - before current, and 1 after the current image
    },
    image: {
      tError: '<a href="%url%">The image #%curr%</a> could not be loaded.',
      titleSrc: function (item) {
        return item.el.attr('title') + '<small>by Marsel Van Oosten</small>';
      }
    }
  });


  // 7. client-testimonial one item carousel
  $('.client-testimonial').owlCarousel({
    loop: true,
    margin: 30,
    nav: false,
    dots: false,
    responsiveClass: true,
    autoplay: true,
    autoplayHoverPause: true,
    lazyLoad: true,
    responsive: {
      0: {
        items: 1
      },
      500: {
        items: 1
      },
      600: {
        items: 2
      },
      800: {
        items: 2
      },
      1200: {
        items: 3
      }
    }
  });

    // 8. client logo item carousel
  $('.clients-carousel').owlCarousel({
    autoplay: true,
    loop: true,
    margin: 15,
    dots: false,
    slideTransition: 'linear',
    autoplayTimeout: 4500,
    autoplayHoverPause: true,
    autoplaySpeed: 4500,
    responsive: {
      0: {
        items: 2
      },
      500: {
        items: 3
      },
      600: {
        items: 4
      },
      800: {
        items: 5
      },
      1200: {
        items: 6
      }

    }
  });


  // 9. wow js
  function wowAnimation() {
    new WOW({
      offset: 100,
      mobile: true
    }).init()
  }

  wowAnimation()

  // 10. Screenshots slider
  $('.screen-carousel').owlCarousel({
    loop: true,
    margin: 0,
    center: true,
    dots: true,
    nav: false,
    autoplay: true,
    responsive: {
      0: {
        items: 1
      },
      768: {
        items: 3
      },
      991: {
        items: 4
      },
      1200: {
        items: 4
      },
      1920: {
        items: 4
      }
    }
  });

  // 11. countdown or coming soon

  /*$('#clock').countdown('2022/01/30', function(event) {
    $(this).html(event.strftime('' +
      '<div class="row">' +
      '<div class="col">' +
      '<h2 class="mb-1">%-D</h2>' +
      '<h5>Day%!d</h5>' +
      '</div>' +
      '<div class="col">' +
      '<h2 class="mb-1">%H</h2>' +
      '<h5>Hours</h5>' +
      '</div>' +
      '<div class="col">' +
      '<h2 class="mb-1">%M</h2>' +
      '<h5>Minutes</h5>' +
      '</div>' +
      '<div class="col">' +
      '<h2 class="mb-1">%S</h2>' +
      '<h5>Seconds</h5>' +
      '</div>' +
      '</div>'));
  });*/

  //12 Dallavitae configurator

  //SingleExp
  function setExpSingle(){
    $('#type_div').fadeOut( "slow", function() {
      //Setting Cookie
      Cookies.set("exp_ty", "sng", { expires: 7 }); //single
      console.log("Exp_Type: " + Cookies.get("exp_ty"));
      $('#single_div').fadeIn();
      $('#exp_msg_prod_choice').text('Esperienza Singola').show();
      //$('#exp_msg_prod_choice').show();

      //hide other
      $('#experiences_div').hide();
      $('#subscription_div').hide();
      $('#exp_msg_sub_type').hide();
      $('#exp_msg_step').hide();
    });
    return false;
  }

  function setExpSubscription() {
    $('#type_div').fadeOut( "slow", function() {
      //Setting Cookie
      Cookies.set("exp_ty", "sub", { expires: 7 }); //subscription
      console.log("Exp_Type: " + Cookies.get("exp_ty"));
      $('#subscription_div').fadeIn();
      $('#exp_msg_prod_choice').text('Abbonamento').show();

      //hide other
      $('#experiences_div').hide();
      $('#single_div').hide();
      $('#exp_msg_sub_type').hide();
      $('#exp_msg_step').hide();
    });
    return false;
  }


  function getExpList(exp_t, exp_sub_t, exp_n)
  {
    //exp_t = type : exp_sub_t = subscription type : exp_n = number experience available
      let vExpT = "";
      let vExpS = "";
      let vExpS_Txt = "";
      let vExpN = 0;

      if (exp_t == "single") {
        vExpT = "single_div";
        vExpS = "single";
        vExpN = 1;
        $('#exp_msg_step').text("Scegliere la tua esperienza dalla lista" ).css("display","inline-block").show();
        $('#exp_msg_sub_type_h2').text("Scegli l'esperienza che vuoi vivere!" ).css("display","inline-block").show();
      }
      else{
        vExpT = "subscription_div";
        vExpS = exp_sub_t;
        //console.log("exp_su_t: " + vExpS)
        vExpN = exp_n;
        vExpS_Txt = vExpS[0].toUpperCase() + vExpS.substring(1)
        //console.log("exp_su_t_expl: " + vExpS_Txt)
        $('#exp_msg_sub_type').text(vExpS_Txt).css("display","inline-block").show();
        $('#exp_msg_step').text("Scegliere " + vExpN + " di " + vExpN + " esperienze" ).css("display","inline-block").show();
        $('#exp_msg_sub_type_h2').text("Scegli le " + vExpN + " esperienze che vuoi vivere!" ).css("display","inline-block").show();
      }

      $('#'+ vExpT).fadeOut( "slow", function() {
        //Setting Cookie
        Cookies.set("exp_pr", vExpS , { expires: 7 }); //subscription
        Cookies.set("exp_n", vExpN , { expires: 7 }); //exp number
        console.log("Exp_Prod: " + Cookies.get("exp_pr"));
        $('#experiences_div').fadeIn();

        //hide other
        $('#single_div').hide();
      });
      return false;
    }

  /*$('.exp-activable').click(function() {
    $('#preloader').fadeIn();
    let cExp = "s";
    let currExp = $('').attr('dvide');
    console.log("exp: " + cExp);
    $('#preloader').fadeOut();
  });*/

  function addExperience(exp_id, arrExp)
  {
    //$('#preloader').fadeIn();
    //todo: add cookie & array
    let vExpN = Cookies.get("exp_n"); //exp number
    let arrExpSng = [];
    let strListExp = "";
    if (arrExp.length() > 0){ // esiste
      arrExpSng = arrExp;
    }else{ //non esiste
      strListExp = exp_id;
      arrExpSng = arrExpSng.push(strListExp);
      Cookies.remove("exp_arr");
      Cookies.set("exp_arr",  arrExpSng, { expires: 7 }); //experiences
    }

    //todo: converto l'array in stringa (con "," separator)

    //todo: aggiungo il nuovo id alla lista

    //todo: riconverto la str in array

    //todo: riconverto l'array in JSON

    //todo: la aggiungo al cookie

    /*if (typeof Cookies.getJSON("exp_arr") !== 'undefined' && Cookies.getJSON("exp_arr").length > 0) {
      arrExpSng = arrExpSng.push(Cookies.getJSON("exp_arr"));
      console.log("Arr Before: " + arrExpSng);
      arrExpSng = arrExpSng.push(exp_id);
      console.log("Arr After: " + arrExpSng);

    }
    else{
       arrExpSng = arrExpSng.push(exp_id);
       console.log(arrExpSng);
    }*/

    //Cookies.set("exp_arr",  arrExpSng, { expires: 7 }); //experiences

    let arrExpSngCook = Cookies.getJSON("exp_arr");
      console.log("CookieList Ae: " + JSON.stringify(arrExpSngCook));

   /* //todo: update msg on top
    if (parseInt(vExpN) === 1) {
      $('#exp_msg_step').text("").css("display", "none").show();
    }else
    {
      if (parseInt(vExpN) === arrExpSngCook.length){
        $('#exp_msg_step').text("").css("display", "none").show();
      }else
      {
        $('#exp_msg_step').text("Scegli ancora " + (parseInt(vExpN) - arrExpSngCook.length) + " esperienze che vuoi vivere!").css("display", "inline-block").show();
      }
    }*/

    //todo: update msg on top

    //todo: disable buttom

    //todo: change style element

    //$('#preloader').fadeOut();
  }

  function removeExperience(exp_id)
  {
    //$('#preloader').fadeIn();

    //todo: remove cookie & array

    //todo: enable buttom

    //todo: change style element

    //$('#preloader').fadeOut();

  }

  $(".exp-activable").click(function() {
    //console.log('Exp: ' + this.id);
    let vExpN = Cookies.get("exp_n"); //exp number
    let vExpC = this.id;

    let strExp = Cookies.getJSON("exp_arr");
    let strExpStr = JSON.stringify(strExp);

    let arrExp = [];

    console.log("First ExpArr: " + strExpStr);

    if (strExp != null) {
      console.log("esiste");

      //console.log("ArrExp: " + strExp);
      if (strExpStr.includes(","))
      {
        arrExp = strExp.split(",");
        if (arrExp.length <= parseInt(vExpN)) {
          console.log("ArrExp Interna: " + arrExp.length);
          arrExp = arrExp.push(vExpN);
          addExperience(vExpC, arrExp);
        }else{
          //console.log("ArrExp Else: " +arrExp.length);
          //todo: warn about maximum is reached

        }
      }

    }else{
      console.log("non esiste");
      addExperience(vExpC, arrExp);
    }

    //todo: disable all other element not "selected" (If limit is reached)

    // if(typeof arrExp[index] === 'undefined') {
    //   console.log("N exp selected: " + arrExp.length);
    //   // does not exist
    //   arrExp.push(this.id);
    //   Cookies.set("exp_arr", arrExp , { expires: 7 }); //experiences
    // }
    // else {
    //   // does exist
    //   console.log("N exp selected: " + arrExp.length);
    // }
    // if (vExpN < arrExp.length) {
    //   // append new value to the array
    //   arrExp.push(this.id);
    //   Cookies.set("exp_arr", arrExp , { expires: 7 }); //experiences
    // }
  });

  $('#exp_singola').click(function() {
    $('#preloader').fadeIn();
    setExpSingle();
    $('#preloader').fadeOut();
  });

  $('#exp_subscription').click(function() {
    $('#preloader').fadeIn();
    setExpSubscription();
    $('#preloader').fadeOut();
  });

  $('#exp_msg_prod_single').click(function() {
    $('#preloader').fadeIn();
    setExpSingle();
    $('#preloader').fadeOut();
  });

  $('#exp_msg_prod_subscriptions').click(function() {
    $('#preloader').fadeIn();
    setExpSubscription();
    $('#preloader').fadeOut();
  });

  $('#exp_singola_get_list').click(function() {
    $('#preloader').fadeIn();
    getExpList("single", "single", 1);
    $('#preloader').fadeOut();
  });

  $('#exp_sub_lov_get_list').click(function() {
    $('#preloader').fadeIn();
    getExpList("subscription", "lover", 3);
    $('#preloader').fadeOut();
  });

  $('#exp_sub_exp_get_list').click(function() {
    $('#preloader').fadeIn();
    getExpList("subscription", "explorer", 4);
    $('#preloader').fadeOut();
  });

  $('#exp_sub_pro_get_list').click(function() {
    $('#preloader').fadeIn();
    getExpList("subscription", "professional", 6);
    $('#preloader').fadeOut();
  });

}); // JQuery end