<!DOCTYPE html>
<html>

<head>
	<title>Bekræft venligst</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<style type="text/css">
		body {
			padding:20px;
		}
		h1 {
			font-size:20pt;
			font-family:sans-serif;
		}
		p, form {
			font-family:sans-serif;
		}
		input[type=submit] {
			cursor:pointer;
			padding:10px 20px 10px 20px;
			border-radius:5px;
			border:1px solid #bbb;
			color:#fff;
			font-family:sans-serif;
			font-size:12pt;
			margin-top:10px;
		}
		.green {
			background:#39702a;
			color:#fff;
		}
		.grey {
			background:#999;
			color:#000;
		}
		input[type=text] {
			padding:10px;
			border-radius:5px;
			border:1px solid #bbb;
			font-family:sans-serif;
			font-size:12pt;
			width:290px;
		}
		#error {
			color:#f00;
			font-weight:bold;
		}
		#fi {
			padding:10px 10px 10px 0px;
		}
		#fi img {
			margin-top:10px;
			border-radius:5px;
		}
		small {
			margin-top:5px;
			color:#999;
			display:block;
		}
	</style>

	<script src="<{$webshop->getUrl()}>/javascript/jquery-1.8.2.min.js"></script>

	<script type="text/javascript">
		$(document).ready(function() {
			$("#c").keyup(function() {
				if ($("#c").val().length == 3) {
					$("#btn").val('Sender ...');
					$("#btn").addClass('green');
					$("#btn").removeClass('grey');
					$("#btn").attr('disabled', false);
					$("#form").submit();
				}
				else {
					$("#btn").val('Vent ...');
					$("#btn").attr('disabled', true);
					$("#btn").addClass('grey');
					$("#btn").removeClass('green');
				}
			});
		});
	</script>
</head>

<body>

	<h1>Bekræft venligst ...</h1>

	<p>Inden du kan fortsætte skal du lige fortælle os at du ikke er en robot:</p>

	<form action="" method="post" id="form">
		<{$form}>

		<{if $error}>
			<div id="error">Der var desværre fejl i koden. Prøv igen.</div>
		<{/if}>

		<div id="fi">
			<img src="<{$imgstr}>">
		</div>

		<div>
			<input type="text" id="c" name="c" autofocus autocomplete="off" value="" placeholder="Skriv indholdet at ovenstående felt" required>
			<div><small>Reload siden hvis du ikke kan læse koden.</small></div>
		</div>

		<input type="submit" class="grey" disabled name="" id="btn" value="Vent ...">

	</form>

</body>

</html>