$(document).ready(function () {

window.setTimeout(reload(), 10000);

var bloco =  $(document).find('ul.servicos__lista');

var erros = bloco.find(`li.servicos__lista__item.erro`);

if(erros.length == 2){
    erros.hide();
} 

var panelbody =  $(document).find('.servicos .panel-body');

function reload() {
$("form#parent").each(function(index, element){       
       var inputs = [];
       $(element.children).each(function(index, element){
          inputs.push(element.value);
       });
       reloadBlocoServicos(inputs[0], inputs[1], inputs[2], inputs[3]);
});
}


function reloadBlocoServicos(parent, url, titulo, classe) {   
$.ajax({
    type: 'GET',
    url: `/_service/tudofacil/servicos?parent=${parent}&maxitens=3`
}).done(function(data) {
    preRender();
    if(bloco.find(`.servicos__lista__item .${classe}`).length > 0) {
        refreshCache__BlocoServicos(data, url, titulo, classe);
    } else {
        if(!($.isEmptyObject(data.resultados))) {
            bloco.find(`li.servicos__lista__item.erro`).remove().fadeOut('fast');
            renderTemplate__BlocoServicos(data, url, titulo, classe);
        }
    }   
}).always(function(){
    posRender(); 
});
}

function preRender() {
    bloco.addClass('d-none-servicos').fadeOut('fast');
    
    panelbody.append(`<div id="spinner" style="text-align:center; paddingfont-size:60px; color:#f6811d;">
                        <i class="fa fa-spinner fa-spin"></i>
                    </div>`).fadeIn('fast');    
}

function posRender() {
    panelbody.find("#spinner").remove().fadeOut('fast');
    bloco.removeClass('d-none-servicos').fadeIn('slow');

}

function renderTemplate__BlocoServicos(data, url, titulo, classe) {
    bloco.find(`li.servicos__lista__item.${classe}`).remove().fadeOut('fast');
    var parts = [];
    parts.push(`<li class="servicos__lista__item ${classe}">
                <h3 class="servicos__lista__item__titulo ${classe}">${titulo}</h3>
                <ul>`);
    var resultados = data.resultados;
    for(var i in resultados) {
        for(var j in resultados[i]){            
            parts.push(`<li>
                        <a href="/${url}/${resultados[i][j].href}" rel="noopener noreferrer">
                         ${resultados[i][j].text}
                        </a>
                        </li>`);
        }
    }
    parts.push(`</ul>
                <p class="text-right"><a href="/${url}">mais</a></p>
                </li>`);
    bloco.prepend(parts.join('')).show();
}

    function refreshCache__BlocoServicos(data, url, titulo, classe) {
        var f_Li = bloco.find(`li.servicos__lista__item.${classe} ul li`);
        var resultados = data.resultados;
        var cont = 0;

        for (var i in resultados) {
            for (var j in resultados[i]) {
                var li_replace = `
                        <a href="/${url}/${resultados[i][j].href}" rel="noopener noreferrer">
                            ${resultados[i][j].text}
                        </a>
                        `;
                if (cont < 3) {
                    f_Li[cont].innerHTML = li_replace;
                    cont++;
                }
            }
        }
    }

});