361 lines
		
	
	
		
			12 KiB
		
	
	
	
		
			HTML
		
	
	
		
			Executable File
		
	
	
			
		
		
	
	
			361 lines
		
	
	
		
			12 KiB
		
	
	
	
		
			HTML
		
	
	
		
			Executable File
		
	
	
| {% extends "mnfapp/base.html" %} {% load static %} {% load i18n %}
 | |
| <!-- {% block title %}Conversion Room {%endblock%} -->
 | |
| <html>
 | |
|   <head>
 | |
|     {% block content %}
 | |
|     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
 | |
|     <!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> -->
 | |
|     <script>
 | |
|       $(document).ready(function(){
 | |
|             {% comment %} $(".container-995").hide();
 | |
|             $(".new").show(); {% endcomment %}
 | |
|         });
 | |
|     </script>
 | |
|     <style>
 | |
|       
 | |
|           .label{
 | |
|             width: 112px;
 | |
|           }
 | |
|           .containerAudit{
 | |
|               top: 50%;
 | |
|               left: 50%;
 | |
|               transform: translate(-50%,-50%);
 | |
|               position: absolute;
 | |
|               width: 50vw;
 | |
|               text-align: center;
 | |
|               box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 | |
|               height: 40vh;
 | |
|           }
 | |
|           .containerAudit form{
 | |
|               display: flex;
 | |
|               width: 40vw;
 | |
|               margin-left: 10vw;
 | |
|               margin-top: 20%;
 | |
|               /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
 | |
|           }
 | |
|           .actsic_builder{
 | |
|             background-color: #ee3c4d;
 | |
|             color: #fff;
 | |
|           }
 | |
| 
 | |
|           #form-container {
 | |
|             min-width: 100%;
 | |
|           }
 | |
| 
 | |
|           input[type="file"] {
 | |
|             display: inline-block !important;
 | |
|           }
 | |
| 
 | |
|           #id_screenplay_name,
 | |
|           #id_author_name {
 | |
|             border: 1px solid;
 | |
|             border-radius:3px;
 | |
|             height: 28px;
 | |
|             margin: 0px 0px 5px;
 | |
|             padding: 0 0 0 7px;
 | |
|             {% comment %} width: 165px; {% endcomment %}
 | |
| 
 | |
|           }
 | |
|       {% comment %}
 | |
|           #id_screenplay_name{
 | |
|             border-radius:3px;
 | |
|             height: 28px;
 | |
|             font-size : 14px;
 | |
|             color: #000;
 | |
|           } {% endcomment %}
 | |
|           #id_language{
 | |
|             border-radius:3px;
 | |
|             height: 28px;
 | |
|             width: 155px;
 | |
|             margin: 0px 0px 5px;
 | |
|           }
 | |
|           #id_script_file {
 | |
|             width: 180px;
 | |
|             margin: auto;
 | |
|           }
 | |
|           .btn-primary{
 | |
|             margin-left:20px;
 | |
|             font-weight: bold;
 | |
|           }
 | |
|           .form-field{
 | |
|             padding: 0 5px 0 0;
 | |
|             display: flex;
 | |
|             grid-gap: 0 5px;
 | |
|             align-items: center;
 | |
|             justify-content: left;
 | |
| 
 | |
|           }
 | |
|           .form-row-audit {
 | |
|             display: grid;
 | |
|             grid-template-columns: repeat(3, 1fr);
 | |
|             row-gap: 10px;
 | |
|             margin-bottom: 6px;
 | |
|             margin-top: 20px;
 | |
|           }
 | |
|           .author_center {
 | |
|             width: 100%;
 | |
|             display: flex;
 | |
|             gap: 0 5px;
 | |
|             justify-content: center;
 | |
|             align-items: center;
 | |
|           }
 | |
|         .mb-5{
 | |
|           font-weight: 700;
 | |
|         }
 | |
| 
 | |
|         .container-995 {
 | |
|           width: 80%;
 | |
|           max-width: 100% !important;
 | |
|           padding: 0 !important;
 | |
|         }
 | |
| 
 | |
|         #input_fields_container_audit{
 | |
|           max-width: 410px;
 | |
|         }
 | |
|         .footer{
 | |
|           width:100%;
 | |
|           position: absolute !important;
 | |
|           bottom: 0;
 | |
|         }
 | |
| 
 | |
|         .card.card-custom {
 | |
|           -webkit-box-shadow: none;
 | |
|           box-shadow: none;
 | |
|         }
 | |
| 
 | |
|         .mt-5 {
 | |
|           margin-top: 0 !important;
 | |
|         }
 | |
| 
 | |
|         .card.card-custom>.card-body {
 | |
|           padding: 0 2rem !important;
 | |
|         }
 | |
| 
 | |
|         @media screen and (max-width: 1025px) {
 | |
|           .card.card-custom>.card-body {
 | |
|             margin-bottom: 2rem !important;
 | |
|           }
 | |
|         }
 | |
| 
 | |
|         @media screen and (max-width: 860px) {
 | |
|           .container-995 {
 | |
|             margin: auto 0;
 | |
|           }
 | |
|         }
 | |
| 
 | |
|         @media screen and (max-width: 768px) {
 | |
|           .form-row-audit {
 | |
|             display: flex;
 | |
|             flex-direction: column;
 | |
|             align-items: center;
 | |
|             justify-content: center;
 | |
|             margin-bottom: 2rem;
 | |
|           }
 | |
| 
 | |
|           .form-row-audit>div {
 | |
|             display: flex;
 | |
|             align-items: center;
 | |
|             justify-content: left;
 | |
|             width: 100%;
 | |
|           }
 | |
| 
 | |
|           #input_fields_container_audit {
 | |
|             margin-bottom: 2rem;
 | |
|             min-width: 86vw;
 | |
|             text-align: center;
 | |
|           }
 | |
| 
 | |
|           #input_fields_container_audit h3 {
 | |
|             font-size: 15px !important;
 | |
|             width: auto !important;
 | |
|           }
 | |
| 
 | |
|           #input_fields_container_audit p {
 | |
|             font-size: 10px !important;
 | |
|             width: 80vw;
 | |
|           }
 | |
| 
 | |
|           #input_fields_container_audit .form-field {
 | |
|             justify-content: center;
 | |
|             width: 80vw;
 | |
|           }
 | |
| 
 | |
|           #input_fields_container_audit .submit-btn-container {
 | |
|             width: 80vw !important;
 | |
|           }
 | |
|         }
 | |
|         @media screen and (max-width: 1367px) {
 | |
|           #mulitligule {
 | |
|              min-height: 105vh;
 | |
|           }
 | |
| 
 | |
|           .footer {
 | |
|             position: static !important;
 | |
|           }
 | |
|       }
 | |
|     </style>
 | |
|   </head>
 | |
|   <body>
 | |
|     <center class="new" style="display: none">
 | |
|       <h3 style="padding: 1em">
 | |
|         We are processing your script. <br />
 | |
|         We will notify you when it is Audited.
 | |
|       </h3>
 | |
|     </center>
 | |
| 
 | |
|     <div id="mulitligule" class="container-995" style="max-width: 1170px">
 | |
|       <div class="pb-0" style="padding: 0.5em">
 | |
|         <div class="card card-custom">
 | |
|           <div class="card-body">
 | |
|             <h3 class="mb-5" style="font-size: 24px; font-weight: 700;">{% trans "Welcome to Script Audit !" %}</h3>
 | |
|             <p class="ml-2" style="font-size: 14px; color: #616161;">
 | |
|               A Screenplay is a technical document.
 | |
|             </p>
 | |
|             <p class="ml-2" style="font-size: 14px; color: #616161;">
 | |
|               Hence, it is required to be written precisely as per international
 | |
|               conventions regarding font type and size, indentation, alignment
 | |
|               and spaces.
 | |
|             </p>
 | |
|             <p class="ml-2" style="font-size: 14px; color: #616161;">
 | |
|               However, inadvertent human errors may creep in while writing a
 | |
|               Screenplay.
 | |
|             </p>
 | |
|             <p class="ml-2" style="font-size: 14px; color: #616161;">
 | |
|               The Script Auditor identifies such inadvertent errors and corrects
 | |
|               them.
 | |
|             </p>
 | |
|             <p class="ml-2" style="font-size: 14px; color: #616161;">
 | |
|               It's simple. Upload your Script, wait for a few minutes and get
 | |
|               the audited version of your Script.
 | |
|             </p>
 | |
| 
 | |
|             <form
 | |
|               method="post"
 | |
|               action="{% url 'upload_audit_facade' %}"
 | |
|               enctype="multipart/form-data"
 | |
|               id="form-container"
 | |
|             >
 | |
|               {% csrf_token %}
 | |
| 
 | |
|               <!-- <p class="lead ml-2">{% trans "Upload your Script in docx or pdf or fdx or txt format below to Audit it and we will notify you once it is Audited." %}</p> -->
 | |
|               {% if form.non_field_errors %}
 | |
|               <div class="error-message">
 | |
|                 {% for error in form.non_field_errors %} {% comment %}
 | |
|                 <p class="custom-error">{{ error }}</p>
 | |
|                 {% endcomment %} {% endfor %}
 | |
|               </div>
 | |
|               {% endif %}
 | |
| 
 | |
|               <div class="form-row-audit">
 | |
|                 <div class="form-field w-100">
 | |
|                   <label for="id_screenplay_name" style="min-width: 115px; font-size: 14px; font-weight: 500;"
 | |
|                     >Screenplay name<span style="color: #ee3c4d">*</span></label
 | |
|                   >
 | |
|                   <input
 | |
|                     type="text"
 | |
|                     name="screenplay_name"
 | |
|                     maxlength="40"
 | |
|                     required
 | |
|                     id="id_screenplay_name"
 | |
|                   />
 | |
|                 </div>
 | |
| 
 | |
|                 <div class="author_center">
 | |
|                   <label for="id_author_name" style="font-size: 14px; font-weight: 500;"
 | |
|                     >Author<span style="color: #ee3c4d">*</span></label
 | |
|                   >
 | |
|                   <input
 | |
|                     type="text"
 | |
|                     id="author_name"
 | |
|                     name="author_name"
 | |
|                     maxlength="25"
 | |
|                     required
 | |
|                     id="id_author_name"
 | |
|                     style="padding-left: 5px; height: 28px"
 | |
|                   />
 | |
|                 </div>
 | |
| 
 | |
|                 <div class="form-field">
 | |
|                   <label for="id_language" style="font-size: 14px; font-weight: 500;">Language:</label>
 | |
|                   <select type="text" name="language" id="id_language">
 | |
|                     <option value="en">English</option>
 | |
|                     <option value="en">Other</option>
 | |
|                   </select>
 | |
|                 </div>
 | |
|               </div>
 | |
|               <div id="input_fields_container_audit">
 | |
|                 <h3 style="font-size: 16px; font-weight: 600; width: 485px;">
 | |
|                   Upload on Blockchain and Audit your Screenplay !
 | |
|                 </h3>
 | |
|                 <div style="text-align: center;">
 | |
|                   <p style="font-size: 12px;">Please upload your script in "docx", "pdf", "fdx" or "txt" format only..</p>
 | |
|                 </div>
 | |
|                 <div class="form-field">
 | |
|                   <!-- <label for="id_script_file">Script file<span style="color: #EE3C4D;">*</span></label> -->
 | |
|                   <input
 | |
|                     type="file"
 | |
|                     name="script_file"
 | |
|                     required
 | |
|                     id="id_script_file"
 | |
|                     syle="margin-left: 9rem"
 | |
|                   />
 | |
|                 </div>
 | |
| 
 | |
|                 {% for field in form %}
 | |
|                 <div class="mt-5 mx-3">
 | |
|                   {% if field.errors %}
 | |
|                   <p class="text-primary">{{ field.errors.0 }}</p>
 | |
|                   {% endif %}
 | |
|                 </div>
 | |
|                 {% endfor %} {% comment %} <button>Submit</button> {% endcomment
 | |
|                 %} {% comment %}
 | |
|                 <button type="submit" class="btn btn-primary my-5">
 | |
|                   Submit
 | |
|                 </button>
 | |
|                 {% endcomment %}
 | |
|                 <div class="submit-btn-container " style="width: 100%; text-align: center; margin-top: 0.4rem;">
 | |
|                   <input
 | |
|                     value="UPLOAD"
 | |
|                     id="submit-btn"
 | |
|                     class="btn btn-primary mx-auto"
 | |
|                     style="
 | |
|                       border-radius: 10px;
 | |
|                       font-family: inherit;
 | |
|                       font-weight: 700;
 | |
|                       font-size: 14px;
 | |
|                       padding: 6px 30px 6px 30px;
 | |
|                       background: #33B0CA;
 | |
|                       border: none;
 | |
|                     "
 | |
|                     type="submit"
 | |
|                   />
 | |
|                 </div>
 | |
|               </div>
 | |
|             </form>
 | |
|             <script>
 | |
|               document
 | |
|                 .getElementById("form-container")
 | |
|                 .addEventListener("submit", function () {
 | |
|                   document.getElementById("submit-btn").disabled = true;
 | |
|                   document.getElementById("submit-btn").style.backgroundColor = "#616161";
 | |
|                   document.getElementById("submit-btn").style.color = "#FAFAFA";
 | |
|                 });
 | |
|             </script>
 | |
|             <script>
 | |
|               const authorNameInput = document.getElementById("author_name");
 | |
| 
 | |
|               authorNameInput.addEventListener("input", function () {
 | |
|                 this.value = this.value.replace(/[^a-zA-Z ]/g, "");
 | |
|               });
 | |
|             </script>
 | |
|           </div>
 | |
|         </div>
 | |
|       </div>
 | |
|     </div>
 | |
|   </body>
 | |
| </html>
 | |
| 
 | |
|  {% comment %} {% include "mnfapp/footer.html" %} {% endcomment %}
 | |
| 
 | |
|  {% endblock %}
 |