/**
 * @module plugins/mobile
 */

import { Config } from 'jodit/config';
import * as consts from 'jodit/core/constants';
import type {
	CanUndef,
	IControlType,
	IJodit,
	IToolbarCollection
} from 'jodit/types';
import { makeCollection } from 'jodit/modules/toolbar/factory';
import { splitArray } from 'jodit/core/helpers';
import { ToolbarCollection } from 'jodit/modules/toolbar/collection/collection';

declare module 'jodit/config' {
	interface Config {
		/**
		 * Mobile timeout for CLICK emulation
		 */
		mobileTapTimeout: number;

		/**
		 * After resize it will change buttons set for different sizes
		 */
		toolbarAdaptive: boolean;
	}
}

Config.prototype.mobileTapTimeout = 300;
Config.prototype.toolbarAdaptive = true;

Config.prototype.controls.dots = {
	mode: consts.MODE_SOURCE + consts.MODE_WYSIWYG,
	popup: (
		editor: IJodit,
		current: false | Node,
		control: IControlType,
		close,
		button
	) => {
		let store:
			| {
					toolbar: IToolbarCollection;
					rebuild: () => void;
			  }
			| undefined = control.data as any;

		if (store === undefined) {
			store = {
				toolbar: makeCollection(editor),
				rebuild: (): void => {
					if (button) {
						const buttons: CanUndef<Array<string | IControlType>> =
							editor.e.fire(
								'getDiffButtons.mobile',
								button.closest(ToolbarCollection)
							);

						if (buttons && store) {
							store.toolbar.build(splitArray(buttons));

							const w =
								editor.toolbar.firstButton?.container
									.offsetWidth || 36;

							store.toolbar.container.style.width =
								(w + 4) * 3 + 'px';
						}
					}
				}
			};

			control.data = store;
		}

		store.rebuild();

		return store.toolbar;
	},
	tooltip: 'Show all'
} as IControlType;