class Dialog extends View {
	static get BUTTONS_DEFAULT() {
		return {
			buttons: {
				cancel: {
					title: "Cancel"
				},
				ok: {
					title: "OK",
					type: "default"
				}
			}
		}
	}

	static get BUTTONS_OK_ONLY() {
		return {
			buttons: {
				ok: {
					title: "OK",
					type: "default"
				}
			}
		}
	}

	static get BUTTONS_DESTRUCTIVE() {
		return {
			buttons: {
				cancel: {
					title: "Cancel"
				},
				delete: {
					title: "Delete",
					type: "destructive default"
				}
			}
		}
	}

	/**
	 * The constructor accepts the HTML content, a callback function and an object with the button configuration.
	 * The callback is called when a button was pressed.
	 */
	constructor(content, callback, configuration = { }) {
		super();

		this.configuration = configuration;
		this.callback = callback;

		this.element.tabIndex = -1;
		this.element.addEventListener("keyup", this.onKeyUp.bind(this));

		//Build the dialog with the configuration.
		this.contentContainer = document.createElement("DIV");
		this.setContent(content);
		this.element.appendChild(this.contentContainer);

		this.buttonContainer = document.createElement("DIV");
		this.buttonContainer.className = "button-container";
		this.element.appendChild(this.buttonContainer);

		if (!("buttons" in this.configuration)) {
			this.configuration.buttons = Dialog.BUTTONS_DEFAULT;
		}

		for (var buttonId in this.configuration.buttons) {
			var buttonData = this.configuration.buttons[buttonId];

			var button = document.createElement("BUTTON");
			button.innerText = buttonData.title;
			button.className = buttonData.type;
			button.id = buttonId;
			button.addEventListener("click", this.onButtonPressed.bind(this));
			this.buttonContainer.appendChild(button);

			if (buttonData.type && buttonData.type.indexOf("default") != -1) {
				this.defaultButtonId = buttonId;
			}
		}

		//Also create the dialog container if it was not created already.
		if (!Dialog.dialogContainer) {
			Dialog.dialogContainer = document.createElement("DIV");
			Dialog.dialogContainer.className = "dialog-container";

			var verticalCenterer = document.createElement("DIV");
			verticalCenterer.className = "vertical-centerer";
			Dialog.dialogContainer.appendChild(verticalCenterer);
		}
	}

	setContent(content) {
		this.contentContainer.innerHTML = content;
	}

	onKeyUp(event) {
		if (this.defaultButtonId && event.key == "Enter") {
			this.processButtonPress(this.defaultButtonId);
		}
	}

	onButtonPressed(event) {
		this.processButtonPress(event.currentTarget.id);
	}

	processButtonPress(buttonId) {
		//Call the callback with the pressed button ID.
		if (this.callback) {
			this.callback(buttonId);
		}

		this.hide();
	}

	show() {
		//Append the dialog container and element to the view controller.
		Dialog.dialogContainer.appendChild(this.element);

		var activeViewControllerElement = UIKit.getActiveViewController().element;
		activeViewControllerElement.appendChild(Dialog.dialogContainer);
		if (activeViewControllerElement.className.indexOf("dialog") == -1) {
			activeViewControllerElement.classList.add("dialog");
		}

		this.element.focus();
	}

	hide() {
		//Remove the dialog container from the active view controller and the dialog from the container.
		Dialog.dialogContainer.parentNode.classList.remove("dialog");
		Dialog.dialogContainer.parentNode.removeChild(Dialog.dialogContainer);
		Dialog.dialogContainer.removeChild(this.element);
	}
}

UIKit.registerViewType(Dialog);