Upload main.js

static/web2/assets/js/main.js

@@ -52,7 +52,7 @@ if(loginButton){
     loginContent.classList.add('show-login')
   })
 }
-  
+
 /*===== LOGIN HIDDEN =====*/
 /* Validate if constant exists */
 if(loginClose){
@@ -112,87 +112,92 @@ let swiperFeatured = new Swiper('.featured__swiper', {
 })
 
 /*=============== FEATURED ADD TO CART ===============*/
+
+//Định nghĩa các hàm xử lý thêm sản phẩm vào giỏ hàng, xóa giỏ hàng, thanh toán và cập nhật giao diện giỏ hàng
 document.addEventListener('DOMContentLoaded', function() {
   const addToCartButtons = document.querySelectorAll('.featured__card .button');
   const clearCartButton = document.getElementById('clearCart');
   const checkoutButton = document.getElementById('checkOut');
 
   addToCartButtons.forEach(button => {
-    button.addEventListener('click', addToCartHandler);
+    button.addEventListener('click', addToCartHandler); // Thêm sự kiện click cho từng nút thêm vào giỏ hàng
   });
 
-  clearCartButton.addEventListener('click', clearCartHandler);
-  checkoutButton.addEventListener('click', checkoutHandler);
+  clearCartButton.addEventListener('click', clearCartHandler); // Thêm sự kiện click cho nút xóa giỏ hàng
+  checkoutButton.addEventListener('click', checkoutHandler); // Thêm sự kiện click cho nút thanh toán
 
   updateCartUI();
 });
 
+//Hàm xử lý thêm sản phẩm vào giỏ hàng
 function addToCartHandler(event) {
   const featuredCard = event.target.closest('.featured__card');
 
-  const productName = featuredCard.querySelector('.featured__title').innerText;
-  const productPrice = parseFloat(featuredCard.querySelector('.featured__discount').dataset.price) || 0;
+  const productName = featuredCard.querySelector('.featured__title').innerText; // Lấy tên sản phẩm
+  const productPrice = parseFloat(featuredCard.querySelector('.featured__discount').dataset.price) || 0; // Lấy giá sản phẩm
 
-  alert(`Đã thêm vào giỏ hàng: ${productName}`);
+  alert(`Add to cart successfully: ${productName}`); // Thông báo thêm sản phẩm vào giỏ hàng thành công
 
-  addToCart(productName, productPrice);
+  addToCart(productName, productPrice); // Thêm sản phẩm vào giỏ hàng
 
   updateCartUI();
 }
 
+//Hàm thêm sản phẩm vào giỏ hàng
 function addToCart(productName, productPrice) {
-  let cartItems = JSON.parse(localStorage.getItem('cartItems')) || [];
+  let cartItems = JSON.parse(localStorage.getItem('cartItems')) || []; // Lấy danh sách sản phẩm trong giỏ hàng từ localStorage
 
-  cartItems.push({ name: productName, price: productPrice });
+  cartItems.push({ name: productName, price: productPrice }); // Thêm sản phẩm vào danh sách sản phẩm trong giỏ hàng
 
-  localStorage.setItem('cartItems', JSON.stringify(cartItems));
+  localStorage.setItem('cartItems', JSON.stringify(cartItems)); // Lưu danh sách sản phẩm trong giỏ hàng vào localStorage
 }
 
+//Hàm xử lý xóa giỏ hàng
 function updateCartUI() {
-  const cartItemsContainer = document.getElementById('cartItemsContainer');
-  const cartItems = JSON.parse(localStorage.getItem('cartItems')) || [];
+  const cartItemsContainer = document.getElementById('cartItemsContainer'); // Lấy ra container chứa danh sách sản phẩm trong giỏ hàng
+  const cartItems = JSON.parse(localStorage.getItem('cartItems')) || []; // Lấy danh sách sản phẩm trong giỏ hàng từ localStorage
 
-  cartItemsContainer.innerHTML = '';
+  cartItemsContainer.innerHTML = ''; // Xóa danh sách sản phẩm trong giỏ hàng
 
   cartItems.forEach(item => {
-    const cartItemElement = document.createElement('div');
-    cartItemElement.innerText = `${item.name} - ${item.price} VND`;
-    cartItemsContainer.appendChild(cartItemElement);
+    const cartItemElement = document.createElement('div'); // Tạo một thẻ div chứa thông tin sản phẩm
+    cartItemElement.innerText = `${item.name} - ${item.price} VND`; // Hiển thị thông tin sản phẩm
+    cartItemsContainer.appendChild(cartItemElement); // Thêm sản phẩm vào danh sách sản phẩm trong giỏ hàng
   });
 
-  const totalAmount = calculateTotalAmount(cartItems);
-  displayTotalAmount(totalAmount);
+  const totalAmount = calculateTotalAmount(cartItems); // Tính tổng số tiền cần thanh toán
+  displayTotalAmount(totalAmount); // Hiển thị tổng số tiền cần thanh toán
 }
 
 function calculateTotalAmount(cartItems) {
-  return cartItems.reduce((total, item) => total + item.price, 0);
+  return cartItems.reduce((total, item) => total + item.price, 0); // Tính tổng số tiền cần thanh toán
 }
 
 function displayTotalAmount(amount) {
-  let totalAmountContainer = document.getElementById('totalAmountContainer');
+  let totalAmountContainer = document.getElementById('totalAmountContainer'); // Lấy ra container chứa tổng số tiền cần thanh toán
 
   if (!totalAmountContainer) {
-    totalAmountContainer = document.createElement('div');
-    totalAmountContainer.id = 'totalAmountContainer';
-    const bagForm = document.querySelector('.bag__form');
-    bagForm.appendChild(totalAmountContainer);
+    totalAmountContainer = document.createElement('div'); // Tạo một thẻ div chứa tổng số tiền cần thanh toán
+    totalAmountContainer.id = 'totalAmountContainer'; // Đặt id cho thẻ div
+    const bagForm = document.querySelector('.bag__form'); // Lấy ra form giỏ hàng
+    bagForm.appendChild(totalAmountContainer); // Thêm thẻ div vào form giỏ hàng
   }
 
-  totalAmountContainer.innerText = `Tổng cộng: ${amount} VND`;
+  totalAmountContainer.innerText = `Total: ${amount} VND`; // Hiển thị tổng số tiền cần thanh toán
 }
 
 function clearCartHandler() {
-  localStorage.removeItem('cartItems');
+  localStorage.removeItem('cartItems'); // Xóa danh sách sản phẩm trong giỏ hàng
 
   updateCartUI();
 }
 
 function checkoutHandler() {
-  alert('Đã thanh toán thành công!');
+  alert('Payment Successfully!');
 
-  resetCart();
+  resetCart(); // Xóa danh sách sản phẩm trong giỏ hàng
 
-  updateCartUI();
+  updateCartUI(); // Cập nhật giao diện giỏ hàng
 }
 
 function resetCart() {
@@ -308,8 +313,35 @@ sr.reveal(`.discount__images`, {origin: 'right'})
 /*=============== OPEN DETAIL TAB ===============*/
 function openDetailPage() {
     // Đường dẫn tới trang detail.html
-    var detailPageURL = "detail.html";
+    var detailPageURL = "static/web2/detail.html";
     
     // Mở tab mới
     window.open(detailPageURL, '_blank');
 }
+
+
+/*=============== CHECK LOGIN INFORMATION ===============*/
+document.addEventListener('DOMContentLoaded', function() {
+    const loginForm = document.getElementById('loginForm');
+
+    loginForm.addEventListener('submit', function(event) {
+        event.preventDefault(); // Ngăn form không tải lại trang
+
+        const email = document.getElementById('login-email').value;
+        const password = document.getElementById('login-pass').value;
+
+        fetch('/login', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify({ email: email, password: password })
+        })
+        .then(response => response.json())
+        .then(data => {
+            const loginMessage = document.getElementById('loginMessage');
+            alert(data.message); // Show alert message
+        })
+        .catch(error => console.error('Error:', error));
+    });
+});