@extends('Admin.layout')

@section('pagetitle', __('trans.Videos'))
@section('content')

<table class="table table-bordered data-table text-center" id="DataTable">
    <thead>
        <tr>
            <th>#</th>
            <th>@lang('trans.title_ar')</th>
            <th>@lang('trans.title_en')</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach($Videos as $item)
        <tr data-bs-toggle="modal" data-bs-target="#VideoModal{{ $loop->iteration }}">
            <th>{{ $loop->iteration }}</th>
            <th>{{ $item['title_ar'] }}</th>
            <th>{{ $item['title_en'] }}</th>
            <th><i class="fa-solid fa-eye"></i></th>
        </tr>
        @endforeach
    </tbody>
</table>
@foreach($Videos as $item)
<div class="modal fade" id="VideoModal{{ $loop->iteration }}" tabindex="-1" aria-labelledby="VideoModal{{ $loop->iteration }}Label" aria-hidden="true">
  <div class="modal-dialog  modal-lg">
    <div class="modal-content">
      <div class="modal-body">
        <video height="300px" width="100%" controls>
          <source src="{{ $item['link'] }}" type="video/mp4">
          Error Message
        </video>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{  __('trans.close') }}</button>
      </div>
    </div>
  </div>
</div>
@endforeach

@endsection