import { __ID__, filePath } from "../consts.mjs";
import { key as customStatusIconsKey } from "../tweaks/customStatusIcons.mjs";

const { HandlebarsApplicationMixin, ApplicationV2 } = foundry.applications.api;
const { SettingsConfig } = foundry.applications.settings;

export class StatusEffectIconConfig extends HandlebarsApplicationMixin(ApplicationV2) {
	// #region Options
	static DEFAULT_OPTIONS = {
		tag: `form`,
		classes: [
			__ID__,
			`StatusEffectIconConfig`,
		],
		window: {
			title: `OFT.apps.StatusEffectIconConfig.title`,
		},
		position: {
			width: 550,
		},
		form: {
			handler: this.#onSubmit,
			closeOnSubmit: true,
			submitOnChange: false,
		},
		actions: {
			pickViaImageTagger: this.#pickViaImageTagger,
			removeOverride: this.#removeOverride,
		},
	};

	static PARTS = {
		list: {
			template: filePath(`templates/StatusEffectIconConfig/effects.hbs`),
			scrollable: [``],
		},
		footer: {
			template: filePath(`templates/StatusEffectIconConfig/footer.hbs`),
		},
	};
	// #endregion Options

	// #region Instance Data
	#overrides = null;
	#originalOverrides = null;
	// #endregion Instance Data

	// #region Lifecycle
	async _onRender() {
		const pickers = this.element.querySelectorAll(`file-picker`);
		for (const picker of pickers) {
			picker.addEventListener(`change`, this.#onChangeFilePicker.bind(this));
		};
	};
	// #endregion Lifecycle

	// #region Data Prep
	_prepareContext() {
		const ctx = {
			meta: {
				idp: this.id,
			},
			showImageTaggerButton: game.modules.get(`image-tagger`)?.active ?? false,
		};

		const effects = Object.values(CONFIG.statusEffects);

		this.#overrides ??= game.settings.get(__ID__, customStatusIconsKey);
		this.#originalOverrides ??= foundry.utils.deepClone(this.#overrides);

		ctx.effects = [];
		for (const effect of effects) {

			let preview = this.#overrides[effect.id] ?? effect.img;
			if (
				this.#originalOverrides[effect.id] != null
				&& this.#overrides[effect.id] === null
			) {
				preview = null;
			}

			ctx.effects.push({
				id: effect.id,
				preview,
				name: game.i18n.localize(effect.name),
				img: this.#overrides[effect.id],
				hasOverride: this.#overrides[effect.id] != null,
			});
		};

		return ctx;
	};
	// #endregion Data Prep

	// #region Event Listeners
	async #onChangeFilePicker(event) {
		const target = event.currentTarget;
		const id = target.closest(`[data-effect-id]`).dataset.effectId;
		this.#overrides[id] = target.value || null;
		await this.render();
	};

	/** @this {StatusEffectIconConfig} */
	static async #onSubmit() {
		game.settings.set(__ID__, customStatusIconsKey, this.#overrides);
		SettingsConfig.reloadConfirm({ world: true });
	};
	// #endregion Event Listeners

	// #region Actions
	/** @this {StatusEffectIconConfig} */
	static async #pickViaImageTagger(event, element) {
		const id = element.closest(`[data-effect-id]`)?.dataset.effectId;
		if (!id) { return };

		const ArtBrowser = game.modules.get(`image-tagger`).api.Apps.ArtBrowser;
		const newImage = await ArtBrowser.select();
		if (!newImage) { return };
		this.#overrides[id] = newImage;

		await this.render();
	};

	/** @this {StatusEffectIconConfig} */
	static async #removeOverride(event, element) {
		const id = element.closest(`[data-effect-id]`)?.dataset.effectId;
		this.#overrides[id] = null;
		await this.render();
	};
	// #endregion Actions
};