$(document).ready(function () {
  new WOW().init();
  var mtm_cont_flip_divs = [$('.xsm-gb-data-div'), $('.sm-gb-data-div'), $('.ss-gb-data-div'), $('.bg-gb-data-div'), $('.lg-gb-data-div'), $('.xl-gb-data-div')];
  var prepay_cont_flip_divs = [$('.xl-gb-data-div'), $('.lg-gb-data-div'), $('.bg-gb-data-div'), $('.sm-gb-data-div'), $('.xsm-gb-data-div')];
  var lock_cont_flip_divs = [$('.bg-gb-data-div'), $('.lg-gb-data-div'), $('.sm-gb-data-div'), $('.xl-gb-data-div')];

  function applyhovereffectoncontdiv(element){
    if(window.innerWidth > 996){
      element.find('.contract-price-div').removeClass('d-xl-none').addClass('animated faster zoomInUp');
      element.find('.cont-view-plan-div').removeClass('d-xl-none');
      element.find('.empty-container').addClass('empty-container-collapsed');
    }
  };

  function removehovereffetoncontdiv(element){
    element.find('.contract-price-div').addClass('animated fadeOutDown').delay(100).queue(function () {
      $(this).addClass('d-xl-none').removeClass('animated fadeOutDown faster zoomInUp').dequeue();
    });
    element.find('.cont-view-plan-div').addClass('animated fadeOutDown').delay(100).queue(function () {
      $(this).addClass('d-xl-none').removeClass('animated fadeOutDown fadeInUp').dequeue();
    });
    element.find('.empty-container').removeClass('empty-container-collapsed');
  }

  function applyhovereffectondatatdiv(element){
    element.find('.plan-details-div').show(300)
    element.find('.data-plan-description').removeClass('d-xl-none').addClass('animated faster zoomIn');
    element.find('.data-fair-policy-text').removeClass('d-xl-none').addClass('animated faster zoomIn');
    element.dequeue();
    element.find('.data-image-container').addClass('data-image-container-collapsed');
  };

  function removehovereffetondatadiv(element){
    element.find('.plan-details-div').hide();
    element.find('.data-plan-description').removeClass('animated faster zoomIn').addClass('d-xl-none');
    element.find('.data-fair-policy-text').removeClass('animated faster zoomIn').addClass('d-xl-none');
    element.find('.data-image-container').removeClass('data-image-container-collapsed');
  }

  $('.contract-data-div').hover(function () {applyhovereffectondatatdiv($(this));}, function () {removehovereffetondatadiv($(this));});

  function applyclickedeffect(element,flip_divs,display_data_div){
    $('#contract-divs-container').addClass("some-cont-div-clicked");
    $('.empty-container').addClass('empty-container-collapsed');
    $('.contract-div').addClass("contract-div-clicked");
    $('.contract-title').removeClass('py-4 text-center').addClass('text-left contract-clicked-title black-text-important py-2');
    $('.contract-title-white').addClass('contract-clicked-title black-text-important');
    element.addClass('this-cont-div-clicked');
    $('.contract-description').hide(200);
    $('.contract-price-div').addClass('d-none');
    $('.cont-view-plan-div').addClass('d-none');
    $('.terms-fair-use-container').removeClass('d-none');
    element.addClass('col-sm-5 order-2').removeClass('col-sm-3 order-1');
    element.find('.contract-title').addClass('text-center white-text-important').removeClass('black-text-important text-left');
    element.find('.contract-title-white').addClass('text-center white-text-important').removeClass('black-text-important');
    $("#contract-plans-div").removeClass('d-none').delay(100).queue(function(){
      flipdatadivs(flip_divs,display_data_div);
      $(this).dequeue();
    });

  }

  function removeclickedeffect(element){
    element.removeClass('this-cont-div-clicked');
    $('#contract-divs-container').removeClass("some-cont-div-clicked");
    $('.contract-div').removeClass("contract-div-clicked");
    $('.contract-title').removeClass('contract-clicked-title py-2 text-left').addClass('py-4 text-center');
    $('.contract-title-white').removeClass('contract-clicked-title');
    $('.contract-description').show(300);
    $('.contract-price-div').removeClass('d-none');
    $('.cont-view-plan-div').removeClass('d-none');
    $('.terms-fair-use-container').addClass('d-none');
    $('.empty-container').removeClass('empty-container-collapsed');
    $('.contract-div').addClass('col-sm-3 order-1').removeClass('col-sm-5 order-2');
    $('.contract-div').find('.contract-title').removeClass('white-text-important black-text-important');
    $('.contract-div').find('.contract-title-white').removeClass('text-center white-text-important black-text-important');
    $("#contract-plans-div").addClass('d-none');
  }

  function transformclickedeffect(element,flip_divs,display_data_div){
    $('.contract-div').removeClass('this-cont-div-clicked');
    $('.contract-div').addClass('col-sm-3 order-1').removeClass('col-sm-5 order-2');
    $('.contract-div').find('.contract-title').removeClass('text-center white-text-important').addClass('black-text-important');
    $('.contract-div').find('.contract-title-white').removeClass('text-center white-text-important').addClass('black-text-important');
    element.addClass('this-cont-div-clicked order-2');
    element.addClass('col-sm-5').removeClass('col-sm-3');
    element.find('.contract-title').addClass('text-center white-text-important').removeClass('black-text-important');
    element.find('.contract-title-white').addClass('text-center white-text-important').removeClass('black-text-important');
    flipdatadivs(flip_divs,display_data_div);
  }

  function flipdatadivs(divsarray,element){

    $.each(divsarray, function(index, item){
      item.find('.contract-data-div').addClass('d-none');
      item.find(element).removeClass('d-none');
      item.removeClass('animated flipInY').addClass('animated flipInY').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
        $(this).removeClass('animated flipInY');
      });
    })

    // $(divsarray[0]).removeClass('animated flipInY').delay(20).queue(function () {
    //   $(divsarray[0]).addClass('animated flipInY').delay(100).queue(function () {
    //     $(this).find('.contract-data-div').addClass('d-none');
    //     $(this).find(element).removeClass('d-none');
    //     $(divsarray[1]).removeClass('animated flipInY').delay(20).queue(function () {
    //       $(divsarray[1]).addClass('animated flipInY').delay(100).queue(function () {
    //         $(this).find('.contract-data-div').addClass('d-none');
    //         $(this).find(element).removeClass('d-none');
    //         $(divsarray[2]).removeClass('animated flipInY').delay(20).queue(function () {
    //           $(divsarray[2]).addClass('animated flipInY').delay(100).queue(function () {
    //             $(this).find('.contract-data-div').addClass('d-none');
    //             $(this).find(element).removeClass('d-none');
    //             $(divsarray[3]).removeClass('animated flipInY').delay(20).queue(function () {
    //               $(divsarray[3]).addClass('animated flipInY').delay(100).queue(function () {
    //                 $(this).find('.contract-data-div').addClass('d-none');
    //                 $(this).find(element).removeClass('d-none').delay(600).queue(function () {
    //                   $(this).dequeue();
    //
    //                 });
    //                 $(this).dequeue();
    //               });
    //               $(this).dequeue();
    //             });
    //             $(this).dequeue();
    //           });
    //           $(this).dequeue();
    //         });
    //         $(this).dequeue();
    //       });
    //       $(this).dequeue();
    //     });
    //     $(this).dequeue();
    //   });
    //   $(this).dequeue();
    // });
  }

  $("#cont-12-month-div").click(function(){
    if(!$(this).hasClass('cont-month-div-selected')){
      $(".cont-month-div").removeClass('cont-month-div-selected');
      $(this).addClass('cont-month-div-selected');
      flipdatadivs(lock_cont_flip_divs,'.contract-data-12-months-div');
    }
  });

  $("#cont-24-month-div").click(function(){
    if(!$(this).hasClass('cont-month-div-selected')){
      $(".cont-month-div").removeClass('cont-month-div-selected');
      $(this).addClass('cont-month-div-selected');
      flipdatadivs(lock_cont_flip_divs,'.contract-data-24-months-div');
    }
  });

  $("#prepay-7-month-div").click(function(){
    if(!$(this).hasClass('cont-month-div-selected')){
      $(".prepay-cont-month-div").removeClass('cont-month-div-selected');
      $(this).addClass('cont-month-div-selected');
      flipdatadivs(prepay_cont_flip_divs,'.prepay-data-7-months-div');
    }
  });

  $("#prepay-13-month-div").click(function(){
    if(!$(this).hasClass('cont-month-div-selected')){
      $(".prepay-cont-month-div").removeClass('cont-month-div-selected');
      $(this).addClass('cont-month-div-selected');
      flipdatadivs(prepay_cont_flip_divs,'.prepay-data-13-months-div');
    }
  });

  $(".mtm-cont-div").click(function(){
    if($("#contract-divs-container").hasClass('some-cont-div-clicked')){
      if($(this).hasClass('this-cont-div-clicked')) {
        removeclickedeffect($(this));
        if($(this).hasClass('contract-div-hovered')){applyhovereffectoncontdiv($(this));}
      }else{
        $("#contract-month-div").addClass('d-none');
        $("#prepay-month-div").addClass('d-none');
        $(".mtm-extra-div").show()
        transformclickedeffect($(this),mtm_cont_flip_divs,'.mtm-data-div');
      }

    }else{applyclickedeffect($(this),mtm_cont_flip_divs,'.mtm-data-div');}

  });

  $(".prepay-save-div").click(function(){
    if($("#contract-divs-container").hasClass('some-cont-div-clicked')){
      if($(this).hasClass('this-cont-div-clicked')) {
        $("#prepay-month-div").addClass('d-none');
        removeclickedeffect($(this));
        if($(this).hasClass('contract-div-hovered')){applyhovereffectoncontdiv($(this));}
      }else{
        $("#contract-month-div").addClass('d-none');
        $("#prepay-month-div").removeClass('d-none');
        $("#prepay-7-month-div").click();
        $(".mtm-extra-div").hide()
        $(".prepay-extra-div").show()
        transformclickedeffect($(this),prepay_cont_flip_divs,'.prepay-data-7-months-div');
      }

    }else{
      $("#prepay-month-div").removeClass('d-none');
      $("#prepay-7-month-div").click();
      $(".mtm-extra-div").hide()
      $(".prepay-extra-div").show()
      applyclickedeffect($(this),prepay_cont_flip_divs,'.prepay-data-7-months-div');
    }
  });

  $(".cont-div").click(function(){
    if($("#contract-divs-container").hasClass('some-cont-div-clicked')){
      if($(this).hasClass('this-cont-div-clicked')) {
        $("#contract-month-div").addClass('d-none');
        removeclickedeffect($(this));
        if($(this).hasClass('contract-div-hovered')){applyhovereffectoncontdiv($(this));}
      }else{
        $("#contract-month-div").removeClass('d-none');
        $("#prepay-month-div").addClass('d-none');
        $("#cont-12-month-div").click();
        $(".mtm-extra-div").hide()
        transformclickedeffect($(this),lock_cont_flip_divs,'.contract-data-12-months-div');
      }

    }else{
      $("#contract-month-div").removeClass('d-none');
      $("#cont-12-month-div").click();
      $(".mtm-extra-div").hide()
      applyclickedeffect($(this),lock_cont_flip_divs,'.contract-data-12-months-div');

    }
  });

  $('#data-plan-slider').on('change input', function() {
    

  }).change();

  $("#confirm-mobile-data").click(function () {
    $("#mobile-data-div").addClass('animated fadeOutLeft').delay(300).queue(function() {
      $(this).addClass('d-sm-none');
      $("#mobile-plan-div").removeClass('d-sm-none');
      $("#mobile-plan-div").addClass('animated fadeInRight');
      $(this).dequeue();
    });
  });

  $('.data-info-summary-text').hover(function(){
    $(this).find('.data-info-text').addClass('border-bottom border-primary');
  },function(){
    $(this).find('.data-info-text').removeClass('border-bottom border-primary');
  })



});