-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
141 lines (122 loc) · 5.89 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<!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 , maximum-scale=1.0" />
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css"
integrity="sha512-5A8nwdMOWrSz20fDsjczgUidUBR8liPYU+WymTZP1lmY9G6Oc7HlZv156XqnsgNUzTyMefFTcsFH/tnJE/+xBg=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- Include Razorpay Scripts -->
<script src="https://checkout.razorpay.com/v1/checkout.js" defer></script>
<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js" defer></script>
<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-database.js" defer></script>
<title>Shubham</title>
</head>
<header class="headerTop" id="headerTop">
<img class="logo" id="logo" src="./assets/img/cube_3d_shape.png" alt="Logo" width="150" height="150" />
<input class="menuBar" id="menuBar" type="text" value="≡" readonly />
<div class="sNav" id="sNav">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#products">Products</a></li>
<li><a href="#contact">Contact us</a></li>
</ul>
</div>
</header>
<body>
<div class="wrapper">
<div class="wrapper-a">
<div class="container c-z">
</div>
</div>
<div class="container c-a">
<div class="block b-a">
<h1>Online Fashion Store</h1>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Error at
accusantium, odio optio beatae recusandae tenetur hic, soluta quasi
asperiores, eaque harum consectetur accusamus odit quo inventore
officiis.
</p>
<button onclick="location.href='#products'">Shop Now !</button>
</div>
<img src="./assets/img/blob.svg" alt="object" />
</div>
<div class="container c-b" id="products">
<h2>Our Products</h2>
<div class="block b-b">
<h3>Product List 1</h3>
<div class="productSlider" id="productSlider">
</div>
<h3>Product List 2</h3>
<div class="productSlider" id="productSlider">
</div>
<h3>Product List 3</h3>
<div class="productSlider" id="productSlider">
</div>
</div>
</div>
</div>
<footer id="contact">
<div>
<h3>Contact Us</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga
mollitia expedita amet beatae nulla ipsum atque blanditiis, alias
tenetur nam.
</p>
</div>
<p class="copyright">Copyright 2023</p>
</footer>
<script type="module" src="./script.js" defer></script>
<script defer>
// Your Razorpay key id
const razorpayKey = "rzp_test_4aDlqND5TSaOCe";
// Define a function to initiate the payment
function initiatePayment(pid, price, desc) {
let userDetails = {}
let userDataInput = prompt("Enter your name, email and contact number separated by commas (,): [for example : {name},{email},{contact}] | without brackets ");
let userDataArray = userDataInput.split(",");
userDetails.name = userDataArray[0];
userDetails.email = userDataArray[1];
userDetails.contact = userDataArray[2];
// console.log(userDetails.name + " " + userDetails.email + " " + userDetails.contact)
if (userDetails.name == " " || userDetails.email == " " || userDetails.contact == " "
|| userDetails.name == null || userDetails.email == null || userDetails.contact == null || userDetails.name == undefined || userDetails.email == undefined || userDetails.contact == undefined
|| userDetails.name == "" || userDetails.email == "" || userDetails.contact == "" || userDetails.name == "null" || userDetails.email == "null" || userDetails.contact == "null"
|| userDetails.name == "undefined" || userDetails.email == "undefined" || userDetails.contact == "undefined" || userDetails.name == "NaN" || userDetails.email == "NaN" || userDetails.contact == "NaN"
|| userDetails.name == "NULL" || userDetails.email == "NULL" || userDetails.contact == "NULL" || userDetails.name == "UNDEFINED" || userDetails.email == "UNDEFINED" || userDetails.contact == "UNDEFINED"
|| userDetails.name == "NAN" || userDetails.email == "NAN" || userDetails.contact == "NAN" || userDetails.name == "Null" || userDetails.email == "Null" || userDetails.contact == "Null"
|| userDetails.name == "Undefined" || userDetails.email == "Undefined" || userDetails.contact == "Undefined" || userDetails.name == "Nan" || userDetails.email == "Nan" || userDetails.contact == "Nan"
|| userDetails.name == "null" || userDetails.email == "null" || userDetails.contact == "null" || userDetails.name == "undefined" || userDetails.email == "undefined"
|| userDetails.contact == "undefined" || userDetails.name == "nan" || userDetails.email == "nan" || userDetails.contact == "nan") {
alert("Please fill all the details");
return;
}
var options = {
key: razorpayKey,
amount: price.toString() + '00', // Amount in paise (e.g., 10000 paise = 100 INR)
currency: "INR",
name: "Online Fashion Store",
description: `Product ID : ${pid} | Product Desc : ${desc}`,
image: "./assets/img/blob.svg",
handler: function (response) {
// Handle the response after successful payment
alert("Payment successful! Payment ID: " + response.razorpay_payment_id);
},
prefill: {
name: userDetails.name,
email: `${userDetails.email}`,
contact: userDetails.contact
}
};
var rzp = new Razorpay(options);
rzp.open();
}
// Attach the payment initiation function to the button click event
document.getElementById("payButton").addEventListener("click", initiatePayment);
</script>
</body>
</html>