$ = jQuery.noConflict();

(function($){
	$(".owl-carousel").owlCarousel({
		items: 1, 
		autoplay : false, 
		smartSpeed : 300,
		fluidSpeed : 300,
		autoplaySpeed : 300,
		navSpeed : 300,
		dotsSpeed : 300,		
		//loop : true,
		center: true,
		nav : true,
		navText : ['<i class="fa fa-chevron-left fa-lg" aria-hidden="true"></i>','<i class="fa fa-chevron-right fa-lg" aria-hidden="true"></i>'],
		dots : true,
		responsiveRefreshRate : 200,
		slideBy : 1,
		mergeFit : true,
		mouseDrag : true,
		touchDrag : true
	});
	
	dot_number = 0;
	
	$( '.my-owl-theme .owl-theme .owl-dots .owl-dot span' ).each(
		function(){
			$( this ).append( dot_number );
			
			dot_number++;
		}
	);
	
	//$( '.with-scroll-bar' ).mCustomScrollbar({
	//	theme: "dark-3"
	//});
	
	$( '.content-slide .content > p:last-child' ).each(
		function(){
			value	= $( this ).text().split( ':' );
			value	= value[1].toLowerCase();
			
			$( this ).parent().closest( '.item' ).attr( 'data-value', value );
		}
	);
	
	$( 'body' ).on( 'click', '#go-search', 
		function(){
			//timeout = null;
			
			search	= $( '#search' ).val().toLowerCase();
			
			if( search.length >= 3 ){
				//clearTimeout( timeout );
				
				//timeout = setTimeout(function() {
					value = $( '#search-value .item[data-value*="' + search + '"]' );
					
					if( value.index() > -1 ){
						$( '#search-value .owl-item' ).removeClass( 'active' );
						
						slide = value.parent( '.owl-item' ).index();
						
						//USE IF LOOP is TRUE
						//slide = slide - 50;
						
						$( '.owl-carousel' ).trigger( 'to.owl.carousel', [slide, 1]);
						
						widht_scroll = $( '.owl-dots' ).width();
						widht_scroll = widht_scroll / 2;
						
						scroll_to_left( '.owl-dot.active', widht_scroll );
						
						path = 'plugin/dreambook/inc/get-dream-api.php';
						
						$.ajax({
							url: path,
							data: 'action=get-dreams&keywords=' + search, 
							beforeSend: function() {
								$( 'body' ).append( '<div id="loading"><div><i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i></div></div>' );
							},						
							success: function (response) {
								$( '#search-value .owl-item.active .content-slide .content .find-dreams' ).remove();
								
								$( '#search-value .owl-item.active .content-slide .content > p:first-child' ).append( response );
								
								$( '#loading' ).remove();
							},
							error: function(){
								//alert( 'Pencarian tidak di temukan ...' );
								
								$( '#loading' ).remove();
							}
						});									
					}
					
					else {
						alert( 'Pencarian tidak di temukan ...' );
					}
				//}, 700 );
			}
			
			return false;
			
			/*
			$( '.order-list-product ul > li' ).filter(
				function(){
					state	= $( this ).text().toLowerCase().indexOf( search ) > -1;
					
					$( this ).toggle( state );
				}
			);
			*/
		}
	);
	
	first_dot 	= $( '.owl-dots > .owl-dot:first-child' ).addClass( 'start' );
	count		= $( '.owl-dot.start' ).index();
	limit		= 8;
	
	total_dots	= $( '.owl-dots > button' ).length;

	html = '<div class="dot-nav"><button id="dot-prev" class=""><i class="fa fa-chevron-left" aria-hidden="true"></i></button><button id="dot-next" class=""><i class="fa fa-chevron-right" aria-hidden="true"></i></button></div>';
	
	$( '#search-value' ).append( html );
	
	btn_prev	= $( '#dot-prev' );
	btn_next	= $( '#dot-next' );
	
	if( count == 0 ){
		btn_prev.attr( 'disabled', true );
		
		//return false;
	}
	
	if( count >= total_dots ){
		btn_next.attr( 'disabled', true );
		
		//return false;
	}
	
	$( 'body' ).on( 'click', '#dot-next', 
		function(){
			count += limit;
			
			if( count >= 0 && count <= total_dots ){			
				active_dot = $( '.owl-dots' ).find( '.owl-dot.start' );
				
				active_dot.removeClass( 'start' );
				$( '.owl-dot' ).eq( count ).addClass( 'start' );
				
				/*
				$( '.owl-dots' ).stop().animate({
					scrollLeft: $( '.owl-dot.start' ).offset().left + $( '.owl-dots' ).scrollLeft()
				}, 400);
				*/

				$( '.owl-dots' ).animate({
					scrollLeft: $( '.owl-dot.start' ).position().left + 6 + $( '.owl-dots' ).scrollLeft()
				}, 'slow');				
				
				btn_prev.attr( 'disabled', false );
			}
			
			if( count >= ( total_dots - 4 ) ){
				btn_next.attr( 'disabled', true );
			}
			
			else {
				btn_next.attr( 'disabled', false );
			}
			
			return false;
		}
	);
	
	$( 'body' ).on( 'click', '#dot-prev', 
		function(){
			count -= limit;

			if( count >= 0 && count <= total_dots ){	
				active_dot = $( '.owl-dots' ).find( '.owl-dot.start' );
				
				active_dot.removeClass( 'start' );
				$( '.owl-dot' ).eq( count ).addClass( 'start' );
				
				/*
				$( '.owl-dots' ).stop().animate({
					scrollLeft: $( '.owl-dot.start' ).offset().left + $( '.owl-dots' ).scrollLeft()
				}, 400);
				*/
				
				if( count <= 0 ){
					$( '.owl-dots' ).animate({
						scrollLeft: $( '.owl-dot.start' ).position().left + 0 + $( '.owl-dots' ).scrollLeft()
					}, 'slow');
				}
				
				else {
					$( '.owl-dots' ).animate({
						scrollLeft: $( '.owl-dot.start' ).position().left + 6 + $( '.owl-dots' ).scrollLeft()
					}, 'slow');				
				}
				
				btn_next.attr( 'disabled', false );
			}
			
			if( count <= 0 ){
				btn_prev.attr( 'disabled', true );
			}
			
			else {
				btn_prev.attr( 'disabled', false );
			}			
		}
	);	
	
	function scrollTo( index ){
		sections = $( '.owl-dot' );
		
		$( '.owl-dots' ).animate({
			scrollLeft: sections.eq( index ).offset().left
		}, 400);		
	}
	
	function scroll_to_left( element_class, removed_width ) {
		scroll_to = $( element_class ).offset().left - removed_width;
		
		if( $(window).scrollLeft() != scroll_to ) {
			$( '.owl-dots' ).stop().animate( {scrollLeft: scroll_to}, 400 );
		}
	}	
	
})(jQuery);