var Webflow = Webflow || [];
Webflow.push(function () {

	var BP_TABLET = 980;

	var ANIMATIONS;
	var ANIM_DEFAULTS = {
		duration: .7,
		delay: .6,
		ease: 'Expo.easeOut',
		alpha: 0,
		y: '+=50',
		stagger: .1
	};

	var S_INTRO = 0;
	var S_INTRO2 = S_INTRO + 1;
	// var S_INTRO2 = S_INTRO;

	var S_VIDEO1 = S_INTRO2 + (1 + 4);
	var S_VIDEO2 = S_VIDEO1 + 1;
	var S_IMAGES_GRID = S_VIDEO2 + 1;
	var S_WHATS_IN_THE_BOX = S_IMAGES_GRID + 1;
	var S_WEIGHTS = S_WHATS_IN_THE_BOX + 1;
	var S_PUSH_FURTHER = S_WEIGHTS + 1;
	var S_IMG_SLIDER = S_PUSH_FURTHER + 1;

	var SLIDER_SECTION_NUM = 8;
	var lastSlide;
	var currentSlide;

	// if (true) {
	// 	$('.s-whats-in-the-box---weights').removeClass('fp-section');
	// }

	var IS_DESKTOP = window.innerWidth > BP_TABLET;

	if (IS_DESKTOP) {

		var myFullpage = new fullpage('#fullpage', {
			licenseKey: '26EAB0AF-8486425C-877ECA73-AB183108',

			// paddingTop: '40px',
			paddingTop: (40 + 30) + 'px',
			// lockAnchors: false,
			// anchors: ['firstPage', 'secondPage'],
			scrollingSpeed: 1000,
			// easingcss3: 'cubic-bezier(0.190, 1.000, 0.220, 1.000)',//easeOutExpo
			// easingcss3: 'cubic-bezier(0.215, 0.610, 0.355, 1.000)',//easeOutCubic
			// easingcss3: 'cubic-bezier(0.165, 0.840, 0.440, 1.000)',//easeOutQuart
			easingcss3: 'cubic-bezier(0.230, 1.000, 0.320, 1.000)',//easeOutQuint
			// normalScrollElements: '.s-image-grid, .s-footer',
			scrollOverflow: true,
			// responsiveWidth: 980,
			// responsiveSlides: false,
			// fixedElements: '#header, .footer',

			// ** Custom selectors
			sectionSelector: '.fp-section',
			// slideSelector: '.slide',

			// ** Events
			afterRender: function () {

				initSlider();

				$('video').each((i, v) => {
					$(v).attr('data-keepplaying', '');
					v.play();
				});

				if (!ANIMATIONS) {
					ANIMATIONS = [];
					createAnimations();
					console.log('animations created');
				}

			},

			afterLoad: function (origin, destination, direction) {
				// console.log('afterLoad --------------------------- @ ' + direction);
				if (!ANIMATIONS) {
					console.log('skipping ... not ready yet');
					return;
				}

				// init 1st slide animations
				if (destination.index != 0 && ANIMATIONS[0] == null) {
					createAnimations(true);
				}

				if (origin.index != destination.index) {// initial call after page load
					animationReset(origin.index);
				}
			},

			onLeave: function (origin, destination, direction) {
				// console.log('onLeave --------------------------- @ ' + destination.index);
				if (!ANIMATIONS) {
					console.log('skipping ... not ready yet');
					return;
				}

				requestAnimationFrame(
					function () {
						animationPlay(destination.index);

						// play 1st slide animation upon arrival
						if (destination.index == SLIDER_SECTION_NUM) {
							currentSlide = 0;
							setTimeout(sliderAnimationPlay, 300, currentSlide);
						}
					}
				);
			},
			// afterResize: function (width, height) { },
			// afterReBuild: function () { },
			// afterResponsive: function (isResponsive) { },
			// afterSlideLoad: function (section, origin, destination, direction) { },
			// onSlideLeave: function (section, origin, destination, direction) { }
		});

	} else {

		// Missing afterRender event. Manual slider init.
		initSlider();

	}

	positionLogoVideo();

	// ***************************************** Slider setup ************************************************	

	function initSlider() {
		var slider = $('.product-features-list');

		slider.on('init', function (event, slick) {
			console.log('slick init: ' + slick);

			if (!SLIDER_ANIMATIONS) {
				SLIDER_ANIMATIONS = [];
				requestAnimationFrame(function () {
					createSliderAnimations();

					// create 1st slide right away
					if (IS_DESKTOP) createSliderAnimations(true);
				});
				console.log('slider animations created');
			}

		});

		slider.slick({
			dots: true,
			arrows: true,
			prevArrow: $('#btnSliderPrev'),
			nextArrow: $('#btnSliderNext'),
			infinite: false,
			// slidesToScroll: 3,
			slidesToShow: 1,
			// centerMode: true,
			// variableWidth: true
		});


		slider.on('swipe', function (event, slick, direction) {
			console.log('swipe: ' + direction);
			// left
		});

		slider.on('afterChange', function (event, slick, newSlide) {
			console.log('afterChange: ' + currentSlide + ' -> ' + newSlide);

			if (currentSlide == newSlide || (currentSlide == undefined && newSlide == 0)) return;

			// init 1st slide animations
			if (currentSlide != 0 && SLIDER_ANIMATIONS[0] == null) {
				createSliderAnimations(true);
			}

			lastSlide = currentSlide;
			sliderAnimationReset(lastSlide);

			currentSlide = newSlide;
			sliderAnimationPlay(currentSlide);
		});


		slider[0].addEventListener('scroll', function (e) {
			console.log('scroll: ', e);
		}, true);
	}

	function sliderAnimationReset(index) {
		if (index >= SLIDER_ANIMATIONS.length) {
			console.log('sliderAnimationReset(' + index + ') -- index out of bounds!');
			return;
		}
		if (SLIDER_ANIMATIONS[index] == null) return;

		SLIDER_ANIMATIONS[index].pause();
		SLIDER_ANIMATIONS[index].seek(0);
	}

	function sliderAnimationPlay(index) {
		if (index >= SLIDER_ANIMATIONS.length) {
			console.log('sliderAnimationPlay(' + index + ') -- index out of bounds!');
			return;
		}
		if (SLIDER_ANIMATIONS[index] == null) return;

		SLIDER_ANIMATIONS[index].play(0);
	}

	var SLIDER_ANIMATIONS;
	var LABEL_DEFAULTS = {
		duration: 1,
		delay: 0,
		ease: 'Expo.easeOut',
		alpha: 0,
		x: '+=70',
		stagger: .2
	};
	var LINE_DEFAULTS = {
		duration: 1,
		delay: 0,
		ease: 'Expo.easeOut',
		alpha: 0,
		x: '+=30',
		scaleX: 0,
		stagger: .2
	};
	var LINES_DELAY = .1;

	function createSliderAnimations(initFirst) {

		var slider = $('.s-slider .product-features-list');

		function genSliderTimeline(index) {
			var cont = slider.find('[data-slick-index=' + index + ']');
			var labels = cont.find('.pfi-pointitem-label');
			var lines = cont.find('.pfi-pointitem-line');
			var tl = gsap.timeline({ paused: true });
			tl.from(lines, LINE_DEFAULTS);
			tl.from(labels, LABEL_DEFAULTS, LINES_DELAY);
			return tl;
		}

		if (initFirst) {
			// -- 0
			var tl = genSliderTimeline(0);
			SLIDER_ANIMATIONS[0] = tl;
			return;
		} else {
			SLIDER_ANIMATIONS[0] = null;
		}

		// -- 1
		SLIDER_ANIMATIONS.push(genSliderTimeline(1));

		// -- 2
		SLIDER_ANIMATIONS.push(genSliderTimeline(2));

		// -- 3
		SLIDER_ANIMATIONS.push(genSliderTimeline(3));

		// -- 4
		SLIDER_ANIMATIONS.push(genSliderTimeline(4));

		// -- 5
		SLIDER_ANIMATIONS.push(genSliderTimeline(5));

		// -- 6
		SLIDER_ANIMATIONS.push(genSliderTimeline(6));
	}


	// ***************************************** Sections' animations ************************************************

	function animationReset(index) {
		if (index >= ANIMATIONS.length) {
			console.log('animationReset(' + index + ') -- index out of bounds!');
			return;
		}
		if (ANIMATIONS[index] == null) return;

		ANIMATIONS[index].pause();
		ANIMATIONS[index].seek(0);
	}

	function animationPlay(index) {
		if (index >= ANIMATIONS.length) {
			console.log('animationPlay(' + index + ') -- index out of bounds!');
			return;
		}
		if (ANIMATIONS[index] == null) return;

		ANIMATIONS[index].play(0);
	}

	function createAnimations(initFirst) {
		var cont, items;
		var tl;

		if (initFirst) {
			// -- 0
			items = $('.s-intro .heading-intro, .s-intro .button-red, .s-intro .intro-bottom-text > *').toArray();
			tl = gsap.timeline({ paused: true });
			tl.from(items, ANIM_DEFAULTS);
			ANIMATIONS[S_INTRO] = tl;
			return;
		} else {
			ANIMATIONS[S_INTRO] = null;
		}

		// -- 1
		cont = $('.s-intro2');
		items = cont.find('.heading-intro2, .intro-bottom-text > *').toArray();
		tl = gsap.timeline({ paused: true });
		tl.from(items, ANIM_DEFAULTS);
		ANIMATIONS[S_INTRO2] = tl;

		// -- 2
		cont = $('#sVideo1');
		items = cont.find('.videoslide-col1 > *').toArray();
		tl = gsap.timeline({ paused: true });
		tl.from(items, ANIM_DEFAULTS);
		ANIMATIONS[S_VIDEO1] = tl;

		// -- 3
		cont = $('#sVideo2');
		items = cont.find('.videoslide-heading, .videoslide-p, .feature-item').toArray();
		tl = gsap.timeline({ paused: true });
		tl.from(items, ANIM_DEFAULTS);
		ANIMATIONS[S_VIDEO2] = tl;

		// -- 4
		// ANIMATIONS.push(null);// grid photos
		ANIMATIONS[S_IMAGES_GRID] = tl;// grid photos

		// -- 5
		cont = $('.s-whats-in-the-box');
		items = cont.find('.specs-heading, .specs-subheading, .specs-item, .button-red').toArray();
		tl = gsap.timeline({ paused: true });
		tl.from(items, ANIM_DEFAULTS);
		ANIMATIONS[S_WHATS_IN_THE_BOX] = tl;

		// -- 6
		cont = $('.s-whats-in-the-box---weights');
		items = cont.find('.specs-heading, .specs-p, .specs-item, .button-red').toArray();
		tl = gsap.timeline({ paused: true });
		tl.from(items, ANIM_DEFAULTS);
		ANIMATIONS[S_WEIGHTS] = tl;

		// -- 7
		cont = $('.s-whats-in-the-box---push-further');
		items = cont.find('.heading---invite-only, .specs-subheading, .specs-p, .carbon-training-programs, .tags-text-line, .button-red').toArray();
		tl = gsap.timeline({ paused: true });
		tl.from(items, ANIM_DEFAULTS);
		ANIMATIONS[S_PUSH_FURTHER] = tl;
	}

	// ***************************************** Logo video positioning ************************************************	

	function positionLogoVideo() {
		var BP_TABLET = 991;
		var ORIG_W = 1036;
		var ORIG_H = 1317;

		var carbonBg = document.getElementById('carbonBg');
		var container = carbonBg.parentNode;
		var logoOverlay = document.querySelector('.carbon-logo-overlay');

		// var video = logoOverlay.querySelector('.logovideo');
		// video.style.display = 'none';

		window.addEventListener('resize', onResize);
		onResize();
		setTimeout(onResize, 2000);// make sure it has worked

		function onResize() {

			var b = carbonBg.getBoundingClientRect();
			var bParent = container.getBoundingClientRect();

			// console.log(b);
			// console.log(bParent);

			var scDiff = bParent.width / b.width;
			var scaleX = (b.width / carbonBg.offsetWidth);
			var scaleOrig = b.width / ORIG_W;
			// console.log('scDiff: ', scDiff);
			// console.log('scaleX: ', scaleX);

			var TL = {};
			TL.x = -b.width + bParent.width;
			TL.y = -b.height + bParent.height;

			if (window.innerWidth <= BP_TABLET) {
				TL.x += (b.width - bParent.width) / 2;
			}

			var myCoords = {};
			myCoords.x = TL.x + 385 * scaleOrig;
			myCoords.y = TL.y + 388 * scaleOrig;
			myCoords.width = 266 * scaleOrig;
			myCoords.height = 474 * scaleOrig;

			// console.log(myCoords);

			var newCoords = {};
			newCoords.x = myCoords.x;
			newCoords.y = myCoords.y;
			newCoords.width = b.width * .5;
			newCoords.height = b.height * .5;

			logoOverlay.style.left = myCoords.x + 'px';
			logoOverlay.style.top = myCoords.y + 'px';
			logoOverlay.style.width = myCoords.width + 'px';
			logoOverlay.style.height = myCoords.height + 'px';
			// logoOverlay.style.backgroundColor = '#f00';

			logoOverlay.classList.remove('hidden');
		}
	};
});