templates/theme_learts/register.html.twig line 1

Open in your IDE?
  1. {% extends 'theme_' ~ constant('config_theme') ~ '/base.html.twig' %}
  3. {% block extracss %}
  4.     <style type="text/css">
  5.         label {
  6.             cursor: pointer;
  7.             margin-bottom: .25rem;
  8.         }
  9.     </style>
  10. {% endblock %}
  12. {% block pageheader %}{% endblock %}
  14. {% block wrapper %}
  15.     <div class="page-header section" style="background-image: url('/assets/theme_{{ constant('config_theme') }}/img/bg2.jpg');">
  16.         <div class="filter"></div>
  17.         <div class="container" style="margin-top:100px;">
  18.             <div class="row">
  19.                 <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">
  20.                     <form autocomplete="off" method="post">
  22.                         {% if app.user %}
  23.                             <div class="mb-3 text-center text-bold">
  24.                                 Du er allerede logget inn som {{ app.user.username }}, <a class="text-bold" href="{{ path('app_logout') }}">Logg ut!</a>
  25.                             </div>
  26.                         {% else %}
  28.                             <h1 class="h3 mb-3 font-weight-normal">Oppgi ønsket brukernavn og passord</h1>
  29.                             <div class="row">
  30.                                 <div class="col-lg-6">
  31.                                     <label for="inputEmail">Brukernavn</label>
  32.                                     <input autocomplete="off" type="email" placeholder="Din email-adresse" value="" name="email" id="inputEmail" class="form-control mb-4" required autofocus>
  33.                                 </div>
  34.                                 <div class="col-lg-6">
  35.                                     <label for="inputPassword">Passord</label>
  36.                                     <input autocomplete="off" type="password" placeholder="Ditt passord" name="password" id="inputPassword" class="form-control mb-4" required>
  37.                                 </div>
  38.                             </div>
  39.                             <div class="row">
  40.                                 <div class="col-lg-4">
  41.                                     <label for="inputFirstname">Fornavn</label>
  42.                                     <input autocomplete="off" type="text" value="" name="firstname" id="inputFirstname" class="form-control mb-4" required>
  43.                                 </div>
  44.                                 <div class="col-lg-5">
  45.                                     <label for="inputLastname">Etternavn</label>
  46.                                     <input autocomplete="off" type="text" value="" name="lastname" id="inputLastname" class="form-control mb-4" required>
  47.                                 </div>
  48.                                 <div class="col-lg-3">
  49.                                     <label for="inputPhone">Mobil</label>
  50.                                     <input autocomplete="off" type="number" value="" name="phone" id="inputPhone" class="form-control mb-4" required>
  51.                                 </div>
  52.                             </div>
  53.                             <div class="row">
  54.                                 <div class="col-lg-5">
  55.                                     <label>Adresse</label>
  56.                                     <input autocomplete="off" type="text" value="" name="address" class="form-control mb-4" required>
  57.                                 </div>
  58.                                 <div class="col-lg-2">
  59.                                     <label>Postnr</label>
  60.                                     <input onchange="findPostalname(this.value)" autocomplete="off" type="number" value="" name="postalnumber" class="form-control mb-4" required>
  61.                                 </div>
  62.                                 <div class="col-lg-5">
  63.                                     <label>Poststed</label>
  64.                                     <input autocomplete="off" type="text" value="" name="postalname" class="form-control mb-4" required>
  65.                                 </div>
  66.                             </div>
  68.                             <button class="btn btn-lg btn-success" type="submit">
  69.                                 Registrèr meg!
  70.                             </button>
  72.                             <div class="row mt-4">
  73.                                 <div class="col-lg-12 text-center">
  74.                                     <a class="text-bold" href="{{ path('app_login') }}">
  75.                                         Logg inn!
  76.                                     </a>
  77.                                 </div>
  78.                             </div>
  80.                         {% endif %}
  81.                     </form>
  82.                     <div class="mt-3 text-danger">
  83.                         <a class="text-bold">
  84.                             {{ message | raw }}
  85.                         </a>
  86.                     </div>
  87.                 </div>
  88.             </div>
  89.         </div>
  90.     </div>
  91. {% endblock %}
  93. {% block javascript %}
  94. <script>
  95.     function titleCase(string) {
  96.     return string[0].toUpperCase() + string.slice(1).toLowerCase();
  97. }
  99.     function findPostalname(pnr) {
  100.     $('[name="postalname"]').LoadingOverlay('show');
  101.     $.get('/ajax/findPostalname/' + pnr, function(json) {
  102.     try {
  103.     logg(json);
  104.     $('[name="postalname"]').LoadingOverlay('hide');
  105.     if (json.response.valid === true) {
  106.     var postalname = titleCase(json.response.result);
  107.     $('[name="postalname"]').val(postalname);
  108. } else {
  109.     $('[name="postalname"]').val('#####');
  110. }
  111. } catch(e) {
  112.     console.log(e);
  113. }
  114. });
  115. }
  116. </script>
  117. {% endblock %}