| Current File : /home/viralhoga/public_html/book_now.php |
<!DOCTYPE html>
<html lang="en">
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<head>
<meta charset="utf-8">
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- title -->
<title>Viralhoga.com</title>
<!-- favicon -->
<link rel="icon" type="image/x-icon" href="img/logo/favicon.png">
<!-- bootstrap css -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<!-- magnific-popup css -->
<link rel="stylesheet" type="text/css" href="css/magnific-popup.css">
<!-- animate css -->
<link rel="stylesheet" type="text/css" href="css/animate.min.css">
<!-- bootstrap icon -->
<link rel="stylesheet" type="text/css" href="css/bootstrap-icons.css">
<!-- font-awesome css -->
<link rel="stylesheet" type="text/css" href="css/all.min.css">
<!--fether css -->
<link rel="stylesheet" type="text/css" href="css/feather.css">
<!-- owl css -->
<link rel="stylesheet" type="text/css" href="css/owl.carousel.min.css">
<link rel="stylesheet" type="text/css" href="css/owl.theme.default.min.css">
<!-- swiper-bundle css -->
<link rel="stylesheet" type="text/css" href="css/swiper-bundle.min.css">
<!-- slick slider css -->
<link rel="stylesheet" type="text/css" href="css/slick.css">
<!-- style css -->
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/product-page.css">
<!-- style css -->
<link rel="stylesheet" type="text/css" href="css/other-page.css">
<link rel="stylesheet" href="css/ourstyle.css">
</head>
<body>
<!-- header start -->
<?php include('includes/navbar.php');
//check customer login or not
if(!isset($_SESSION['reg_id']) || empty($_SESSION['reg_id']))echo "<script>window.location='login.php'</script>";
//get product
$song_dta = mysqli_fetch_array($obj->select_all('product',"where id='$_REQUEST[pid]'"));
$explodeDist = explode(",",$song_dta['Pro_code']);
$_SESSION['productId']=$song_dta['id'];
$_SESSION['productinfo']=$song_dta['name'];
?>
<!-- header end -->
<!-- main section start-->
<main>
<!-- breadcrumb start -->
<section class="breadcrumb-area">
<div class="container">
<div class="col">
<div class="row">
<div class="breadcrumb-index">
<!-- breadcrumb main-title start-->
<div class="breadcrumb-title">
<h2>Booking</h2>
</div>
<!-- breadcrumb main-title end-->
<!-- breadcrumb-list start -->
<ul class="breadcrumb-list">
<li class="breadcrumb-item-link">
<a href="index.php">Home</a>
</li>
<li class="breadcrumb-item-link">
<span>Booking <?php echo $song_dta['pro_type']?></span>
</li>
</ul>
<!-- breadcrumb-list end -->
</div>
</div>
</div>
</div>
</section>
<!-- breadcrumb end -->
<section class="product-details-page pro-style7">
<div class="container">
<div class="row">
<div class="col">
<div class="pro_details_pos pro_details_right_pos">
<!-- Product slider start -->
<div class="product_detail_slider product_details_tb product_details product_details_sticky shadow"></div>
<!-- peoduct detail start -->
<div class="product_details_wrap product_details_tb product_details">
<form method="post" action="action-form.php">
<div class="product_details_info">
<div class="pro-nprist">
<div class="product-info">
<!-- product-title start -->
<div class="product-title">
<h2>Order Details</h2>
</div>
<!-- product-title end -->
</div>
<div class="mt-3">
<div class="form-check">
<input class="form-check-input me-3" type="checkbox" id="check1" name="song_type" value="<?php if($song_dta['menu_id']=="1")echo "Exclusive";else echo "Non Exclusive";?>" checked>
<label class="form-check-label mt-1 text-black"><?php if($song_dta['menu_id']=="1")echo "Exclusive";else echo "Non Exclusive";?> Song</label>
</div>
</div>
<?php if($song_dta['pro_size']=="Yes"){?>
<div class="mt-3">
<div class="form-check">
<input class="form-check-input me-3" type="checkbox" id="check2" name="addon" value="<?php echo $song_dta['pro_size']?>" <?php if($song_dta['pro_size']=="No")echo 'disabled="disabled"';?> onClick="getAddonType()" style="border: 1px solid #d9caca;">
<label class="form-check-label mt-1 text-black">Add On</label>
</div>
<div class="row align-items-center mt-3">
<div class="title mb-2">Recreate / Dance Video :
<select class="form-select mt-3" name="recreate_video" id="recreate_video" onChange="setUrlLink(this.value)" <?php if($song_dta['pro_size']=="No")echo 'disabled="disabled"';?>>
<option value="">Select</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</div>
<p class="mb-3">Maxium Discount 35% on Purchase above 3</p>
</div>
<script>
function getAddonType(){
if(document.getElementById('yesCheck'))document.getElementById('yesCheck').checked = false;
document.getElementById('noCheck').checked = false;
document.getElementById('totalAmount').innerHTML = '';
if(document.getElementById('check2').checked==true){
document.getElementById('addprice1').disabled = false;
document.getElementById('addprice2').disabled = false;
document.getElementById('addprice3').disabled = false;
document.getElementById('addprice4').disabled = false;
document.getElementById('recreate_video').innerHTML='<select class="form-select mt-3" name="recreate_video" id="recreate_video" onChange="setUrlLink(this.value)" required><option value="">Select</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option><option>6</option><option>7</option><option>8</option><option>9</option><option>10</option></select>';
}else{
document.getElementById('addprice1').checked=false;
document.getElementById('addprice2').checked=false;
document.getElementById('addprice3').checked=false;
document.getElementById('addprice4').checked=false;
document.getElementById('addprice1').disabled = true;
document.getElementById('addprice2').disabled = true;
document.getElementById('addprice3').disabled = true;
document.getElementById('addprice4').disabled = true;
document.getElementById('recreate_video').innerHTML='<select class="form-select mt-3" name="recreate_video" id="recreate_video" onChange="setUrlLink(this.value)"><option value="">Select</option></select>';
}
}
function setUrlLink(getrVideo){
if(getrVideo==1 && document.getElementById('check2').checked==true)document.getElementById('addprice1').checked=true;
if(getrVideo==2 && document.getElementById('check2').checked==true)document.getElementById('addprice2').checked=true;
if(getrVideo==3 && document.getElementById('check2').checked==true)document.getElementById('addprice3').checked=true;
if(getrVideo>=4 && document.getElementById('check2').checked==true)document.getElementById('addprice4').checked=true;
}
function getDropRecreateVideo(value){
if(document.getElementById('yesCheck'))document.getElementById('yesCheck').checked = false;
document.getElementById('noCheck').checked = false;
document.getElementById('totalAmount').innerHTML = '';
if(value>=4){
document.getElementById('recreate_video').innerHTML='<select class="form-select mt-3" name="recreate_video" id="recreate_video" onChange="setUrlLink(this.value)" required=""><option>4</option><option>5</option><option>6</option><option>7</option><option>8</option><option>9</option><option>10</option></select>'
}else document.getElementById('recreate_video').innerHTML='<option>'+value+'</option>'
}
</script>
<div class="plans">
<div class="title">Offer</div>
<label class="plan basic-plan mt-3" for="addprice1">
<input type="radio" name="plan" onClick="getDropRecreateVideo(1)" value="<?php echo $explodeDist[0]?>" id="addprice1" disabled/>
<div class="plan-content">
<div class="plan-details">
<span>Buy 1</span>
<p><?php echo $explodeDist[0]?></p>
</div>
</div>
</label>
<?php if(isset($explodeDist[1]) && !empty($explodeDist[1])){?>
<label class="plan basic-plan mt-3" for="addprice2">
<input type="radio" name="plan" onClick="getDropRecreateVideo(2)" value="<?php
if(isset($explodeDist[1])){
$addonPrice = $explodeDist[0]*$explodeDist[1]/100;
echo round($addonPrice);
}else echo 0; ?>" id="addprice2" disabled />
<div class="plan-content">
<div class="plan-details">
<span>Buy 2</span>
<p><?php if(isset($explodeDist[1])) echo $explodeDist[1]."% Discount"?></p>
</div>
</div>
</label>
<?php }
if(isset($explodeDist[2]) && !empty($explodeDist[2])){?>
<label class="plan complete-plan mt-3" for="addprice3">
<input type="radio" name="plan" onClick="getDropRecreateVideo(3)" value="<?php
if(isset($explodeDist[2])){
$addonPrice = $explodeDist[0]*$explodeDist[2]/100;
echo round($addonPrice);
}else echo 0; ?>" id="addprice3" disabled />
<div class="plan-content">
<div class="plan-details">
<span>Buy 3</span>
<p><?php if(isset($explodeDist[2])) echo $explodeDist[2]."% Discount"?></p>
</div>
</div>
</label>
<?php }
if(isset($explodeDist[3]) && !empty($explodeDist[3])){?>
<label class="plan complete-plan mt-3" for="addprice4">
<input type="radio" name="plan" onClick="getDropRecreateVideo(4)" value="<?php if(isset($explodeDist[3])){
$addonPrice = $explodeDist[0]*$explodeDist[3]/100;
echo round($addonPrice);
}else echo 0; ?>" id="addprice4" disabled />
<div class="plan-content">
<div class="plan-details">
<span>Buy 4-10</span>
<p><?php if(isset($explodeDist[3])) echo $explodeDist[3]."% Discount"?></p>
</div>
</div>
</label>
<?php }?>
</div>
</div>
<div class="product-info">
<div class="product-inventory">
<div class="stock-inventory stock-more">
<p class="text-success ">Deliver Video Within
<span class="available-stock bg-success"><?php echo $song_dta['stock']?></span>
</p>
</div>
<div style="padding: 15px;border: 1px solid #ccc;margin-bottom:15px; margin-top:15px">
<div class="book_add mt-4">
<p class="mb-2 text-black">Youtube Channel Link</p>
<div class="customer_records d-flex mb-3">
<input name="channelUrl[]" class="form-control songLink" type="text" placeholder="Enter Channel Link" required>
</div>
<div class="customer_records_dynamic"></div>
</div>
<div class="book_add mt-4">
<p class="mb-2 text-black">Youtube Channel Name</p>
<div class="customer_records1 d-flex mb-3">
<input name="channelName[]" class="form-control" type="text" placeholder="Enter Channel Name" required>
</div>
<div class="customer_records_dynamic1"></div>
</div>
</div>
<style>
.add_form_field
{
background-color: #3c8dbc;
border: none;
color: white;
padding: 8px 15px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border: 1px solid #186dad;
}
.delete{
background-color: #3c8dbc;
border: none;
color: white;
padding: 3px 0px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 14px;
margin: 8px 2px;
cursor: pointer;
//float: right;
border-radius: 20px;
}
@media(max-width:769px){
.delete{float: right!important;}
}
@media(max-width:480px){
.delete{float: right!important;}
}
@media(max-width:320px){
.delete{float: right!important;}
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
var max_fields1 = 5;
var wrapper1 = $(".containerForm1");
var add_button1 = $(".add_form_field1");
var x = 1;
$(add_button1).click(function(e){
e.preventDefault();
if(x < max_fields1){
x++;
$(wrapper1).append('<div style="padding: 15px;border: 1px solid #ccc;margin-bottom:15px"><div class="book_add mt-4"><p class="mb-2 text-black">Youtube Channel Link</p><div class="customer_records d-flex mb-3"><input name="channelUrl[]" class="form-control songLink" type="text" placeholder="Enter Channel Link" required></div><div class="customer_records_dynamic"></div></div><div class="book_add mt-4"><p class="mb-2 text-black">Youtube Channel Name</p><div class="customer_records1 d-flex mb-3"><input name="channelName[]" class="form-control" type="text" placeholder="Enter Channel Name" required></div><div class="customer_records_dynamic1"></div></div><a href="#" class="delete" style="width: 115px;"><i class="fa fa-remove"></i> Remove</a></div>');
}
else
{
alert('You Reached the limits')
}
document.getElementById('yesCheck').checked = false;
document.getElementById('noCheck').checked = false;
document.getElementById('totalAmount').innerHTML = '';
});
$(wrapper1).on("click",".delete", function(e){
if(document.getElementById('yesCheck'))document.getElementById('yesCheck').checked = false;
document.getElementById('noCheck').checked = false;
document.getElementById('totalAmount').innerHTML = '';
e.preventDefault(); $(this).parent('div').remove(); x--;
})
});
</script>
<fieldset id="account" class="containerForm1"></fieldset>
<span class="add_form_field1" style="float: right;background: #1d1b18;color: #fff;padding: 2px;border-radius: 5px;cursor:pointer"> <span style="font-size:16px; font-weight:bold;">+ </span> Add More </span>
<div class="payment_option">
<?php if($song_dta['menu_id']=="1")echo '<h6 class="mb-3">Payment</h6>';else echo "";?>
<div class="form mb-3">
<?php if($song_dta['menu_id']=="1"){?>
<label class="me-3"><input type="radio" class="input-radio off " onClick="javascript:yesnoCheck();" name="yesno" value="Advance" id="yesCheck" required> Advance </label>
<?php }?>
<label><input type="radio" class="input-radio on" onClick="javascript:yesnoCheck();" name="yesno" id="noCheck" value="Full Payment" required>
<?php if($song_dta['menu_id']=="1")echo "Full Payment";else echo "Payment";?></label>
</div>
<div id="ifYes"></div>
<label><input type="text" class="form-control" name="name" value="<?php echo $_SESSION['name']?>" placeholder="Enter Name" required></label>
<label><input type="text" class="form-control" name="email" value="<?php echo $_SESSION['email']?>" placeholder="Enter Email" required></label>
<label><input type="text" class="form-control" name="mobile" maxlength="10" value="<?php echo $_SESSION['mobile']?>" placeholder="Enter Mobile" style="width: 125px;" required></label>
</div>
<span style="margin-top:15px" id="totalAmount"></span>
<div class="payment_btn">
<button name="bookNow" class="btn btn-danger mt-4 px-lg-4 rounded-pill">Continue</button>
</div>
</div>
</div>
<script>
function yesnoCheck() {
var addOnPrice = 0;
var basePrice = '<?php echo $song_dta['price']?>';
if(document.getElementById('yesCheck')){
if (document.getElementById('yesCheck').checked) {
if(document.getElementById('check2').checked){
var baseAddon = document.getElementById('addprice1').value;
var addOnPrice = baseAddon;
for(i=1;i<='<?php echo sizeof($explodeDist)?>';i++){
var addonId = 'addprice'+i;
if(document.getElementById(addonId).checked && i>1){
var dist = parseInt(document.getElementById(addonId).value)*i;
addOnPrice = (baseAddon*i)-dist;
}
}
}
var totalLink = document.getElementsByClassName('songLink').length;
var totalAmount = basePrice*totalLink+parseInt(addOnPrice);
document.getElementById('ifYes').innerHTML = '<input type="text" class="form-control" name="amount" placeholder="Enter Amount" min="99" style="margin-bottom:15px" required>';
}
}
if (document.getElementById('noCheck').checked){
if(document.getElementById('check2').checked){
var baseAddon = document.getElementById('addprice1').value;
var addOnPrice = baseAddon;
for(i=1;i<='<?php echo sizeof($explodeDist)?>';i++){
var addonId = 'addprice'+i;
if(document.getElementById(addonId).checked && i>1){
var dist = parseInt(document.getElementById(addonId).value)*i;
addOnPrice = (baseAddon*i)-dist;
}
}
}
var totalLink = document.getElementsByClassName('songLink').length;
var totalAmount = basePrice*totalLink+parseInt(addOnPrice);
document.getElementById('ifYes').innerHTML = '';
}
if(totalAmount>0 && totalAmount!=''){
myData = "payAmount="+totalAmount;
jQuery.ajax({
type: "POST", // HTTP method POST or GET
url: "getTotal.php", //Where to make Ajax calls
dataType:"text", // Data type, HTML, json etc.
data:myData, //Form variables
success:function(response){
//alert(response);
document.getElementById('totalAmount').innerHTML = '<font color="green">Total Payment Amount <i class="fa fa-inr"></i> '+response+'</font>';
},
error:function (xhr, ajaxOptions, thrownError){
reg("#submitbtn").show(); //show submit button
reg("#LoadingImage").hide(); //hide loading image
alert(thrownError);
}
});
}
}
</script>
<?php }else{?>
<div class="product-info">
<div class="product-inventory">
<div class="stock-inventory stock-more">
<p class="text-success ">Deliver Video Within
<span class="available-stock bg-success"><?php echo $song_dta['stock']?></span>
</p>
</div>
<div style="padding: 15px;border: 1px solid #ccc;margin-bottom:15px; margin-top:15px">
<div class="book_add mt-4">
<p class="mb-2 text-black">Youtube Channel Link</p>
<div class="customer_records d-flex mb-3">
<input name="channelUrl[]" class="form-control songLink" type="text" placeholder="Enter Channel Link" required>
</div>
<div class="customer_records_dynamic"></div>
</div>
<div class="book_add mt-4">
<p class="mb-2 text-black">Youtube Channel Name</p>
<div class="customer_records1 d-flex mb-3">
<input name="channelName[]" class="form-control" type="text" placeholder="Enter Channel Name" required>
</div>
<div class="customer_records_dynamic1"></div>
</div>
</div>
<style>
.add_form_field
{
background-color: #3c8dbc;
border: none;
color: white;
padding: 8px 15px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border: 1px solid #186dad;
}
.delete{
background-color: #3c8dbc;
border: none;
color: white;
padding: 3px 0px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 14px;
margin: 8px 2px;
cursor: pointer;
//float: right;
border-radius: 20px;
}
@media(max-width:769px){
.delete{float: right!important;}
}
@media(max-width:480px){
.delete{float: right!important;}
}
@media(max-width:320px){
.delete{float: right!important;}
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
var max_fields1 = 5;
var wrapper1 = $(".containerForm1");
var add_button1 = $(".add_form_field1");
var x = 1;
$(add_button1).click(function(e){
e.preventDefault();
if(x < max_fields1){
x++;
$(wrapper1).append('<div style="padding: 15px;border: 1px solid #ccc;margin-bottom:15px"><div class="book_add mt-4"><p class="mb-2 text-black">Youtube Channel Link</p><div class="customer_records d-flex mb-3"><input name="channelUrl[]" class="form-control songLink" type="text" placeholder="Enter Channel Link" required></div><div class="customer_records_dynamic"></div></div><div class="book_add mt-4"><p class="mb-2 text-black">Youtube Channel Name</p><div class="customer_records1 d-flex mb-3"><input name="channelName[]" class="form-control" type="text" placeholder="Enter Channel Name" required></div><div class="customer_records_dynamic1"></div></div><a href="#" class="delete" style="width: 115px;"><i class="fa fa-remove"></i> Remove</a></div>');
}
else
{
alert('You Reached the limits')
}
document.getElementById('yesCheck').checked = false;
document.getElementById('noCheck').checked = false;
document.getElementById('totalAmount').innerHTML = '';
});
$(wrapper1).on("click",".delete", function(e){
if(document.getElementById('yesCheck'))document.getElementById('yesCheck').checked = false;
document.getElementById('noCheck').checked = false;
document.getElementById('totalAmount').innerHTML = '';
e.preventDefault(); $(this).parent('div').remove(); x--;
})
});
</script>
<fieldset id="account" class="containerForm1"></fieldset>
<span class="add_form_field1" style="float: right;background: #1d1b18;color: #fff;padding: 2px;border-radius: 5px;cursor:pointer"> <span style="font-size:16px; font-weight:bold;">+ </span> Add More </span>
<div class="payment_option">
<?php if($song_dta['menu_id']=="1")echo '<h6 class="mb-3">Payment</h6>';else echo "";?>
<div class="form mb-3">
<?php if($song_dta['menu_id']=="1"){?>
<label class="me-3"><input type="radio" class="input-radio off " onClick="javascript:yesnoCheck();" name="yesno" value="Advance" id="yesCheck" required> Advance </label>
<?php }?>
<label><input type="radio" class="input-radio on" onClick="javascript:yesnoCheck();" name="yesno" id="noCheck" value="Full Payment" required>
<?php if($song_dta['menu_id']=="1")echo "Full Payment";else echo "Payment";?></label>
</div>
<div id="ifYes"></div>
<label><input type="text" class="form-control" name="name" value="<?php echo $_SESSION['name']?>" placeholder="Enter Name" required></label>
<label><input type="text" class="form-control" name="email" value="<?php echo $_SESSION['email']?>" placeholder="Enter Email" required></label>
<label><input type="text" class="form-control" name="mobile" maxlength="10" value="<?php echo $_SESSION['mobile']?>" placeholder="Enter Mobile" style="width: 125px;" required></label>
</div>
<span style="margin-top:15px" id="totalAmount"></span>
<div class="payment_btn">
<button name="bookNow" class="btn btn-danger mt-4 px-lg-4 rounded-pill">Continue</button>
</div>
</div>
</div>
<script>
function yesnoCheck() {
var addOnPrice = 0;
var basePrice = '<?php echo $song_dta['price']?>';
if(document.getElementById('yesCheck')){
if (document.getElementById('yesCheck').checked) {
document.getElementById('ifYes').innerHTML = '<input type="text" class="form-control" name="amount" placeholder="Enter Amount" min="99" style="margin-bottom:15px" required>';
var totalLink = document.getElementsByClassName('songLink').length;
var totalAmount = basePrice*totalLink+parseInt(addOnPrice);
}
}
if(document.getElementById('noCheck')){
if (document.getElementById('noCheck').checked) {
var totalLink = document.getElementsByClassName('songLink').length;
var totalAmount = basePrice*totalLink+parseInt(addOnPrice);
document.getElementById('ifYes').innerHTML = '';
}
}
if(totalAmount>0 && totalAmount!=''){
myData = "payAmount="+totalAmount;
jQuery.ajax({
type: "POST", // HTTP method POST or GET
url: "getTotal.php", //Where to make Ajax calls
dataType:"text", // Data type, HTML, json etc.
data:myData, //Form variables
success:function(response){
//alert(response);
document.getElementById('totalAmount').innerHTML = '<font color="green">Total Payment Amount <i class="fa fa-inr"></i> '+response+'</font>';
},
error:function (xhr, ajaxOptions, thrownError){
reg("#submitbtn").show(); //show submit button
reg("#LoadingImage").hide(); //hide loading image
alert(thrownError);
}
});
}
}
</script>
<?php }?>
</div>
</div>
</form>
</div>
<!-- peoduct detail end -->
</div>
</div>
</div>
</div>
</section>
</main>
<!-- main section end-->
<!-- footer start -->
<?php include('includes/footer.php')?>
<!-- screen-bg start -->
<div class="screen-bg"></div>
<!-- screen-bg end -->
<!-- back-to-top start -->
<a href="javascript:void(0)" id="top" class="scroll">
<span><i class="feather-arrow-up"></i></span>
</a>
<!-- back-to-top end -->
<!-- jquery
<script src="js/jquery-3.6.3.min.js"></script> -->
<!-- bootstrap js -->
<script src="js/bootstrap.min.js"></script>
<script src="js/popper.min.js"></script>
<!-- magnific-popup js -->
<script src="js/jquery.magnific-popup.min.js"></script>
<!-- owl js -->
<script src="js/owl.carousel.min.js"></script>
<!-- swiper-bundle js -->
<script src="js/swiper-bundle.min.js"></script>
<!-- slick js -->
<script src="js/slick.min.js"></script>
<!-- waypoints js -->
<script src="js/waypoints.min.js"></script>
<!-- counter js -->
<script src="js/counter.js"></script>
<!-- main js -->
<script src="js/main.js"></script>
</body>
</html>