jQuery(document).ready(function($){

	$(window).scroll(function() {
		var scroll = $(window).scrollTop();
		var x = $('header').outerHeight();
		var y = $('.mainFeaturedSection').outerHeight();
		var z = $('.mainSection').outerHeight();
		
		if (scroll >= (x+y) && scroll <= (x+z)) {
			$('#image').css('background-size', 350 - parseInt(scroll / 4.9, 0) + '% ');
		}

		// fix background image 
		// if(scroll >= (z+100)) {
		// 	$('#image').css('background-attachment', 'unset');
		// } else {
		// 	$('#image').css('background-attachment', 'fixed');
		// }
	});
	
	// Popular Brands Carousel
	var owlFindCars = $('#upcomingCarsModels');
		owlFindCars.owlCarousel({
		loop: true,
		dots: true,
		center: true,
		nav: true,
		navText : ["<i class='fa fa-chevron-left fa-lg'></i>","<i class='fa fa-chevron-right fa-lg'></i>"],
		autoplay:false,
		autoplayTimeout:4000,
		responsive: {
			0: {
			items: 1,
			stagePadding: 0,
			},
			800 : {
			items: 2,
			margin: 100,
			stagePadding: 0,
			},
			1200: {
			items: 1,
			margin: 200,
			stagePadding: 432,
			}
		}
	});

	// Popular Brands Carousel
	var owlFindCars2 = $('#ourClients');
		owlFindCars2.owlCarousel({
		loop: true,
		dots: true,
		center: true,
		nav: false,
		autoplay:true,
		stagePadding:0,
		margin:20,
		autoplayTimeout:4000,
		responsive: {
			0: {
			items: 2
			},
			800 : {
			items: 3
			},
			1200: {
			items: 4
			}
		}
	});

	$('.client-single').on('click', function (event) {
		event.preventDefault();

		var active = $(this).hasClass('active');

		var parent = $(this).parents('.testi-wrap');

		if (!active) {
			var activeBlock = parent.find('.client-single.active');

			var currentPos = $(this).attr('data-position');

			var newPos = activeBlock.attr('data-position');

			activeBlock.removeClass('active').removeClass(newPos).addClass('inactive').addClass(currentPos);
			activeBlock.attr('data-position', currentPos);

			$(this).addClass('active').removeClass('inactive').removeClass(currentPos).addClass(newPos);
			$(this).attr('data-position', newPos);

		}
	});

	
	window.addEventListener('load', () => {
		var carousels = document.querySelectorAll('.carousel');
	  
		for (var i = 0; i < carousels.length; i++) {
		  carousel(carousels[i]);
		}
	  });
	  
	  function carousel(root) {
		var
		figure = root.querySelector('figure'),
		nav = root.querySelector('nav'),
		images = figure.children,
		n = images.length,
		gap = root.dataset.gap || 0,
		bfc = 'bfc' in root.dataset,
	  
		theta = 2 * Math.PI / n,
		currImage = 0;
	  
	  
		setupCarousel(n, parseFloat(getComputedStyle(images[0]).width));
		window.addEventListener('resize', () => {
		  setupCarousel(n, parseFloat(getComputedStyle(images[0]).width));
		});
	  
		setupNavigation();
	  
		function setupCarousel(n, s) {
		  var
		  apothem = s / (2 * Math.tan(Math.PI / n));
	  
	  
		  figure.style.transformOrigin = `50% 50% ${-apothem}px`;
	  
		  for (var i = 0; i < n; i++)
		  images[i].style.padding = `${gap}px`;
		  for (i = 1; i < n; i++) {
			images[i].style.transformOrigin = `50% 50% ${-apothem}px`;
			images[i].style.transform = `rotateY(${i * theta}rad)`;
		  }
		  if (bfc)
		  for (i = 0; i < n; i++)
		  images[i].style.backfaceVisibility = 'hidden';
	  
		  rotateCarousel(currImage);
		}
	  
		function setupNavigation() {
		  nav.addEventListener('click', onClick, true);
	  
		  function onClick(e) {
			e.stopPropagation();
	  
			var t = e.target;
			if (t.tagName.toUpperCase() != 'BUTTON')
			return;
	  
			if (t.classList.contains('next')) {
			  currImage++;
			} else
			{
			  currImage--;
			}
	  
			rotateCarousel(currImage);
		  }
	  
		}
	  
		function rotateCarousel(imageIndex) {
		  figure.style.transform = `rotateY(${imageIndex * -theta}rad)`;
		}
	  
	  }

});