{% extends "mnfapp/base.html" %}
{% load static %}
{% block content %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<!-- font-awesome -->
{% comment %} <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
integrity="sha512-MCQjHzXiDGfqw3jGxooYf7c3M2WEj5eqXWquqwfz3LN+mzIMHf/AaXoAdIcmhvZBWHaxROm5ZOFxjkoC+Gu9KA=="
crossorigin="anonymous" referrerpolicy="no-referrer" /> {% endcomment %}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<link rel="stylesheet" type="text/css"
href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
<!-- <link rel="stylesheet" href="project4.css"> -->
<!-- Refused to apply style from 'http://115.245.192.138/project4.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled. -->
<base href="static/media/">
<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/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.12"></script>
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<script src="https://js.stripe.com/v3/"></script>
<link rel="stylesheet" type="text/css" href=".." href="{% static 'homepage/css/style.css' %}">
<style>
* {
box-sizing: border-box;
}
body{
overflow-x:hidden;
}
/* Create three equal columns that floats next to each other */
.column {
float: left;
margin: 20px;
width: 446px;
height: 700px;
}
/* Should be removed. Only for demonstration *
/* Clear floats after the columns */
/*.row:after {
content: "";
display: table;
clear: both;
}
.shape {
width: 354px;
height: 115px;
background-color: green;
-webkit-clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
position: relative;
}
.shape:before {
content: '';
width: 341px;
height: 113px;
-webkit-clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
background: white;
display: block;
position: absolute;
top: 1px;
left: 1px;
}
.shape2 {
width: 454px;
height: 115px;
background-color: #43479E;
-webkit-clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
position: relative;
}
.shape2:before {
content: '';
width: 441px;
height: 113px;
-webkit-clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
background: white;
display: block;
position: absolute;
top: 0px;
left: 0px;
}
.shape3 {
width: 454px;
height: 115px;
background-color: #ee273c;
-webkit-clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
position: relative;
}
.shape3:before {
content: '';
width: 441px;
height: 113px;
-webkit-clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
clip-path: polygon(0 0, 900% 0, 100% 0%, 50% 100%, 0 0%);
background: white;
display: block;
position: absolute;
top: 0px;
left: 0px;
}*/
#title {
font-family: 'Poppins';
font-style: normal;
font-weight: 700;
font-size: 24px;
}
.footer {
position: static;
}
#box3 {
border-left: 1px solid rgba(238, 44, 61, 0.85);
border-right: 6px solid rgba(238, 44, 61, 0.85);
border-bottom: 6px solid rgba(238, 44, 61, 0.85);
border-bottom-left-radius: 150px;
border-bottom-right-radius: 75px;
}
#box2 {
border-left: 1px solid #43479e;
border-right: 6px solid #43479e;
border-bottom: 6px solid #43479e;
border-bottom-left-radius: 150px;
border-bottom-right-radius: 75px;
}
#box1 {
border-left: 1px solid #7ac043;
border-right: 6px solid #7ac043;
border-bottom: 6px solid #7ac043;
border-bottom-left-radius: 150px;
border-bottom-right-radius: 75px;
}
.flim-title {
min-height: 50px !important;
display: flex;
justify-content: center;
align-items: center;
background-color: #7ac043;
font-family: 'Poppins';
font-style: normal;
font-weight: 600;
color: white;
}
.pri-title {
min-height: 50px !important;
display: flex;
justify-content: center;
align-items: center;
background-color: #43479e;
font-family: 'Poppins';
font-style: normal;
font-weight: 600;
color: white;
}
.grab-title {
min-height: 50px !important;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: rgba(238, 44, 61, 0.85);
font-family: 'Poppins';
font-style: normal;
font-weight: 600;
color: white;
}
.p-title {
font-family: 'Poppins';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 20px;
color: #ee273c;
}
.pri-btn1 {
color: white;
font-weight: bold;
border: none;
width: 80%;
background: #43479E;
}
.pri-btn2 {
color: white;
font-weight: bold;
border: none;
width: 80%;
background: rgba(248, 69, 88, 0.85);
}
.pri-btnnone {
color: red;
font-weight: bold;
border: none;
width: 80%;
cursor:default;
}
.pri-btn1:hover {
transform: scale(1.1);
cursor: pointer;
}
.card-body li {
font-weight: 500;
}
/*.card1 {
background-image: url("./1.png") !important;
}*/
.batn {
width: 310px;
height: 30px;
background-color: #ee3c4d;
color: #fff;
border: solid #ee3c4d 1px;
border-radius: 20px;
font-size: 14px;
font-weight: bold;
float: right;
text-align: center;
margin-right: 25px;
}
.p-free,
.p-board,
.p-privilege {
text-align: right;
position: relative;
}
.p-free img {
position: absolute;
top: -30px;
right: 30px;
}
.pri-btn2:hover {
transform: scale(1.1);
cursor: pointer;
}
.p-board img {
/*background-image: url("{% static 'media/Ellipse 1.png' %}");
background-repeat: no-repeat;*/
background-color: #43479e;
border-radius: 50%;
position: absolute;
top: -30px;
right: 30px;
}
.p-privilege img {
/*background-image: url("{% static 'media/Ellipse 1.png' %}");
background-repeat: no-repeat;*/
background-color: #43479e;
border-radius: 50%;
position: absolute;
top: -20px;
right: 30px;
}
.p-additional {
background-repeat: no-repeat;
text-align: center;
color: #43479E;
margin-top: 100px !important;
font-weight: bold;
}
.batn:hover {
transform: scale(1.1)
}
.col {
margin-bottom: 50px;
}
.promo-container {
position: relative;
display: inline-block;
}
.promo-text {
position: relative;
color: white;
font-size: 24px;
font-weight: bold;
text-align: center;
z-index: 2;
white-space: nowrap;
}
.promo-star {
position: absolute;
top: 0;
margin-left: -143px;
margin-top: -3px;
width: 281px;
height: 46px;
z-index: 1;
}
.p-pop8,
.pop8 {
display: none;
position: absolute;
top: 13vh;
background: linear-gradient(to bottom,
rgba(254,
255,
255,
0.7),
rgba(254,
255,
255,
0.7)),
url("{%static 'media/./49.jpeg'%}") no-repeat center center/cover;
left: 24vw;
width: 54vw;
height: 75vh;
border: 4px solid purple;
border-radius: 20px;
padding: 20px;
z-index: 20;
}
.p-pop88,
.pop88 {
display: none;
position: absolute;
top: 13vh;
background:#FFE2E5;
left: 27vw;
min-width: 600px;
min-height: 450px;
border-radius: 20px;
padding: 20px;
z-index: 20;
}
.center_align {
display: flex;
justify-content: space-between;
margin: 0px 20px;
}
.jp_button_1 {
width: 190px;
height: 30px;
border: none;
border-radius: 40px;
font-weight: 600;
font-size: 14px;
top: 11px;
position: relative;
font-family: inherit;
cursor: pointer;
background: linear-gradient(90deg, rgba(96, 49, 134, 1) 0%, rgba(107, 56, 136, 1) 44%, rgba(238, 60, 77, 1) 73%, rgba(238, 60, 77, 1) 100%);
color: #ffff;
}
{% comment %} .hidden {
display: none;
} {% endcomment %}
{% comment %} #jp_table1{
display: block;
height: 60vh;
overflow: auto;
} {% endcomment %}
#jp_table1 {
display: block;
height: 63vh;
overflow: auto;
{% comment %} display: flex;
justify-content: center;
text-align: center; {% endcomment %}
margin-top: 20px;
margin-left:20px;
margin-bottom:20px;
}
#jp_table2{
height: 60vh;
overflow: auto;
display:none;
{% comment %} display: flex;
justify-content: center;
text-align: center; {% endcomment %}
margin-top: 20px;
margin-left:20px;
}
.btn {
background: #7634d9;
background-image: -webkit-linear-gradient(left, #55318b, rgb(238, 60, 77));
background-image: -moz-linear-gradient(left, #55318b, rgb(238, 60, 77));
background-image: -ms-linear-gradient(left, #55318b, rgb(238, 60, 77));
background-image: -o-linear-gradient(left, #55318b, rgb(238, 60, 77));
background-image: linear-gradient(to right, #55318b, rgb(238, 60, 77));
border-radius: 60px;
color: #ffffff;
font-size: 2vh;
padding: 3px 17px 2px 13px;
text-decoration: none;
border: none;
/*cursor: pointer;*/
font-family: Poppins, Helvetica, "sans-serif";
font-weight: bold;
}
.pop1btn8 {
width: 32vw;
height: 6vh;
position: absolute;
top: -3vh;
left: 11vw;
align-items: center;
font-size: 2vw;
font-family: Poppins, Helvetica, "sans-serif";
font-weight: bold;
}
.red-cross-btn {
border: 1px solid whitesmoke;
font-size: 12px;
border-radius: 50%;
background-color: #d64242;
color: white;
height: 18px;
width: 18px;
display: flex;
justify-content: center;
align-items: center;
font-weight: 700;
cursor: pointer;
z-index: 999;
padding:17px;
}
.red-cross-btn {
position: absolute;
top: -20px;
right: -10px;
}
.jp_button_1_clicked {
background:#FFE2E6;
color:#EE3C4D;
}
.table-con table td,
.table-con-discount table td,
.table-div table td {
width: max-content;
font-size: 1vw;
padding: 5px 2px;
color: #444 !important;
font-family: Poppins, Helvetica, "sans-serif";
font-weight: bold;
}
.table-con table td,
.table-con-discount table td,
.table-div table td {
position: relative;
left: .5vw;
}
.table-div table {
background-color: rgba(246, 220, 220, 0.5);
border: 1px solid #6f6e6e;
border-collapse: collapse;
margin: 0;
padding: 0;
width: 100%;
table-layout: fixed;
color: #444 !important;
}
.table-div td,
tr {
border: 1px solid #f97474;
border-collapse: collapse;
padding: 0;
margin: 0;
}
.table-con td,
tr {
border-bottom: 1px solid #f97474;
border-collapse: collapse;
padding: 0;
margin: 0;
}
.table-con-discount td,
tr {
border-bottom: 1px solid #f97474;
border-collapse: collapse;
padding: 0;
margin: 0;
}
.table-con table,
.table-con-discount table {
border: none;
margin: 0;
padding: 0;
width: 100%;
table-layout: fixed;
color: #444;
}
.table-con thead td,
.table-div thead td {
color: #f43434 !important;
font-size: 1.3vw !important;
padding: 2px 2px !important;
}
.table-con tbody td {
font-size: 1vw !important;
}
.table-con-discount thead td {
color: #f43434 !important;
font-size: 30px !important;
padding: 10px 2px !important;
}
.jp_tablehead,.jp_tablehead2 {
color: #EE3C4D;
background: #FFE2E6;
font-size: 14px;
padding: 2px 12px;
}
.jp_tablehead,.jp_tabledata,.jp_tablehead2 {
border: 1px solid #EE3C4D;
padding: 4px 0px;
text-align: center;
font-family: 'Poppins', sans-serif !important;
font-size: 12px;
color: #333031;
}
.jp_tabledataaa ,.jp_tableheaddd{
border: 1px solid #EE3C4D;
padding: 4px 22px;
text-align: center;
font-family: 'Poppins', sans-serif !important;
font-size: 12px;
color: #333031;
}
.extra_bold_text {
font-weight: 600;
font-weight: bolder;
}
@supports (-webkit-appearance: none) or (-moz-appearance: none) {
.checkbox-wrapper-13 input[type=checkbox] {
--active: #EE3C4D;
--active-inner: red;
--focus: 2px #8f252f(39, 94, 254, .3);
--border: #EE3C4D;
--border-hover: #EE3C4D;
--background: #fff;
--disabled: #F6F8FF;
--disabled-inner: #E1E6F9;
-webkit-appearance: none;
-moz-appearance: none;
height: 16px;
outline: none;
display: inline-block;
vertical-align: top;
position: relative;
margin: 0;
cursor: pointer;
border: 2px solid var(--bc, var(--border));
background: var(--b, var(--background));
transition: background 0.3s, border-color 0.3s, box-shadow 0.2s;
}
.checkbox-wrapper-13 input[type=checkbox]:after {
content: "";
display: block;
left: 0;
top: 0;
position: absolute;
transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s);
}
.checkbox-wrapper-13 input[type=checkbox]:checked {
--b: transparent;
--bc: var(--active);
--d-o: .3s;
--d-t: .6s;
--d-t-e: cubic-bezier(.2, .85, .32, 1.2);
}
.checkbox-wrapper-13 input[type=checkbox]:disabled {
--b: var(--disabled);
cursor: not-allowed;
opacity: 0.9;
}
.checkbox-wrapper-13 input[type=checkbox]:disabled:checked {
--b: var(--disabled-inner);
--bc: var(--border);
}
.checkbox-wrapper-13 input[type=checkbox]:disabled + label {
cursor: not-allowed;
}
.checkbox-wrapper-13 input[type=checkbox]:hover:not(:checked):not(:disabled) {
--bc: var(--border-hover);
}
.checkbox-wrapper-13 input[type=checkbox]:focus {
box-shadow: 0 0 0 var(--focus);
}
.checkbox-wrapper-13 input[type=checkbox]:not(.switch) {
width: 17px;
}
.checkbox-wrapper-13 input[type=checkbox]:not(.switch):after {
opacity: var(--o, 0);
}
.checkbox-wrapper-13 input[type=checkbox]:not(.switch):checked {
--o: 1;
}
.checkbox-wrapper-13 input[type=checkbox] + label {
display: inline-block;
vertical-align: middle;
cursor: pointer;
margin-left: 3.5px;
}
.checkbox-wrapper-13 input[type=checkbox]:not(.switch) {
border-radius: 1px;
}
.checkbox-wrapper-13 input[type=checkbox]:not(.switch):after {
width: 4px;
height: 8px;
border: 2px solid var(--active-inner);
border-top: 0;
border-left: 0;
left: 5px;
top: 2px;
transform: rotate(var(--r, 20deg));
}
.checkbox-wrapper-13 input[type=checkbox]:not(.switch):checked {
--r: 43deg;
}
.jp_buynow_button {
color: #ee3a4c;
background: #FFE2E6;
border: none;
box-sizing: border-box;
padding: 2px 14px;
border-radius: 14px;
cursor: pointer;
font-style: bold;
font-size: 13px;
}
.jp_buynow_button:hover{
background:#DB5858;
color: #FFE2E6;
}
}
.italic_text {
font-style: italic;
font-weight: 600;
}
.center_bottom_text {
display: flex;
justify-content: center;
top: 20px;
position: relative;
font-size: 16px;
}
{% comment %} .jp_tablehead2 {
color: #EE3C4D;
background: #FFE2E6;
font-size: 14px;
padding: 2px 12px;
} {% endcomment %}
{% comment %} .col_width3 {
width: 105px;
} {% endcomment %}
.popo{
{% comment %} border:2px solid blue; {% endcomment %}
}
.bb{
background:#FFE2E6;
color:#EE3C4D;
}
.overlay{
z-index:44444;
border:2px solid black;
height:50vh;
weight:100px;
display: none;
background-color: rgba(0, 0, 0, 0.7);
position:absolute;
top:0;
left:30px;
{% comment %} position: fixed; {% endcomment %}
}
{% comment %} .overlay {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
align-items: center;
justify-content: center;
} {% endcomment %}
/* Styles for the modal */
.modal {
z-index:444444;
background-color: #fff;
padding: 20px;
border-radius: 5px;
max-width: 400px;
text-align: center;
}
/* Style for the close button */
.close-btn {
z-index:4444477;
cursor: pointer;
color: #333;
font-size: 20px;
font-weight: bold;
}
</style>
</head>
<body>
<div class="container mx-auto" style="min-height: 90vh;">
<h4 id="title">Pull Your <span style="color:#EE273C;">Filmmaking Future Into Present</span>
</h4>
<div class="pay-payment">
<div class="checkout-container ">
<button class="batn activation-btn" id="submit-button"><a href="/pay/verifygift"
style="color: white;">Activate Your Gift Subscription</a>
</button>
</div>
<div class="checkout-container">
{% comment %} <button class="batn activation-btn" id="submit-button" onclick="myFunction17P()" onmouseleave="SetTimeOutForIdea()"
style="color: white; margin-right:20px;">juggernaut Package
</button> {% endcomment %}
<a href="/pay/base_related"><button class="batn activation-btn" id="submit-button" onmouseleave="SetTimeOutForIdea()"
style="color: white; margin-right:20px;">juggernaut Package
</button></a>
</div>
{% comment %} check {% endcomment %}
{% comment %} <div class="checkout-container">
<button class="batn activation-btn" id="submit-button" onclick="myFunction17PP()"
style="color: white; margin-right:20px;">Check
</button>
</div> {% endcomment %}
<div class="p-pop88" style="z-index:999 !important;" >
<i class="fa-solid fa-x red-cross-btn" onclick="myFunction188()" style="cursor:pointer;"></i>
<h3>Amount: {{total_amount}} USD </h3>
<div class="payment-elements" id="payment-element"></div>
<button class="btn btn-danger px-3 py-2 mt-2" onclick="handleStripePayment()" id="stripe-pay-button">Make Payment</button>
</div>
{% comment %} end {% endcomment %}
<!-- Bundle pricing -->
<div class="p-pop8" onmouseover="typeWriter8()">
<button class="btn pop1btn8">Juggernaut Packages </button>
<i class="fa-solid fa-x red-cross-btn" onclick="myFunction18()" style="cursor:pointer;"></i>
{% comment %} <h3 class="margin-top primary-color">Coming soon..........</h3> {% endcomment %}
<div class="center_align">
<button id="production_house_button" class="jp_button_1 bb">Production Houses</button>
<button id="screenplay_writers_button" class="jp_button_1">Screenplay Writers</button>
</div>
<!-- ******************first table***************** -->
<div id="jp_table1" class="popo">
<table id="jp_table" class="jp_table">
<tr class="jp_tablerow">
<th class="jp_tablehead jp_tableheaddd" colspan="4">Package Name</th>
<th class="jp_tablehead jp_tableheaddd col_width3">Radiate</th>
<th class="jp_tablehead jp_tableheaddd col_width3">Regionalise</th>
<th class="jp_tablehead jp_tableheaddd col_width3">Globalise</th>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata medium_bold_text" colspan="4">Validity in days</td>
<td class="jp_tabledata medium_bold_text">30</td>
<td class="jp_tabledata medium_bold_text">180</td>
<td class="jp_tabledata medium_bold_text">365</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata medium_bold_text" colspan="4">Price $</td>
<td id="radiate_price" class="jp_tabledata medium_bold_text">149</td>
<td id="regionalise_price" class="jp_tabledata medium_bold_text">1499</td>
<td id="globalise_price" class="jp_tabledata medium_bold_text">14999</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata jp_tabledataaa extra_bold_text " rowspan="4">Subtitling</td>
<td class="jp_tabledata left_text medium_bold_text" colspan="3">Number of Minutes Input (Any
number of videos)</td>
<td class="jp_tabledata medium_bold_text">30</td>
<td class="jp_tabledata medium_bold_text">150</td>
<td class="jp_tabledata medium_bold_text">1200</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata left_text medium_bold_text" colspan="3">Output in No. of Languages</td>
<td class="jp_tabledata medium_bold_text">2</td>
<td class="jp_tabledata medium_bold_text">5</td>
<td class="jp_tabledata medium_bold_text">8</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata left_text medium_bold_text" colspan="3">No. of iterations per language
</td>
<td class="jp_tabledata medium_bold_text">2</td>
<td class="jp_tabledata medium_bold_text">2</td>
<td class="jp_tabledata medium_bold_text">2</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata italic_text left_text medium_bold_text" colspan="6">Note : Extra
minutes/
Subtitles in more
languages/ more
iterations
are available at normal rates.</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata extra_bold_text " rowspan="8">Added Benefits</td>
<td class="jp_tabledata extra_bold_text left_text" colspan="3">No. of Projects
Scheduling and Budgeting</td>
<td class="jp_tabledata">2</td>
<td class="jp_tabledata">5</td>
<td class="jp_tabledata">10</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata extra_bold_text left_text" rowspan="3">Narration in 1 language</td>
<td class="jp_tabledata italic_text right_text medium_bold_text" colspan="2">Character
Introduction
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata italic_text right_text medium_bold_text" colspan="2">Line by line
Narration
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata italic_text right_text medium_bold_text" colspan="2">Character Wise
Narration</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata extra_bold_text left_text" rowspan="2">Conversion</td>
<td class="jp_tabledata italic_text right_text medium_bold_text" colspan="2">No. of Script pages
for
Conversion</td>
<td class="jp_tabledata medium_bold_text">0</td>
<td class="jp_tabledata medium_bold_text">150</td>
<td class="jp_tabledata medium_bold_text">1200</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata italic_text right_text medium_bold_text" colspan="2">Conversion in
languages
with LPP</td>
<td class="jp_tabledata medium_bold_text">0</td>
<td class="jp_tabledata medium_bold_text">1</td>
<td class="jp_tabledata medium_bold_text">1</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata extra_bold_text left_text" colspan="3">AI-assisted beat wise Scene
generation</td>
<td class="jp_tabledata medium_bold_text">100</td>
<td class="jp_tabledata medium_bold_text">500</td>
<td class="jp_tabledata medium_bold_text">5000</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata extra_bold_text left_text" colspan="3">Screenplay Audit</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata" colspan="4"></td>
<td class="jp_tabledata">
{% if user.is_authenticated%}
<button onclick="handleUrlWithPricing('Radiate','149')" class="jp_buynow_button medium_bold_text" id="buybutton1">Buy Now </button>
{% else %}
<button onclick="alert('Please log in to access this feature.');" class="jp_buynow_button" >Buy Now </button>
{% endif %}
</td>
<td class="jp_tabledata">
{% if user.is_authenticated%}
<button onclick="handleUrlWithPricing('Regionalise','1499')" class="jp_buynow_button medium_bold_text" id="buybutton2">Buy Now</button>
{% else %}
<button onclick="alert('Please log in to access this feature.');" class="jp_buynow_button medium_bold_text">Buy Now</button>
{% endif %}
</td>
<td class="jp_tabledata">
{% if user.is_authenticated%}
<button onclick="handleUrlWithPricing('Globalise','14999')" class="jp_buynow_button medium_bold_text" id="buybutton3">Buy Now</button>
{% else %}
<button onclick="alert('Please log in to access this feature.');" class="jp_buynow_button medium_bold_text">Buy Now</button>
{% endif %}
</td>
</tr>
</table>
</div>
<!-- ******************second table***************** -->
<div id="jp_table2">
<table id="jp_table" class="jp_table">
<tr class="jp_tablerow">
<th class="jp_tablehead2" colspan="4">Package Name (For 110 Pages)</th>
<th class="jp_tablehead2 col_width3">Long Jump</th>
<th class="jp_tablehead2 col_width3">Triple Jump</th>
<th class="jp_tablehead2 col_width3">High Jump</th>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata medium_bold_text" colspan="4">Validity in days</td>
<td class="jp_tabledata medium_bold_text">90</td>
<td class="jp_tabledata medium_bold_text">180</td>
<td class="jp_tabledata medium_bold_text">365</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata medium_bold_text" colspan="4">Price $</td>
<td id="longjump_price" class="jp_tabledata medium_bold_text">149</td>
<td id="triplejump_price" class="jp_tabledata medium_bold_text">274</td>
<td id="highjump_price" class="jp_tabledata medium_bold_text">399</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata left_text extra_bold_text" colspan="4">AI-assisted beat wise Scene
generation</td>
<td class="jp_tabledata medium_bold_text">500</td>
<td class="jp_tabledata medium_bold_text">1000</td>
<td class="jp_tabledata medium_bold_text">2000</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata left_text extra_bold_text" colspan="4">Screenplay Audit</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata extra_bold_text " rowspan="3">Conversion</td>
<td class="jp_tabledata italic_text left_text medium_bold_text col_width2" colspan="3">Languages
(with Vetting by Language Pair Partners)</td>
<td class="jp_tabledata ">1</td>
<td class="jp_tabledata ">3</td>
<td class="jp_tabledata ">5</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata italic_text left_text medium_bold_text" colspan="3">No. of iterations
per
language</td>
<td class="jp_tabledata ">2</td>
<td class="jp_tabledata ">2</td>
<td class="jp_tabledata ">2</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata italic_text left_text medium_bold_text" colspan="3">Conversion in
additional
languages
</td>
<td class="jp_tabledata extra_bold_italic_text" colspan="3">$99 each with applicable discounts
</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata extra_bold_text " rowspan="3">Pitch deck creation
(in 1 language)</td>
<td class="jp_tabledata italic_text left_text medium_bold_text" colspan="3">One pager</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata italic_text left_text medium_bold_text" colspan="3">Elevator Pitch</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata italic_text left_text medium_bold_text" colspan="3">Screenplay Analysis
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata extra_bold_text" colspan="4">Scheduling and Budgeting of 1 Project</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
<td class="jp_tabledata">
<div class="checkbox-wrapper-13">
<input id="" type="checkbox" name="" class="jp_checkbox" value="" checked >
</div>
</td>
</tr>
<tr class="jp_tablerow">
<td class="jp_tabledata" colspan="4"></td>
<td class="jp_tabledata">
{% if user.is_authenticated%}
<button onclick="handleUrlWithPricing('Longjump','149')" class="jp_buynow_button" id="buybutton4">Buy Now</button>
{% else %}
<button onclick="alert('Please log in to access this feature.');" class="jp_buynow_button" >Buy Now </button>
{% endif %}
</td>
<td class="jp_tabledata">
{% if user.is_authenticated%}
<button onclick="handleUrlWithPricing('Triplejump','274')" class="jp_buynow_button" id="buybutton5">Buy Now</button>
{% else %}
<button onclick="alert('Please log in to access this feature.');" class="jp_buynow_button">Buy Now </button>
{% endif %}
</td>
<td class="jp_tabledata">
{% if user.is_authenticated%}
<button onclick="handleUrlWithPricing('Highjump','399')" class="jp_buynow_button" id="buybutton6">Buy Now</button>
{% else %}
<button onclick="alert('Please log in to access this feature.');" class="jp_buynow_button" >Buy Now </button>
{% endif %}
</td>
</tr>
</table>
<div>
<p class="center_bottom_text italic_text">Note : Validity is extendable by 30 days at a price of $5
</p>
</div>
</div>
</div>
</div>
{{member_type}}
{% if user.is_authenticated and dataP3 %}
<h1 style="text-align: left;">
<i style="color:black;"> Hi {{user.username}},<br> You are already a privileged member and your membership is valid till <span id="validity">{{expiry}}(UTC)</span>
</i>
</h1>
{%elif dataP4%}
<h4 style="text-align: left;">
<i style="color:black;"> Hi {{user.username}},<br> You are already a Life member and your membership is valid till <span id="validity2">{{expiry}}(UTC)</span>
</i>
</h4>
{%else%}
<h4 style="text-align: left;">
<i style="color:black;"> Hi {{user.username}},<br> Become a privileged member to avail our exciting services.
</i>
</h4>
{%endif%}
<div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-5">
<div class="col" style="">
<div class="card h-100 card-style card1" id="box1">
<h4 class="flim-title">Filmmaking Democratized</h4>
<div class="card-body">
<p class="p-title">In the Idea Mall</p>
<p>
<ul>
<li>Post your ideas, scripts, etc</li>
<li>Browse ideas posted by others</li>
<li>Find Co-writers</li>
<li>Find opportunities for Script Writing</li>
</ul>
</p>
<p class="p-title">In the Viewer's Lounge</p>
<p>
<ul>
<li>Upload your Showreel and other videos.</li>
<li>Create your video introduction for everyone to see.</li>
</ul>
</p>
<p class="p-title">In the Harkat Club</p>
<p>
<ul>
<li>Free membership of Harkat Club</li>
<li>Propose and set up a Harkat Club in your locality</li>
</ul>
</p>
<p class="p-title text-center" style="font-size: 24px;margin-top:40px;">& Also.... </p>
<p>
<ul>
<li>Limited usage of conversion studio, Narration room, Script Builder, Preview Chamber etc</li>
</ul>
</p>
</div>
<p class="p-free"><img loading="lazyloading" loading="lazyloading" src="{% static 'media/Frame1.png' %}" alt=""></p>
</div>
</div>
<div class="col" style="">
<div class="card h-100 card-style" id="box2">
<h4 class=" pri-title">Privileges waiting for You!</h4>
<div class="card-body">
<p class="p-title">In the Idea Mall</p>
<p>
<ul>
<li>Auction your scripts and Projects.</li>
<li>Commission script writing assignments and find co-producers and financers</li>
</ul>
</p>
<p class="p-title">Unique Offerings!</p>
<p>
<ul>
<li>Full benefits of conversion studio, Narration room, Script Builder, Preview Chamber etc</li>
</ul>
</p>
<div class="mx-auto text-center mt-2">
{% comment %} manoj starts code for monthly payment{% endcomment %}
{% if user.is_staff %}
<form action="{% url 'payment' %}" method="post" class="buy-now-up-btn">
{%csrf_token%}
<input type="text" style="display: none;" name="plan" value='Monthly special' id="plan" required>
<input type="text" style="display: none;" name="country">
{%if monthly_disable %}
<!-- <button id='claim' type="submit" disabled class="pri-btn1 rounded p-2 mb-2" style="font-size: 18px;">claim -->
<button id='claim' type="submit" class="pri-btn1 rounded p-2 mb-2" style="font-size: 18px;">claim
Privileges <br>for 1 USD/month</button>
{%else%}
<button type="submit" class="pri-btn1 rounded p-2 mb-2" style="font-size: 18px;">Claim Privileges
<br>for 1 USD/month</button>
{%endif%}
</form>
{% else %}
<form action="{% url 'payment' %}" method="post" class="buy-now-up-btn">
4
<input type="text" style="display: none;" name="plan" value='Monthly plan' id="plan" required>
<input type="text" style="display: none;" name="country">
{%if monthly_disable %}
<!-- <button type="submit" disabled class="pri-btn1 rounded p-2 mb-2" style="font-size: 18px;">Claim -->
<button type="submit" class="pri-btn1 rounded p-2 mb-2" style="font-size: 18px;">Claim
Privileges <br>for 1 USD/month</button>
{%else%}
<button type="submit" class="pri-btn1 rounded p-2 mb-2" style="font-size: 18px;">Claim Privileges
<br>for 1 USD/month</button>
{%endif%}
</form>
{%endif%}
{% comment %} manoj ends code for monthly payment {% endcomment %}
{% comment %} <button class="pri-btn1 rounded p-2 mb-2" style="font-size: 18px;">Claim Privileges <br>for
1 USD/month</button> {% endcomment %}
<div class="mt-5">
<p class="mt-5"><span style="color: #43479E;font-size: 18px;font-weight:bold">Yearly Subscription
</span>
<br>
<span style="color: #EE273C;font-size: 16px;">10 % additional discount on all services </span>
</p>
{% comment %} manoj starts code for yearly payment{% endcomment %}
{% if user.is_staff %}
<form action="{% url 'payment' %}" method="post" class="buy-now-up-btn">
{%csrf_token%}
<input type="text" style="display: none;" name="plan" value='yearly special' id="plan" required>
<input type="text" style="display: none;" name="country">
{%if yearly_disable %}
<!-- <button class="pri-btn1 rounded p-2" type="submit" disabled style="font-size: 18px;">Claim Privileges -->
<button class="pri-btn1 rounded p-2" type="submit" style="font-size: 18px;">Claim Privileges
Now for $10</button>
{%else%}
<button class="pri-btn1 rounded p-2" type="submit" style="font-size: 18px;">Claim Privileges Now for
$10</button>
{%endif%}
</form>
{% else %}
<form action="{% url 'payment' %}" method="post" class="buy-now-up-btn">
{%csrf_token%}
<input type="text" style="display: none;" name="plan" value='yearly' id="plan" required>
<input type="text" style="display: none;" name="country">
{%if yearly_disable %}
<!-- <button class="pri-btn1 rounded p-3" type="submit" disabled style="font-size: 18px;">Claim Privileges -->
<button class="pri-btn1 rounded p-3" type="submit" style="font-size: 18px;">Claim Privileges
Now for $10</button>
{%else%}
<button class="pri-btn1 rounded p-3" type="submit" style="font-size: 18px;">Claim Privileges Now for
$10</button>
{%endif%}
</form>
{%endif%}
{% comment %} manoj ends code for yearly payment {% endcomment %}
{% comment %} <button class="pri-btn1 rounded p-5" style="font-size: 24px;">Claim Privileges Now for
$10</button> {% endcomment %}
</div>
</div>
</div>
<!-- <p class="p-privilege"><img loading="lazyloading" loading="lazyloading" src="{% static 'media/privilege 1.png' %}" alt=""></p> -->
<p class="p-privilege"><img loading="lazyloading" loading="lazyloading" src="{% static 'media/image.png' %}" alt=""></p>
</div>
</div>
<div class="col" style="">
<div class="card h-100 card-style" id="box3">
<div class=" grab-title">
<div>
<span class="" style="font-size: 16px;">Grab a Life Membership!</span><br>
<span style="font-size:12px;">For 10 years</span>
</div>
</div>
<div class="card-body">
<p class="p-title">20 % additional discount on all services</p>
<p>
<ul>
<li>Free trial of yet to be launched products and services.</li>
<li>Get a committed Relationship Manager.</li>
<li>Be on the MNF life member’s page.</li>
<li>Get priority notifications/ informations for filmmaking related business
proposals/assignments/opportunities</li>
</ul>
</p>
<div class="mx-auto text-center mt-2">
{% comment %} manoj code for life payment {% endcomment %}
{% if user.is_staff %}
<!-- <p class="p-title">Only {{left}} left for {{thisMonth}}</p> -->
<!-- <button class="pri-btnnone rounded p-2 mb-2" style="font-size: 18px;cursor: default;">Only {{left}} left for
{{thisMonth}}</button> -->
<!-- <img loading="lazyloading" loading="lazyloading" src="{% static 'media/art.png' %}" class="promo-star" alt="bgart">-->
<div class="promo-container">
<img loading="lazyloading" loading="lazyloading" src="{% static 'media/art.png' %}" class="promo-star" alt="bgart">
<div class="promo-text"><p class="pri-btnnone rounded p-2 mb-2" style="font-size: 18px; margin-left: 20px;" >Only {{left}} left for {{thisMonth}}</p>
</div>
</div>
{%else%}
<form action="{% url 'payment' %}" method="post">
{%csrf_token%}
<input type="text" style="display: none;" name="plan" value='Life' id="plan" required>
<input type="text" style="display: none;" name="country">
{%if life_disable %}
<!-- <button type="submit" disabled class="pri-btn2 rounded p-2 mb-2" style="font-size: 18px;">Buy for 95 -->
<button type="submit" class="pri-btn2 rounded p-2 mb-2" style="font-size: 18px;">Buy for 95
USD</button>
{%else%}
<button type="submit" class="pri-btn2 rounded p-2 mb-2" style="font-size: 18px;">Buy for 95 USD</button>
{%endif%}
</form>
{% endif %}
{% comment %} ends manoj code {% endcomment %}
{% comment %} <button class="pri-btn2 rounded p-2 mb-2" style="font-size: 18px;">Buy for 95 USD</button>
{% endcomment %}
</div>
<p class="p-title">50 % saving on Life membership for</p>
<p>
<ul>
<li>Language Pair Partners</li>
<li>MNF Messiah</li>
<li>Harkat Club Founders</li>
<li>Find opportunities for Script Writing</li>
</ul>
</p>
<div class="mx-auto text-center mt-2">
{% if user.is_staff %}
<form action="{% url 'payment' %}" method="post">
{%csrf_token%}
<input type="text" style="display: none;" name="plan" value='Life' id="plan" required>
<input type="text" style="display: none;" name="country">
{%if life_disable %}
<!-- <button type="submit" disabled class="pri-btn2 rounded p-2 mb-2" style="font-size: 18px;">Grab it now <br>for 47 USD only</button> -->
<button type="submit" class="pri-btn2 rounded p-2 mb-2" style="font-size: 18px;">Grab it now <br>for 47 USD only</button>
{%else%}
<button type="submit" class="pri-btn2 rounded p-2 mb-2" style="font-size: 18px;">Grab it now <br>for 47
USD only</button>
{%endif%}
</form>
{%else%}
<button class="pri-btn2 rounded p-2 mb-2" style="font-size: 18px;cursor:default;">Only {{left}} left for
{{thisMonth}}</button>
{% endif %}
{% comment %} <button class="pri-btn2 rounded p-2 mb-2" style="font-size: 18px;">Grab it now <br>for 47
USD only</button> {% endcomment %}
</div>
</div>
<!-- <p class="p-board"><img loading="lazyloading" loading="lazyloading" src="{% static 'media/clapperboard 1.png' %}" alt=""></p> -->
<p class="p-board"><img loading="lazyloading" loading="lazyloading" src="{% static 'media/Capture.PNG' %}" alt=""></p>
</div>
</div>
</div>
{% comment %} RAZOR PAY FORM {% endcomment %}
{% if orderId %}
<form action="{% url 'jugarnut_Razorpay' %}" method="POST" id='payment-form' style="margin-top: 100px; position: absolute; min-width: 100%;">
{%csrf_token%}
<input type="hidden" name="payment_intent_id" value='{{pid}}'>
<div id="card-element" class="card-payment"></div>
</form>
{% endif %}
</div>
<div class="mt-5">
{% comment %} {% include 'mnfapp/footer.html' %} {% endcomment %}
</div>
<script>
$(document).ready(function () {
function daysInThisMonth() {
var now = new Date();
return new Date(now.getFullYear(), now.getMonth() + 1, 0).getDate();
}
const months = ["January", "February", "March", "April", "May", "June", "July", "August", "September",
"October", "November", "December"
];
var today = new Date();
var currentMonth = months[today.getMonth()];
var daysLeft = daysInThisMonth() - today.getDate() + 1;
$('#days-left')[0].textContent = daysLeft;
$('#current-month')[0].textContent = currentMonth;
});
</script>
<script>
fetch("https://ipinfo.io/json?key=tryout").then(
(response) => response.json()
).then(
(jsonResponse) => {
console.log(jsonResponse)
let L = document.getElementsByName("country");
console.log(L);
for (l of L) {
l.setAttribute("value", jsonResponse.country);
}
}
)
function add_months(dt, n) {
return new Date(dt.setMonth(dt.getMonth() + n));
}
</script>
<script>
function myFunction17P() {
timeoutId = setTimeout(function () {
document.querySelector(".p-pop8").style.display = "block";
}, 200);
}
</script>
<script>
var o = 0;
var speed8 = 150;
const pop8 = document.querySelector(".pop8");
function typeWriter8() {
if (!typeWriter8.called) {
typeWriter8.called = true;
var txt8 = new Typed(".p8-auto-type", {
strings: ["<li>MNF invites you to join or set up and administer a real life filmmaking club in your city, town or neighbourhood.</li><li>MNF supports the Harkat Clubs to make and showcase their films.</li><li>MNF also refers filmmaking related opportunities and assignments to the appropriate Harkat Club.</li>"],
typeSpeed: 41,
startDelay: 3000,
showCursor: false,
});
pop8.addEventListener("mouseenter", () => {
txt8.start();
});
pop8.addEventListener("mouseleave", () => {
txt8.stop();
});
}
}
function myFunction18() {
document.querySelector(".p-pop8").style.display = "none";
}
{% comment %} function myFunction188() {
document.querySelector(".p-pop88").style.display = "none";
} {% endcomment %}
function SetTimeOutForIdea() {
clearTimeout(timeoutId);
}
</script>
<script>
document.addEventListener("DOMContentLoaded", function () {
const productionHouseButton = document.getElementById("production_house_button");
const screenplayWritersButton = document.getElementById("screenplay_writers_button");
const jpTable1 = document.getElementById("jp_table1");
const jpTable2 = document.getElementById("jp_table2");
function handleButtonClick(button, divToDisplay) {
jpTable1.style.display = "none";
jpTable2.style.display = "none";
// Remove the "jp_button_1_clicked" class from all buttons
productionHouseButton.classList.remove("bb")
screenplayWritersButton.classList.remove("jp_button_1_clicked");
// Show the specified div
divToDisplay.style.display = "block";
// Add the "jp_button_1_clicked" class to the clicked button
button.classList.add("jp_button_1_clicked");
}
// Add click event listeners to the buttons
productionHouseButton.addEventListener("click", function () {
handleButtonClick(productionHouseButton, jpTable1);
});
screenplayWritersButton.addEventListener("click", function () {
handleButtonClick(screenplayWritersButton, jpTable2);
});
});
</script>
{% comment %} check {% endcomment %}
<script>
$(document).ready(function () {
function daysInThisMonth() {
var now = new Date();
return new Date(now.getFullYear(), now.getMonth() + 1, 0).getDate();
}
const months = ["January", "February", "March", "April", "May", "June", "July", "August", "September",
"October", "November", "December"
];
var today = new Date();
var currentMonth = months[today.getMonth()];
var daysLeft = daysInThisMonth() - today.getDate() + 1;
$('#days-left')[0].textContent = daysLeft;
$('#current-month')[0].textContent = currentMonth;
});
</script>
<script>
fetch("https://ipinfo.io/json?key=tryout").then(
(response) => response.json()
).then(
(jsonResponse) => {
console.log(jsonResponse)
let L = document.getElementsByName("country");
console.log(L);
for (l of L) {
l.setAttribute("value", jsonResponse.country);
}
}
)
function add_months(dt, n) {
return new Date(dt.setMonth(dt.getMonth() + n));
}
</script>
<script>
function myFunction17P() {
timeoutId = setTimeout(function () {
document.querySelector(".p-pop8").style.display = "block";
}, 200);
}
{% comment %} stripe modal open {% endcomment %}
function myFunction17PP() {
timeoutId = setTimeout(function () {
document.querySelector(".p-pop88").style.display = "block";
}, 200);
}
{% comment %} stripe modal close {% endcomment %}
function myFunction188() {
document.querySelector(".p-pop88").style.display = "none";
}
</script>
<script>
var o = 0;
var speed8 = 150;
const pop8 = document.querySelector(".pop8");
function typeWriter8() {
if (!typeWriter8.called) {
typeWriter8.called = true;
var txt8 = new Typed(".p8-auto-type", {
strings: ["<li>MNF invites you to join or set up and administer a real life filmmaking club in your city, town or neighbourhood.</li><li>MNF supports the Harkat Clubs to make and showcase their films.</li><li>MNF also refers filmmaking related opportunities and assignments to the appropriate Harkat Club.</li>"],
typeSpeed: 41,
startDelay: 3000,
showCursor: false,
});
pop8.addEventListener("mouseenter", () => {
txt8.start();
});
pop8.addEventListener("mouseleave", () => {
txt8.stop();
});
}
}
function myFunction18() {
document.querySelector(".p-pop8").style.display = "none";
}
function SetTimeOutForIdea() {
clearTimeout(timeoutId);
}
</script>
<script>
function handleUrlWithPricing(package,price){
console.log('inside buy func');
window.location.href=`http://115.245.192.138/juggernaut/${package}/${price}`
//const price = parseInt(document.getElementById(price).innerText);
console.log(package,price)
}
</script>
{% comment %} button {% endcomment %}
{% if orderId %}
<script>
function makeRazorPay(){
var options = {
key: "{{pk}}",
amount: "{{amtINR}}",
currency: "INR",
order_id: "{{pid}}",
name: "MNF",
description: "Juggernaut",
image: "{% static 'logo.jpg' %}",
handler: function(response) {
// alert(response.razorpay_order_id);
// alert(response.razorpay_signature);
// alert(response.razorpay_payment_id);
var form = document.getElementById('payment-form');
var razorpay_payment_id = document.createElement('input');
razorpay_payment_id.setAttribute('type', 'hidden');
razorpay_payment_id.setAttribute('name', 'razorpay_payment_id');
razorpay_payment_id.setAttribute('value', response.razorpay_payment_id);
form.appendChild(razorpay_payment_id);
var razorpay_order_id = document.createElement('input');
razorpay_order_id.setAttribute('type', 'hidden');
razorpay_order_id.setAttribute('name', 'razorpay_order_id');
razorpay_order_id.setAttribute('value', response.razorpay_order_id);
//alert(response.razorpay_order_id)
form.appendChild(razorpay_order_id);
var razorpay_signature = document.createElement('input');
razorpay_signature.setAttribute('type', 'hidden');
razorpay_signature.setAttribute('name', 'razorpay_signature');
razorpay_signature.setAttribute('value', response.razorpay_signature);
form.appendChild(razorpay_signature);
form.submit();
},
theme: {
color: "#ee3c4d",
},
};
var rzp1 = new Razorpay(options);
rzp1.open();
}
makeRazorPay()
</script>
{% elif client_secret %}
<script>
const stripe = Stripe("{{pk}}");
console.log("test2");
var options = {
clientSecret: "{{secret_key}}",
};
const elements = stripe.elements(options);
var style = {
base: {
color: "#32325d",
fontFamily: '"Helvetica Neue", Helvetica, sans-serif',
fontSmoothing: "antialiased",
fontSize: "16px",
"::placeholder": {
color: "#aab7c4",
},
},
invalid: {
color: "#fa755a",
iconColor: "#fa755a",
},
};
async function showStripeForm(){
// document.getElementById("stripe-pay-button").style.display="block"
var paymentElement = elements.create("payment");
console.log("aajjj")
paymentElement.mount("#payment-element");
}
async function handleStripePayment(){
//const stripeBtn = document.getElementById("stripe-pay-button")
//stripeBtn.setAttribute("disabled",true)
//stripeBtn.textContent("Processing...")
const { error } = await stripe.confirmPayment({
//`Elements` instance that was used to create the Payment Element
elements,
confirmParams: {
return_url: "http://115.245.192.138/jugarnut_Stripe",
},
});
if (error) {
const messageContainer = document.querySelector("#error-message");
messageContainer.textContent = error.message;
} else {
}
}
setTimeout(()=> {
myFunction17PP()
showStripeForm()
},1000)
</script>
{% endif %}
<script>
// Function to open the modal
function openModal() {
console.log("okk")
document.getElementById('modalOverlay').style.display = 'block';
}
// Function to close the modal
function closeModal() {
document.getElementById('modalOverlay').style.display = 'none';
}
// Event listener for the Buy Now button
document.getElementById('buyNowBtn').addEventListener('click', openModal);
</script>
{% comment %} {% if messages %}
<script>
$(document).ready(function() {
// Display an alert for each success message
{% for message in messages %}
// Customize the alert based on your needs
alert("{{ message }}");
{% endfor %}
});
</script>
{% endif %} {% endcomment %}
{% if error %}
<div id="error-message" style="display: none;">{{ error }}</div>
{% endif %}
<script>
const errorMessage = document.getElementById('error-message');
if (errorMessage.innerHTML.length > 0) {
alert(errorMessage.innerHTML);
}
</script>
</body>
</html>
{%endblock%}