@extends('../analyst/analyst_layout.app')

@section('content')
    <div class="page_right">

        <!-- Beardcrumbs -->
        <div class="breadcrumbs">
            <a
                href="{{ route('analyst.scriptsqueue') }}">Dashboard</a><span>/{{ ucfirst(Route::current()->getName()) }}</span>
        </div>

        <section class="analyst_script_details mt-5">
            <div class="row w-100">
                <div class="col-md-5 col-12 text-center">
                    <h5 class="mb-4">Script Details</h5>
                    <div class="row mx-0 w-100">
                        <div class="col-12">
                            <img src="/img/branded-script-image.png" width="90%" height="90%" alt="Profile Picture"
                                class="image-fluid">
                        </div>
                    </div>
                    <h6 class="mb-0">{{ $script->title }}</h6>
                    <span>Updated {{ $script->elapsed }}</span>
                    <div class="row w-100 mx-0 mt-md-5 mt-3">
                        <div class="col-12 mb-3">
                            <button type="button" class="border-0" data-bs-toggle="modal"
                                data-bs-target="#sendtoadmin">Send to Admin</button>
                        </div>
                    </div>
                </div>
                <div class="col-md-7 col-12 mt-4 mt-md-0">
                    <div class="row w-100 mx-0">
                        <div class="col-12">
                            <h4 class="mb-md-5 mb-4">{{ $script->title }}</h4>
                            <p>*Synopsis:</p>
                            <p>{{ $script->synopsis}}</p>
                            <p>*Logline:</p>
                            <p>{{ $script->logline}}</p>
                            <p>*Tagline:</p>
                            <p>{{ $script->tagline}}</p>
                            <p>
                                <span>*Treatment:</span>
                                <span class="ms-2"><a href="{{config('services.gcs.storage_api_uri')}}treatments/{{$script->treatment}}" download>Download</a><i
                                        class="fa-solid fa-file-pdf ms-2"></i></span>
                            </p>
                            <p>
                                <span>*ScreenPlay:</span>
                                <span class="ms-2"><a href="{{ {{config('services.gcs.storage_api_uri')}}treatments/{{$script->screenplay }} }}" download>Download</a><i
                                        class="fa-solid fa-file-pdf ms-2"></i></span>
                            </p>
                        </div>
                    </div>
                    <form action="{{ route('analyst.script.rating_form') }}" method="POST" class="analyst_rating_form">
                        @csrf
                        <div class="row w-100 mx-0 mt-5">
                            <div class="col-12 text-center">
                                <h6 class="mb-5">Type of Rating</h6>
                                <div class="row w-100 mx-0">
                                    <div class="col-xl-3 col-sm-6 col-12">
                                        <div class="text-center">
                                            <div>1</div>
                                            <p>Need Improvement</p>
                                            <p>0-20</p>
                                        </div>
                                    </div>
                                    <div class="col-xl-3 col-sm-6 col-12 mt-2 mt-xl-0">
                                        <div class=text-center>
                                            <div>2</div>
                                            <p>Passable</p>
                                            <p>20-26</p>
                                        </div>
                                    </div>
                                    <div class="col-xl-3 col-sm-6 col-12 mt-2 mt-xl-0">
                                        <div class=text-center>
                                            <div>3</div>
                                            <p>Solid</p>
                                            <p>27-33</p>
                                        </div>
                                    </div>
                                    <div class="col-xl-3 col-sm-6 col-12 mt-2 mt-xl-0">
                                        <div class=text-center>
                                            <div>4</div>
                                            <p>Outstanding</p>
                                            <p>34-36</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row w-100 mx-0 mt-5">
                            <div class="col-12 text-center">
                                <h6 class="mb-4">Script Info</h6>
                                <div class="row w-100 mx-0">
                                    <div class="col-4 text-center">
                                        <label class="form-label">Character</label>
                                        <input name="character" id="rating" min=0 max=4 type="number"
                                            class="form-control py-3 text-center"
                                            value="{{ !empty($script->ratings->character) ? $script->ratings->character : 0 }}"
                                            disabled>
                                    </div>
                                    <div class="col-4 text-center">
                                        <label class="form-label">Conflict</label>
                                        <input name="conflict" id="rating" min=0 max=4 type="number"
                                            class="form-control py-3 text-center"
                                            value="{{ !empty($script->ratings->conflict) ? $script->ratings->conflict : 0 }}"
                                            disabled>
                                    </div>
                                    <div class="col-4
                                            text-center">
                                        <label class="form-label">Dialogue</label>
                                        <input name="dialogue" id="rating" min=0 max=4 type="number"
                                            class="form-control py-3 text-center"
                                            value="{{ !empty($script->ratings->dialogue) ? $script->ratings->dialogue : 0 }}"
                                            disabled>
                                    </div>
                                </div>
                                <div class="row
                                            w-100 mx-0 mt-2">
                                    <div class="col-4 text-center">
                                        <label class="form-label">Logic</label>
                                        <input name="logic" id="rating" min=0 max=4 type="number"
                                            class="form-control py-3 text-center"
                                            value="{{ !empty($script->ratings->logic) ? $script->ratings->logic : 0 }}"
                                            disabled>
                                    </div>
                                    <div class="col-4
                                                text-center">
                                        <label class="form-label">Originality</label>
                                        <input name="originality" id="rating" min=0 max=4 type="number"
                                            class="form-control py-3 text-center"
                                            value="{{ !empty($script->ratings->originality) ? $script->ratings->originality : 0 }}"
                                            disabled>
                                    </div>
                                    <div class="col-4
                                                text-center">
                                        <label class="form-label">Pacing</label>
                                        <input name="pacing" id="rating" min=0 max=4 type="number"
                                            class="form-control py-3 text-center"
                                            value="{{ !empty($script->ratings->pacing) ? $script->ratings->pacing : 0 }}"
                                            disabled>
                                    </div>
                                </div>
                                <div class="row
                                                w-100 mx-0 mt-2">
                                    <div class="col-4 text-center">
                                        <label class="form-label">Premise</label>
                                        <input name="premise" id="rating" min=0 max=4 type="number"
                                            class="form-control py-3 text-center"
                                            value="{{ !empty($script->ratings->premise) ? $script->ratings->premise : 0 }}"
                                            disabled>
                                    </div>
                                    <div class="col-4
                                                    text-center">
                                        <label class="form-label">Stucture</label>
                                        <input name="structure" id="rating" min=0 max=4 type="number"
                                            class="form-control py-3 text-center"
                                            value="{{ !empty($script->ratings->structure) ? $script->ratings->structure : 0 }}"
                                            disabled>
                                    </div>
                                    <div class="col-4
                                                    text-center">
                                        <label class="form-label">Tone</label>
                                        <input name="tone" id="rating" min=0 max=4 type="number"
                                            class="form-control py-3 text-center"
                                            value="{{ !empty($script->ratings->tone) ? $script->ratings->tone : 0 }}"
                                            disabled>
                                    </div>
                                    <input type="hidden" name="script_id" value="{{ $script->id }}">
                                    <div
                                        class="col-12
                                                    mt-5 text-center">
                                        <button type="button" class="border-0 me-md-3 me-0">Edit</button>
                                        <button type="submit" class="border-0">Save</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                    <form action="{{ route('analyst.script.updatefeedback', ['id' => $script->id]) }}" method="POST"
                        class="analyst_feedback_form">
                        @csrf
                        @method('PUT')
                        <div class="row w-100 mb-5 mx-0">
                            <div class="col-12 text-center mt-5">
                                <div class="row mx-0 w-100 justify-content-center">
                                    <div class="col-auto text-center">
                                        <div class="mb-2 text-center"><span  id="total_rating">0</span>pt</div>
                                        <span id="rating_level">Need Improvement</span>
                                    </div>
                                    <div class="col-12 text-start">
                                        <h5 class="mb-0 mt-3 text-start">Analyst Feedback</h5>
                                        <span
                                            class="text-start">{{ !empty($script->ratings->created_at) ? Carbon\Carbon::parse($script->ratings->created_at)->format('F Y') : '' }}</span>
                                        <textarea class="form-control" name="feedback" id="" rows="3" disabled>{{ !empty($script->ratings->feedback) ? $script->ratings->feedback : '' }}</textarea>
                                    </div>
                                    <div class="col-12 mt-5 text-center">
                                        <button type="button" class="border-0 me-md-3 me-0">Edit</button>
                                        <button type="submit" class="border-0">Save</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

        </section>

        <!-- Modal -->
        <div class="modal fade" id="sendtoadmin" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
            aria-labelledby="sendtoadminLabel" aria-hidden="true">
            <div class="modal-dialog m-0 top-50 start-50 translate-middle h-100 pt-5">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <input type="hidden" name="" id="update_script_url"
                        value="{{ route('analyst.script.updatestatus', ['id' => $script->id]) }}">
                    <input type="hidden" name="" id="redirect_url"
                        value="{{ route('analyst.scriptsreview') }}">
                    <div class="modal-body text-center">
                        <span><i class="fa-solid fa-question"></i></span>
                        <p class="mt-3">Warning</p>
                        <p>Are you sure you want to submit the script to Admin?</p>
                    </div>
                    <div class="modal-footer justify-content-around px-4">
                        <button type="button" data-bs-dismiss="modal" onclick="window.location.replace('{{ route('analyst.scriptsreview')}}')">No</button>
                        <button type="button" id="confirm_send_to_admin">Yes</button>
                    </div>
                </div>
            </div>
        </div>

    </div>
@endsection

<!--Start JS Section for Analyst Ratings - load once on page -->

@push('js')
    <script>

    </script>
@endpush