{% extends 'theme_' ~ constant('config_theme') ~ '/base.html.twig' %}
{% block extracss %}
<style type="text/css">
label {
cursor: pointer;
margin-bottom: .25rem;
}
</style>
{% endblock %}
{% block pageheader %}{% endblock %}
{% block wrapper %}
<div class="page-header section" style="background-image: url('/assets/theme_{{ constant('config_theme') }}/img/bg2.jpg');">
<div class="filter"></div>
<div class="container" style="margin-top:100px;">
<div class="row">
<div class="col-lg-8 offset-lg-2 col-md-8 offset-md-2 col-10 offset-1 p-4 border rounded p-2 bg-white text-black-50">
<form autocomplete="off" method="post">
{% if app.user %}
<div class="mb-3 text-center text-bold">
Du er allerede logget inn som {{ app.user.username }}, <a class="text-bold" href="{{ path('app_logout') }}">Logg ut!</a>
</div>
{% else %}
<h1 class="h3 mb-3 font-weight-normal">Oppgi ønsket brukernavn og passord</h1>
<div class="row">
<div class="col-lg-6">
<label for="inputEmail">Brukernavn</label>
<input autocomplete="off" type="email" placeholder="Din email-adresse" value="" name="email" id="inputEmail" class="form-control mb-4" required autofocus>
</div>
<div class="col-lg-6">
<label for="inputPassword">Passord</label>
<input autocomplete="off" type="password" placeholder="Ditt passord" name="password" id="inputPassword" class="form-control mb-4" required>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<label for="inputFirstname">Fornavn</label>
<input autocomplete="off" type="text" value="" name="firstname" id="inputFirstname" class="form-control mb-4" required>
</div>
<div class="col-lg-5">
<label for="inputLastname">Etternavn</label>
<input autocomplete="off" type="text" value="" name="lastname" id="inputLastname" class="form-control mb-4" required>
</div>
<div class="col-lg-3">
<label for="inputPhone">Mobil</label>
<input autocomplete="off" type="number" value="" name="phone" id="inputPhone" class="form-control mb-4" required>
</div>
</div>
<div class="row">
<div class="col-lg-5">
<label>Adresse</label>
<input autocomplete="off" type="text" value="" name="address" class="form-control mb-4" required>
</div>
<div class="col-lg-2">
<label>Postnr</label>
<input onchange="findPostalname(this.value)" autocomplete="off" type="number" value="" name="postalnumber" class="form-control mb-4" required>
</div>
<div class="col-lg-5">
<label>Poststed</label>
<input autocomplete="off" type="text" value="" name="postalname" class="form-control mb-4" required>
</div>
</div>
<button class="btn btn-lg btn-success" type="submit">
Registrèr meg!
</button>
<div class="row mt-4">
<div class="col-lg-12 text-center">
<a class="text-bold" href="{{ path('app_login') }}">
Logg inn!
</a>
</div>
</div>
{% endif %}
</form>
<div class="mt-3 text-danger">
<a class="text-bold">
{{ message | raw }}
</a>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
{% block javascript %}
<script>
function titleCase(string) {
return string[0].toUpperCase() + string.slice(1).toLowerCase();
}
function findPostalname(pnr) {
$('[name="postalname"]').LoadingOverlay('show');
$.get('/ajax/findPostalname/' + pnr, function(json) {
try {
logg(json);
$('[name="postalname"]').LoadingOverlay('hide');
if (json.response.valid === true) {
var postalname = titleCase(json.response.result);
$('[name="postalname"]').val(postalname);
} else {
$('[name="postalname"]').val('#####');
}
} catch(e) {
console.log(e);
}
});
}
</script>
{% endblock %}