
// Init della pagina
$$(document).on('page:init', '.page[data-name="gestione-stampanti"]', function (e, page) {

  loadTranslationsAndApply();

  Stampanti.caricaGrigliaStampanti();

  //#region Eventi della pagina"

  // Click su fab aggiungi
  $$(this).on('click', '#fab-aggiungi-stampante', function () {
    Stampanti.apriPopupGestioneStampante(TIPO_OPERAZIONE.INSERIMENTO);
  })

  // Click sulla riga della griglia per accesso in modifica
  $$(this).on('click', '#table-stampanti tbody tr', function () {

    // Recupero dati dalla riga
    let ip = $$(this).find('td[data-name="ip"]').text();
    let porta = $$(this).find('td[data-name="porta"]').text();
    let modello = $$(this).find('td[data-name="modello"]').text();
    let descrizione = $$(this).find('td[data-name="descrizione"]').text();
    let isPredefinita = $$(this).find('input[data-name="is-predefinita"]').prop('checked');
    isPredefinita = (isPredefinita != undefined && isPredefinita != false)

    Stampanti.apriPopupGestioneStampante(
      TIPO_OPERAZIONE.MODIFICA,
      ip, porta, modello, descrizione, isPredefinita);
  })

  //#endregion

})

const Stampanti = {

  caricaGrigliaStampanti() {

    // Svuoto la tabella
    let tbody = $$('#table-stampanti tbody');
    tbody.empty()

    app.preloader.show();

    // Effettuo la richesta ai webservices
    let url = app.data.url + WS_STAMPANTI.GET_STAMPANTI;
    app.request.promise.post(url, {})
      .then(function (res) {

        let stampanti = JSON.parse(res.data);

        // Salvo in una variabile la lista delle stampanti,
        // per non interrogare i webservices ogni volta che devo stam
        app.data.lista_stampanti = stampanti;

        let isPredefinita;
        let tdPredefinita = `
        <label class="checkbox">
            <input data-name="is-predefinita" type="checkbox" checked disabled/>
            <i class="icon-checkbox"></i>
        </label>`;

        // Ciclo le stampanti e creo la relativa riga sulla tabella
        let rigaStampante;
        stampanti.forEach((stampante) => {

          isPredefinita = (localStorage.getItem('stampantePredefinita') === stampante.ip);

          rigaStampante = $$(`
          <tr>
            <td data-name="ip" class="numeric-cell">${stampante.ip}</td>
            <td data-name="porta" class="numeric-cell">${stampante.porta}</td>
            <td data-name="modello" class="numeric-cell">${stampante.modello}</td>
            <td data-name="descrizione" class="label-cell">${stampante.descrizione}</td>
            <td data-name="predefinita" class="numeric-cell">
              ${(isPredefinita) ? tdPredefinita : ''}
            </td>
            <td data-name="stato" class="numeric-cell">Ping in corso...</td>
          </tr>`);

          tbody.append(rigaStampante);
        })

        // Se c'è almeno una stampante, controllo se è stata impostata quella predefinita
        // if (stampanti.length > 0) Utility.checkStampantePredefinita();

      })
      .then(() => {

        // Nascondo il preloader, in quanto il ping può richiedere qualche secondo,
        // e non vale la pena far attendere l'utente
        app.preloader.hide();

        this.setStatoStampanti();

      })
      .catch(function (errore) {
        app.preloader.hide();
        Utility.gestisciMessaggioErrore(errore);
      });

  },

  async apriPopupGestioneStampante(tipoOperazione, ip = '', porta = '', modello = '', descrizione = '', isPredefinita = false) {

    // Variabili di utilità
    let strTitolo;
    let strTestoPulsanteSalva;
    let blnMostraElimina;
    let htmlElimina = `
      <button 
        id="btn-elimina" 
        class="col-50 button button-raised button-fill button-round color-red"
        type="button" style="margin: 3px;">${await translateText('lbl61')}
      </button>`;

    // Classi da aggiungere agli input quando entro in modifica, altrimenti i valori vengono visualizzati male
    let inputVal = "";
    let itemInputVal = "";
    let disabled = "";

    // In base al tipo di operazione modifico l'aspetto della pagina
    switch (tipoOperazione) {

      case TIPO_OPERAZIONE.INSERIMENTO:
        strTitolo = await translateText('lbl50');
        strTestoPulsanteSalva = await translateText('lbl51');
        blnMostraElimina = false;
        break;

      case TIPO_OPERAZIONE.MODIFICA:
        strTitolo = await translateText('lbl62');
        strTestoPulsanteSalva = await translateText('lbl63');
        blnMostraElimina = true;

        inputVal = "input-with-value";
        itemInputVal = "item-input-with-value";
        disabled = "disabled";
        break;
    }

    let popupContent = `
  <div class="popup" id="popupGestioneStampante">
    <div class="view">
      <div class="page" data-name="popupGestioneStampante">
        <div class="navbar">
          <div class="navbar-bg"></div>
          <div class="navbar-inner">
          <div class="left">
              <a href="#" class="link"></a>
            </div>
            <div class="title">${strTitolo}</div>
            <div class="right">
              <a href="#" class="link popup-close">${await translateText('lbl64')}</a>
            </div>
          </div>
        </div>
        <div class="page-content">

          <!-- Variabili nascoste della pagina -->
          <input id="tipo-operazione" type="text" style="display: none;" value="${tipoOperazione}">

          <!-- Lista parametri -->
          <div class="list no-hairlines-md">
            <ul>

            <!-- Indirizzo IP -->
              <li class="item-content item-input item-input-outline ${itemInputVal}">
                <div class="item-inner">
                  <div class="item-title item-floating-label">IP</div>
                  <div class="item-input-wrap">
                    <input id="ip-stampante" class="${inputVal}" type="text" placeholder="${await translateText('lbl65')}" value="${ip}" ${disabled}>
                    ${(tipoOperazione == TIPO_OPERAZIONE.MODIFICA) ? '' : '<span class="input-clear-button"></span>'}
                  </div>
                </div>
              </li>

              <!-- Porta -->
              <li class="item-content item-input item-input-outline ${itemInputVal}">
                <div class="item-inner">
                  <div class="item-title item-floating-label">${await translateText('lbl72')}</div>
                  <div class="item-input-wrap">
                    <input id="porta-stampante" class="${inputVal}" type="text" placeholder="${await translateText('lbl66')}" value="${porta}">
                    <span class="input-clear-button"></span>
                  </div>
                </div>
              </li>

              <!-- Descrizione -->
              <li class="item-content item-input item-input-outline ${itemInputVal}">
                <div class="item-inner">
                  <div class="item-title item-floating-label">${await translateText('lbl67')}</div>
                  <div class="item-input-wrap">
                    <input id="descrizione-stampante" class="${inputVal}" type="text" placeholder="${await translateText('lbl68')}" value="${descrizione}">
                    <span class="input-clear-button"></span>
                  </div>
                </div>
              </li>

              <!-- Modello stampante -->
              <li class="item-content" style="justify-content:left">
                <span style="margin-right: 15px;">${await translateText('lbl69')}</span>
                <div id="tipo-stampante" class="segmented segmented-raised segmented-round" style="margin-left: 7px; min-width: 50%;">
                  <button class="button button-round ${modello == 'GK420T' ? 'button-active' : ""}">GK420T</button>
                  <button class="button button-round ${modello == 'ZT230' ? 'button-active' : ""}">ZT230</button>
                  <button class="button button-round ${modello != 'GK420T' && modello != 'ZT230' ? 'button-active' : ""}">${await translateText('lbl70')}</button>
                </div>
              </li>

              <li class="item-content" style="justify-content:left">
                <span style="margin-right: 15px;">${await translateText('lbl71')}</span>
                <label class="toggle toggle-init color-blue">
                  <input id="chk-stampante-predefinita" type="checkbox" ${isPredefinita ? 'checked' : ""}>
                  <span class="toggle-icon" style="margin-left: 7px"></span>
                </label>
              </li>

            </ul>
          </div>

          <div class="block">
            <div class="row" style="justify-content: center;">
              ${(blnMostraElimina) ? htmlElimina : ""}
              <button id="btn-salva" class="col-50 button button-raised button-fill button-round"
                type="button" style="margin: 3px;">${strTestoPulsanteSalva}</button>
              </div>
          </div>
        </div>
      </div>
    </div>
  </div>`

    // Creo ed apro il popup
    app.popup.create({
      content: popupContent,
      on: {
        opened: function (popup) {

          // Click su pulsante salva del popup
          $$('.page[data-name="popupGestioneStampante"]').on('click', '#btn-salva', function () {
            Stampanti.salvaStampante();
          })

          // Click su pulsante salva del popup
          $$('.page[data-name="popupGestioneStampante"]').on('click', '#btn-elimina', function () {
            Stampanti.eliminaStampante();
          })

          // Click sui bottoni tipo stampante
          $$('.page[data-name="popupGestioneStampante"]').on('click', '#tipo-stampante button', function () {
            $$('#tipo-stampante button').removeClass('button-active');
            $$(this).addClass('button-active');
          })

        },
      }
    }).open();

  },

  salvaStampante() {

    let tipoOperazione = $$('#tipo-operazione').val();

    // Verifico che i parametri siano corretti, altrimenti esco
    let verifica = this.verificaParametriOK();
    if (!verifica.esito) return;

    // Controllo il toggle di "stampante predefinita"
    if (verifica.parametri.isPredefinita) {
      // Setto nella localStorage l'ip della stampante
      localStorage.setItem('stampantePredefinita', verifica.parametri.ip);
    }
    else {
      // Se l'ip sulla local storage è lo stesso della stampante che sto modificando,
      // elimino la chiave dalla local storage
      Stampanti.checkCleanLocalStorage('stampantePredefinita', verifica.parametri.ip);
    }

    // In base al tipo di operazione, creo l'url del ws da chimare
    let url;
    switch (tipoOperazione) {
      case TIPO_OPERAZIONE.INSERIMENTO:
        url = app.data.url + WS_STAMPANTI.INSERISCI;
        break;

      case TIPO_OPERAZIONE.MODIFICA:
        url = app.data.url + WS_STAMPANTI.AGGIORNA;
        break;
    }

    app.preloader.show();

    // Effettuo la chiamata ai webservices
    app.request.promise.post(url, verifica.parametri)
      .then(() => {
        app.preloader.hide();
        app.popup.get('#popupGestioneStampante').close();
        this.caricaGrigliaStampanti();
      })
      .catch(function (errore) {
        app.preloader.hide();
        Utility.gestisciMessaggioErrore(errore);
      });

  },

  async eliminaStampante() {
    let ipStampante = $$('#ip-stampante').val().trim();
    let descrStampante = $$('#descrizione-stampante').val().trim();

    // Chiedo conferma dell'eliminazione
    var msg = await translateText('lbl33', { IP: ipStampante });
    app.dialog.confirm(msg, '<i class="icon f7-icons" style="color:orange;">question_diamond_fill</i>', function () {

      Stampanti.checkCleanLocalStorage('stampantePredefinita', ipStampante);

      // Effetto l'eliminazione
      let url = app.data.url + WS_STAMPANTI.ELIMINA;
      app.request.promise.post(url, { ip: ipStampante, descrizione: descrStampante })
        .then(() => {
          // Chiudo il popup e ricarico la pagina delle stampanti
          app.popup.get('#popupGestioneStampante').close();
          Stampanti.caricaGrigliaStampanti();
        })
        .catch(function (errore) {
          Utility.gestisciMessaggioErrore(errore);
        })
    }
    );

  },

  verificaParametriOK() {

    let blnEsito = true;

    // Predispongo un oggetto da restituire
    let objVerifica = {
      esito: false,
      messaggio: '',
      parametri: {
        ip: null,
        porta: null,
        descrizione: null,
        modello: null,
        isPredefinita: null
      }
    }

    // Verifico la validità dell'IP
    let ip = $$('#ip-stampante').val().trim();
    let ipv4_regex = /^(?:25[0-5]|2[0-4]\d|1\d\d|[1-9]\d|\d)(?:\.(?:25[0-5]|2[0-4]\d|1\d\d|[1-9]\d|\d)){3}$/gm;
    if (!ipv4_regex.test(ip)) {
      objVerifica.messaggio += "Indirizzo IP non valido!<br>";
      blnEsito = false;
    } else
      objVerifica.parametri.ip = ip

    // Verifico la porta
    let porta = $$('#porta-stampante').val().trim();
    if (porta == '' || isNaN(Number(porta))) {
      objVerifica.messaggio += "Porta non valida!<br>";
      blnEsito = false;
    } else
      objVerifica.parametri.porta = porta

    // Verifico la descrizione
    let descrizione = $$('#descrizione-stampante').val().trim().replace("'", "''");
    if (descrizione == '') {
      objVerifica.messaggio += "Inserisci una descrizione!<br>";
      blnEsito = false;
    } else
      objVerifica.parametri.descrizione = descrizione;

    // Modello stampante
    let modello = $$("#tipo-stampante button.button-active").text();
    if (modello == null || modello == undefined) {
      objVerifica.messaggio += "Selezionare il modello!<br>";
      blnEsito = false;
    } else
      objVerifica.parametri.modello = modello;

    // Recupero lo stato di stampante predefinita
    objVerifica.parametri.isPredefinita = $$('#chk-stampante-predefinita').prop('checked');


    objVerifica.esito = blnEsito;

    // Se la verifica non è andata a buon fine mostro un messaggio di errore
    if (!blnEsito)
      Utility.alertAttenzione(objVerifica.messaggio.trim());

    return objVerifica;

  },

  setStatoStampanti() {

    // Variabili di utilità
    let tdStato;
    let ip;

    // Recupero tutte le righe della tabella
    let righeStampante = $$('#table-stampanti tbody tr');

    // Le ciclo
    for (const riga of righeStampante.toArray()) {

      // Recupero la cella dello stato e l'ip della stampante
      tdStato = $$(riga).find('td[data-name="stato"]');
      ip = $$(riga).find('td[data-name="ip"]').text();

      // Effettuo chiamata ai ws
      Stampanti.setStatoStampante(ip, tdStato);

    }
  },

  setStatoStampante(ip, tdStato) {

    let url = app.data.url + WS_STAMPANTI.PING;
    app.request.promise.post(url, { ip })
      .then(res => {

        let isOnline = (res.data.toString().trim() === 'true');

        // Imposto lo stile della td
        $$(tdStato).css('font-weight', 'bold')
        if (isOnline) {
          $$(tdStato).css('color', 'green');
          $$(tdStato).text('ONLINE');
        } else {
          $$(tdStato).css('color', 'red');
          $$(tdStato).text('OFFLINE');
        }

      })
      .catch(function (errore) {
        $$(tdStato).css('color', 'red');
        $$(tdStato).text('ERRORE PING');
      });

  },

  checkCleanLocalStorage(key, valoreConfronto) {

    // Se il valore sulla local storage (relativo alla key) è lo stesso del valore di confronto,
    // elimino la chiave dalla local storage
    let valoreLocalStorage = localStorage.getItem(key);

    if (valoreLocalStorage == valoreConfronto)
      localStorage.removeItem(key);
  },

  disegnaPulsantiStampanti(idPopup, classContainerPulsanti, classPerListenerClick) {
    // Recupero la <div> che contiene i bottoni e la svuoto
    let buttonContainer = $$(`#${idPopup} .${classContainerPulsanti}`);
    $$(buttonContainer).empty();

    // Ciclo le stampanti in memoria e le disegno --> la logica è stata spostata
    let pulsante;

    for (const stampante of app.data.lista_stampanti) {

      pulsante = `
    <button 
      ipStampante = "${stampante.ip}"
      portaStampante = "${stampante.porta}"
      modelloStampante = "${stampante.modello}"
      class="button button-fill button-round inline-element ${classPerListenerClick}">${stampante.descrizione}</button>
      `;
      $$(buttonContainer).append(pulsante);

    }
  }

}


// Appena viene caricato questo file javascript, 
// carico la griglia delle stampanti, in modo da avere subito disponibile
// un oggetto che le contiene, senza dover interrogare i webservices
// ogni volta che devo stampare un etichetta
Stampanti.caricaGrigliaStampanti();