'use strict';

( function( $ ) {
	// Reorder
	$( '.tabs_reorder #the-list' ).sortable( {
		items: 'tr',
		axis: 'y',
		update() {
			$.post( ajaxurl, {
				action: 'wpt_update_post_order',
				order: $( '.tabs_reorder #the-list' ).sortable( 'serialize' ),
			} ).done( function( response ) {
				if ( true === response.success ) {
					const message = response.data.message;
					$( '#reorder-output' ).hide().text( message ).fadeIn().delay( 2000 ).fadeOut();
				}
			} );
		},
	} );

	//Tab repeater
	$( '#product_tabs .add-new-tab' ).click( function( event ) {
		event.preventDefault();
		let value = parseInt( document.getElementById( 'count' ).value );
		value = isNaN( value ) ? 1 : value;
		value++;
		document.getElementById( 'count' ).value = value;
		const titleId = 'newtab_title_' + value;
		const contentId = 'newtab_content_' + value;
		const icon = 'newtab_icon_' + value;
		$( '.tabs-layout' ).children( 'p' ).each( function() {
			$( this ).clone().insertBefore( '.tabs-layout' ).removeClass( 'hidden' ).addClass( 'new-tab-product' ).attr( 'data-row', 'content_' + value );
		} ).promise().done( function() {
			//Title
			$( '.new-tab-product' ).find( 'input' ).each( function() {
				if ( $( this ).is( 'input[name="hidden_duplicate_title"]' ) ) {
					$( this ).attr( 'name', '_wpt_newtab[' + value + '][title]' ).attr( 'id', titleId ).attr( 'required', '' ).parents( 'p' ).addClass( titleId + '_field' ).removeClass( 'hidden_duplicate_title_field' ).find( 'label' ).removeAttr( 'for' ).attr( 'for', titleId + '_field' );
				}
			} );

			//Content
			$( '.new-tab-product' ).find( 'textarea' ).each( function() {
				if ( $( this ).is( 'textarea[name="hidden_duplicate_content"]' ) ) {
					$( this ).attr( 'name', '_wpt_newtab[' + value + '][content]' ).attr( 'id', contentId ).parents( 'p' ).addClass( contentId + '_field' ).removeClass( 'hidden_duplicate_content_field' ).find( 'label' ).removeAttr( 'for' ).attr( 'for', contentId + '_field' );
				}
			} );

			//Icon
			$( '.new-tab-product' ).find( '.icon-div' ).each( function() {
				$( this ).removeClass( 'icon-div' ).addClass( 'tab_icon' ).parents( 'p' ).addClass( 'icon-wrap' ).append( '<input class="input-icon" type="hidden" name="_wpt_newtab[' + value + '][icon]" id="' + icon + '" value=""><div class="icon-output"></div>' );
			} );
			$( '.remove_product_tab' ).removeClass( 'hidden' );
			$( '.tab_icon' ).removeClass( 'hidden' );
			woocommerceProductTabEditor( contentId );
		} );
	} );

	//Icon popup
	$( '#product_tabs' ).on( 'click', '.tab_icon', function( e ) {
		e.preventDefault();
		$( '#wpt-modal' ).show();
		$( '.tab_icon' ).removeClass( 'input-model' );
		$( this ).addClass( 'input-model' );
	} );
	$( '.icon-wrap' ).on( 'click', '.tab_icon', function( e ) {
		e.preventDefault();
		$( '#wpt-modal' ).show();
		$( '.tab_icon' ).removeClass( 'input-model' );
		$( this ).addClass( 'input-model' );
	} );
	$( '.close' ).on( 'click', function() {
		$( '#wpt-modal' ).hide();
		$( '#wpt_search_icon' ).val( '' );
		$( '.icon-list-wrap li' ).show();
	} );
	$( window ).on( 'click', function( e ) {
		if ( e.target.id === 'wpt-modal' ) {
			$( '#wpt-modal' ).hide();
			$( '#wpt_search_icon' ).val( '' );
			$( '.icon-list-wrap li' ).show();
		}
	} );

	// Remove tab
	$( '#product_tabs' ).on( 'click', '.remove_product_tab', function( e ) {
		e.preventDefault();
		const val = $( this ).parent( 'p' ).attr( 'data-row' );
		$( '#product_tabs p[data-row="' + val + '"]' ).remove();
	} );

	//Select Icon
	$( '.wpt-font-wrap' ).on( 'click', '.select-icon', function( e ) {
		e.preventDefault();
		const icon = $( this ).find( 'i' );
		const iconName = icon.attr( 'class' );

		//Repeater tab add icon
		$( '.input-model' ).parents( 'p' ).find( 'input' ).val( iconName ).nextAll( '.icon-output' ).html( '<i class="' + iconName + '"></i><a href="#" class="icon-remove">Remove</a>' );

		//Add icon tab & setting
		$( '.input-model' ).parents( '.icon-wrap' ).find( 'input' ).val( iconName ).nextAll( '.icon-output' ).html( '<i class="' + iconName + '"></i><a href="#" class="icon-remove">Remove</a>' );
		$( '#wpt-modal' ).hide();
		$( '#wpt_search_icon' ).val( '' );
		$( '.icon-list-wrap li' ).show();
	} );

	//Repeater tab remove icon
	$( '#product_tabs' ).on( 'click', '.icon-remove', function( e ) {
		e.preventDefault();
		$( this ).parents( '.new-tab-product' ).find( '.input-icon' ).val( '' );
		$( this ).parents( '.new-tab-product' ).find( '.icon-output' ).html( '' );
	} );

	//Remove icon tab & setting
	$( '.icon-wrap' ).on( 'click', '.icon-remove', function( e ) {
		e.preventDefault();
		$( this ).parents( '.icon-wrap' ).find( '.input-icon' ).val( '' );
		$( this ).parents( '.icon-wrap' ).find( '.icon-output' ).html( '' );
	} );

	//Search icon
	$( '#wpt_search_icon' ).on( 'keyup', function() {
		SearchData( '#wpt_search_icon' );
	} );

	//Search product
	$( '#wpt_search_product' ).on( 'keyup', function() {
		SearchData( '#wpt_search_product' );
	} );
	function SearchData( input ) {
		let a, i, txtValue;
		const filter = $( input ).val().toUpperCase();
		const li = $( input ).parents( '.inside' ).find( '.icon-list-wrap li' );
		for ( i = 0; i < li.length; i++ ) {
			a = li[ i ].getElementsByTagName( 'i' )[ 0 ];
			if ( a === null ) {
				a = li[ i ].getElementsByTagName( 'label' )[ 0 ];
				txtValue = a.innerHTML;
			} else {
				txtValue = a.getAttribute( 'data-icon' );
			}
			if ( txtValue.toUpperCase().indexOf( filter ) > -1 ) {
				li[ i ].style.display = '';
			} else {
				li[ i ].style.display = 'none';
			}
		}
	}
	function woocommerceProductTabEditor( contentId ) {
		const settings = {
			mediaButtons: true,
			tinymce: {
				branding: false,
				theme: 'modern',
				skin: 'lightgray',
				language: 'en',
				formats: {
					alignleft: [ {
						selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li',
						styles: {
							textAlign: 'left',
						},
					}, {
						selector: 'img,table,dl.wp-caption',
						classes: 'alignleft',
					} ],
					aligncenter: [ {
						selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li',
						styles: {
							textAlign: 'center',
						},
					}, {
						selector: 'img,table,dl.wp-caption',
						classes: 'aligncenter',
					} ],
					alignright: [ {
						selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li',
						styles: {
							textAlign: 'right',
						},
					}, {
						selector: 'img,table,dl.wp-caption',
						classes: 'alignright',
					} ],
					strikethrough: {
						inline: 'del',
					},
				},
				relative_urls: false,
				remove_script_host: false,
				convert_urls: false,
				browser_spellcheck: true,
				fix_list_elements: true,
				entities: '38,amp,60,lt,62,gt',
				entity_encoding: 'raw',
				keep_styles: false,
				paste_webkit_styles: 'font-weight font-style color',
				preview_styles: 'font-family font-size font-weight font-style text-decoration text-transform',
				end_container_on_empty_block: true,
				wpeditimage_disable_captions: false,
				wpeditimage_html5_captions: true,
				plugins: 'charmap,colorpicker,hr,lists,media,paste,tabfocus,textcolor,fullscreen,wordpress,wpautoresize,wpeditimage,wpemoji,wpgallery,wplink,wpdialogs,wptextpattern,wpview',
				menubar: false,
				wpautop: true,
				indent: false,
				resize: true,
				theme_advanced_resizing: true,
				theme_advanced_resize_horizontal: false,
				statusbar: true,
				toolbar1: 'formatselect,bold,italic,bullist,numlist,blockquote,alignleft,aligncenter,alignright,link,wp_more,fullscreen,wp_adv',
				toolbar2: 'strikethrough,hr,forecolor,pastetext,removeformat,charmap,outdent,indent,undo,redo,wp_help',
				toolbar3: '',
				toolbar4: '',
				tabfocus_elements: ':prev,:next',
			},
			quicktags: {
				buttons: 'strong,em,link,block,del,ins,img,ul,ol,li,code,more,close',
			},
		};
		wp.editor.initialize( contentId, settings );
	}

	//Accordion
	const acc = document.getElementsByClassName( 'wpt_accordion' );
	if ( acc ) {
		let i;
		for ( i = 0; i < acc.length; i++ ) {
			acc[ i ].addEventListener( 'click', function() {
				this.classList.toggle( 'active' );
				const panel = this.nextElementSibling;
				if ( panel.style.display === 'block' ) {
					panel.style.display = 'none';
				} else {
					panel.style.display = 'block';
				}
			} );
		}
	}

	// Tabs Start.
	// Change tab class and display content
	$( '.tabs-nav a' ).on( 'click', function( event ) {
		event.preventDefault();
		$( '.tab-active' ).removeClass( 'tab-active' );
		$( this ).parent().addClass( 'tab-active' );
		$( '.tabs-stage .tab-ui-sortable' ).hide();
		$( $( this ).attr( 'href' ) ).show();
	} );
	$( '.tabs-nav a:first' ).trigger( 'click' );
	// Tabs end.

	$( '.form-table' ).find( 'td' ).each( function() {
		const field = $( this ).find( 'input' ).attr( 'id' );
		$( this ).parent().addClass( field );
	} );

	// Accordion windows size
	if ( $( '#enable_accordion' ).is( ':checked' ) ) {
		$( '.accordion_shown_size' ).show();
	}
	$( '#enable_accordion' ).change( function() {
		if ( this.checked ) {
			$( this ).parents( '.enable_accordion' ).next( '.accordion_shown_size' ).show();
		} else {
			$( this ).parents( '.enable_accordion' ).next( '.accordion_shown_size' ).hide();
		}
	} );
}( jQuery ) );
