@extends('voyager::master')

@section('page_title', __('voyager::generic.viewing').' '.'f')

@section('page_header')
    <div class="container-fluid">
        <h1 class="page-title">All Recordings</h1>
        
    </div>
@stop

@section('content')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<style>
        .btn-custom {
            height: 25px;
            width: 25px;
            border-radius: 8px;
            padding-left: 0px;
            padding-right: 20px;
            justify-content: center;
            align-items: center;
            cursor: pointer;
        }

        .table-custom th, .table-custom td {
            vertical-align: middle;
        }

        .btn-primary-custom {
            background-color: #007bff;
            border-color: #007bff;
            padding: 0.25rem 0.5rem;
        }

        .btn-primary-custom:hover {
            background-color: #0056b3;
            border-color: #004085;
        }

        .btn-danger-custom {
            background-color: #dc3545;
            border-color: #dc3545;
            padding: 0.25rem 0.5rem;
        }

        .btn-danger-custom:hover {
            background-color: #c82333;
            border-color: #bd2130;
        }

        .form-group small {
            display: block;
            margin-top: 5px;
        }

        .cover-art {
            width: 50px;
            height: 50px;
            object-fit: cover;
            border-radius: 5px;
        }
        
        .status-label {
    color: white;
    padding: 4px 8px;
    border-radius: 4px;
    font-weight: bold;
    display: inline-block;
    margin-right: 5px;
}

.status-pending {
    background-color: yellow;
    color: black; /* Use black text for readability on yellow */
}

.status-approved {
    background-color: green;
}

.status-rejected {
    background-color: red;
}

.status-taken-down {
    background-color: black;
}

    </style>
    @if(session('success'))
    <div class="alert alert-success">
        {{ session('success') }}
    </div>
@endif
<a href="{{ route('export.csv2') }}" class="btn btn-primary">
    Export to CSV
</a>
<table class="table table-bordered table-hover table-custom" id="albumTable">
        <thead class="">
            <tr>
                <th>ID</th>
                <th>Title</th>
                @if (Auth::user()->role_id == 1 || Auth::user()->role_id == 3)
                    <th>Creator</th>
                @endif
                <th>Cover Art</th>
                <th>Contributor</th>
                <th>UPC</th>
                <th>Release Type</th>
                <th>Creation Date</th>
                <th>Release Date</th>
                <th>Status</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            @foreach ($releases as $release)
                <tr>
                    <td>{{ $release->id }}</td>
                    <td>{{ $release->title }}</td>
                    @if (Auth::user()->role_id == 1 || Auth::user()->role_id == 3)
                        <td>{{ $release->user->email }}</td>
                    @endif
                    
                    <td>
                        <img src="{{ asset('storage/' . $release->cover_art) }}" alt="Cover Art" class="cover-art">
                    </td>
                    <td>
                        @foreach ($release->contributors as $contributor)
                            {{ $contributor->name }}<br>
                        @endforeach
                    </td>
                    <td>{{ $release->upc_ean }}</td>
                    <td>{{ $release->release_type }}</td>
                    <td>{{ $release->created_at->format('Y-m-d') }}</td>
                    <td>{{ $release->digital_release_date }}</td>
                    <td>
    @php
        $distributionStatus = $release->distributions->first() ? $release->distributions->first()->status : null;
    @endphp

       @if($distributionStatus === 'submitted')
    <span class="status-label status-pending">Pending</span>
@else
    @foreach ($release->distributions as $distribution)
        <span class="status-label 
            @if($distribution->status == 'approved') status-approved 
            @elseif($distribution->status == 'rejected') status-rejected 
            @elseif($distribution->status == 'down') status-taken-down 
            @endif">
            {{ $distribution->status }}
        </span><br>
    @endforeach
@endif

    <!-- Approve and Reject buttons -->
    <form action="{{ route('albums.distribute', ['id' => $release->id]) }}" method="POST" style="display: inline;">
    @csrf

    <button type="submit" name="action" value="approve"
            class="btn btn-success btn-sm {{ $distributionStatus == 'approved' ? 'disabled' : '' }}">
        <i class="fas fa-check"></i>
    </button>

    <button type="submit" name="action" value="reject"
            class="btn btn-danger btn-sm {{ $distributionStatus == 'rejected' ? 'disabled' : '' }}">
        <i class="fas fa-times"></i>
    </button>
    
    <button type="submit" name="action" value="down"
            class="btn btn-dark btn-sm {{ $distributionStatus == 'down' ? 'disabled' : '' }}">
        <i class="fas fa-ban"></i>
    </button>
</form>

<style>
    .disabled {
        opacity: 0.5;
        pointer-events: none;
        background-color: #e0e0e0 !important; /* Faded background color */
        border-color: #d6d6d6 !
    }
</style>

</td>



<td>
    @php
        $distributionStatus = $release->distributions->first() ? $release->distributions->first()->status : null;
    @endphp

    @if($distributionStatus != 'approved')
        <div class="btn-group" role="group">
            <a target="_blank" href="{{ route('album.edit', $release->id) }}" class="btn btn-sm btn-primary edit">
                edit
            </a>

            <!-- Show Delete button unless status is 'approved' -->
            @if($distributionStatus != 'approved')
                <form action="{{ route('album-recordings.destroy', $release->id) }}" method="POST" style="display:inline-block;">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="btn btn-sm btn-danger pull-right delete">
                        delete
                    </button>
                </form>
            @endif
        </div>
    @endif
    <!-- New Export XML button -->
            <a target="_blank" href="{{ route('export.xml', $release->id) }}" class="btn btn-sm btn-primary ">
                Export XML
            </a>
</td>


                </tr>
            @endforeach
        </tbody>
    </table>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.datatables.net/1.11.10/js/jquery.dataTables.min.js"></script>
    <link rel="stylesheet" href="https://cdn.datatables.net/1.11.10/css/jquery.dataTables.min.css">
    <script>
        $(document).ready( function () {
            $('#albumTable').DataTable();
        });
    </script>


@endsection