361 lines
12 KiB
HTML
361 lines
12 KiB
HTML
|
{% 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>
|
||
|
|
||
|
|
||
|
|
||
|
{% endblock %}
|