class AddCategoryPopover extends Popover {
	constructor(element) {
		super(element);

		this.onCategoryUpdateBound = this.onCategoryUpdate.bind(this);

		TimeCards.dataManager.addStoreErrorListener("card_category", this.onCategoryStoreError.bind(this));
	}

	viewDidLoad() {
		this.clear();
	}

	viewDidAppear() {
		this.categoryNameField.focus();
	}

	onAddButtonPressed(event) {
		event.preventDefault();

		this.addButton.disabled = true;

		var category = {
			name: this.categoryNameField.value,
			icon: this.categoryIconField.value,
			visibility: this.categoryVisibilitySelect.value ? parseInt(this.categoryVisibilitySelect.value) : 1
		};

		//Add a listener for the next created category.
		TimeCards.dataManager.addDataListener("card_category", category, this.onCategoryUpdateBound);

		TimeCards.dataManager.store("card_category", category);
	}

	clear() {
		this.categoryNameField.value = "";
		this.categoryIconField.value = "🗃";
		this.addButton.disabled = true;
	}

	onInput(event) {
		if (this.categoryNameField.value && this.categoryNameField.value.length >= 1 && this.categoryIconField.value.length <= 2 && this.categoryIconField.value.length > 0) {
			this.addButton.disabled = false;
		}
		else {
			this.addButton.disabled = true;
		}
	}

	onCategoryUpdate(categoryId, category) {
		//Remove the data listener after the category was successfully created.
		TimeCards.dataManager.removeDataListener("card_category", this.onCategoryUpdateBound);

		this.dismiss(true);
		this.addButton.disabled = false;
		this.clear();
	}

	onCategoryStoreError(categoryId, category, error) {
		//Remove the data listener after the category creation failed.
		TimeCards.dataManager.removeDataListener("card_category", this.onCategoryUpdateBound);

		//Call the onInput function to re-enable the add button under the correct conditions.
		this.onInput();
	}
}

UIKit.registerPopoverType(AddCategoryPopover);