<!DOCTYPE html>
<html ng-app="wtsPrintTestApp">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<title>Printer Test</title>
		<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css">
		<script src="node_modules/angular/angular.js"></script>
		<script src="index.js"></script>
	</head>
	<body>
		<header>
			<nav class="navbar navbar-expand-lg navbar-light bg-light">
				<h1>Impression de ticket</h1>
			</nav>
		</header>
		<div class="container" ng-controller="wtsPrintTestController as test">
			<form ng-submit="test.print()">
				<div class="form-group">
					<label>Interface :</label><input class="form-control" type="text" id="interface" ng-model="test.data.interface">
				</div>
				<div class="form-check">
					<input class="form-check-input" type="checkbox" id="dontCheckIfConnected" ng-value="true" ng-model="test.data.dontCheckIfConnected">
					<label class="form-check-label" for="dontCheckIfConnected">Ne pas vérifier la connexion</label>
				</div>
				<div class="form-group">
					<label>Largeur :</label><input class="form-control" type="number" id="width" ng-model="test.data.width">
				</div>
				<div ng-repeat="element in test.data.elements">
					<div class="form-group">
						<label>Lignes avant :</label><input class="form-control" type="number" ng-model="element.linesBefore" min="1" ng-min="1" max="8" ng-max="8">
					</div>
					<div class="form-group">
						<label>Lignes après :</label><input class="form-control" type="number" ng-model="element.linesAfter" min="1" ng-min="1" max="8" ng-max="8">
					</div>
					<div class="form-group" ng-hide="element.text">
						<label>URL Image :</label><input class="form-control" type="text" ng-model="element.imageURL">
					</div>
					<div class ng-hide="element.imageURL">
					<div class="form-group">
						<label>Largeur texte :</label><input class="form-control" type="number" ng-model="element.textWidth" min="1" ng-min="1" max="8" ng-max="8">
					</div>
					<div class="form-group">
						<label>Hauteur texte :</label><input class="form-control" type="number" ng-model="element.textHeight" min="1" ng-min="1" max="8" ng-max="8">
					</div>
					<div class="form-check">
						<input class="form-check-input" type="checkbox" ng-value="true" ng-model="element.bold">
						<label class="form-check-label">Gras</label>
					</div>
					<div class="form-group">
						<label>Texte :</label><input class="form-control" type="text" ng-model="element.text">
					</div>
					</div>
					<div class="form-group">
						<button type="button" class="btn btn-danger" ng-click="test.deleteElement($index)">Supprimer</button>
					</div>
					<hr>
				</div>
				<div class="form-group">
					<button type="button" class="btn btn-success" ng-click="test.appendElement()">Ajouter</button>
				</div>
				<br>
				<div class="form-group">
					<button type="submit" class="btn btn-primary">Imprimer</button>
				</div>
				<div class="form-group">
					<label>Résultat :</label><textarea class="form-control" ng-model="test.error" rows="5"></textarea>
				</div>
				<div class="form-group">
					<label>JSON requête :</label><textarea class="form-control" ng-model="test.data | json" rows="20"></textarea>
				</div>
			</form>
		</div>
	</body>
</html>