@extends('layouts.app')
@section('content')
    @if (session('error'))
        <div class="container my-5">
            <div class="px-4 my-2">
                <div class="mr-4 alert alert-danger" role="alert">
                    {{ session('error') }}
                </div>
            </div>
        </div>
    @endif

    <div class="container my-5">
        <div class="row p-4 pb-0 pe-lg-0 pt-lg0 rounded-3 border shadow-lg">
            <div class="">

                <h4 class="text-dark">Comentários da Live --</h4>

                <table class="table table-hover table-striped">
                    <thead>
                        <tr>
                            <th scope="col">Rede Social</th>
                            <th scope="col">ID Video</th>
                            <th scope="col">Título</th>
                            <th scope="col">Status</th>
                            <th scope="col">Data/Hora</th>
                            <th scope="col">VD + CT</th>
                            <th scope="col">CT</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($lives as $i => $item)   
                            @php 
                                if (isset($item['video']["id"])){
                                  $id = $item['video']["id"] ;
                                    $social = 'facebook' ;
                                    $jsfunc = 'FB';
                                } 
                                else { 
                                     $id = $item["id"];
                                    $social = 'instagram';
                                    $jsfunc = 'IG';
                                    }
                                
                            @endphp
                            <tr>
                                <td class="text-center" width="10%">
                                    <span class="text-primary px-0"><i class="fa-brands fa-{{ $social }}"></i></span>
                                </td>
                                <td>
                             
                                    <a href="{{ url('/comments/live/' . $id. '/' . $token. '/'. $social ) }}">{{ $id }}</a> 
                                                         
                                     
                               
                                </td><td>
                                
                                    {!! isset($item['title']) ? $item['title'] : (isset($item['caption']) ? $item['caption'] : '-') !!}
                                </td>
                                <td>
                                @if (isset($item['status']))
                                    @switch($item['status'])
                                        @case('VOID')
                                            <span class="text-success">Video</span>
                                        @break

                                        @case('LIVE')
                                            <span class="text-danger">Broadcast</span>
                                        @break

                                        @default
                                            <span class="">Video</span>
                                    @endswitch
                                @endif
                                
                                @if (isset($item['media_type']))
                                    @switch($item['media_type'])
                                        @case('VOID')
                                            <span class="text-success">Video</span>
                                        @break

                                        @case('BROADCAST')
                                            <span class="text-danger">Broadcast</span>
                                        @break

                                        @default
                                            <span class="">Video</span>
                                    @endswitch
                                @endif
                                </td>
                                <td>
                                    <span>{!! \Carbon\Carbon::parse( isset($item['creation_time']) ? $item['creation_time']  :   $item['timestamp'] )->format("d/m/Y H:i:s") !!}</span>
                                </td>
                                <td>
                                    <button class="btn btn-danger btn-sm" id="btn-video-{{ $id }}" onclick="delete{{ $jsfunc }}Video('{{ $id }}')" {{ ( $jsfunc == 'IG' ) ? 'disabled': ''  }} >
                                        Apagar
                                    </button>
                                </td>
                                <td>
                                    <button class="btn btn-warning btn-sm text-white" id="btn-comments-{{  $id }}" onclick="delete{{ $jsfunc }}Comments('{{ $id }}')">
                                        Apagar 
                                    </button>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>

                {{ $lives->links('pagination.custom') }}
            </div>
        </div>
    </div>
    @push('scripts')
    <script type="text/javascript">
        const token = "{{ $token }}";

         function deleteFBVideo(video_id) {
            if (confirm(`Realmente deseja deletar esta Live  com o id ${video_id}? \n Ao confirmar, todos os dados da live serão apagados.`) ){
                var btn = document.getElementById(`btn-video-${video_id}`);
                let html =   `<div class="spinner-border" role="status">
                            <span class="visually-hidden">Apagando...</span>
                            </div>`
                btn.innerHtml = html
                
                if (confirm("Realmente deseja apagar esta live do Facebook\n Esta ação não poderá ser revertida. ?")) {

                    $.ajax({
                        url: `{{ url('/all-comments') }}/${video_id}/${token}`,
                        type: "delete",
                        success: function(response) {
                            console.log('response', response);
                            if (response.success) {
                                console.log("comentários eliminados", );
                              //  window.location.reload();
                            }
                            
                        },
                        error: function(jqXHR, textStatus, errorThrown) {
                            let error = jqXHR.responseJSON;
                            html = `<button class="btn btn-danger btn-sm" id="btn-${video_id}" onclick="deleteComments('${video_id}')">Apagar</button>`;
                            btn.innerHTML = html;
                            alert("Desculpe, Houve um erro ao apagar os comentários \n"+ (error ? error.message : ''));
                            console.log(textStatus, errorThrown);
                        }
                    });
                    
                    $.ajax({
                        url: `https://graph.facebook.com/v14.0/${video_id}?access_token=${token}`,
                        type: "delete",
                        success: function(response) {
                            console.log('response', response);
                            if (response.success) {
                                window.location.reload();
                            }
                        },
                        error: function(jqXHR, textStatus, errorThrown) {
                            console.log(textStatus, errorThrown);
                        }
                    });
                }
            }
        }

        function deleteFBComments(video_id) {
            if (confirm(`Realmente deseja apagar os comentários desta Live com o id ${video_id}?\n Somente os comentários da live serão apagados!`) ){
                const btn = document.getElementById(`btn-comments-${video_id}`)
                let html = `<div class="spinner-border" role="status">
                            <span class="visually-hidden">Apagando...</span>
                            </div>`
                btn.innerHTML = html
                $.ajax({
                    url: `{{ url('/all-comments') }}/${video_id}/${token}`,
                    type: "delete",
                    success: function(response) {
                        console.log('response', response);
                        //if (response.success) {
                            window.location.reload();
                        //}
                        console.log("eliminado", );
                    },
                    error: function(jqXHR, textStatus, errorThrown) {
                        let error = jqXHR.responseJSON
                        html = `
                        <button class="btn btn-danger btn-sm" id="btn-${video_id}" onclick="deleteComments('${video_id}')">Apagar</button>
                        `
                        btn.innerHTML = html
                        alert("Desculpe, Houve um erro ao apagar os comentários \n"+ (error ? error.message : ''))
                        console.log(textStatus, errorThrown);
                    }
                });
            }
        } 

        function deleteIGVideo(video_id) {
            let igDeleteImplemented = false;
            if (igDeleteImplemented){
                confirm(`Realmente deseja apagar este video com o id ${video_id}? \n Ao confirmar, todos os dados do video serão apagados.`) 
                var btn = document.getElementById(`btn-video-${video_id}`);
                let html =   `<div class="spinner-border" role="status">
                            <span class="visually-hidden">Apagando...</span>
                            </div>`
                btn.innerHtml = html
                
                if (confirm("Realmente deseja apagar esta live do Instagram?\n Esta ação não poderá ser revertida.")) {

                    $.ajax({
                        url: `{{ url('/all-comments') }}/${video_id}/${token}`,
                        type: "delete",
                        success: function(response) {
                            console.log('response', response);
                            if (response.success) {
                                console.log("comentários eliminados", );
                              //  window.location.reload();
                            }
                            
                        },
                        error: function(jqXHR, textStatus, errorThrown) {
                            let error = jqXHR.responseJSON;
                            html = `<button class="btn btn-danger btn-sm" id="btn-${video_id}" onclick="deleteComments('${video_id}')">Apagar</button>`;
                            btn.innerHTML = html;
                            alert("Desculpe, Houve um erro ao apagar os comentários \n"+ (error ? error.message : ''));
                            console.log(textStatus, errorThrown);
                        }
                    });

                    $.ajax({
                        url: `https://graph.instagram.com/v14.0/${video_id}?access_token=${token}`,
                        type: "delete",
                        success: function(response) {
                            console.log('response', response);
                            if (response.success) {
                                console.log("video eliminados", );
                                window.location.reload();
                            }
                        },
                        error: function(jqXHR, textStatus, errorThrown) {
                            let error = jqXHR.responseJSON;
                            alert("Desculpe, Houve um erro ao apagar o video \n"+ (error ? error.message : ''));
                            console.log(error.message);
                        }
                    });
                }
            }
        }

        function deleteIGComments(video_id) {
            if (confirm(`Realmente deseja apagar os comentários deste Video com o id ${video_id}?\n Somente os comentários da live serão apagados!`) ){
                const btn = document.getElementById(`btn-comments-${video_id}`)
                let html = `<div class="spinner-border" role="status">
                            <span class="visually-hidden">Apagando...</span>
                            </div>`
                btn.innerHTML = html
                $.ajax({
                    url: `{{ url('/all-comments') }}/${video_id}/${token}`,
                    type: "delete",
                    success: function(response) {
                        console.log('response', response);
                        //if (response.success) {
                            window.location.reload();
                        //}
                        console.log("eliminado", );
                    },
                    error: function(jqXHR, textStatus, errorThrown) {
                        let error = jqXHR.responseJSON
                        html = `
                        <button class="btn btn-danger btn-sm" id="btn-${video_id}" onclick="deleteComments('${video_id}')">Apagar</button>
                        `
                        btn.innerHTML = html
                        alert("Desculpe, Houve um erro ao apagar os comentários \n"+ (error ? error.message : ''))
                        console.log(textStatus, errorThrown);
                    }
                });
            }
        }
    </script>
    @endpush
@endsection