'use strict';
import {createRowDomain} from '../templates/domains-template.js';
import { getToken, logoutKeycloak } from './script.js';
import {createNewUser, createNewService} from '../templates/create-new-domain-template.js';

class App {
    constructor(myDomains, requestsToDomain) {
        // this.myDomains = myDomains;
        this.requestsToDomain = requestsToDomain;
        this.showAllDomains(myDomains);
        this.fillModal();
        this.performLogout();
    }

    showAllDomains(domainsToShow) {
        const addHere = document.getElementById('table-row-domains');
        for(const d of domainsToShow) {
            const tr = document.createElement('tr');
            tr.innerHTML = createRowDomain(d);
            const plusRow = addHere.lastElementChild;
            addHere.insertBefore(tr, plusRow);
            if(d.admin) {
                const toggle = tr.querySelector('.toggle-button');
                this.statoDomainToggle(d, toggle, this.requestsToDomain);
                const deleteDomain = tr.querySelector('.fa-trash');
                deleteDomain.addEventListener('click', async () => {
                    const resultDelete = await this.requestsToDomain.deleteDomain(d);
                    if(resultDelete) {
                        addHere.removeChild(tr);
                    }
                    else {
                        throw new Error('Impossibile eliminare il dominio, provare piu\' tardi');
                    }
                });
            }
        }
    }


    statoDomainToggle(domain, toggle, requestsToDomain) {
        toggle.addEventListener('click', async (event) => {
            event.preventDefault();
            const token = getToken();
            const stop = toggle.classList.contains('active');
            if(stop) {
                // toggle attiva. Se clicco richiedo che il dominio sia fermato
                const resultStop = await requestsToDomain.stopDomain(domain);
                if(resultStop) {
                    toggle.classList.remove('active');
                }
                else {
                    throw new Error('Impossibile fermare il dominio, provare piu\' tardi');
                }
            }
            else {
                const resultStart = await requestsToDomain.startDomain(domain);
                if(resultStart) {
                    toggle.classList.add('active');
                }
                else {
                    throw new Error('Impossibile far partire il dominio, provare piu\' tardi');
                }
            }
        });
    }


    async fillModal() {
        const allServices = ["luci","camera","azione"];//await this.requestsToDomain.getAllServices(); // DA FARE: scommenta (quindi usa la chiamata al domain)
        const div = document.createElement('div');
        div.id = "checkbox-div";
        for(const s of allServices) {
            div.innerHTML = div.innerHTML+createNewService(s); 
        }
        const modalBody = document.getElementById('modal-body-new-domain');
        modalBody.appendChild(div);
        modalBody.innerHTML = modalBody.innerHTML + createNewUser();

        let userNum = 0;
        const addUserButton = document.getElementById('add-user-button');
        addUserButton.addEventListener('click', () => {
            modalBody.innerHTML = modalBody.innerHTML + createNewUser();
            userNum++;
        });

        const form = document.getElementById('new-domain-form');
        form.addEventListener('submit', (event) => {
            event.preventDefault();
            
            const domainName = form['nuovoDominio'].value;
            if(domainName == null){
                alert('Inserire un valore valido in ogni campo');
                return;
            }

            const topicsArr = [ {role:"A", topic: `+/${domainName}/#`} ];
            const checkboxarr = document.querySelectorAll("input.form-check-input");
            const checks = [];  // array contentente i nomi dei servizi che l'utente vuole nel dominio che sta creando
            for(const c of checkboxarr){
                if(c.checked) {
                    checks.push(c.value);
                    topicsArr.push({role:"U", topic: `to/${domainName}/luci/${c.value}/#`});
                    topicsArr.push({role:"U", topic: `from/${domainName}/luci/${c.value}/#`});
                    topicsArr.push({role:"U", topic: `rpc/${domainName}/luci/${c.value}/#`});        
                    
                       
                   }
            }
            if(checks.length === 0){
                alert('Inserire un valore valido in ogni campo');
                return;
            }

            let i=1;
            const utenti = [];
            while(i<=userNum){
                const nome = document.getElementById(`nuovoUtente${i}`).value;
                const password = document.getElementById(`passwordUtente${i}`).value;
                const ruolo = document.getElementById(`ruoloUtente${i}`).value;
                console.log(ruolo);//FIXME aaaaaaaaa
                if(nome == null || password == null || ruolo == null || ruolo == "unselected"){
                    alert('Inserire un valore valido in ogni campo');
                    return;
                }

                utenti.push({nome,password,ruolo});
                i++;
            }
            
            const json = {
                domain: domainName,
                services: checks,
                users: utenti,
                topics: topicsArr
            };
            console.log(json);

            this.requestsToDomain.createNewDomain(json);
        });
    }



    performLogout() {
        const buttonLogout = document.getElementById('button-logout');
        buttonLogout.addEventListener('click', async (event) => {
            event.preventDefault();
            logoutKeycloak();
        });
    }

}

export default App;