@extends('../admin/admin_layout.app')

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

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

        <section class="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">
                        {{-- @if (request()->query('type') == 'marketplace_screenwriter') --}}
                        <div class="col-12 mb-3">
                            <button type="button" class="border-0" data-bs-toggle="modal"
                                data-bs-target="#accept">Accept</button>
                        </div>
                        <div class="col-12">
                            <button type="button" class="border-0" data-bs-toggle="modal"
                                data-bs-target="#reject">Reject</button>
                        </div>
                        {{-- @elseif(request()->query('type') == 'program_screenwriter')
                            <div class="col-12 mb-3">
                                <button type="button" class="border-0" data-bs-toggle="modal"
                                    data-bs-target="#sendtomarketplace">Send to Marketplace </button>
                            </div>
                            <div class="col-12">
                                <button type="button" class="border-0">Send it Back</button>
                            </div>
                        @endif --}}
                    </div>
                    <form action="{{ route('management.script.update_marketplace', ['id' => $script->id]) }}" method="POST"
                        class="admin_marketplace_details_form">
                        @csrf
                        @method('PUT')
                        <div class="row w-100 mx-0 mt-5 pt-5 text-start">
                            <div class="col-12 mb-3">
                                <h5>Marketplace Details</h5>
                            </div>
                            <div class="col-6 mb-3">
                                <label for="genre" class="form-label">Genre</label>
                                <select class="form-select" id="genre" name="genre" disabled>
                                    <option disabled>Select Genre</option>
                                    @isset($genre->id)
                                        <option value="{{ $script->genre }}" selected>{{ $genre->name }}</option>
                                    @endisset
                                    <option value="action">Action</option>
                                    <option value="adventure">Adventure</option>
                                    <option value="comedy">Comedy</option>
                                    <option value="drama">Drama</option>
                                    <option value="fantasy">Fantasy</option>
                                    <option value="foreign">Foreign</option>
                                    <option value="historical">Historical</option>
                                    <option value="horrow">Horror</option>
                                    <option value="science">Science</option>
                                    <option value="thriller">Thriller</option>
                                    <option value="western">Western</option>
                                    <option value="other">Other</option>
                                </select>
                            </div>
                            <div class="col-6 mb-3">
                                <label for="mpaa_rating" class="form-label">MPAA Rating</label>
                                <select class="form-select" id="mpaa_rating" name="mpaa_rating" disabled>
                                    <option disabled>Select MPAA Rating</option>
                                    @isset($script->content_ratings)
                                        <option value="{{ $script->content_ratings }}">{{ $script->content_ratings }}</option>
                                    @endisset
                                    <option value="g">G</option>
                                    <option value="pg">PG</option>
                                    <option value="pg-13">PG-13</option>
                                    <option value="r">R</option>
                                </select>
                            </div>
                            <div class="col-6 mb-3">
                                <label for="timeline" class="form-label">Timeline</label>
                                <select class="form-select" id="timeline" disabled>
                                    <option disabled>Select Timeline</option>
                                    @isset($script->timeline)
                                        <option value="{{ $script->timeline }}">{{ $script->timeline }}
                                        </option>
                                    @endisset
                                    <option value="past">Past</option>
                                    <option value="present">Present</option>
                                    <option value="future">Future</option>
                                </select>
                            </div>
                            <div class="col-6 mb-3">
                                <label for="budget" class="form-label">Budget</label>
                                <select class="form-select" id="budget" name="budget" disabled>
                                    <option disabled>Select Budget</option>
                                    @isset($script->budget_options)
                                        <option value="{{ $script->budget_options }}">{{ $script->budget_options }}</option>
                                    @endisset
                                    <option value="nobudget">No Budget < 500K (Independent)</option>
                                    <option value="microbudget">Micro Budget 500k > 1m (Independent)</option>
                                    <option value="ultralowbudget">Ultra Low Budget 1m to 5m (Independent)</option>
                                    <option value="lowbudget">Low Budget 5m to 20m (Independent or Studio)</option>
                                    <option value="mediumbudget">Medium Budget 20m - 100m (Studio Backed)</option>
                                    <option value="bigbudget">Big Budget 100m+ (Studio Backed)</option>
                                </select>
                            </div>
                            <div class="col-6 mb-3">
                                <label for="where" class="form-label">Where</label>
                                <select class="form-select" id="where" name="where" disabled>
                                    <option disabled>Select Continent</option>
                                    @isset($script->where)
                                        <option value="{{ $script->where }}">{{ $script->where }}</option>
                                    @endisset
                                    <option value="asia">Asia</option>
                                    <option value="europe">Europe</option>
                                    <option value="africar">Africa</option>
                                    <option value="northamerica">North America</option>
                                    <option value="southamerica">South America</option>
                                    <option value="antarctica">Antarctica</option>
                                    <option value="australia">Australia</option>
                                </select>
                            </div>
                            <div class="col-6 mb-3">
                                <label for="pages" class="form-label">Pages</label>
                                <select class="form-select" id="pages" name="pages" disabled>
                                    <option disabled>Select Pages</option>
                                    @isset($script->pages)
                                        <option value="{{ $script->pages }}">{{ $script->pages }}</option>
                                    @endisset
                                    <option value="90">90-110</option>
                                    <option value="110">111-140</option>
                                    <option value="140">140+</option>
                                </select>
                            </div>
                            <div class="col-6 mb-5">
                                <label for="similarstories" class="form-label">Similar Stories</label>

                                <input type="text" class="form-control" name="similarstories" id="similarstories"
                                    disabled value="{{ $script->similar_stories }}">
                            </div>
                            <div class="col-12 mb-3 text-center">
                                <button type="button" class="border-0 me-3">Edit</button>
                                <button type="submit" class="border-0">Save</button>
                            </div>
                        </div>
                    </form>
                </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') }}scripts/{{ $script->script }}"
                                        download>Download</a><i class="fa-solid fa-file-pdf ms-2"></i></span>
                            </p>
                        </div>
                    </div>

                    <form action="{{ route('management.script.rating_form', ['id' => $script->id]) }}"
                        class="admin_rating_form" method="POST">
                        @csrf
                        @method('PUT')
                        <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>21-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($ratings->character) ? $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($ratings->conflict) ? $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($ratings->dialogue) ? $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($ratings->logic) ? $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($ratings->originality) ? $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($ratings->pacing) ? $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($ratings->premise) ? $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($ratings->structure) ? $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($ratings->tone) ? $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>
                    <div class="col-12 text-center my-4">
                        <h6 class="mb-3">Analyst Assigned</h6>
                        <form action="{{ route('management.script.assign_analyst') }}" method="post">
                            @csrf
                            <input type="hidden" name="script_id" id="modal_script_id" value="{{ $script->id }}">
                            <div class="row mx-4">
                                <div class="col-8 mb-3">
                                    <select class="form-control" name="send_to" id="send_to">
                                        <option value="">Not assigned</option>
                                        @foreach ($analysts as $analyst)
                                            @if ( isset( $analyst_assigned) && $analyst->id == $analyst_assigned->analyst_id )
                                                <option value="{{ $analyst_assigned->analyst_id }}" selected> {{ $analyst->fullname }}</option>
                                                @continue
                                            @endif
                                            <option value="{{ $analyst->id }}"> {{ $analyst->fullname }} </option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="col-4">
                                    <button class="btn btn-primary" type="submit">Change</button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <form class="admin_feedback_form"
                        action="{{ route('management.script.updatefeedback', ['id' => $script->id]) }}" method="POST">
                        @csrf
                        @method('PUT')
                        <div class="row w-100 mb-5 mx-0">
                            <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" id="total_rating">0</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($ratings->created_at) ? Carbon\Carbon::parse($ratings->created_at)->format('F Y') : '' }}</span>
                                            <textarea class="form-control" name="feedback" id="" rows="3" disabled>{{ !empty($ratings->feedback) ? $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>
                        </div>
                    </form>


                </div>
            </div>
        </section>
        <!-- Modal For Accept Button-->
        <div class="modal fade" id="accept" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
            aria-labelledby="acceptLabel" 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>
                    <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 Accept?</p>
                    </div>
                    <form action="{{ route('management.script.updatestatus', ['id' => $script->id]) }}" method="post">
                        @csrf
                        @method('PUT')
                        <input type="hidden" name="status" value="accepted">
                        <div class="modal-footer justify-content-around px-4">
                            <button type="button" data-bs-dismiss="modal">No</button>
                            <button type="submit">Yes</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <!-- Modal For Reject Button-->
        <div class="modal fade" id="reject" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
            aria-labelledby="acceptLabel" 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>
                    <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 Accept?</p>
                    </div>
                    <form action="{{ route('management.script.updatestatus', ['id' => $script->id]) }}" method="post">
                        @csrf
                        @method('PUT')
                        <input type="hidden" name="status" value="denied">
                        <div class="modal-footer justify-content-around px-4">
                            <button type="button" data-bs-dismiss="modal">No</button>
                            <button type="submit">Yes</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <!-- Modal -->
        <div class="modal fade" id="sendtomarketplace" data-bs-backdrop="static" data-bs-keyboard="false"
            tabindex="-1" aria-labelledby="sendtomarketplaceLabel" 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>
                    <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 marketplace?</p>
                    </div>
                    <div class="modal-footer justify-content-around px-4">
                        <button type="button" data-bs-dismiss="modal">No</button>
                        <button type="button" data-bs-dismiss="modal">Yes</button>
                    </div>
                </div>
            </div>
        </div>

    </div>
@endsection


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

@push('js')
    <script defer>
        function calculate() {
            let total = 0;
            $("input[id^=rating]")
                .map(function(idx, elem) {
                    total += Number($(elem).val());
                })
                .get();

            $("#total_rating").html(total);

            if (total > 33) {
                $("#rating_level").html("Outstanding");
            } else if (total > 26) {
                $("#rating_level").html("Solid");
            } else if (total > 20) {
                $("#rating_level").html("Passable");
            } else {
                $("#rating_level").html("Need Improvement");
            }
        }

        calculate();

        $("input[id^=rating]").on("keyup", function(e) {
            e.preventDefault();
            calculate();
        });

        $("#confirm_send_to_admin").on("click", function() {
            let url = $("#update_script_url").val();
            let redirect = $("#redirect_url").val();
            // Send to controller update status
            $.ajax({
                async: false,
                type: "put",
                url: url,
                headers: {
                    "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
                },
                data: {
                    status: "ready",
                },
                success: function(response) {
                    window.location.replace(redirect);
                },
                error: function(error) {},
            });
        });
    </script>
@endpush