@extends('masterpage.masterpage')

@section('content')
    <section class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
            <h1>Integrar Whatsapp</h1>
          </div>
        </div>
      </div>
    </section>

    <section class="content">
      <div class="container-fluid">
        @if(Session::has('flash_message'))
          <div class="alert alert-success alert-dismissible">
            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
            {{ Session::get('flash_message')}}
          </div>
        @endif
        @if(Session::has('error'))
          <div class="alert alert-danger alert-dismissible">
            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
            {{ Session::get('error')}}
          </div>
        @endif
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Application Buttons</h3>
                    </div>
                    <div class="card-body">
                        <div class="x_content">
                            <a class="btn btn-app bg-success" onclick="restartBot()">
                                <i class="fas fa-refresh"></i> Restart Bot
                            </a>
                            <a class="btn btn-app bg-success" onclick="importContacts()">
                                <i class="fas fa-users"></i> Importar Contatos
                            </a>
                            <a class="btn btn-app bg-success" onclick="onBot()">
                                <i class="fas fa-refresh"></i> Ativar Respostas Automaticas
                            </a>
                        </div>
                    </div>
                </div>
            </div>
          <div class="col-md-12" style="float:none;margin:auto;">

            <div class="card card-default">
              <div class="card-header">
                <h3 class="card-title"><b><i>Integrar</b></i></h3>
              </div>
              <div id="divQRCode" class="form-group" style="display: none">
                <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">LEIA O QRCODE<span id="countDown"></span>
                </label>
                <div class="col-md-4 col-sm-6 col-xs-12">
                    <img id="qrcode" width="100%" height="100%">
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
    <script src="{{ url('/js/socketio.js') }}" type="text/javascript"></script>
@stop

@section('scripts')

  <script>

    let botAutomateStatus = "on"
    const BASE_URI = 'http://localhost:8000'
    const BEARER_TOKEN = 'Bearer $2b$10$hTzjCkIZufeFlXn6pEF0Re0RJThoRM33gnc_sfGXCW09_mhBfAJtK'
    const SECRET_KEY = 'THISISMYSECURETOKEN'

    const socket = io("http://127.0.0.1:8000/");
    var buffer = null;
    //socket.emit('start-session')
    socket.on('statusSession', function(msg) {
        console.log(msg);
        if(msg === 'isLogged') setLabelsConectionOk();
        if(msg === 'qrReadSuccess') setLabelsConectionOk();

    })

    socket.on('server-active', function(msg) {
        console.log(msg);
    })

    socket.on('qrcode', function(msg) {
        console.log(msg);
        setReadyQrCode(msg);
    });

    function checkApiStatus(){
        return new Promise(async (resolve) => {
            try{
              await fetch(BASE_URI + '/status-api', {
                    method:'get',
                    headers: {
                        'Content-Type': 'application/json'
                    },
                })
                .then(resp => resp.json())
                .then(json => resolve(json))
            }catch(e){
                resolve(false);
            }
        })
    }

    function restartBot(){
        return new Promise(async (resolve) => {
            try{
                let status_api = false;
                Swal.fire({
                    title: "Reiniciar Robô?",
                    showCancelButton: true,
                    icon: "question",
                    confirmButtonText: "Sim",
                    showLoaderOnConfirm: true,
                    preConfirm: async (login) => {
                        try {
                            const response = await fetch(BASE_URI + '/restart', {
                                                        method:'get',
                                                        headers: {
                                                            'Content-Type': 'application/json'
                                                        },
                                                    })
                            if (!response.ok) {
                                return Swal.showValidationMessage(`
                                    ${JSON.stringify(await response.json())}
                                `);
                            }
                            return response.json();
                        } catch (error) {
                            Swal.showValidationMessage(`
                                Request failed: ${error}
                            `);
                        }
                    },
                    allowOutsideClick: () => !Swal.isLoading()
                    }).then(async (result) => {
                        Swal.fire({
                                title: `Reiniciando seu Robô!`,
                                text: "aguarde",
                                icon: "success"
                            });
                            Swal.showLoading();
                        while (!status_api) {
                             await new Promise(resolve => setTimeout(resolve, 10000));
                             status_api = await checkApiStatus();
                        }
                        if(status_api){
                            socket.emit('start-session')
                        }
                        if (result.value) {
                            Swal.fire({
                                title: `Riniciado com sucesso`,
                                text: "Reiniciado",
                                icon: "success"
                            });
                        }
                    });

            }catch(e){
                resolve(false);
            }
        })
    }

    function importContacts(){
        return new Promise(async (resolve) => {
            try{
                Swal.fire({
                    title: "Importar todos os contatos",
                    showCancelButton: true,
                    confirmButtonText: "Iniciar",
                    showLoaderOnConfirm: true,
                    preConfirm: async (login) => {
                        try {
                            const response = await fetch(BASE_URI + '/get-all-contacts', {
                                                        method:'get',
                                                        headers: {
                                                            'Content-Type': 'application/json'
                                                        },
                                                    })
                            if (!response.ok) {
                                return Swal.showValidationMessage(`
                                    ${JSON.stringify(await response.json())}
                                `);
                            }
                            return response.json();
                        } catch (error) {
                            Swal.showValidationMessage(`
                                Request failed: ${error}
                            `);
                        }
                    },
                    allowOutsideClick: () => !Swal.isLoading()
                    }).then(async (result) => {
                        if (result.value) {

                            Swal.fire({
                                title: `Salvando seus contatos no banco de dados`,
                                text: "importando",
                                icon: "success"
                            });
                            Swal.showLoading();
                            contacts = await sendImportContacts(result.value);
                            Swal.fire({
                                title: `Importado`,
                                text: "Seus contatos de WhatsApp fora importados",
                                icon: "success"
                            });
                        }
                    });

            }catch(e){
                resolve(false);
            }
        })
    }

    function onBot(){
        return new Promise(async (resolve) => {
            try{
                Swal.fire({
                    title: "Importar todos os contatos",
                    showCancelButton: true,
                    confirmButtonText: "Iniciar",
                    showLoaderOnConfirm: true,
                    preConfirm: async (login) => {
                        try {
                            const response = await fetch(BASE_URI + '/on-bot', {
                                                        method:'post',
                                                        headers: {
                                                            'Content-Type': 'application/json'
                                                        },
                                                        body:JSON.stringify({ status: botAutomateStatus})
                                                    })
                            if (!response.ok) {
                                return Swal.showValidationMessage(`
                                    ${JSON.stringify(await response.json())}
                                `);
                            }
                            return response.json();
                        } catch (error) {
                            Swal.showValidationMessage(`
                                Request failed: ${error}
                            `);
                        }
                    },
                    allowOutsideClick: () => !Swal.isLoading()
                    }).then(async (result) => {

                        console.log(result.value);
                        botAutomateStatus = result.value ? 'off' : 'on'
                        if(result.value.status){
                            Swal.fire({
                                title: `Automação ativada com  sucesso!`,
                                text: "On",
                                icon: "success"
                            });
                            $("#onAutomate").css("background-color", "#1abb9c");
                            $("#onAutomate").css("color", "white");
                            $("#LabelOnAutomate").text("Desativar Respostas Automaticas");
                        }
                        else{
                            Swal.fire({
                                title: `Automação desativada com  sucesso!`,
                                text: "Off",
                                icon: "success"
                            });
                            $("#onAutomate").css("background-color", "#f9f9f9");
                            $("#onAutomate").css("color", "#73879C");
                            $("#LabelOnAutomate").text("Ativar Respostas Automaticas");
                        }
                    });

            }catch(e){
                resolve(false);
            }
        })
    }

    async function sendImportContacts(contacts){
        return new Promise(async (res) => {
            await fetch("{{URL('clientes/importContactWhatsappp')}}", {
                method: "POST",
                body: JSON.stringify(contacts),
                credentials: "same-origin",
                headers: {
                    "X-CSRF-Token": "{{ csrf_token() }}",
                    "Content-type": "application/json; charset=UTF-8"
                },

            })
            .then(response => {
                return response.json()
            }).then(async json => {
                res(json);
            })

        })
    }

    function checkBotStatus(){
        return new Promise(async (resolve) => {
            try{
              await  fetch(BASE_URI + '/status-bot', {
                    method:'get',
                    headers: {
                        'Content-Type': 'application/json'
                    },
                })
                .then(resp => resp.json())
                .then(json => resolve(json))
            }catch(e){
                resolve(false);
            }
        })
    }

    function checkBotAutomate(){
        return new Promise(async (resolve) => {
            try{
              await  fetch(BASE_URI + '/status-bot-automate', {
                    method:'get',
                    headers: {
                        'Content-Type': 'application/json'
                    },
                })
                .then(resp => resp.json())
                .then(json => resolve(json))
            }catch(e){
                resolve(false);
            }
        })
    }

    function toBase64(arr) {
        //arr = new Uint8Array(arr) if it's an ArrayBuffer
        return btoa(
            arr.reduce((data, byte) => data + String.fromCharCode(byte), '')
        );
    }

    function testaConexao() {
        return new Promise(async (resolve) => {
            let check = await statusSession()
            console.log(check)
            if (check.status == 'CONNECTED') {
                $('#status').val('SERVIDOR CONECTADO')
                $('#btInitConnection').hide();
                $('#btCloseConnection').show();
            } else {
                $('#status').val('SERVIDOR DESCONECTADO')
                $('#btInitConnection').show();
                $('#btCloseConnection').hide();
                //logout(0)
            }
        });
    }

    function sleep(ms) {
        return new Promise(resolve => setTimeout(resolve, ms));
    }

    function generateToken() {
        return new Promise(async (resolve) => {
            fetch(BASE_URI + '/' + SECRET_KEY + '/generate-token', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
            })
            .then(resp => resp.json())
            .then(json => resolve(json))
        })
    }

    function statusSession() {
        return new Promise(async (resolve) => {
            fetch(BASE_URI + '/status-session', {
                method: 'GET',
                headers: {
                    'Content-Type': 'application/json',
                    Authorization: BEARER_TOKEN
                },
            })
            .then(resp => resp.json())
            .then(json => resolve(json))
        })
    }

    function startSession() {
        return new Promise(async (resolve) => {
            fetch(BASE_URI + '/start-session', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    Authorization: BEARER_TOKEN
                },
            })
            .then(resp => resp.json())
            .then(json => resolve(json))
        })
    }

    function checkConnection() {
        return new Promise(async (resolve) => {
            fetch(BASE_URI + '/check-connection-session', {
                method: 'GET',
                headers: {
                    'Content-Type': 'application/json',
                    Authorization: BEARER_TOKEN
                },
            })
            .then(resp => resp.json())
            .then(json => resolve(json))
        })
    }

    function closeConnection() {
        return new Promise(async (resolve) => {
            fetch(BASE_URI + '/close-session', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    Authorization: BEARER_TOKEN
                },
            })
            .then(resp => resp.json())
            .then(json => resolve(json))
        })
    }

    function logoutConnection(params) {
        fetch(BASE_URI + '/logout-session', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                Authorization: BEARER_TOKEN
            },
        })
        .then(resp => resp.json())
        .then(json => console.log(JSON.stringify(json)))
    }

    function sendMessage (phones, message) {
        fetch(BASE_URI + '/send-message', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                Authorization: BEARER_TOKEN
            },
            body: JSON.stringify({phone: phones, message: message})
        })
        .then(resp => resp.json())
        .then(json => console.log(JSON.stringify(json)))
    }



    async function config() {

        $('#divQRCode').hide();
        let objQrCode = null
        var tentativas = 0
        apiStatus = await checkApiStatus()
        apiBot = await checkBotStatus()
        apiBotAutomate = await checkBotAutomate()
        if(apiBotAutomate.status){
            botAutomateStatus = "off"
            $("#onAutomate").css("background-color", "#1abb9c");
            $("#onAutomate").css("color", "white");
            $("#LabelOnAutomate").text("Desativar Respostas Automaticas");
        }
        if(!apiStatus){
            Swal.fire(
                'Falha de conexao!',
                'Seu serviço de API esta inativo.',
                'error'
            )
            return
        }
        if(!apiBot){
            $('#loadModal').modal()
            socket.emit('start-session')
        }
        else{
            Swal.fire(
                'Seu BOT esta ativo!',
                'Seu bot esta em funcionamento.',
                'success'
            )
            return
        }

        /*
        do {
            tentativas++
            if (tentativas == 6) {
                Swal.fire(
                    'Falha de conexao!',
                    'Tente novamente clicando em Iniciar conexão. Caso a falha persista entre em contato com o suporte.',
                    'error'
                )
                break
            } else {
                objQrCode = await startSession()
                console.log(objQrCode)
                if (objQrCode.status == 'CLOSED') {
                    $('#lblStatus').text('Estabelecendo conexão...tentativa 0'+tentativas)
                } else if ((objQrCode.status == 'INITIALIZING')) {
                    $('#lblStatus').text('Servidor conectado...')
                } else if ((objQrCode.status == 'QRCODE')) {
                    $('#lblStatus').text('Imprimindo QR Code...')
                    tentativas = 1
                } else {
                    break
                }
                await sleep(5000);
            }
        } while (objQrCode.status != 'QRCODE');

        if (tentativas != 6) {
            if (objQrCode.status == 'QRCODE') {
                setReadyQrCode();
            } else {
                setLabelsConectionOk();
            }
        }
        */
        //$('#loadModal').modal('hide')
    }

    function setLabelsConectionOk (){
        $('#status').val('SERVIDOR CONECTADO')
        $('#btInitConnection').hide();
        $('#btCloseConnection').show();
        $('#divQRCode').hide();
        $('#loadModal').modal('hide')
    }

    function setReadyQrCode (qrCode){
        $("#qrcode").attr("src", qrCode);
        $('#loadModal').modal('hide')
        $('#divQRCode').show();

        //countdown(35)
    }

    function countdown(seconds) {
        var countdownInterval = setInterval(function() {
            $('#countDown').text(' (' + seconds +')')
            seconds--
            return new Promise(async (resolve) => {
               // let check = await checkConnection()
                console.log(check)
                if (check.status == true) {
                    $('#countDown').text(' (CONECTADO)')
                    $('#status').val('SERVIDOR CONECTADO')
                    $('#btInitConnection').hide();
                    $('#btCloseConnection').show();
                    $('#divQRCode').hide();
                    return
                }
                if (seconds < 0) {
                    clearInterval(countdownInterval);
                    return
                }
            });
        }, 1000);
    }

    function logout(tipo) {
        if (tipo == 1) {
            Swal.fire({
                title: 'Tem certeza que deseja encerrar a conexao?',
                showCancelButton: true,
                confirmButtonText: 'Sim',
                denyButtonText: `Cancelar`,
                icon: 'info'
            }).then((result) => {
                if (result.value == true) {
                    let close = new Promise(resolve => closeConnection())
                    console.log(close)
                }
            })
        } else {
            let close = new Promise(resolve => closeConnection())
            console.log(close)
        }
    }


    config()
  </script>



@stop