/**
 * @module ui/group
 */

import './list.less';

import type {
	IControlTypeStrong,
	IUIButton,
	IUIElement,
	IUIGroup,
	IUIList,
	IViewBased,
	Nullable,
	ButtonsOption
} from 'jodit/types';
import { getStrongControlTypes } from 'jodit/core/ui/helpers/get-strong-control-types';
import { component, watch } from 'jodit/core/decorators';
import { UIGroup } from 'jodit/core/ui/group/group';
import { UISeparator } from 'jodit/core/ui/group/separator';
import { UISpacer } from 'jodit/core/ui/group/spacer';
import { UIButton } from 'jodit/core/ui/button/button/button';
import { isButtonGroup } from 'jodit/core/ui/helpers/buttons';
import { getControlType } from 'jodit/core/ui/helpers/get-control-type';
import { splitArray } from 'jodit/core/helpers/array/split-array';
import { Component } from 'jodit/core/component/component';

@component
export class UIList<T extends IViewBased = IViewBased>
	extends UIGroup<T>
	implements IUIList
{
	/** @override */
	override className(): string {
		return 'UIList';
	}

	override jodit!: T;

	mode: IUIList['mode'] = 'horizontal';

	@watch('mode')
	onChangeMode(): void {
		this.setMod('mode', this.mode);
	}

	constructor(jodit: T) {
		super(jodit);
		this.onChangeMode();
	}

	/**
	 * Make new group and append it in list of elements
	 */
	private makeGroup(): IUIGroup {
		return new UIGroup(this.jodit);
	}

	/**
	 * All buttons from list
	 */
	get buttons(): IUIButton[] {
		return this.allChildren.filter(elm =>
			Component.isInstanceOf(elm, UIButton)
		) as IUIButton[];
	}

	/**
	 * Helper for getting full plain button list
	 */
	getButtonsNames(): string[] {
		return this.buttons
			.map(a => (a instanceof UIButton && a.state.name) || '')
			.filter(a => a !== '');
	}

	protected removeButtons: string[] = [];

	setRemoveButtons(removeButtons?: string[]): this {
		this.removeButtons = removeButtons || [];
		return this;
	}

	build(items: ButtonsOption, target: Nullable<HTMLElement> = null): IUIList {
		items = splitArray(items);

		// console.log('item: ', items);

		// UI list 초기화
		// console.log('this.elements before clear: ', this.elements);
		this.clear();
		// console.log('this.elements after clear: ', this.elements);

		let lastBtnSeparator: boolean = false;

		let line = this.makeGroup();
		// console.log('line (new UIGroup): ', line);

		// console.log('this before append: ', this);
		this.append(line);
		line.setMod('line', true);

		// console.log('this after append: ', this);

		let group: IUIGroup;

		const addButton = (control: IControlTypeStrong): void => {
			let elm: Nullable<IUIElement> = null;

			switch (control.name) {
				case '\n':
					line = this.makeGroup();
					line.setMod('line', true);
					group = this.makeGroup();
					line.append(group);
					this.append(line);
					break;

				case '|':
					if (!lastBtnSeparator) {
						lastBtnSeparator = true;
						elm = new UISeparator(this.j);
					}
					break;

				case '---': {
					group.setMod('before-spacer', true);

					const space = new UISpacer(this.j);
					line.append(space);

					group = this.makeGroup();
					line.append(group);
					lastBtnSeparator = false;

					break;
				}

				default:
					// console.log('');
					// console.log(
					// 	' ---------------',
					// 	control.name,
					// 	'--------------- '
					// );
					lastBtnSeparator = false;
					elm = this.makeButton(control, target);

					// media버튼인 경우 media Mod 추가 (isMedia는 각 플러그인 config에서 적용)
					if (control.isMedia) elm.setMod('media', true);
			}

			if (elm) {
				if (!group) {
					group = this.makeGroup();
					line.append(group);
				}

				group.append(elm);
			}
		};

		const isNotRemoved = (b: IControlTypeStrong): boolean =>
			!this.removeButtons.includes(b.name);

		items.forEach(item => {
			if (isButtonGroup(item)) {
				// console.log('isButtonGroup(item) && item: ', item);
				const buttons = item.buttons.filter(b => b);

				if (buttons.length) {
					group = this.makeGroup();
					group.setMod('separated', true).setMod('group', item.group);

					line.append(group);

					getStrongControlTypes(buttons, this.j.o.controls)
						.filter(isNotRemoved)
						.forEach(addButton);
				}
			} else {
				// console.log('item: ', item);
				if (!group) {
					group = this.makeGroup();
					line.append(group);
				}

				const control = getControlType(item, this.j.o.controls);
				isNotRemoved(control) && addButton(control);
			}
		});

		this.update();

		return this;
	}

	/**
	 * Create button instance
	 */
	protected makeButton(
		control: IControlTypeStrong,
		target: Nullable<HTMLElement>
	): IUIButton {
		// console.log('::: makeButton ::: ');
		return new UIButton(this.j);
	}
}