{% extends "base.htm" %}
{% block title %}Modifica dispositivo • estus{% endblock %}
{% block extrahead %}
    <script>
        var users = 0;

        function genhtml(n) {
            return "<select id=\"utente" + n + "\" class=\"form-control\" name=\"utente" + n + "\">{% for impiegato in impiegati %}<option value=\"{{impiegato.iid}}\">{{impiegato.nomeimpiegato}} - {{impiegato.username}}</option>{% endfor %}</select>"
        }


        function adduser() {
            $("#users-column").append(genhtml(users));
            users += 1;
            $("#remove-user").removeClass("disabled");
        }

        function removeuser() {
            if (users > 0) {
                $("#utente" + (users - 1)).remove();
                users -= 1;
                if (users === 0) {
                    $("#remove-user").addClass("disabled");
                }
            }
        }

        function calchostname() {
            var comune = prompt("Inserisci le due lettere corrispondenti al comune in cui verrà collocato il dispositivo. (Es: VG)");
            if(comune === null) return;
            var anno = $("#form-ordine").find(":selected").text().substring(2,4);
            if(anno === "") anno = prompt("Inserisci l'anno d'acquisto del dispositivo. (Es: 17)");
            if(anno === null) return;
            var servizio = prompt("Inserisci le tre lettere corrispondenti al servizio di destinazione del dispositivo. (Es. SCU)");
            if(servizio === null) return;
            var inv = $("#form-ced").val();
            if(inv === "") inv = prompt("Inserisci il numero dell'inventario del dispositivo. (Es: 0351)");
            if(inv === null) return;
            var proprietario = prompt("Inserisci la lettera corrispondente al proprietario del dispositivo. (Es: U)");
            if(proprietario === null) return;
            $("#form-hostname").val(comune + anno + servizio + inv.padStart(4, "0") + proprietario);
        }

        {% if dispositivo %}
            window.onload = function () {
                {% for accesso in accessi %}
                    adduser();
                    $("#utente{{ loop.index - 1 }} option").prop("selected", false);
                    $("#utente{{ loop.index - 1 }} option[value={{ accesso.iid }}]").prop("selected", true);
                {% endfor %}
            };
        {% endif %}
    </script>
{% endblock %}
{% block content %}
    <div class="page-header">
        <h1>
            {% if action == "add" %}
                Crea dispositivo
            {% elif action == "show" %}
                Modifica dispositivo
            {% elif action == "clone" %}
                Clona dispositivo
            {% endif %}
        </h1>
    </div>
    <form class="form-horizontal" action="/disp_{{ action }}{% if dispositivo %}/{{ dispositivo.did }}{% endif %}" method="post">
        <div class="form-group">
            <label class="col-xs-2" for="form-tipo">Tipo dispositivo</label>
            <div class="col-xs-10">
                <input type="text" class="form-control" name="tipo" list="form-tipo" {% if dispositivo %}value="{{ dispositivo.tipo }}"{% endif %}>
                <datalist id="form-tipo" name="tipo">
                    {% for opzione in opzioni %}
                        <option value="{{ opzione }}">{{ opzione }}</option>
                    {% endfor %}
                </datalist>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-ordine">Ordine di appartenenza</label>
            <div class="col-xs-10">
                <select id="form-ordine" class="form-control" name="ordine">
                    <option value=""></option>
                    {% for ordine in ordini %}
                        <option value="{{ ordine.oid }}" {% if dispositivo and ordine.oid == dispositivo.oid %}selected{% endif %}>{{ ordine.data }} #{{ ordine.numero_ordine }}</option>
                    {% endfor %}
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-so">Sistema operativo</label>
            <div class="col-xs-10">
                <input type="text" class="form-control" name="so" list="form-so" {% if dispositivo %}value="{{ dispositivo.so }}"{% endif %}>
                <datalist id="form-so" name="so">
                    {% for sistema in sistemi %}
                        <option value="{{ sistema }}">{{ sistema }}</option>
                    {% endfor %}
                </datalist>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-utente">Utenti</label>
            <div class="col-xs-10" id="users-column">
                <p>
                    <div id="add-user" class="btn btn-success" onclick="adduser()"><span class="glyphicon glyphicon-plus"></span></div>
                    <div id="remove-user" class="btn btn-danger disabled" onclick="removeuser()"><span class="glyphicon glyphicon-minus"></span></div>
                </p>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-marca">Marca</label>
            <div class="col-xs-10">
                <input id="form-marca" class="form-control" type="text" placeholder="Marca" name="marca" {% if dispositivo %}value="{{ dispositivo.marca }}"{% endif %}>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-modello">Modello</label>
            <div class="col-xs-10">
                <input id="form-modello" class="form-control" type="text" placeholder="Modello" name="modello" {% if dispositivo %}value="{{ dispositivo.modello }}"{% endif %}>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-ced">Inventario CED</label>
            <div class="col-xs-10">
                <input id="form-ced" class="form-control" type="text" placeholder="Inventario CED" name="inv_ced" {% if dispositivo and dispositivo.inv_ced %}value="{{ dispositivo.inv_ced }}"{% endif %}>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-ente">Inventario ente</label>
            <div class="col-xs-10">
                <input id="form-ente" class="form-control" type="text" placeholder="Inventario ente" name="inv_ente" {% if dispositivo and dispositivo.inv_ente %}value="{{ dispositivo.inv_ente }}"{% endif %}>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-seriale">Numero Seriale</label>
            <div class="col-xs-10">
                <input id="form-seriale" class="form-control" type="text" placeholder="Seriale" name="seriale" {% if dispositivo %}value="{{ dispositivo.seriale }}"{% elif request.args.get("scanned_barcode") %}value="{{ request.args.get('scanned_barcode') }}{% endif %}">
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="">Rete</label>
            <div class="col-xs-10">
                <select id="form-rete" class="form-control" name="rete">
                    {% for rete in reti %}
                        <option value="{{ rete.nid }}" {% if dispositivo and rete.nid == dispositivo.nid %}selected{% endif %}>{{ rete.nome }} - {{ rete.network_ip }}/{{ rete.subnet }}</option>
                    {% endfor %}
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-ip">IP</label>
            <div class="col-xs-10">
                <input id="form-ip" class="form-control" type="text" placeholder="Indirizzo IP" name="ip" {% if dispositivo %}value="{{ dispositivo.ip }}"{% endif %}>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-ip">Hostname</label>
            <div class="col-xs-8">
                <input id="form-hostname" class="form-control" type="text" placeholder="Hostname" name="hostname" {% if dispositivo %}value="{{ dispositivo.hostname }}"{% endif %}>
            </div>
            <div class="col-xs-2">
                <button class="form-control btn btn-info" onclick="calchostname()" type="button">Genera</button>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-2" for="form-control"></label>
            <div class="col-xs-10">
                <input class="form-control btn btn-primary" type="submit">
            </div>
        </div>
    </form>
{% endblock %}