@extends('layouts.dashboard')

@section('content')
    <div class="breadcrumbs">
        <div class="col-sm-4">
            <div class="page-header float-left">
                <div class="page-title">
                    <h1>Login Sdk Logs</h1>
                </div>
            </div>
        </div>
    </div>

    <div class="content mt-3">
        <div class="animated fadeIn">
            <div class="row">

                <div class="col-md-12">
                    <div class="card">
                        <div class="card-header">
                            <strong class="card-title">Verification List</strong>

                        </div>
                        <div class="card-body">

                            <div class="card-body card-block">

                               <div class="col-md-12 mb-3">
                                <h5><u>Registration Details:</u></h5>
                               </div>

                                <div class="col-md-12">
                                    <div class="col-md-4">
                                        <p><strong>Unique Id:</strong> {{  $register->unique_id }}</p>
                                    </div>

                                    <div class="col-md-4">
                                        <p><strong>Reg 1:</strong></p>
                                        @isset($register->reg_url_1)
                                            <audio controls>
                                                <source src="{{  $url . '/' .('uploads/recordings/sdk') . '/' .$register->reg_url_1}}" type="audio/wav">
                                                 Your browser does not support the audio element.
                                            </audio>
                                            @else -
                                        @endisset
                                    </div>
                                    <div class="col-md-4">
                                        <p><strong>Reg 2:</strong></p>
                                        @isset($register->reg_url_2)
                                            <audio controls>
                                                <source src="{{  $url . '/' .('uploads/recordings/sdk') . '/' .$register->reg_url_2}}" type="audio/wav">
                                                 Your browser does not support the audio element.
                                            </audio>
                                            @else -
                                        @endisset
                                    </div>
                                </div>

                            </div>


                            <table class="table table-striped table-bordered table-responsive" style="width:100%">
                                <thead>
                                    <tr>
                                        <th>S.No.</th>
                                        <th>Ver Url 1</th>
                                        <th>Response</th>
                                        <th>Status</th>
                                        <th>Verified At</th>
                                        <th>Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($verifies as $verification)

                                    @php
                                     $status = "";
                                    if(isset($verification->data)){
                                        $response = json_decode($verification->data, true);

                                            if($response['status'] == "200"){
                                                $status = "Successfully Verified";
                                            }else{
                                                $status = "Verification Failed";
                                            }
                                    }

                                    @endphp

                                        <tr style="background-color:@if($status == 'Successfully Verified')#ccf3cc @else #edb0b0 @endif ">
                                            <td>{{ $loop->iteration }}</td>
                                            <td>
                                                @isset($verification->ver_url_1)
                                                <audio controls>
                                                    <source src="{{ $url.'/'.('uploads/recordings/sdk') . '/' .$verification->ver_url_1}}" type="audio/wav">
                                                     Your browser does not support the audio element.
                                                </audio>
                                            @endisset
                                            </td>
                                            <td>
                                                @if ($verification->data !== null)
                                                    <i class="fa fa-info-circle response-info" aria-hidden="true"
                                                        data-id={{ $verification->id }} style="cursor:pointer"></i>
                                                @else
                                                    -
                                                @endif
                                                @php
                                                    $response = json_decode($verification->data, true);

                                                    if (isset($response['data'])) {

                                                        $arr = str_replace('Array', '', print_r($response['data'], true));
                                                        $arr = str_replace('(', '', print_r($arr, true));
                                                        $arr = str_replace(')', '', print_r($arr, true));

                                                        echo '<pre style="white-space:pre-wrap">';
                                                        echo str_replace(')', '', print_r($arr, true));
                                                        echo '</pre>';
                                                    }
                                                @endphp
                                        </td>
                                        <td>{{ $status }}</td>
                                        <td>{{ date('d-m-Y H:i:s', strtotime($verification->voice_verified_at)) }}</td>
                                        <td>
                                            @if($verification->payload != null)
                                            <button type="button" class="btn btn-info open-modal"
                                                data-id={{ $verification->id }}>Payload</button>
                                                @else
                                                -
                                                @endif
                                        </td>
                                    </tr>
                                    @empty

                                  <tr>
                                    <td colspan="7" class="text-center"> No data Found</td>
                                  </tr>

                                   @endforelse
                                </tbody>
                            </table>
                            <div class="link">
                                {{ $verifies->onEachSide(2)->links() }}
                            </div>
                        </div>
                    </div>
                </div>


            </div>
        </div><!-- .animated -->
    </div><!-- .content -->



    <!-- Payload Modal -->
    <div class="modal fade" id="payloadModal" tabindex="-1" role="dialog" aria-labelledby="payloadModalTitle"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content" style="width: auto">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLongTitle">API Request Payload</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <p id="modal-info"></p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>


    <!-- Response Modal -->
    <div class="modal fade" id="responsedModal" tabindex="-1" role="dialog" aria-labelledby="responseModalTitle"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content" style="width: auto">
                <div class="modal-header">
                    <h5 class="modal-title">API Response</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <p id="response-info"></p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>

@endsection


@push('scripts')
    <script>
        $(document).ready(function() {
            $('.open-modal').on('click', function() {
                var id = $(this).data('id');

                $.ajax({
                    url: '/captcha/get-modal-content/' + id,
                    method: 'GET',
                    data: { 'type' : 'ver'},
                    success: function(data) {
                        $('#modal-info').text(data.info);
                        $('#payloadModal').modal('show');
                    }
                });
            });

            $('.response-info').on('click', function() {
                var id = $(this).data('id');

                $.ajax({
                    url: '/captcha/get-response-content/' + id,
                    data: { 'type' : 'ver'},
                    method: 'GET',
                    success: function(data) {
                        $('#response-info').text(data.info);
                        $('#responsedModal').modal('show');
                    }
                });
            });
        });
    </script>
@endpush