{% extends 'registration/base_custom.html' %}

{% block title %}Home{% endblock %}

{%block nav%}
  <nav class="nav-extended">
    <div class="nav-wrapper red lighten-1">
      <a style="margin-left: 10px;" href="{% url 'index' %}" class="breadcrumb">Home</a>
      <a href="#!" class="breadcrumb hide-on-med-and-down">Account</a>
      <ul class="right">
          {% if user.is_staff %}
            <li><a href="{% url 'server' %}">Pannello Admin</a></li>
          {% endif %}
          {% if user.is_authenticated %}
            <li><a href="{% url 'personal' %}">{{ user.username }}</a></li>
          {% endif %}
          {% if user.username != "" %}
            <li>
            <a href="{% url 'logout' %}"><i class="material-icons">exit_to_app</i></a>
            </li>
          {% else %}
            <li><a href="{% url 'signup' %}">Registrazione</a></li>
            <li><a href="{% url 'login' %}">Login</a></li>
          {% endif %}
      </ul>
    </div>
    <div class="nav-content red lighten-1">
      <ul class="tabs tabs-transparent">
        <li class="tab"><a class="active" href="#personal">Info Personali</a></li>
        <li class="tab"><a href="#medic">Info Mediche</a></li>
      </ul>
    </div>
  </nav>

  <ul class="sidenav" id="mobile-demo">
    {% if user.is_staff %}
      <li><a href="{% url 'server' %}">Pannello Admin</a></li>
    {% endif %}
    {% if user.is_authenticated %}
      <li><a href="{% url 'personal' %}">{{ user.username }}</a></li>
    {% endif %}
    {% if user.username != "" %}
      <li>
      <a href="{% url 'logout' %}"><i class="material-icons">exit_to_app</i></a>
      </li>
    {% else %}
      <li><a href="{% url 'signup' %}">Registrazione</a></li>
      <li><a href="{% url 'login' %}">Login</a></li>
    {% endif %}
  </ul>
{% endblock%}

{% block content %}
<div id="personal" class="row">
  <div class="col l8 offset-l2 s12">
    <div class="card-panel">
      <div class="row">
        <form action="{% url 'personal'%}" method="post" id="form" class="col s12">
          {% csrf_token %}
          <div class="row">
            <div class="input-field col s4">
              <input name="first_name" value="{{first_name}}" id="first_name" type="text" >
              <label for="first_name">Nome</label>
            </div>
            <div class="input-field col s4">
              <input name="last_name" value="{{last_name}}" id="last_name" type="text" >
              <label for="last_name">Cognome</label>
            </div>
            <div class="input-field col s4">
              <input name="birth_date" value="{{birth_date}}" id="birth_date" type="text" class="datepicker">
              <label for="birth_date">Data di nascita</label>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s4">
              <select name="branca">
                <option value="" disabled {{branca_default}}>Scegli</option>
                <option value="colonia" {{branca_castorini}}>Castorini</option>
                <option value="muta" {{branca_lupetti}}>Lupetti</option>
                <option value="reparto" {{branca_esploratori}}>Esploratori</option>
                <option value="posto" {{branca_pionieri}}>Pionieri</option>
                <option value="clan" {{branca_rover}}>Rover</option>
              </select>
              <label>Branca</label>
            </div>
            <div class="input-field col s8">
              <input value="{{parent_name}}" name="parent_name" id="parent_name" type="text" >
              <label for="parent_name">Nome dei genitori</label>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s12">
              <input value="{{via}}" name="via" id="via" type="text" >
              <label for="via">Via e numero</label>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s4">
              <input value="{{cap}}" name="cap" id="cap" type="text" >
              <label for="cap">CAP</label>
            </div>
            <div class="input-field col s4">
              <input value="{{country}}" name="country" id="country" type="text" >
              <label for="country">Paese</label>
            </div>
            <div class="input-field col s4">
              <input value="{{nationality}}" name="nationality" id="nationality" type="text" >
              <label for="nationality">Nazionalit&agrave;</label>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s4">
              <input value="{{phone}}" name="phone" id="phone" type="text" >
              <label for="phone">Cellulare</label>
            </div>
            <div class="input-field col s4">
              <input value="{{home_phone}}" name="home_phone" id="home_phone" type="text" >
              <label for="home_phone">Telefono di casa</label>
            </div>
            <div class="input-field col s4">
              <input value="{{email}}" name="email" id="email" type="text" >
              <label for="email">Email</label>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s8">
              <input value="{{school}}" name="school" id="school" type="text" >
              <label for="school">Scuola frequentata</label>
            </div>
            <div class="input-field col s4">
              <input value="{{year}}" name="year" id="year" type="text" >
              <label for="year">Classe</label>
            </div>
          </div>
            <div class="fixed-action-btn">
              <a class="btn-floating btn-large red lighten-1" onclick="document.getElementById('form').submit()">
                <i class="large material-icons">save</i>
              </a>
            </div>
      </div>
    </div>
  </div>
</div>
<div id="medic" class="row">
  <div class="col l8 offset-l2 s12">
    <div class="card-panel">
      <div class="row">
          {% csrf_token %}
          <div class="row">
            <div class="col s12">
              <h6>Persona di contatto in caso di necessit&agrave;</h6>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s6">
              <input name="emer_name" value="{{emer_name}}" id="emer_name" type="text" >
              <label for="emer_name">Nome e cognome</label>
            </div>
            <div class="input-field col s3">
              <input name="emer_relative" value="{{emer_relative}}" id="emer_relative" type="text" >
              <label for="emer_releative">Parentela</label>
            </div>
            <div class="input-field col s3">
              <input name="cell_phone" value="{{cell_phone}}" id="cellphone" type="text" >
              <label for="cell_phone">Cellulare</label>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s9">
              <input value="{{address}}" name="address" id="address" type="text" >
              <label for="address">Indirizzo completo</label>
            </div>
            <div class="input-field col s3">
              <input value="{{emer_phone}}" name="emer_phone" id="emer_phone" type="text" >
              <label for="emer_phone">Telefono di casa</label>
            </div>
          </div>
          <div class="row">
            <div class="col s12">
              <h6>Assicurazione</h6>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s4">
              <input value="{{health_care}}" name="health_care" id="health_care" type="text" >
              <label for="health_care">Cassa Malati</label>
            </div>
            <div class="input-field col s4">
              <input value="{{injuries}}" name="injuries" id="injuries" type="text" >
              <label for="injuries">Infortuni</label>
            </div>
            <div class="input-field col s4">
              <input value="{{rc}}" name="rc" id="rc" type="text" >
              <label for="rc">Responsabilit&agrave; civile</label>
            </div>
          </div>
          <div class="row">
            <div class="switch col s12">
              &Egrave; sostenitore REGA&nbsp;&nbsp;
              <label>
                No
                <input name="rega" type="checkbox" {{rega_check}}>
                <span class="lever"></span>
                Si
              </label>
            </div>
          </div>
          <div class="row">
            <div class="col s12">
              <h6>Medico di famiglia</h6>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s6">
              <input value="{{medic_name}}" name="medic_name" id="medic_name" type="text" >
              <label for="medic_name">Nome e cognome</label>
            </div>
            <div class="input-field col s6">
              <input value="{{medic_phone}}" name="medic_phone" id="medic_phone" type="text" >
              <label for="medic_phone">Telefono studio</label>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s12">
              <input value="{{medic_address}}" name="medic_address" id="medic_address" type="text" >
              <label for="medic_address">Indirizzo completo</label>
            </div>
          </div>
          <div class="row">
            <div class="col s12">
              <h6>Scheda medica personale</h6>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s12">
              <input value="{{sickness}}" name="sickness" id="sickness" type="text" data-length="250">
              <label for="sickness">Principali malattie avute</label>
            </div>
          </div>
          <div class="row">
            <div class="input-field col s8">
              <input value="{{vaccine}}" name="vaccine" id="vaccine" type="text" data-length="250">
              <label for="vaccine">Vacinazioni fatte</label>
            </div>
            <div class="input-field col s4">
              <label for="tetanus_date">Ultima vacinazione contro il tetano</label>
              <input value="{{tetanus_date}}" name="tetanus_date" id="tetanus_date" type="text" class="datepicker">
            </div>
          </div>
          <div class="row">
            <div class="input-field col s12">
              <input value="{{allergy}}" name="allergy" id="allergy" type="text" data-length="250">
              <label for="allergy">Allergie particolari/Intolleraze alimentari</label>
            </div>
          </div>
          <div class="row">
            <div class="switch col s12">
              Deve assumere regolarmente medicamenti&nbsp;&nbsp;
              <label>
                No
                <input name="drugs_bool" type="checkbox" {{drugs_check}}>
                <span class="lever"></span>
                Si
              </label>
            </div>
          </div>
          <div class="row">
            <div class="col s12">
              <div class="card red lighten-1">
                <div class="card-content">
                  <p style="color:white"><b>In caso dovesse assumere farmaci, avvisare comunque i capi</b></p>
                </div>
              </div>
            </div>
            <div class="input-field col s12">
              <input value="{{drugs}}" name="drugs" id="drugs" type="text" data-length="250">
              <label for="drugs">Se s&igrave; quali, in che dosi e prescrizioni</label>
            </div>
          </div>
          <div class="row">
            <div class="switch col s12">
              Informazioni particolari sullo stato di salute: (postumi di operazioni, incidenti, malattie, disturbi fisici)&nbsp;&nbsp;
              <label>
                No
                <input name="misc_bool" type="checkbox" {{misc_check}}>
                <span class="lever"></span>
                Si
              </label>
            </div>
            <div class="input-field col s12">
              <input value="{{misc}}" name="misc" id="misc" type="text" data-length="250">
              <label for="misc">Se s&igrave; quali</label>
            </div>
          </div>
          <div class="row">
            <div class="col s12">
              <h6>Allegati</h6>
            </div>
          </div>
          <div class="row">
            <div class="col s6">
              Certificato delle vacinazioni
            </div>
            <div class="col s6">
              Tessera della cassa malati
            </div>
          </div>
          <div class="fixed-action-btn">
            <a class="btn-floating btn-large red lighten-1" onclick="document.getElementById('form').submit()">
              <i class="large material-icons">save</i>
            </a>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>
{% endblock %}

{% block script %}
    var elem = $('.tabs')
    var options = {
      yearRange:100,
      format:'dd mmmm yyyy',
      i18n: {
        months: [ 'gennaio', 'febbraio', 'marzo', 'aprile', 'maggio', 'giugno', 'luglio', 'agosto', 'settembre', 'ottobre', 'novembre', 'dicembre' ],
        monthsShort: [ 'gen', 'feb', 'mar', 'apr', 'mag', 'giu', 'lug', 'ago', 'set', 'ott', 'nov', 'dic' ],
        weekdays: [ 'domenica', 'lunedì', 'martedì', 'mercoledì', 'giovedì', 'venerdì', 'sabato' ],
        weekdaysShort: [ 'dom', 'lun', 'mar', 'mer', 'gio', 'ven', 'sab' ],
        weekdaysAbbrev: [ 'D', 'L', 'M', 'M', 'G', 'V', 'S' ],
        today: 'Oggi',
        clear: 'Cancella',
        close: 'Chiudi',
        firstDay: 1,
        format: 'dddd d mmmm yyyy',
        formatSubmit: 'yyyy/mm/dd',
        labelMonthNext: 'Mese successivo',
        labelMonthPrev: 'Mese precedente',
        labelMonthSelect: 'Seleziona un mese',
        labelYearSelect: 'Seleziona un anno'
            }}
    var instance = M.Tabs.init(elem, options);
    document.addEventListener('DOMContentLoaded', function() {
    var elems = document.querySelectorAll('.datepicker');
    var instances = M.Datepicker.init(elems, options);
    });
    document.addEventListener('DOMContentLoaded', function() {
    var elems = document.querySelectorAll('select');
    var instances = M.FormSelect.init(elems, options);
    });
    $(document).ready(function() {
    $('input#sickness, input#vaccine, input#allergy, input#drugs, input#misc').characterCounter();
    });
{% endblock %}