@extends('layouts.app', ['header_image' => false, 'header' => true, 'close_button' => false])

@section('back_button')
    <a href="{{ route('member.leaderboard.event.user.score', ['userScore' => $userScore->id ,'division_type' => request()->division_type, 'token' => request()->token]) }}"
        class="back-btn-back">
        <i class="fa-solid fa-chevron-left"></i>
    </a>
@endsection

@section('content')
    @include('include.leaderboard.event-header', ['collection' => $event, 'score' => $userScore])

    <section class="member-sec p-0">
        <div class="container">
            <div class="leaderboard-traget-board p-0 mb-3">
                @if($userScore->target_path)
                    <img src="{{ Storage::url($userScore->target_path) }}" alt="" style="aspect-ratio:{{ @$userScore->event->aspect_ratio ?? 'fit-content' }}">
                @else
                    <img src="{{ Storage::url($event->eventTarget->first()->path) }}" alt="" style="aspect-ratio:{{ @$userScore->event->aspect_ratio ?? 'fit-content' }}">
                @endif
                <img src="{{ asset('images/official-target-badge.png') }}" alt="" class="leaderboard-traget-top-badge">
            </div>
        </div>
    </section>

    @include('include.leaderboard.event-challenge-details', ['collection' => $event])
@endsection

{{-- rules modal js  --}}
@push('scripts')
    <script>
        jQuery(document).ready(function() {
            //show official rules
            jQuery('.show-event-rules').click(function() {
                let pdfUrl = "{{ Storage::url($event?->pdfFile('event_rules')?->path) }}"

                jQuery('#title').text('Event official rules')
                // jQuery('#pdf-preview').attr('src', pdfUrl + '#toolbar=0&navpanes=0')
                previewPdf(pdfUrl , jQuery('#pdf-preview'));
                jQuery('#pdf-preview-modal').modal('show');
            });
        });
    </script>
@endpush