$(document).ready(function(){
  $('a').on('click', function(event) {
    if (this.hash !== "") {
      event.preventDefault();
      var hash = this.hash;
      $('html, body').animate({
        scrollTop: $(hash).offset().top - 80
      }, 800, function(){
        window.location.hash = hash;
      });
    }
  });
});

// $(function() {
//   $(window).on('resize', function(e) {
//     if (screen.width < screen.height){
//       $('.section--preview').addClass('horizontal');
//     }else{
//       $('.section--preview').removeClass('horizontal');
//     }
//   });
// })

init();

function init() {
  let state = 0;

  // if (screen.width < screen.height){
  //   $('.section--preview').addClass('horizontal');
  // }else{
  //   $('.section--preview').removeClass('horizontal');
  // }

  $('.js-prev-slide').click(function() {
    if(state - 1 == -1){state = 2;}else{state = state - 1;}
    swiper(state,0);
  });  
  $('.js-next-slide').click(function() {
    if(state + 1 == 3){state = 0;}else{state = state + 1;}
    swiper(state,1);
  });

  $('.js-menu-object').click(function() {
    closeSequence($('body').find('.section--block' + $(this).attr('href')));
  });
  $('.js-menu-detail').click(function() {
    menuControl($('body').find('.section--block' + $(this).attr('href')), "detail");
  });
  $('.js-menu-gallery').click(function() {
    menuControl($('body').find('.section--block' + $(this).attr('href')), "gallery");
  });
  $('.js-menu-price').click(function() {
    menuControl($('body').find('.section--block' + $(this).attr('href')), "price");
  });

  $('.js-left-open').click(function() {
    let position;
    if (screen.width > 1200){position = 50;}else{position = 0;}
    if($(this).closest('.section').hasClass('section--switch')){
      $(this).closest('.section').find('.section__left').css('left',position + '%');
    }else{
      $(this).closest('.section').find('.section__left').css('left','0%');
    }
  });
  $('.js-left-close').click(function() {
    let position1;
    let position2;
    if (screen.width > 1200){position1 = 0;position2 = -50;}else{position1 = -100;position2 = -100;}
    if($(this).closest('.section').hasClass('section--switch')){
      $(this).closest('.section').find('.section__left').css('left',position1 + '%');
    }else{
      $(this).closest('.section').find('.section__left').css('left',position2 + '%');
    }
  });
  $('.js-gallery-open').click(function() {
    const x = $(this).closest('.section').find('.section__gallery');
    x.addClass('is-open');
    if(!x.hasClass('loaded')){loadGallery(this,x.attr('data-object'),x.attr('data-items'));}
  });
  $('.js-gallery-close').click(function() {
    $(this).closest('.section').find('.section__gallery').removeClass('is-open');
  });
  $('.js-right-open').click(function() {
    let position;
    if (screen.width > 1200){position = 50;}else{position = 0;}
    if($(this).closest('.section').hasClass('section--switch')){
      $(this).closest('.section').find('.section__right').css('left',position + '%');
    }else{
      $(this).closest('.section').find('.section__right').css('left','0%');
    }
  });
  $('.js-right-close').click(function() {
    let position;
    if (screen.width > 1200){position = 50}else{position = 100;}
    if($(this).closest('.section').hasClass('section--switch')){
      $(this).closest('.section').find('.section__right').css('left','100%');
    }else{
      $(this).closest('.section').find('.section__right').css('left',position + '%');
    }
  });

  $('.js-preview-close').click(function() {
    $('body').removeClass('noscroll');
    $('body').find('.section--preview').removeClass('is-open');
  });

  $('.js-preview-prev').click(function() {
    let data = $(this).closest('.section--preview');
    let x = Number(data.attr('data-object'));
    let y = Number(data.attr('data-item'));
    let z = Number(data.attr('data-items'));
    galleryControl(x,0,y,z);
  });

  $('.js-preview-next').click(function() {
    let data = $(this).closest('.section--preview');
    let x = Number(data.attr('data-object'));
    let y = Number(data.attr('data-item'));
    let z = Number(data.attr('data-items'));
    galleryControl(x,1,y,z);
  });

  $('.js-menu-button').click(function() {
    if($(this).hasClass('is-active')){
      $(this).removeClass('is-active');
      $('body').removeClass('noscroll');
      $('body').find('.header').removeClass('is-open');
    }else{
      $(this).addClass('is-active');
      $('body').addClass('noscroll');
      $('body').find('.header').addClass('is-open');
    }
  });

  $('.js-menu-close').click(function() {
    $('body').find('.header').removeClass('is-open');
    $('body').find('.js-menu-button').removeClass('is-active');
    $('body').removeClass('noscroll');
  });
}

function swiper(e,f) {
  const a = $('.js-slide-one');
  const b = $('.js-slide-two');
  const c = $('.js-slide-three');

  if (e == 1) {
    if (f == 1) {
      $(a).css('zIndex','1');
      $(c).css('zIndex','-1');
    } else {
      $(a).css('zIndex','-1');
      $(c).css('zIndex','1');
    }
    $(b).css('zIndex','1');
    $(a).css('left','-100%');
    $(b).css('left','0%');
    $(c).css('left','100%');
  } else if (e == 2) {
    if (f == 1) {
      $(b).css('zIndex','1');
      $(a).css('zIndex','-1');
    } else {
      $(b).css('zIndex','-1');
      $(a).css('zIndex','1');
    }
    $(c).css('zIndex','1');
    $(a).css('left','100%');
    $(b).css('left','-100%');
    $(c).css('left','0%');
  } else {
    if (f == 1) {
      $(c).css('zIndex','1');
      $(b).css('zIndex','-1');
    } else {
      $(c).css('zIndex','-1');
      $(b).css('zIndex','1');
    }
    $(a).css('zIndex','1');
    $(a).css('left','0%');
    $(b).css('left','100%');
    $(c).css('left','-100%');
  }
}

function loadGallery(item,object,maxItems){
  let imageUrls = [];
  const loadImage = src =>
  new Promise((resolve, reject) => {
    const img = new Image();
    img.onload = () => resolve(img);
    img.onerror = reject;
    img.src = src;
  })  
;

switch(Number(object)) {
  case 0:
    imageUrls = [
      "img/gallery/statek/1.webp",
      "img/gallery/statek/2.webp",
      "img/gallery/statek/3.webp",
      "img/gallery/statek/4.webp",
      "img/gallery/statek/5.webp",
      "img/gallery/statek/6.webp",
      "img/gallery/statek/7.webp",
      "img/gallery/statek/8.webp",
      "img/gallery/statek/9.webp",
      "img/gallery/statek/10.webp",
      "img/gallery/statek/11.webp",
      "img/gallery/statek/12.webp",
      "img/gallery/statek/13.webp",
      "img/gallery/statek/14.webp",
      "img/gallery/statek/15.webp",
      "img/gallery/statek/16.webp",
      "img/gallery/statek/17.webp",
      "img/gallery/statek/18.webp",
      "img/gallery/statek/19.webp",
      "img/gallery/statek/20.webp",
      "img/gallery/statek/21.webp",
      "img/gallery/statek/22.webp",
      "img/gallery/statek/23.webp",
      "img/gallery/statek/24.webp"
    ];
    break;
  case 1:
    imageUrls = [
      "img/gallery/penzion/1.webp",
      "img/gallery/penzion/2.webp",
      "img/gallery/penzion/3.webp",
      "img/gallery/penzion/4.webp",
      "img/gallery/penzion/5.webp",
      "img/gallery/penzion/6.webp",
      "img/gallery/penzion/7.webp",
      "img/gallery/penzion/8.webp",
      "img/gallery/penzion/9.webp",
      "img/gallery/penzion/10.webp",
      "img/gallery/penzion/11.webp",
      "img/gallery/penzion/12.webp",
      "img/gallery/penzion/13.webp",
      "img/gallery/penzion/14.webp",
      "img/gallery/penzion/15.webp",
      "img/gallery/penzion/16.webp",
      "img/gallery/penzion/17.webp",
      "img/gallery/penzion/18.webp",
      "img/gallery/penzion/19.webp",
      "img/gallery/penzion/20.webp",
      "img/gallery/penzion/21.webp",
      "img/gallery/penzion/22.webp",
      "img/gallery/penzion/23.webp",
      "img/gallery/penzion/24.webp"
    ];
    break;
    case 2:
      imageUrls = [
        "img/gallery/chata/1.webp",
        "img/gallery/chata/2.webp",
        "img/gallery/chata/3.webp",
        "img/gallery/chata/4.webp",
        "img/gallery/chata/5.webp",
        "img/gallery/chata/6.webp",
        "img/gallery/chata/7.webp",
        "img/gallery/chata/8.webp",
        "img/gallery/chata/9.webp",
        "img/gallery/chata/10.webp",
        "img/gallery/chata/11.webp",
        "img/gallery/chata/12.webp",
        "img/gallery/chata/13.webp",
        "img/gallery/chata/14.webp",
        "img/gallery/chata/15.webp",
        "img/gallery/chata/16.webp",
        "img/gallery/chata/17.webp",
        "img/gallery/chata/18.webp",
        "img/gallery/chata/19.webp",
        "img/gallery/chata/20.webp",
        "img/gallery/chata/21.webp",
        "img/gallery/chata/22.webp",
        "img/gallery/chata/23.webp",
        "img/gallery/chata/24.webp"
      ];
      break;
  case 3:
    imageUrls = [
      "img/gallery/statek/6.webp",
      "img/gallery/statek/w1.webp",
      "img/gallery/statek/w2.webp",
      "img/gallery/statek/w6.webp",
      "img/gallery/statek/w3.webp",
      "img/gallery/statek/w4.webp",
      "img/gallery/statek/3.webp",
      "img/gallery/statek/9.webp",
      "img/gallery/statek/8.webp",
      "img/gallery/statek/7.webp",
      "img/gallery/statek/11.webp",
      "img/gallery/statek/w5.webp"
    ];
}

Promise.all(imageUrls.map(loadImage)).then(images => {
  let count = 1;
  images.forEach((image, i) =>{
    $(item).closest('.section').find('.gallery').append($('<div class="gallery__item js-gallery-item" data-order="' + count + '"></div>').append(image));
    if(count == maxItems){
      $(item).closest('.section').find('.section__gallery').addClass('loaded');
      $('.js-gallery-item').click(function() {
        let z;
        let x = $('body').find('.section--preview');
        let y = Number($(this).attr('data-order'));
        let w = Number($(item).closest('.section').find('.section__gallery').attr('data-items'));
        let c = $(this).closest('.section').attr('id');

        if(c == "statek"){z = 0;}else if(c == "penzion"){z = 1;}else if(c == "chata"){z = 2;}else{z = 3;}
        $('body').addClass('noscroll');
        x.attr('data-object',z);
        x.attr('data-item',y);
        x.attr('data-items',w);
        x.find('img').attr('src',$(this).find('img').attr('src'));
        x.addClass('is-open');
      });
    }
    count = count + 1;
  });
}
);
}

function galleryControl(e,f,g,h) {
  let object;
  let next = loopControl(g, f, h);
  
  switch(e) {
    case 0:
      object = "statek";
      break;
    case 1:
      object = "penzion";
      break;
    case 2:
      object = "chata";
      break;
    case 3:
      object = "statek";
  }
  $('body').find('.section--preview').attr('data-item',next);
  if(e==3){
    switch(next) {
      case 1:
        next = "6";
        break;
      case 2:
        next = "w1";
        break;
      case 3:
        next = "w2";
        break;
      case 4:
        next = "w6";
        break;
      case 5:
        next = "w3";
        break;
      case 6:
        next = "w4";
        break;
      case 7:
        next = "3";
        break;
      case 8:
        next = "9";
        break;
      case 9:
        next = "8";
        break;
      case 10:
        next = "7";
        break;
      case 11:
        next = "11";
        break;
      case 12:
        next = "w5";
    } 
  }
  $('body').find('.section--preview').find('img').attr('src','img/gallery/' + object + '/' + next + '.webp');
}

function loopControl(e,f,g) {
  if(f){if(g+1==e+1){e=1;}else{e=e+1;}}else{if(0==e-1){e=g;}else{e=e-1;}}return e;
}

function menuControl(e,f) {
  let position;
  if (screen.width > 1200){position = 50;}else{position = 0}
  closeSequence(e);

  if(f=="detail"){
    if(e.hasClass('section--switch')){
      e.find('.section__left').css('left',position+'%');
    }else{
      e.find('.section__left').css('left','0%');
    }
  }else if(f=="gallery"){
    let x = e.find('.section__gallery');
    x.addClass('is-open');
    if(!x.hasClass('loaded')){loadGallery(e,x.attr('data-object'),x.attr('data-items'));}
  }else{
    if(e.hasClass('section--switch')){
      e.find('.section__right').css('left',position+'%');
    }else{
      e.find('.section__right').css('left','0%');
    }
  }
}

function closeSequence(e) {
  let position1;
  let position2;
  let position3;
  let position4;
  if (screen.width > 1200){position1 = 0;position2 = 100;position3 = -50;position4 = 50;}else{position1 = -100;position2 = 100;position3 = -100;position4 = 100;}

  if($('body').find('.header').hasClass('is-open')){
    $('body').removeClass('noscroll');
    $('body').find('.header').removeClass('is-open');
    $('body').find('.js-menu-button').removeClass('is-active');
  }

  if(e.hasClass('section--switch')){
    e.find('.section__left').css('left',position1+'%');
    e.find('.section__right').css('left',position2+'%');
  }else{
    e.find('.section__left').css('left',position3+'%');
    e.find('.section__right').css('left',position4+'%');
  }
  e.find('.section__gallery').removeClass('is-open');
}