doctype html
html(lang='de')
	head
		meta(charset='utf-8')
		meta(name='viewport', content='width=device-width, initial-scale=1, shrink-to-fit=no')
		link(rel='stylesheet', href='/stylesheets/style.css')
		link(rel='stylesheet', href='/stylesheets/bootstrap.min.css')
		link(rel='stylesheet', href='/stylesheets/open-iconic-bootstrap.min.css')
		script(src='/javascripts/jquery.min.js')
		script(src='/javascripts/popper.min.js')
		script(src='/javascripts/bootstrap.min.js')
	body

		.container-fluid
			h1(style="font-variant: small-caps; margin-top: 1rem;") BibelWissen.Halieus.DE
			hr(style="margin-top: 3px; margin-bottom: 40px;")
				
			p(style="text-align: right;")
				a(href="http://www.halieus.de/impressum_datenschutz.html" target="_blank") Impressum & Datenschutzerklärung
				
			
			
			//- img(src="/captcha", alt="CAPTCHA", style="margin-top: 5px; margin-bottom: 5px;")
				

			
			

				
			form(method="post", action="/login", role="form", style="margin-top: 15px;", id="login_form")
			
				.form-group(style="margin-bottom: 25px;")
					.col-sm-12
						| Auf diesen Seiten finden Sie interessante Informationen zu biblischen Themen.
						br
						| Der Zugriff ist beschränkt auf zugelassene Benutzer.
				.form-group
					label.col-sm-1.control-label(for="benutzername") 
						b Benutzername
					.col-sm-5
						input.form-control#benutzername(type="text", name="username")
				.form-group
					label.col-sm-1.control-label(for="passwort") 
						b Paßwort
					.col-sm-5
						input.form-control#passwort(type="password", name="password")
							
				
				.from-group(style="margin-top: 25px; margin-bottom: 25px;")
					.col-sm-12
						| Mit dem Klicken auf <q>Weiter ...</q> wird ein Session-Cookie erzeugt und im Browser bespeichert.
						br
						| Außer diesem werden keine weiteren Cookies angelegt, es findet kein Tracking statt und die Seiten sind werbefrei.
						br
						| Zum Speichern und Abfragen der Einstellung zum Präsentationsmodus wird der Session-Store genutzt.
							
				.from-group
					.col-sm-1
						button.btn.btn-success.btn-sm
							//- (onclick="run_login();")
							span Weiter ...
				
				//- .form-group(style="display: none;")
					label.col-sm-1.control-label(for="ID1") 
						b Captcha
					.col-sm-5
						input.form-control(type="text", name="captcha", id="captcha")
				//- .from-group
				//-	.col-sm-1
				//-		button.btn.btn-success.btn-sm(type="submit")
				//-			span OK
			//-	.form-check(style="margin-top: 50px;")
					.col-sm-5
						label.form-check-label
							input.form-check-input(type="checkbox", name="as_presentation")
							i Als Präsentation anzeigen (sofern verfügbar)
					.col-sm-12.small
						span 
							| <q>Als Präsentation anzeigen</q> bedeutet:
							br
							| Soweit eine Seite im Präsentationsmodus verfügbar ist, werden die Inhalte nicht gleich angezeigt.
							| Vielmehr werden die Inhalte wie bei einer Präsentation durch Drücken von Tasten ein- bzw. ausgeblendet.
							| Das Einblenden erfolgt mittels Pfeil-nach-rechts (<span class="oi oi-arrow-right"></span>),
							| das Ausblenden mittels Pfeil-nach-links (<span class="oi oi-arrow-left"></span>).
		
			form(style="display: none; color: white;")
				input(type="checkbox", name="refreshCheck", id="refreshCheck") 
				span Force Refresh on Back Key Logic

		script.
			/*$(function () {
				if ($('#refreshCheck')[0].checked) {
					window.location.reload();
				}
				$('#refreshCheck')[0].checked = true;
			});*/
			
			/*
			function run_login() {
				$("#captcha").val("!{captcha}");
				$("#login_form").submit();
			}*/