(function ($) {
$(function(){
	// Ленивая загрузка
	observer = lozad('.lozad:not(loaded)', {
		rootMargin: '400px 400px',
		threshold: 0,
		loaded: function(el) {
			el.classList.add('loaded')
		}
	})

	observer.observe()


	// Проверка браузера
	if ( !supportsCssVars() ) {
		$('body').addClass('lock')
		$('.supports_error').addClass('show')
	}

	// Установка ширины стандартного скроллбара
	$(':root').css('--scroll_width', widthScroll() + 'px')


	// Плавная прокрутка к якорю
	$('body').on('click', '.scroll-js', function(e) {
		e.preventDefault()

		$('.scroll-js').removeClass('active')
		$(this).addClass('active')

		var href = $(this).data('anchor')

		var addOffset = $('.layout-fixed-emulation').height()

		$('html, body').stop().animate({
			scrollTop: $(href).offset().top - addOffset
		}, 500)
	})
})


$(window).on("load", function () {
	if( $(window).width() > 1024 ){
		$('body').on('mouseenter', '.principles-thums__item', function(e) {
			var slideActive = $(this).data('index-slide')

			$(this).closest('.principles-thumbs').find('.principles-thums__item').removeClass('active')

			$(this).addClass('active')

			$(this).closest('.principles').find('.principles-item').removeClass('active')

			$(this).closest('.principles').find('.principles-item:eq(' + slideActive + ')').addClass('active')
		})

	    $('body').on('mousemove', '.best-link__hover', function(e) {
			$(this).parent().addClass('hover')
			var pos = $(this).parent().offset()
			var pageX = event.pageX
			var pageY = event.pageY
			var x = pageX - pos.left + 10
			var y = pageY - pos.top + 10

			$(this).parent().find('.best-link__img').css({
				'left' : x + 'px',
				'top' : y + 'px'
			})
	    })

		$('body').on('mouseout', '.best-link__hover', function(e) {
			$(this).parent().removeClass('hover')

			$(this).parent().find('.best-link__img').css({
				'left' : '50%',
				'top' : '50%',
			})
		})
	}

	var offsetTop = $('.layout-fixed-emulation').innerHeight()

	//init
	var controller = new ScrollMagic.Controller()

	var durationEl = $('.first-section__anim').innerHeight() - $('.first-section__anim').innerHeight()/3

	scene = new ScrollMagic.Scene({
		triggerElement: '.first-section',
		duration: durationEl,
		triggerHook: 'onLeave',
		offset: '-'+offsetTop
	})
	.setClassToggle('.first-section', 'fixed')
	.on('progress', function (e) {
		if ( e.progress > 0 ) {
			$('.first-section').addClass('hide_info')
		} else{
			$('.first-section').removeClass('hide_info')
		}

		if ( e.progress == 1 ) {
			$('.first-section').addClass('no_fixed')
		} else{
			$('.first-section').removeClass('no_fixed')
		}

		if ( e.progress >= 0 && e.progress < .333 ) {
			$('.first-section__dot').removeClass('active')

			$('.first-section__dot:eq(0)').addClass('active')
		} else if ( e.progress >= .333 && e.progress < .666 ) {
			$('.first-section__dot').removeClass('active')

			$('.first-section__dot:eq(1)').addClass('active')
		} else if ( e.progress >= .666 && e.progress < 1 ) {
			$('.first-section__dot').removeClass('active')

			$('.first-section__dot:eq(2)').addClass('active')
		}
	})
	.addTo(controller)


	$('.principles-item__box').height('auto')

	setHeight( $('.principles-item__box') )


	slidersMob()
})

$(window).on("resize", function () {
	var offsetTop = $('.layout-fixed-emulation').innerHeight()

	var durationEl = $('.first-section__anim').innerHeight() - $('.first-section__anim').innerHeight()/3

	scene.duration(durationEl)
	scene.offset(offsetTop*-1)
	scene.refresh()


	$('.principles-item__box').height('auto')

	setHeight( $('.principles-item__box') )


	slidersMob()
})


// Вспомогательные функции
var supportsCssVars = function() {
    var s = document.createElement('style'),
	support

    s.innerHTML = ":root { --tmp-var: bold; }"
    document.head.appendChild(s)
    support = !!(window.CSS && window.CSS.supports && window.CSS.supports('font-weight', 'var(--tmp-var)'))
    s.parentNode.removeChild(s)

    return support
}

function widthScroll() {
    var div = document.createElement('div')
    div.style.overflowY = 'scroll'
    div.style.width = '50px'
    div.style.height = '50px'
    div.style.visibility = 'hidden'
    document.body.appendChild(div)

    var scrollWidth = div.offsetWidth - div.clientWidth
    document.body.removeChild(div)

    return scrollWidth
}

function setHeight(className){
    var maxheight = 0
    var object = $(className)

    object.each(function() {
    	var elHeight = $(this).innerHeight()

        if( elHeight > maxheight ) {
        	maxheight = elHeight
        }
    })

    object.innerHeight( maxheight )
}


function slidersMob(){
	if ( $(window).width() < 1025 && !$('.principles-thumbs').hasClass('swiper-container-initialized') ) {
		$('.principles-thumbs').addClass('swiper-container')
		$('.principles-thumbs__wrapp').addClass('swiper-wrapper').removeClass('principles-thumbs__wrapp')

		$('.principles-thums__item').removeClass('active')

		$('.principles-thums__item:eq(0)').addClass('active')

		galleryThumbs = new Swiper('.principles-thumbs', {
			spaceBetween: 0,
			slidesPerView: 2,
			loop: false,
			watchSlidesVisibility: true,
			watchSlidesProgress: true,
			watchOverflow: true,
			speed: 500,
			breakpoints: {
				'320': {
					slidesPerView: 2
				},
				'600': {
					slidesPerView: 3
				}
			}
		})

		galleryThumbs.on('slideChange', function(swiper) {
			if ( swiper.realIndex == swiper.slides.length - swiper.visibleSlidesIndexes.length ) {
				$(swiper.$el).addClass('last_slide')
			} else {
				$(swiper.$el).removeClass('last_slide')
			}
		})
	} else if ( $(window).width() > 1024 && $('.principles-thumbs').hasClass('swiper-container-initialized') ) {
		$('.principles-thumbs').removeClass('swiper-container')
		$('.principles-thumbs .swiper-wrapper').addClass('principles-thumbs__wrapp').removeClass('swiper-wrapper')

		galleryThumbs.destroy(true, true)

		$('.principles-thums__item').removeClass('active')

		$('.principles-thums__item:eq(0)').addClass('active')
	}


	if ( $(window).width() < 1025 && !$('.principles-items').hasClass('swiper-container-initialized') ) {
		$('.principles-items').addClass('swiper-container')
		$('.principles-items_wrapp').addClass('swiper-wrapper')

		galleryImg = new Swiper('.principles-items', {
			spaceBetween: 0,
			loop: false,
			speed: 500,
			watchOverflow: true,
			watchSlidesVisibility: true,
			watchSlidesProgress: true,
			effect: 'fade',
			slideActiveClass: 'active',
			breakpoints: {
				'320': {
					allowTouchMove: false
				},
				'600': {
					allowTouchMove: true
				}
			},
			thumbs: {
				swiper: galleryThumbs,
				slideThumbActiveClass: 'active',
			},
			on: {
				init: function () {
					$('.principles-item__box').height('auto')

					setTimeout(function(){
						setHeight( $('.principles-item__box') )
					}, 100)
				},
				resize: function () {
					$('.principles-item__box').height('auto')

					setTimeout(function(){
						setHeight( $('.principles-item__box') )
					}, 100)
				}
			}
		})
	} else if ( $(window).width() > 1024 && $('.principles-items').hasClass('swiper-container-initialized') ) {
		$('.principles-items').removeClass('swiper-container')
		$('.principles-items_wrapp').removeClass('swiper-wrapper')

		galleryImg.destroy(true, true)

		$('.principles-item').removeClass('active')
		$('.principles-item:eq(0)').addClass('active')
	}
}
})(jQuery);