import {createApp} from 'vue'
import Swal from "sweetalert2"

const $webienAiApp = createApp({
    name: "WebienAiAdmin",
    data() {
        return {
            loading: false,
            file: webienAiSettings.file,
            checkActive: false,
            generateFiles: false,
            status: {
                filesTotal: 0,
                filesDone: 0,
                folderId: '',
            },
        }
    },
    mixins: [],
    computed: {
        statusText() {
            if(this.generateFiles){
                if(this.status.filesTotal > 0) {
                    return `${this.status.filesDone}/${this.status.filesTotal} filer från Google Drive hanterade.`;
                } else {
                    return 'Hämtar filer från Google Drive...';
                }
            } else {
                return 'Sparar..';
            }

        }
    },
    watch: {

    },
    methods: {

        generateFile() {

            let app = this;

            this.generateFiles = true;

            this.statusText = 'Hämtar filer...';

            this.loading = true;

            let status = setInterval(() => {
                app.checkStatus();
            }, 1000);

            jQuery('#webien-ai-dashboard .loader').show().addClass('generate');

            jQuery.ajax({
                type : "post",
                dataType : "json",
                url : webien.ajaxurl,
                data:{
                    'action': 'webien_ai_generate',
                    'newSource': true,
                },
                success: function(data){
                    console.log(data);
                    app.loading = false;
                    app.file = data.data.file;

                    jQuery('#webien-ai-dashboard .loader').hide().removeClass('generate');
                    jQuery('.check-settings').html('<i class="icon icon-check"></i>');
                    jQuery('.check-file').html('<i class="icon icon-check"></i>');

                    Swal.fire({
                        //icon: 'success',
                        title: 'Sparat',
                        text: 'Din informationskälla för AI:n är nu uppdaterad.',
                        confirmButtonText: 'Ok',
                    })

                    clearInterval(status);

                    this.generateFiles = false;

                }
            });

        },

        updateAssistant() {
            let app = this;

            this.loading = true;

            jQuery('#webien-ai-dashboard .loader').show();

            jQuery.ajax({
                type : "post",
                dataType : "json",
                url : webien.ajaxurl,
                data:{
                    'action': 'webien_ai_update',
                },
                success: function(data){
                    console.log(data);
                    app.loading = false;

                    jQuery('#webien-ai-dashboard .loader').hide();
                    jQuery('.check-settings').html('<i class="icon icon-check"></i>');

                    Swal.fire({
                        //icon: 'success',
                        title: 'Sparat',
                        text: 'AI:n är uppdaterad med dina inställningar.',
                        confirmButtonText: 'Ok',
                    })



                }
            });

        },

        checkStatus() {
            let app = this;
            if(app.checkActive) return;
            app.checkActive = true;
            // Get contents of text file from server
            fetch(webien.statusFile)
                .then(response => response.text())
                .then(textString => {
                    let json = JSON.parse(textString);
                    if(json.hasOwnProperty('filesTotal')){
                        app.status = JSON.parse(textString);
                    }
                    // Update with of bar
                    let progress = (app.status.filesDone / app.status.filesTotal) * 100;
                    jQuery('#webien-ai-dashboard .loader .bar .inner').css('width', progress + '%');
                    app.checkActive = false;
                });
        }

    },
    mounted: function () {

        // Attach listoner to button
        let app = this;

        // Vue dont seem to work. Use jQuery instead.. whatevva
        jQuery('#generate-file').on('click', app.generateFile);
        jQuery('#update-ai').on('click', app.updateAssistant);

        if(webienAiSettings.assistant.id){
            jQuery('.check-settings').html('<i class="icon icon-check"></i>');
        } else {
            jQuery('.check-settings').html('<i class="icon icon-warning"></i>');
        }
        if(webienAiSettings.assistant.file_id){
            jQuery('.check-file').html('<i class="icon icon-check"></i>');
        } else {
            jQuery('.check-file').html('<i class="icon icon-warning"></i>');
        }

    },
    created() {

    },
    components: {
    },
});

// Mount app to DOM
if(document.getElementById('webien-ai-dashboard')) {
    window.$webienAiApp = $webienAiApp.mount('#webien-ai-dashboard');
}