Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Revert "Payment Gateway Integration #572" #671

Merged
merged 1 commit into from
May 30, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
57 changes: 12 additions & 45 deletions Html-files/cart.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,18 +12,24 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="shortcut icon" type="image/x-icon" href="./Favicon image/favicon.ico">

<link rel="stylesheet" href="../Css-files/content.css">
<link rel="stylesheet" href="../Css-files/cart.css">



</head>

<body>
<div class="head_container">
<header>

<!-- <nav class="navbar">
<ul id="header-items">
<li><a href="../index.html">Home</a></li>
<li><a href="menu.html">Menu</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="contact.html">Contact us</a></li>
<li><a href="cart.html">Cart</a></li>
</ul>
</nav> -->
<nav>
<div class="navigbar">
<div class="logo">Foodie</div>
Expand All @@ -50,33 +56,7 @@
<h1>C A R T</h1>
</div>
</div>
<div id="couponCode"><p class="text-light bg-secondary p-5">Use coupon code <b>qN6FVAn4</b> for 30% off!</p></div>
<section class="cart-section ">
<div class="cart col-md-8">
<table id="cart-table">
<thead>
<tr>
<th>Item Name</th>
<th>Price</th>
<th>Quantity</th>
<th >Actions</th>
</tr>
</thead>
<tbody id="cart-items">
<!-- Cart items will be inserted here -->
</tbody>
<tfoot>
<tr>
<td>Bill amount</td>
<td>
<div id="cart-total">$0.00</div>
</td>
</tr>
</tfoot>

</table>

</div>
<section class="cart-section">
<div id="couponCode">
<p>Use coupon code <b>qN6FVAn4</b> for 30% off!</p>
Expand All @@ -93,31 +73,18 @@ <h1>C A R T</h1>
</div>



<!-- Input Section For Coupon Code -->


<div class="inputForCoupon col-md-4">



<div class="inputForCoupon">


<label for="couponCodes" id="haveCoupon">Have a Coupon?</label>
<div class="enterCouponCode">
<input type="text" name="inputCode" id="inputCode" placeholder="Enter Coupon Code">
<button id="applyCouponButton">Apply</button>
</div>


<button id="proceed-to-payment" href="Html-files\Payment.html" class="butt">Order Now</button>



<button type="submit" onclick="applyFirstTimeDiscount()" class="butt">Order Now</button>


</div>

</section>
Expand Down Expand Up @@ -201,10 +168,10 @@ <h4>Follow Us</h4>
</footer>


<!-- <script src="../cart.js"></script-->
<!-- <script src="../cart.js"></script> -->
<script src="cart.js">

</script>
</body>

</html>
</html>
156 changes: 23 additions & 133 deletions Html-files/cart.js
Original file line number Diff line number Diff line change
@@ -1,81 +1,20 @@
document.addEventListener("DOMContentLoaded", () => {
loadCartFromLocalStorage();

document.getElementById("cart-items").addEventListener("click", (event) => {
if (event.target.classList.contains("increase-quantity")) {
updateQuantity(event.target, 1);
} else if (event.target.classList.contains("decrease-quantity")) {
updateQuantity(event.target, -1);
}
});

document.getElementById("applyCouponButton").addEventListener("click", () => {
applyCoupon();
});
//CODE FOR TABLE OF ADD TO CART
document.addEventListener('DOMContentLoaded', () => {
loadCartFromLocalStorage();

document.getElementById('cart-items').addEventListener('click', (event) => {
if (event.target.classList.contains('increase-quantity')) {
updateQuantity(event.target, 1);
} else if (event.target.classList.contains('decrease-quantity')) {
updateQuantity(event.target, -1);
}
});
});

function loadCartFromLocalStorage() {
const cartItems = JSON.parse(localStorage.getItem("cartItems")) || [];
const cartItemsContainer = document.getElementById("cart-items");
cartItemsContainer.innerHTML = ""; // Clear existing items


cartItems.forEach((item) => {
const cartItemRow = document.createElement("tr");
cartItemRow.className = "cart-item";
cartItemRow.setAttribute("data-product-id", item.id);
cartItemRow.setAttribute("data-product-price", item.price);
cartItemRow.innerHTML = `
<td>${item.name}</td>
<td>$${item.price.toFixed(2)}</td>
<td class="quantity">${item.quantity}</td>
<td>
<button class="increase-quantity">+</button>
<button class="decrease-quantity">-</button>
</td>
`;
cartItemsContainer.appendChild(cartItemRow);
});

updateTotal();
}

function updateQuantity(button, change) {
const cartItemRow = button.parentElement.parentElement;
const quantityElement = cartItemRow.querySelector(".quantity");
const newQuantity = parseInt(quantityElement.textContent) + change;
if (newQuantity > 0) {
quantityElement.textContent = newQuantity;
} else {
cartItemRow.remove();
}
updateTotal();
saveCartToLocalStorage();
}

function updateTotal() {
const cartItems = document.querySelectorAll(".cart-item");
let total = 0;
cartItems.forEach((item) => {
const price = parseFloat(item.getAttribute("data-product-price"));
const quantity = parseInt(item.querySelector(".quantity").textContent);
total += price * quantity;
});
document.getElementById("cart-total").textContent = `Total: $${total.toFixed(
2
)}`;
}

function saveCartToLocalStorage() {
const cartItems = [];
document.querySelectorAll(".cart-item").forEach((item) => {
cartItems.push({
id: item.getAttribute("data-product-id"),
price: parseFloat(item.getAttribute("data-product-price")),
quantity: parseInt(item.querySelector(".quantity").textContent),
});
});
localStorage.setItem("cartItems", JSON.stringify(cartItems));
const cartItems = JSON.parse(localStorage.getItem('cartItems')) || [];
const cartItemsContainer = document.getElementById('cart-items');
cartItemsContainer.innerHTML = ''; // Clear existing items

cartItems.forEach(item => {
cartItemsContainer.appendChild(createCartItemElement(item));
Expand Down Expand Up @@ -140,69 +79,21 @@ const generateCouponCode = () => {
couponCode += characters.charAt(Math.floor(Math.random() * characters.length));
}
return couponCode;

}

// Function to generate a random coupon code
const generateCouponCode = () => {
const characters =
"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
let couponCode = "";
for (let i = 0; i < 8; i++) {
couponCode += characters.charAt(
Math.floor(Math.random() * characters.length)
);
}
return couponCode;
};

// Check if it's the user's first order and apply discount
const applyFirstTimeDiscount = () => {
let couponCode = localStorage.getItem("couponCode");
if (!couponCode) {
couponCode = generateCouponCode();
localStorage.setItem("couponCode", couponCode);
}
document.getElementById(
"couponCode"
).innerHTML = `Use coupon code <span style="font-weight: bold;"> ${couponCode} </span> for 30% off!`;
alert(
`Congratulations! Your coupon code is ${couponCode}. You've received a 30% discount on your first order.`
);
};
let couponCode = localStorage.getItem('couponCode');
if (!couponCode) {
couponCode = generateCouponCode();
localStorage.setItem('couponCode', couponCode);
}
document.getElementById('couponCode').innerHTML = `Use coupon code <span style="font-weight: bold;"> ${couponCode} </span> for 30% off!`;
alert(`Congratulations! Your coupon code is ${couponCode}. You've received a 30% discount on your first order.`);
}
window.onload = applyFirstTimeDiscount;

// Function to apply the coupon and display the discounted price
function applyCoupon() {
const couponCode = document.getElementById("inputCode").value;
const storedCouponCode = localStorage.getItem("couponCode");

if (!couponCode) {
alert("Please enter a Coupon Code.");
return;
}


if (couponCode === storedCouponCode) {
let total = parseFloat(
document.getElementById("cart-total").textContent.replace("Total: $", "")
);
const discount = total * 0.3;
const discountedTotal = total - discount;

document.getElementById(
"cart-total"
).textContent = `Total: $${discountedTotal.toFixed(2)} (30% off applied)`;
alert("Coupon code applied successfully! You've received a 30% discount.");
} else {
alert("Invalid coupon code. Please try again.");
}
}
document
.getElementById("proceed-to-payment")
.addEventListener("click", function () {
window.location.href = "Payment.html"; // Ensure this path is correct
});
// Input for apply coupon code

document.getElementById('applyCouponButton').addEventListener('click', function () {
const couponCode = document.getElementById('inputCode').value;
Expand Down Expand Up @@ -254,4 +145,3 @@ function handleEmptyCart(total) {
<a href="./menu.html"><button class="butt">Explore Menu</button></a>`;
}
}

Loading
Loading