{% extends "mnfapp/base.html" %}
{% load static %}
{% load doc2pdf %}
{% block content %}
<style>
    .container-script {
        display: grid;
        grid-template-columns: 28vw 28vw 28vw;
        width: 90vw;
        margin: auto;
        padding-right: 100px;
    }

    .container-script .card {
        margin: 0.5em;
    }

    #wrap {
        word-wrap: break-word;
    }
</style>
<!-- <h2 style="padding: 0.4em;text-align: center; " >My Audited Script</h2> -->
<div>
    <h2><a href="audited" style="margin-left: 40%">My Audited Scripts </a></h2>
</div>
<!-- <h2 style="padding: 0.4em;text-align: center; " >My Audited Script</h2> -->

<div class="container-script ">
    <!--begin::Row-->
    {% if user.is_authenticated %}
    {% if i %}
    {% for k in i %}
    <div class="grid-col ">
        <!--begin::Col-->
        <div class="">

            <!--begin::Card-->
            <div class="card card-custom gutter-b card-stretch">
                <!--begin::Body-->
                <div class="card-body pt-4">
                    <!--begin::Toolbar-->
                    <div class="">
                        <div class="dropdown dropdown-inline" data-toggle="tooltip" data-placement="left">
                            <a href="#" class="btn btn-clean btn-hover-light-primary btn-sm btn-icon"
                                data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                <i class="ki ki-bold-more-hor"></i>
                            </a>
                            <div class="dropdown-menu dropdown-menu-md dropdown-menu-right">
                                <!--begin::Navigation-->
                                <ul class="navi navi-hover py-5">
                                    <li class="navi-item">
                                        <a href="{{k.id}}" class="navi-link">
                                            <span class="navi-icon">
                                                <i class="flaticon-interface-4"></i>
                                            </span>
                                            <span class="navi-text">Delete Script completed</span>
                                        </a>
                                    </li>
                                    {% comment %}
                                    <li class="navi-item" target="_blank">
                                        <a class="navi-link">
                                            <span class="navi-icon">
                                                <i class="flaticon-visible"></i>
                                            </span>
                                            <span class="navi-text">Edit Script</span>
                                        </a>
                                    </li> {% endcomment %}

                                    <li class="navi-item">
                                        <a href="../../../media/Audited/{{k.fileOut|slice:'57:'}}" target="_blank"
                                            class="navi-link" download>
                                            <span class="navi-icon">
                                                <i class="flaticon-download"></i>
                                            </span>
                                            <span class="navi-text">Download</span>
                                        </a>
                                    </li>
                                </ul>
                                <!--end::Navigation-->
                            </div>
                        </div>
                    </div>
                    <!--end::Toolbar-->
                    <!--begin::User-->
                    <div class="d-flex align-items-center mb-7">
                        <!--begin::Pic-->
                        <div class="flex-shrink-0 mr-4 mt-lg-0 mt-3">
                            <div class="symbol symbol-circle symbol-lg-75 d-none">
                                <img src="assets/media/users/300_10.jpg" alt="image" />
                            </div>
                            <div class="symbol symbol-lg-75 symbol-circle symbol-primary">
                                <span class="symbol-label font-size-h3 font-weight-boldest"
                                    style="text-transform: uppercase;">{{k.script_title|slice:":1"}}</span>
                            </div>
                        </div>
                        <!--end::Pic-->
                        <!--begin::Title-->
                        <div class="d-flex flex-column " class="wrap">
                            <a href="#"
                                class="text-dark font-weight-bold text-hover-primary font-size-h4 mb-0 script-title"
                                style="word-wrap:break-all; max-width: 200px;">{{k.scriptName}}</a>
                            <span class="text-muted font-weight-bold">Copyright </span>
                        </div>
                        <!--end::Title-->
                    </div>
                    <!--end::User-->
                    <!--begin::Info-->
                    <div class="mb-7">
                        <div class="d-flex justify-content-between align-items-center my-1">
                            <span class="text-dark-75 font-weight-bolder mr-2">Script Name:</span>
                            <a class="text-muted text-hover-primary">{{k.name }}</a>
                        </div>
                        <div class="d-flex justify-content-between align-items-center my-1">
                            <span class="text-dark-75 font-weight-bolder mr-2">Author:</span>
                            <a class="text-muted text-hover-primary">{{k.author }}</a>
                        </div>
                        {% comment %} <div class="d-flex justify-content-between align-items-cente my-1">
                            <span class="text-dark-75 font-weight-bolder mr-2">Screenplay:</span>
                            <a href="#" class="text-muted text-hover-primary"></a>
                        </div>
                        <div class="d-flex justify-content-between align-items-center my-1">
                            <span class="text-dark-75 font-weight-bolder mr-2">Dialogue:</span>
                            <span class="text-muted font-weight-bold"></span>
                        </div>
                        <div class="d-flex justify-content-between align-items-center my-1">
                            <span class="text-dark-75 font-weight-bolder mr-2">Uploaded on:</span>

                            <a href="#" class="text-muted text-hover-primary"></a>

                        </div> {% endcomment %}

                        {% comment %} <div class="d-flex justify-content-between align-items-center my-1">
                            <span class="text-dark-75 font-weight-bolder mr-2">Languages:</span>
                            <span class="text-muted font-weight-bold"></span>
                        </div> {% endcomment %}
                    </div>
                    <!--end::Info-->
                    {% if k.iscomplete %}
                    <a href="../../media{{k.fileOutpdf|cut:mediaroot}}" target="_blank"
                        class="btn btn-block btn-sm btn-light-success font-weight-bolder text-uppercase py-4">View
                        Audited Script</a>
                    <!-- <a href="../../../media/{{k.scriptName}}" target="_blank"
                      class="btn btn-block btn-sm btn-light-success font-weight-bolder text-uppercase py-4">View
                      Audit Report</a>
                  -->


                    <a href="../../media{{k.fileOut|cut:mediaroot}}" target="_blank"
                        class="btn btn-block btn-sm btn-light-success font-weight-bolder text-uppercase py-4">Download
                        Audited Script (docx)</a>
                    <a href="../../media{{k.reportOut|cut:mediaroot}}" target="_blank"
                        class="btn btn-block btn-sm btn-light-success font-weight-bolder text-uppercase py-4">Download
                        Audit Report</a>
                    {% else %}
                    <button class="btn btn-block btn-sm btn-light-danger font-weight-bolder text-uppercase py-4">
                        <a href="http://115.246.78.132/scriptpad/#/{{k.scriptid}}">View Audited Script</a>
                    </button>
                    <!-- <button onclick="alert('your script is in underprocessing please wait...');window.location.reload(false)"

                      class="btn btn-block btn-sm btn-light-danger font-weight-bolder text-uppercase py-4">View
                      Audit Report</button> -->
                    <button
                        onclick=window.open("http://115.246.78.132/scriptpad/download?script_id={{k.scriptid}}&type=script-docx")
                        class="btn btn-block btn-sm btn-light-danger font-weight-bolder text-uppercase py-4">
                        Download Audited Script (docx)
                    </button>
                    <button
                        onclick="alert('your script is in underprocessing please wait...');window.location.reload(false)"
                        class="btn btn-block btn-sm btn-light-danger font-weight-bolder text-uppercase py-4">Download
                        Audit Report</button>


                    {% endif %}
                </div>
                <!--end::Body-->
            </div>
            <!--end::Card-->
        </div>
        <!--end::Col-->

    </div>
    {%endfor%}
</div>

{%else%}
<div class="container-script">
    <div style="width:42vw;margin-left:23vw; padding:2em;margin-top:5%;background-color:#f3dcfc;text-align:center;">
        <h4>Oops! You are yet to Convert your first script!!</h4>
        <div style="width:35vw;margin-left:3.5vw;margin-top:2vh;display:flex"> <button
                onclick="window.location.replace('/conversion/')" class="btn btn-primary"
                style="margin-right:1cm;font-weight:bold;">Convert your Script Now</button>
            <button onclick="window.location.replace('/samplescriptC')" class="btn btn-primary"
                style="font-weight:bold;">Convert a Sample Script</button>
        </div><br>
        <p style="text-align:left;">P.S. - if you uploaded your script for conversion and are not yet seeing the
            conversion OR had some difficulty in uploading your script, please <a href="/contact">contact us</a>.
        </p>
    </div>
</div>


{%endif%}


{%endif%}
{% endblock content %}