/**
 * Created by rockyl on 2018-12-12.
 *
 * 对话框内容组件
 */

import ScillaComponent from "scilla-components/src/base/ScillaComponent";
import { fade, flew, none, zoom } from "./PopupEffect";
import { raw } from "scilla/src";
import { decorators } from "scilla/src";
import { Button } from "scilla-components/src";

const { dirtyFieldTrigger } = decorators;

export default class DialogContent extends ScillaComponent {
	@dirtyFieldTrigger
	effect: PopupEffect = PopupEffect.flew;
	showEffectOptions: raw;
	hideEffectOptions: raw;

	protected _closeButtons: Button[];

	effectImpl = none;

	protected onModify(value, key, oldValue) {
		super.onModify(value, key, oldValue);

		if (key === 'effect') {
			this.effectImpl = effects[value];
		}
	}

	onAwake() {
		super.onAwake();

		if (!this._closeButtons) {
			this._closeButtons = [];
			const buttons = this.entity.getChildrenByName('CloseButton');
			if (buttons) {
				buttons.forEach(button => {
					const closeBtn = button.getComponent(Button);
					closeBtn.onClick.addListener(this.onTapCloseButton, this);
				})
			}
		}
	}

	protected onTapCloseButton() {
		this.hide();
	}

	setup(data) {

	}

	show = (data?, callback?) => {
		this.bubbling('showDialog', this.entity.name, data, callback);
	}

	hide = (action?) => {
		this.bubbling('hideDialog', this.entity.name, action || 'close');
	}
}

const effects = {
	none,
	fade,
	flew,
	zoom,
};

export enum PopupEffect {
	none = 'none',
	fade = 'fade',
	flew = 'flew',
	zoom = 'zoom',
}
