/**
 * @license Copyright (c) 2017-2025, CKSource Holding sp. z o.o. All rights reserved.
 * For licensing, see LICENSE.md.
 */

import $ from 'jquery';

export function enableFiltering() {
	const storagePrefix = 'filtering:props:';
	const filterStorageKeys = {
		public: storagePrefix + 'public',
		inherited: storagePrefix + 'inherited',
		internal: storagePrefix + 'internal',
		protected: storagePrefix + 'protected',
		private: storagePrefix + 'private',
		deprecated: storagePrefix + 'deprecated',
		tree: 'filtering:tree'
	};

	enablePropertiesFiltering();
	enableTreeFiltering();

	function enablePropertiesFiltering() {
		$( '.api-props-filter input' )
			.on( 'change', applyFilterConfig )
			.on( 'change', saveFilterSetting );

		function getFilterConfig() {
			return $( '.api-props-filter input' ).map( function( index, domInput ) {
				if ( domInput.checked ) {
					return $( domInput ).val();
				}
			} );
		}

		function applyFilterConfig() {
			const cfg = getFilterConfig().toArray();
			const visibleClass = 'collapsing-list__item--visible';
			const hiddenLoadingClass = 'hidden-loading';
			const emptyClass = 'collapsing-list--empty';
			const firstItemClass = 'collapsing-list__item--first';
			const dropdownHiddenClass = 'api-subheader__navigation-dropdown--hidden';

			$( '.loading' ).addClass( hiddenLoadingClass );
			$( `.main__content--api .${ hiddenLoadingClass }:not(.loading)` ).removeClass( hiddenLoadingClass );

			$( `.collapsing-list__item.${ visibleClass }` ).removeClass( `${ visibleClass } ${ firstItemClass }` );
			$( '.collapsing-list' ).removeClass( emptyClass );

			$( '.collapsing-list__item' ).each( function() {
				const data = $( this ).data();

				for ( const key in data ) {
					if ( Object.prototype.hasOwnProperty.call( data, key ) && data[ key ] === true && cfg.indexOf( key ) === -1 ) {
						return;
					}
				}

				$( this ).addClass( visibleClass );
			} );

			$( '.collapsing-list' ).filter( function() {
				return $( this ).children( ':visible' ).length === 0;
			} ).each( function() {
				$( this ).addClass( emptyClass );
			} );

			$( '.collapsing-list' ).each( function() {
				$( this ).children( ':visible' ).first().addClass( firstItemClass );
			} );

			$( `.api-subheader__navigation-dropdown > li.${ dropdownHiddenClass }` ).removeClass( dropdownHiddenClass );
			$( '.api-subheader__navigation-dropdown > li' ).each( function() {
				const data = $( this ).data();
				for ( const key in data ) {
					if ( Object.prototype.hasOwnProperty.call( data, key ) && data[ key ] === true && cfg.indexOf( key ) === -1 ) {
						$( this ).addClass( dropdownHiddenClass );
					}
				}
			} );

			// Refresh dropdown classes and visibility
			window.umberto.updateDropdowns();
		}

		function saveFilterSetting() {
			const type = $( this ).val();
			const checked = $( this ).prop( 'checked' );

			window.localStorage.setItem( filterStorageKeys[ type ], checked );
		}

		function applySavedFilterSettings() {
			$( '.api-props-filter input' ).each( function() {
				const type = $( this ).val();
				const stored = window.localStorage.getItem( filterStorageKeys[ type ] );

				if ( stored !== null ) {
					$( this ).prop( 'checked', JSON.parse( stored ) );
				}
			} );
		}

		applySavedFilterSettings();
		applyFilterConfig();
	}

	function enableTreeFiltering() {
		const input = $( '.api-tree__filter input' );
		const showPrivateClass = 'api-tree--show-private';
		const tree = $( '.api-tree' );
		const stored = window.localStorage.getItem( filterStorageKeys.tree );

		if ( input && input.length === 0 ) {
			return;
		}

		input
			.on( 'change', applyTreeFilter )
			.on( 'change', function() {
				const checked = $( this ).prop( 'checked' );
				window.localStorage.setItem( filterStorageKeys.tree, checked );
			} );

		function applyTreeFilter() {
			if ( input.get( 0 ).checked ) {
				tree.addClass( showPrivateClass );
			} else {
				tree.removeClass( showPrivateClass );
			}
		}

		if ( stored !== null ) {
			input.prop( 'checked', JSON.parse( stored ) );
		}

		applyTreeFilter();
	}
}
