/**
 * Homepage products: wheel over the products area drives horizontal scroll.
 * Page vertical scroll remains enabled everywhere else.
 */
( function () {
	'use strict';

	var section = document.getElementById( 'newarrivalproducts-section' );
	if ( ! section || ! document.body.classList.contains( 'hbs-home-products' ) ) {
		return;
	}

	var viewport = section.querySelector( '.hbs-na-products-viewport' );
	var track = section.querySelector( '.hbs-na-products-track' );
	if ( ! viewport || ! track ) {
		return;
	}

	var originalItems = Array.prototype.slice.call( track.children );
	var originalCount = originalItems.length;

	if ( originalCount < 1 ) {
		return;
	}

	var prefersReducedMotion = window.matchMedia( '(prefers-reduced-motion: reduce)' ).matches;
	var scrollEase = prefersReducedMotion ? 1 : 0.14;
	var wheelMultiplier = prefersReducedMotion ? 1 : 0.85;

	originalItems.forEach( function ( item, index ) {
		item.dataset.hbsNaIndex = String( index );
	} );

	for ( var clonePass = 0; clonePass < 2; clonePass++ ) {
		originalItems.forEach( function ( item ) {
			var clone = item.cloneNode( true );
			clone.setAttribute( 'aria-hidden', 'true' );
			clone.classList.add( 'hbs-na-float-item--clone' );
			var link = clone.querySelector( 'a' );
			if ( link ) {
				link.setAttribute( 'tabindex', '-1' );
			}
			track.appendChild( clone );
		} );
	}

	var currentOffset = 0;
	var targetOffset = 0;
	var setWidth = 0;
	var resizeObserver;
	var animationFrame = 0;

	function getSetWidth() {
		var width = 0;
		var index;

		for ( index = 0; index < originalCount; index++ ) {
			width += track.children[ index ].getBoundingClientRect().width;
		}

		return width;
	}

	function applyTransform( value ) {
		track.style.transform = 'translate3d(' + ( -value ) + 'px, 0, 0)';
	}

	function normalizePair() {
		if ( setWidth <= 0 ) {
			return;
		}

		while ( targetOffset >= setWidth * 2 ) {
			targetOffset -= setWidth;
			currentOffset -= setWidth;
		}

		while ( targetOffset < setWidth ) {
			targetOffset += setWidth;
			currentOffset += setWidth;
		}
	}

	function measure() {
		setWidth = getSetWidth();

		if ( setWidth <= 0 ) {
			return;
		}

		if ( currentOffset < setWidth || currentOffset >= setWidth * 2 ) {
			currentOffset = setWidth;
		}

		if ( targetOffset < setWidth || targetOffset >= setWidth * 2 ) {
			targetOffset = setWidth;
		}

		normalizePair();
		applyTransform( currentOffset );
	}

	function animateScroll() {
		normalizePair();

		var distance = targetOffset - currentOffset;

		if ( Math.abs( distance ) < 0.35 ) {
			currentOffset = targetOffset;
			applyTransform( currentOffset );
			animationFrame = 0;
			return;
		}

		currentOffset += distance * scrollEase;
		applyTransform( currentOffset );
		animationFrame = window.requestAnimationFrame( animateScroll );
	}

	function startAnimation() {
		if ( animationFrame ) {
			return;
		}

		animationFrame = window.requestAnimationFrame( animateScroll );
	}

	function onWheel( event ) {
		if ( document.body.classList.contains( 'showing-menu-modal' ) ) {
			return;
		}

		if ( event.target.closest( '.hbs-sidebar-panel, .menu-modal' ) ) {
			return;
		}

		// Only hijack wheel when the pointer is over the products carousel.
		if ( ! viewport.contains( event.target ) ) {
			return;
		}

		event.preventDefault();

		var delta = event.deltaY;

		if ( Math.abs( event.deltaX ) > Math.abs( delta ) ) {
			delta = event.deltaX;
		}

		targetOffset += delta * wheelMultiplier;
		normalizePair();

		if ( prefersReducedMotion ) {
			currentOffset = targetOffset;
			applyTransform( currentOffset );
			return;
		}

		startAnimation();
	}

	track.style.willChange = 'transform';

	measure();

	if ( 'ResizeObserver' in window ) {
		resizeObserver = new ResizeObserver( measure );
		resizeObserver.observe( viewport );
	} else {
		window.addEventListener( 'resize', measure );
	}

	viewport.addEventListener( 'wheel', onWheel, { passive: false } );
}() );
