<?xml version="1.0" encoding="UTF-8"?>

<?import org.cryptomator.ui.controls.FontAwesome5IconView?>
<?import org.cryptomator.ui.controls.FormattedLabel?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.ButtonBar?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.Region?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.layout.VBox?>
<VBox xmlns:fx="http://javafx.com/fxml"
	  xmlns="http://javafx.com/javafx"
	  fx:controller="org.cryptomator.ui.addvaultwizard.CreateNewVaultNameController"
	  prefWidth="450"
	  prefHeight="450"
	  spacing="12"
	  alignment="CENTER_LEFT">
	<padding>
		<Insets topRightBottomLeft="24"/>
	</padding>
	<children>
		<Region VBox.vgrow="ALWAYS"/>

		<VBox spacing="6">
			<Label text="%addvaultwizard.new.nameInstruction" labelFor="$textField"/>
			<TextField fx:id="textField" promptText="%addvaultwizard.new.namePrompt" HBox.hgrow="ALWAYS"/>
			<HBox alignment="TOP_RIGHT">
				<StackPane visible="${!textField.text.empty}">
					<Label styleClass="label-muted" text="%addvaultwizard.new.invalidName" textAlignment="RIGHT" alignment="CENTER_RIGHT" visible="${!controller.validVaultName}" graphicTextGap="6">
						<graphic>
							<FontAwesome5IconView styleClass="glyph-icon-red" glyph="TIMES" />
						</graphic>
					</Label>
					<Label styleClass="label-muted" text="%addvaultwizard.new.validName" textAlignment="RIGHT" alignment="CENTER_RIGHT" visible="${controller.validVaultName}" graphicTextGap="6">
						<graphic>
							<FontAwesome5IconView styleClass="glyph-icon-primary" glyph="CHECK" />
						</graphic>
					</Label>
				</StackPane>
			</HBox>

			<Label text="%addvaultwizard.new.validCharacters.message"/>
			<VBox>
				<padding>
					<Insets left="6"/>
				</padding>
				<Label text="%addvaultwizard.new.validCharacters.chars">
					<graphic>
						<FontAwesome5IconView glyph="CHECK" />
					</graphic>
				</Label>
				<Label text="%addvaultwizard.new.validCharacters.numbers">
					<graphic>
						<FontAwesome5IconView glyph="CHECK" />
					</graphic>
				</Label>
				<FormattedLabel format="%addvaultwizard.new.validCharacters.dashes" arg1="-" arg2="_">
					<graphic>
						<FontAwesome5IconView glyph="CHECK" />
					</graphic>
				</FormattedLabel>
			</VBox>

		</VBox>

		<Region VBox.vgrow="ALWAYS"/>

		<ButtonBar buttonMinWidth="120" buttonOrder="+X">
			<buttons>
				<Button text="%generic.button.next" ButtonBar.buttonData="NEXT_FORWARD" onAction="#next" defaultButton="true" disable="${!controller.validVaultName}"/>
			</buttons>
		</ButtonBar>
	</children>
</VBox>
