@extends('layouts.app')
@section('js')
    {{-- <script src="{{ asset('js/tracking.js') }}"></script> --}}
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
@endsection
@section('content')
    <div class='row'>
        <div class='col-8 mb-5'>
            <h2 class="font-semibold text-xl text-gray-800 leading-tight">
                {{ __('FB Stats Best Videos') }}
            </h2>
        </div>
    </div>

    <div class='row'>
        <div class='col-12'>
          <table class="table table-striped">
            <thead>
              <tr>
                <th scope="col">Likes</th>
                <th scope="col">Duration</th>
                <th scope="col">URL</th>
                <th scope="col">Title</th>
              </tr>
            </thead>
            <tbody>
              @foreach($data as $video)
                <tr>
                    <td>{{$video->likes}}</td>
                    <td>{{isset($video->duration) ? $video->duration : 'N/A' }}</td>
                    <td>
                        <a href='{{$video->source ?? ''}}' target='_blank'>Source
                    </td>
                    <td>
                        <a href='{{$video->post_url ?? ''}}' target='_blank'>Post
                    </td>
                    <td>{{$video->title}}</td>
                </tr>
              @endforeach
            </tbody>  
        </div>
    </div>
    
    
    
    
    <script>
    $(document).ready(function(){
        
    });
    </script>

@endsection