/**
 * TEMPLATE: widget-super-base.js
 * =============================================
 * JavaScript base para Super Widget Fluig.
 * Extende SuperWidget com init, bindings e metodos.
 *
 * PADRAO DE PRODUCAO (carrossel_imagem_dwp, cultura_minha_vida):
 * - SuperWidget.extend({...})
 * - init() para carregar dados iniciais
 * - bindings local/global para eventos
 * - WCMSpaceAPI para salvar preferencias
 * - FLUIGC para componentes visuais
 * - Mustache para templates
 * - IDs com instanceId para multi-instancia
 */

var ${NOME_WIDGET} = SuperWidget.extend({

    // =============================================
    // VARIAVEIS (recebidas do data-params no FTL)
    // =============================================
    datasetId: null,
    titulo: null,
    qtdRegistros: null,

    // =============================================
    // INICIALIZACAO
    // =============================================
    init: function() {
        if (!this.isEditMode) {
            // Modo visualizacao: carregar dados
            this.carregarDados();
        } else {
            // Modo edicao: pre-preencher campos de config
            this.carregarConfiguracao();
        }
    },

    // =============================================
    // BINDING DE EVENTOS
    // =============================================
    bindings: {
        local: {
            'salvar-config': ['click_salvarConfig'],
            'recarregar': ['click_carregarDados'],
            'acao-item': ['click_acaoItem']
        }
    },

    // =============================================
    // SALVAR CONFIGURACAO (modo edicao)
    // =============================================
    salvarConfig: function(el, ev) {
        var that = this;
        var preferences = {};
        preferences.datasetId = $('#datasetId_' + this.instanceId).val();
        preferences.titulo = $('#titulo_' + this.instanceId).val();
        preferences.qtdRegistros = $('#qtdRegistros_' + this.instanceId).val();

        WCMSpaceAPI.PageService.UPDATEPREFERENCES({
            async: true,
            success: function(data) {
                FLUIGC.toast({
                    message: data.message,
                    type: 'success'
                });
            },
            fail: function(xhr, message, errorData) {
                FLUIGC.toast({
                    message: errorData.message,
                    type: 'danger'
                });
            }
        }, this.instanceId, preferences);
    },

    // =============================================
    // CARREGAR DADOS VIA API DATASET
    // =============================================
    carregarDados: function() {
        var that = this;

        if (!this.datasetId || this.datasetId === '') {
            $('#vazio_' + this.instanceId).show();
            return;
        }

        $('#loading_' + this.instanceId).show();
        $('#conteudo_' + this.instanceId).hide();
        $('#vazio_' + this.instanceId).hide();

        var url = '/api/public/ecm/dataset/search?datasetId=' + this.datasetId;
        if (this.qtdRegistros) {
            url += '&limit=' + this.qtdRegistros;
        }

        $.ajax({
            type: 'GET',
            dataType: 'json',
            url: url,
            contentType: 'application/json',
            success: function(data) {
                $('#loading_' + that.instanceId).hide();

                if (data && data.content && data.content.length > 0) {
                    var template = $('.template-lista-' + that.instanceId).html();
                    var html = Mustache.render(template, { itens: data.content });
                    $('#conteudo_' + that.instanceId).html(html).show();
                } else {
                    $('#vazio_' + that.instanceId).show();
                }
            },
            error: function(xhr, status, error) {
                $('#loading_' + that.instanceId).hide();
                FLUIGC.toast({
                    message: 'Erro ao carregar dados: ' + error,
                    type: 'danger'
                });
            }
        });
    },

    // =============================================
    // CARREGAR CONFIGURACAO (modo edicao)
    // =============================================
    carregarConfiguracao: function() {
        // Preferencias ja vem pre-carregadas via data-params
        // Aqui pode carregar opcoes dinamicas (ex: lista de datasets)
    },

    // =============================================
    // ACAO EM ITEM DA LISTA
    // =============================================
    acaoItem: function(el, ev) {
        var itemId = $(el).attr('data-id');
        // Exemplo: abrir detalhes em modal
        // FLUIGC.modal({
        //     title: 'Detalhes',
        //     content: '<p>ID: ' + itemId + '</p>',
        //     actions: [{ label: 'Fechar', autoClose: true }]
        // });
    }
});
