(function ( $ ) {
	'use strict';
	qodefCore.shortcodes.ginevra_core_horizontal_showcase = {};

	$( document ).ready(
		function () {
			qodefCustomHorizontalSlider.init();
		}
	);

	$( window ).on(
		'resize',
		function () {
			qodefCustomHorizontalSlider.init();
		}
	);

	var qodefCustomHorizontalSlider = {
		currentHolder: '',
		currentScrollBackHolder: '',
		nextScrollHolder: '',
		scrollBackAppearAfter: 10,
		init: function () {
			var holder = $( '.qodef-custom-horizontal-slider' );

			if ( qodef.windowWidth > 768 ) {
				if ( holder.length ) {
					holder.each( function () {
						qodefCustomHorizontalSlider.currentHolder           = $( this );
						qodefCustomHorizontalSlider.currentScrollBackHolder = $( this ).find( '.qodef-scroll-back' );
						qodefCustomHorizontalSlider.nextScrollHolder        = $( this ).find( '.next-slide' );
						qodefCustomHorizontalSlider.initItem( $( this ) );
						qodefCustomHorizontalSlider.animateSlider( $( this ) );
					} );
				}
			}
		},

		initItem: function ( $currentItem ) {

			qodefCore.qodefIsInViewport.check(
				$currentItem,
				function () {
					$currentItem.addClass( 'qodef--appeared' );
				}
			);
		},

		animateSlider: function ( $thisHolder ) {
			var $itemsHolder         = $thisHolder.find( '.qodef-slides-holder' ),
				$items               = $itemsHolder.find( '.qodef-e' ),
				scrollItemOffset     = 50,
				scrollInitItemOffset = 50;

			var Scrollbar = window.Scrollbar;

			Scrollbar.use( HorizontalScrollPlugin );
			Scrollbar.use( window.OverscrollPlugin );

			var myScrollbar = Scrollbar.init(
				document.querySelector( '.qodef-custom-horizontal-slider .qodef-slides-holder' ),
				{
					damping: 0.05,
					plugins: {
						overscroll: {
							damping: 0.1,
							maxOverscroll: 0
						}
					}
				}
			);

			setTimeout(
				function () {
					var $itemWidth = $items.width();

					$items.each( function ( i ) {
						var thisOffsetLeft = $itemWidth * (i + 1);
						$( this ).attr(
							'data-offset-left',
							thisOffsetLeft
						);
						$( this ).data(
							'offset-left',
							thisOffsetLeft
						);
					} );
				},
				10
			);

			$items.each( function ( i ) {
				var thisItem = $( this );
				if ( qodef.windowWidth / 2 + scrollInitItemOffset > $( this ).data( 'offset-left' ) ) {
					setTimeout(
						function () {
							thisItem.addClass( 'qodef--appear' );
						},
						i * 200
					);
				}
			} );

			myScrollbar.addListener( function ( status ) {
				var scrollbarOffset = this.offset.x,
					windowOffset    = qodef.windowWidth / 2 - scrollItemOffset;

				if ( status.offset.x >= qodefCustomHorizontalSlider.scrollBackAppearAfter && ! qodefCustomHorizontalSlider.currentScrollBackHolder.hasClass( 'qodef-appear' ) ) {
					qodefCustomHorizontalSlider.currentScrollBackHolder.addClass( 'qodef-appear' );
				}

				if ( status.offset.x < qodefCustomHorizontalSlider.scrollBackAppearAfter && qodefCustomHorizontalSlider.currentScrollBackHolder.hasClass( 'qodef-appear' ) ) {
					qodefCustomHorizontalSlider.currentScrollBackHolder.removeClass( 'qodef-appear' );
				}

				$items.each( function () {
					if ( scrollbarOffset + windowOffset > $( this ).prev().data( 'offset-left' ) ) {
						$( this ).addClass( 'qodef--appear' );
					}
				} );

                var initialItem = $('.qodef-e-item.qodef-horizontal-slide.intro'),
					widget = $('.qodef-widget-holder'),
					menuOpener = $('.qodef-opener-icon'),
					featured = $('.qodef-item-featured'),
					featuredWidth;

                if(featured.length) {
                    featuredWidth = featured.width();
                } else {
                    featuredWidth = 0;
                }

                if(status.offset.x > (initialItem.width() - ( featuredWidth + scrollInitItemOffset))) {
                	if(menuOpener.length) {
                		$('body').find(menuOpener).css('opacity', '0');
					}

                    if(widget.length) {
                        $('body').find(widget).css('opacity', '0');
                    }
				} else if (status.offset.x < (initialItem.width() - ( featuredWidth + scrollInitItemOffset))) {
                    if(menuOpener.length) {
                        $('body').find(menuOpener).css('opacity', '1');
                    }

                    if(widget.length) {
                        $('body').find(widget).css('opacity', '1');
                    }
				}

				//hide whole header when first intro slide ends
                if(status.offset.x > initialItem.width()) {
                    $('body').find('#qodef-page-header').css('opacity', '0');
                } else {
                    $('body').find('#qodef-page-header').css('opacity', '1');
                }

                //hide mobile header for smalller devices
                if(qodef.windowWidth < 1025 && status.offset.x > 1) {
                	$('body').find('#qodef-page-mobile-header').css('display', 'none')
				} else if(qodef.windowWidth < 1025 && status.offset.x < 1) {
                    $('body').find('#qodef-page-mobile-header').css('display', 'block')
				}
			} );

			if ( qodefCustomHorizontalSlider.currentScrollBackHolder.length ) {
				qodefCustomHorizontalSlider.currentScrollBackHolder.bind(
					'click',
					function () {
						myScrollbar.scrollTo(
							0,
							0,
							1500
						);
					}
				);
			}

			if ( qodefCustomHorizontalSlider.nextScrollHolder.length ) {
				qodefCustomHorizontalSlider.nextScrollHolder.bind(
					'click',
					function () {
						myScrollbar.scrollTo(
							2450,
							0,
							1500
						);
					}
				);
			}
		},
	};

	qodefCore.shortcodes.ginevra_core_horizontal_showcase.qodefCustomHorizontalSlider = qodefCustomHorizontalSlider;

})( jQuery );