/*
Theme Name: Optysil
Text Domain: Optysil
Version: 1.0
Requires at least: 5.6
Requires PHP: 7.3.0
Description: Motyw napisany na potrzeby strony www.

*/

/* STYLE NA POTRZEBY MOTYWU */

.district a.disabled {
	cursor: not-allowed;
	pointer-events: none;
}

.video .my-container {
	transform-style: preserve-3d;
}


$(function() {                       
	$("#hamburger").click(function() { 
		$('.menu-wrapper').toggleClass("active");      
		$('.cta-btn').toggleClass("hide-cta");   
	});

	$(".show-more").click(function() { 
		$('.more-text').toggleClass("show");      
	});

	$(".nav-link").click(function() { 
		$('.menu-wrapper').toggleClass("active"); 
		$('#hamburger').toggleClass("open");     
	});

});

( function() {
	var youtube = document.querySelectorAll( ".youtube" );
	var youtubes = document.querySelectorAll( ".youtubes" );
	for (var i = 0; i < youtube.length; i++) {
		youtubes[i].addEventListener( "click", function() {
			var iframe = document.createElement( "iframe" );
			var youtube = document.querySelector( ".youtube" );
			var frame = document.querySelector( ".frame-outer" );
			iframe.setAttribute( "frameborder", "0" );
			iframe.setAttribute( "allowfullscreen", "" );
			iframe.setAttribute( "allow", "autoplay" );
			iframe.setAttribute( "src", "https://www.youtube.com/embed/"+ this.dataset.embed +"?rel=0&showinfo=0&autoplay=1" );
			youtube.innerHTML = "";
			youtube.appendChild( iframe );
			frame.classList.toggle("active");
		} );  
	};
} )();

$( document ).ready(function() {
	new Splide( '#splide1', {
		type   : 'slide',
		pagination: false,
		autoplay: false,
		perPage: 3,
		gap: 10,
		arrows: false,
		breakpoints:{
			991: {
				perPage: 2
			},
			600:{
				padding: { right: 120 },
				perPage: 1,
				arrows: true,
			}
		}
	} ).mount();

	new Splide( '#splide2', {
		type   : 'slide',
		pagination: false,
		autoplay: false,
		perPage: 5,
		gap: 10,
		arrows: false,
		breakpoints:{
			1300: {
				perPage: 4,
				arrows: false,
			},
			991: {
				perPage: 2,
				arrows: false,
			},
			600:{
				padding: { right: 120 },
				perPage: 1,
				arrows: true
			}
		}
	} ).mount();

	new Splide( '#splide3', {
		type   : 'slide',
		pagination: false,
		autoplay: false,
		perPage: 4,
		gap: 10,
		arrows: false,
		breakpoints:{
			991: {
				perPage: 2,
				arrows: false,
			},
			600:{
				padding: { right: 120 },
				perPage: 1,
				arrows: true,
			}
		}
	} ).mount();
	new Splide( '#splide4', {
		type   : 'slide',
		pagination: false,
		autoplay: false,
		perPage: 4,
		gap: 10,
		arrows: false,
		breakpoints:{
			991: {
				perPage: 2,
				arrows: false,
			},
			600:{
				padding: { right: 120 },
				perPage: 1,
				arrows: true,
			}
		}
	} ).mount();

	new Splide( '#splide5', {
		type: 'slide',
		pagination: false,
		autoplay: false,
		perPage: 3,
		loop: true,
		gap: 10,
		arrows: false,
		breakpoints:{
			991: {
				perPage: 2,
				arrows: false,
			},
			600:{
				padding: { right: 120 },
				perPage: 1,
				arrows: true
			}
		}
	} ).mount();

	var btn = $('#button');

	btn.on('click', function(e) {
		e.preventDefault();
		$('html, body').animate({scrollTop:0}, '300');
	});

});
$("#select-town").change(function(){
	var mobile = $(this).find(':selected').data('mobile');
	var mail = $(this).find(':selected').data('mail');
	var town = $(this).find(':selected').data('town');
	$( ".data-info--phone a" ).html(mobile);
	$( ".data-info--mail a" ).html(mail);
	$( ".name-town" ).html(town);
	$(".data-info--phone a").attr("href", "tel:" + mobile);
	$(".data-info--mail a").attr("href", "mailto:" + mail);

})

$("#input-town-list").change(function(){
  var el=$("#input-town-list")[0];  //used [0] is to get HTML DOM not jquery Object
  var dl=$("#town-list")[0];
  if(el.value.trim() != ''){
  	var opSelected = dl.querySelector(`[value="${el.value}"]`);
  	mail = opSelected.getAttribute('data-mail');
  	mobile = opSelected.getAttribute('data-mobile');
  	town = opSelected.getAttribute('value');
  	$( ".data-info--phone a" ).html(mobile);
  	$( ".data-info--mail a" ).html(mail);
  	$( ".name-town" ).html(town);
  	$(".data-info--phone a").attr("href", "tel:" + mobile);
  	$(".data-info--mail a").attr("href", "mailto:" + mail);
	    	$(".data-info--mail a").removeClass('disabled');
  	$(".data-info--phone a").removeClass('disabled');
  }
});


var closeX = document.querySelector(".close");
closeX.addEventListener("click", function() {
	var iframe = document.querySelector( "iframe" );
	var frame = document.querySelector( ".frame-outer" );
	frame.classList.toggle("active");
	iframe.remove();
});

var stickyWrapper = document.getElementById("temp-wrapper");
var sectionHeight = stickyWrapper.scrollHeight;
stickyWrapper.style.maxHeight = sectionHeight + 'px';

(function(){
	var sectionHeight = stickyWrapper.scrollHeight;
	stickyWrapper.style.maxHeight = sectionHeight + 'px';
	setTimeout(arguments.callee, 100);
})();


// document.addEventListener('DOMContentLoaded', function(event) {
//     const el = document.querySelector(".button")
//     const observer = new IntersectionObserver( 
//       ([e]) => e.target.classList.toggle("is-pinned", e.intersectionRatio < 1),
//       { threshold: [1] }
//       );

//     observer.observe(el);
// });

var waypoint = new Waypoint({
	element: document.getElementById('hero'),
	handler: function() {
		el = document.querySelector(".button")
		el.classList.toggle("is-pinned")
	}
});