obanana_b2b_test/product-left-sidebar.php

2664 lines
184 KiB
PHP
Raw Normal View History

2024-02-12 10:35:09 +08:00
<?php
include "functions.php";
2024-02-12 10:35:09 +08:00
$_SESSION["url"] = $_SERVER['REQUEST_URI'];
if ($_SESSION["userId"] <> "") {
$_SESSION["isLoggedIn"] = true;
$customer_data = getCustomerbyLoginId($_SESSION["userId"]);
// $customerData = json_decode($customer_data, true);
// var_dump("Customer Data " + $customerData);
// if ($customer_data) {
// $customerData = json_decode($customer_data, true);
// var_dump("Customer Data " + $customerData);
// }
} else {
$_SESSION["isLoggedIn"] = false;
};
if (isset($_GET['id'])) {
$product_id = $_GET['id'];
$product_data = getProduct($product_id);
if ($product_data) {
$product_details = json_decode($product_data, true);
$current_category = $product_details['product_category'];
$related_products = simpleProducts($current_category);
if ($product_details) {
$vendor_data = getVendorbyId($product_details['vendor_api_id']);
$vendor_details = json_decode($vendor_data, true);
if ($product_details['product_type'] === 'variable') {
$variation_products = getProductVariations($product_details['_id']);
if ($variation_products) {
$variation_details = json_decode($variation_products, true);
}
}
}
}
}
?>
<!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, minimum-scale=1.0">
<title>oBanana B2B - Elevate Your Business</title>
2024-05-21 09:18:10 +08:00
<meta name="keywords"
content="apparel, catalog, clean, ecommerce, ecommerce HTML, electronics, fashion, html eCommerce, html store, minimal, multipurpose, multipurpose ecommerce, online store, responsive ecommerce template, shops" />
2024-02-12 10:35:09 +08:00
<meta name="description" content="Best ecommerce html template for single and multi vendor store.">
<meta name="author" content="ashishmaraviya">
<!-- site Favicon -->
<link rel="icon" href="assets/images/favicon/favicon.png" sizes="32x32" />
<link rel="apple-touch-icon" href="assets/images/favicon/favicon.png" />
<meta name="msapplication-TileImage" content="assets/images/favicon/favicon.png" />
<!-- css Icon Font -->
<link rel="stylesheet" href="assets/css/vendor/ecicons.min.css" />
<!-- css All Plugins Files -->
<link rel="stylesheet" href="assets/css/plugins/animate.css" />
<link rel="stylesheet" href="assets/css/plugins/swiper-bundle.min.css" />
<link rel="stylesheet" href="assets/css/plugins/jquery-ui.min.css" />
<link rel="stylesheet" href="assets/css/plugins/countdownTimer.css" />
<link rel="stylesheet" href="assets/css/plugins/slick.min.css" />
<link rel="stylesheet" href="assets/css/plugins/bootstrap.css" />
2024-03-07 10:53:15 +08:00
<link rel="stylesheet" href="assets/css/plugins/nouislider.css" />
2024-02-12 10:35:09 +08:00
<!-- Main Style -->
<link rel="stylesheet" href="assets/css/style.css" />
<link rel="stylesheet" href="assets/css/style2.css" />
<link rel="stylesheet" href="assets/css/responsive.css" />
2024-05-21 09:18:10 +08:00
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css"
integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
2024-02-12 10:35:09 +08:00
<!-- Background css -->
<link rel="stylesheet" id="bg-switcher-css" href="assets/css/backgrounds/bg-4.css">
<script>
2024-05-21 09:18:10 +08:00
function updateCartItemCount() {
$.get("cartitems.php?id=<?php echo $_SESSION['customerId']; ?>", function(data, status) {
if (data != "") {
console.log("Data: " + data + "\nStatus: " + status);
document.getElementById("cartItemCount").innerHTML = data;
document.getElementById("cartNewItemCount").innerHTML = data;
2024-05-21 09:18:10 +08:00
}
});
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
function updateWishItemCount() {
$.get("wishlistitems.php?id=<?php echo $_SESSION['customerId']; ?>", function(data) {
if (data != "") {
document.getElementById("wishItemCount").innerHTML = data;
document.getElementById("wishNewItemCount").innerHTML = data;
2024-05-21 09:18:10 +08:00
}
});
}
2024-02-12 10:35:09 +08:00
</script>
<style>
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab {
display: flex;
flex-direction: column;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.single-tab {
display: flex;
background-color: #f8f8f8;
border-radius: 8px 8px 0 0;
width: 50%;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.tab-button {
flex: 1;
padding: 12px;
background-color: #3498db;
border: none;
color: #fff;
text-align: center;
cursor: pointer;
transition: background-color 0.3s ease;
border-radius: 8px;
margin: 0px 8px;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.tab-button.active {
background-color: #2980b9;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.tab-content {
display: none;
padding: 20px;
border: 1px solid #ddd;
border-radius: 0 0 8px 8px;
margin-top: 10px;
background-color: #fff;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.tab-content.active {
display: block;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab-desc {
margin-bottom: 20px;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab-desc p {
margin-bottom: 0;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab-desc strong {
font-weight: bold;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab-desc u {
text-decoration: underline;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab-desc ul {
list-style-type: disc;
margin-left: 20px;
padding-left: 10px;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab-desc li {
margin-bottom: 5px;
list-style: disc;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab-desc table {
width: 100%;
border-collapse: collapse;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab-desc th,
.ec-single-pro-tab-desc td {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab-desc th {
background-color: #f2f2f2;
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.ec-single-pro-tab-desc img {
width: 50%;
display: block;
margin: 0 auto;
}
2024-05-21 09:18:10 +08:00
/* 02-21-2024 Stacy added css for addtocart & wishlist */
.ec-product-inner .ec-pro-image .ec-pro-actions .add-to-cart {
width: 35px;
position: absolute;
right: 15px;
bottom: 36px;
margin: 0;
padding: 0;
font-size: 0;
border-radius: 10px 10px 0 0;
}
2024-05-21 09:18:10 +08:00
.ec-product-inner .ec-pro-image .ec-pro-actions .wishlist {
position: absolute;
right: 15px;
bottom: 0;
border-radius: 0 0 10px 10px;
}
.vendor_img {
height: 45px;
width: 45px;
border-radius: 50px;
border: 1px solid #ccc;
object-fit: cover
}
.vendor_wrap {
display: flex;
flex-direction: row;
align-items: center;
}
.vendor_details {
padding: 10px
}
.seller-header {
font-weight: 500;
}
/* 02-21-2024 Stacy added css for addtocart & wishlist */
2024-02-12 10:35:09 +08:00
</style>
</head>
<body onload="updateCartItemCount(); updateWishItemCount()" class="product_page">
<div id="ec-overlay">
<div class="ec-ellipsis">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>
<!-- Header start -->
<?php include "header.php" ?>
<!-- Header End -->
<!-- ekka Cart Start -->
<!-- ekka Cart End -->
2024-02-29 16:00:50 +08:00
<!-- Category Sidebar start -->
<?php include "category-slider.php" ?>
2024-02-12 10:35:09 +08:00
<!-- Ec breadcrumb start -->
<div class="sticky-header-next-sec ec-breadcrumb section-space-mb">
<div class="container">
<div class="row">
<div class="col-12">
<div class="row ec_breadcrumb_inner">
<div class="col-md-6 col-sm-12">
<h2 class="ec-breadcrumb-title">Single Products</h2>
</div>
<div class="col-md-6 col-sm-12">
<!-- ec-breadcrumb-list start -->
<ul class="ec-breadcrumb-list">
<li class="ec-breadcrumb-item"><a href="index.php">Home</a></li>
<li class="ec-breadcrumb-item active">Products</li>
</ul>
<!-- ec-breadcrumb-list end -->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Ec breadcrumb end -->
<!-- Sart Single product -->
<section class="ec-page-content section-space-p">
<div class="container">
<div class="row">
<div class="ec-pro-rightside ec-common-rightside col-lg-9 order-lg-last col-md-12 order-md-first">
<!-- Single product content Start -->
<div class="single-pro-block">
<div class="single-pro-inner">
2024-02-20 15:01:07 +08:00
<!-- 02-20-2024 Stacy message sent pop-up -->
<?php
if (isset($_SESSION["SuccessfullySent"])) {
echo '<div class="alert alert-success" id="alertSuccess" role="alert"; content-align:center;>';
echo $_SESSION["SuccessfullySent"];
echo '</div>';
unset($_SESSION["SuccessfullySent"]);
echo " <script>
2024-02-20 15:01:07 +08:00
setTimeout(function() {
document.getElementById('alertSuccess').style.display = 'none';
}, 10000);
</script>";
}
2024-02-20 15:01:07 +08:00
?>
<!-- 02-20-2024 Stacy message sent pop-up -->
2024-02-12 10:35:09 +08:00
<div class="row">
<div class="single-pro-img">
<div class="single-product-scroll">
<?php $images = explode(",", $product_details["images"]); ?>
<div class="single-product-cover">
<?php
foreach ($images as $i) {
?>
2024-05-21 09:18:10 +08:00
<div class="single-slide zoom-image-hover"
style="width: 100%; height: 500px; border: 1px solid #ddd; text-align: center; overflow: hidden;">
<?php
$placeholderImage = 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
2024-02-12 10:35:09 +08:00
if (!isset($product_details["images"]) or $product_details["images"] == "") {
$productImage = $placeholderImage;
} else {
$productImage = $i;
}
?>
2024-05-21 09:18:10 +08:00
<img id="mainProductImage" class="img-responsive"
src="<?php echo $productImage; ?>" alt=""
style="width: 100%; height: 100%; object-fit: cover; object-position: center center;">
</div>
2024-02-12 10:35:09 +08:00
<?php
}
?>
</div>
<div class="single-nav-thumb">
<?php
foreach ($images as $i) {
?>
2024-05-21 09:18:10 +08:00
<div class="single-slides">
<?php
$placeholderImage = 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
2024-02-12 10:35:09 +08:00
if (!isset($product_details["images"]) or $product_details["images"] == "") {
$productImage = $placeholderImage;
} else {
$productImage = $i;
}
?>
2024-05-21 09:18:10 +08:00
<!-- <img loading="lazy" class="img-responsive" src="<?php #echo $productImage;
?>" alt="" style="width: 100%; height: 100%; object-fit: cover; object-position: center center;"> -->
2024-05-21 09:18:10 +08:00
<!-- 02-26-2024 Stacy updated img width & height -->
<img class="img-responsive" src="<?php echo $productImage; ?>" alt=""
style="max/width: 90px; height: 120px; object-fit: cover; object-position: center center;">
</div>
2024-02-12 10:35:09 +08:00
<?php
}
?>
</div>
</div>
</div>
<div class="single-pro-desc">
<div class="single-pro-content">
2024-05-21 09:18:10 +08:00
<input type="hidden" id="product_Id"
value="<?php echo $product_details['_id']; ?>">
<h5 class="ec-single-title" id="productTitle">
<?php echo $product_details['product_name']; ?></h5>
2024-02-12 10:35:09 +08:00
<!-- <h5 class="ec-single-title" id="productTitlemodal"><?php echo $product_details['product_name']; ?></h5> -->
2024-02-27 09:11:14 +08:00
<!-- 02-22-2024 Stacy hide -->
<!-- <div class="ec-single-rating-wrap">
2024-02-12 10:35:09 +08:00
<div class="ec-single-rating">
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star-o"></i>
</div>
<span class="ec-read-review"><a href="#ec-spt-nav-review">Be the first to
review this product</a></span>
2024-02-27 09:11:14 +08:00
</div> -->
2024-05-21 09:18:10 +08:00
<div class="ec-single-desc" id="shortDescription">
<?php echo isset($product_details['product_description'])?$product_details['product_description']:null; ?>
</div>
2024-02-12 10:35:09 +08:00
2024-02-27 09:11:14 +08:00
<!-- 02-22-2024 Stacy hide -->
<!-- <div class="ec-single-sales">
2024-02-12 10:35:09 +08:00
<div class="ec-single-sales-inner">
<div class="ec-single-sales-title">sales accelerators</div>
<div class="ec-single-sales-visitor">real time <span>24</span> visitor
right now!</div>
<div class="ec-single-sales-progress">
<span class="ec-single-progress-desc">Hurry up!left 29 in
stock</span>
<span class="ec-single-progressbar"></span>
</div>
<div class="ec-single-sales-countdown">
<div class="ec-single-countdown"><span id="ec-single-countdown"></span></div>
<div class="ec-single-count-desc">Time is Running Out!</div>
</div>
</div>
2024-02-27 09:11:14 +08:00
</div> -->
2024-02-12 10:35:09 +08:00
<div class="ec-single-price-stoke">
<div class="ec-single-price">
<span class="ec-single-ps-title">As low as</span>
<?php
// 02-13-24 Jun Jihad Removed Logic to DIsplay Price Range of Variable Products
if (isset($product_details['sale_price']) && $product_details['sale_price'] > 0) {
echo '<s><span id="productPrice" class="old-price">' . $product_details['regular_price'] . '</span></s>';
echo '<span id="productNewPrice" class="new-price">' . $product_details['sale_price'] . '</span>';
} elseif (!isset($product_details['regular_price']) || $product_details['regular_price'] <= 0) {
echo '<span id="productPrice" class="new-price">Contact Seller for Price</span>';
} else {
echo '<span id="productPrice" class="new-price">' . $product_details['regular_price'] . '</span>';
}
// 02-13-24 Jun Jihad Removed Logic to DIsplay Price Range of Variable Products
2024-02-12 10:35:09 +08:00
?>
</div>
<div class="ec-single-stoke">
<span class="ec-single-ps-title">Stocks Available</span>
2024-05-21 09:18:10 +08:00
<span class="ec-single-sku"
id="productStock"><?php echo $product_details['stock']; ?></span>
</div>
</div>
<div class="ec-single-price-stoke">
<div class="ec-single-price">
<span class="ec-single-ps-title seller-header">Seller information</span>
<div class="vendor_wrap">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="vendor_img img-responsive"
src="<?php echo isset( $vendor_details['vendor_image']) ?$vendor_details['vendor_image'] :'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png'; ?>"
alt="">
<div class="vendor_details">
<h6>
<?php echo $vendor_details['user_login']; ?>
</h6>
</div>
</div>
</div>
<div class="ec-single-stoke">
2024-05-21 09:18:10 +08:00
<a
href="catalog-single-vendor.php?id=<?php echo $vendor_details['_id'] ?>">
2024-05-21 09:18:10 +08:00
<span class="ec-single-ps-title"
style="color:#ffaa00; font-weight:500; font-size:13px">Visit
Seller <i class="fa-solid fa-arrow-right"
style="color:#ffaa00"></i></span>
</a>
<!-- <span class="ec-single-sku" id="productStock"><?php echo $product_details['stock']; ?></span> -->
2024-02-12 10:35:09 +08:00
</div>
</div>
<!-- 20240212 Jun Jihad Include Parent Product in the Variation Selection -->
2024-02-12 10:35:09 +08:00
<?php
2024-02-13 17:54:24 +08:00
if (isset($variation_details) && is_array($variation_details)) {
?>
2024-05-21 09:18:10 +08:00
<div class="ec-pro-variation">
<div class="ec-pro-variation-inner ec-pro-variation-size">
<span>VARIATION</span>
<div class="ec-pro-variation-content">
<ul class="eccart-pro-items">
<!-- <?php
$main_product_image = isset($product_details["images"]) ? $product_details["images"] : 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
?>
<a href="javascript:void(0);" onclick="selectVariation(<?php // echo htmlspecialchars(json_encode($product_details), ENT_QUOTES, 'UTF-8'); ?>)">
<li style="width: 100px; height: 100px">
<img src="<?php // echo $main_product_image; ?>" alt="product">
<?php // foreach ($product_details['variables'] as $variable) { ?>
<p><?php // echo $variable['name'] . ': ' . $variable['value']; ?></p>
<?php // } ?>
</li>
</a> -->
2024-05-21 09:18:10 +08:00
<?php
$main_product_image = isset($product_details["images"]) ? strtok($product_details["images"], ',') : 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
2024-02-27 09:11:14 +08:00
?>
2024-05-21 09:18:10 +08:00
<a href="javascript:void(0);"
onclick="selectVariation(<?php echo htmlspecialchars(json_encode($product_details), ENT_QUOTES, 'UTF-8'); ?>)">
<li style="width: 100px; height: 100px">
<img src="<?php echo $main_product_image; ?>"
alt="product">
<?php foreach ($product_details['variables'] as $variable) { ?>
<p><?php echo $variable['name'] . ': ' . $variable['value']; ?>
</p>
<?php } ?>
</li>
</a>
<?php
2024-02-27 09:11:14 +08:00
foreach ($variation_details as $index => $variation) {
$variationImage = isset($variation["images"]) ? $variation["images"] : 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
2024-02-27 09:11:14 +08:00
?>
2024-05-21 09:18:10 +08:00
<a href="javascript:void(0);"
onclick="selectVariation(<?php echo htmlspecialchars(json_encode($variation), ENT_QUOTES, 'UTF-8'); ?>)">
<li style="width: 100px; height: 100px">
<img src="<?php echo $variationImage; ?>" alt="product">
<?php foreach ($variation['variables'] as $variable) { ?>
<p><?php echo $variable['name'] . ': ' . $variable['value']; ?>
</p>
<?php } ?>
</li>
</a>
<?php
2024-02-27 09:11:14 +08:00
}
?>
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
</ul>
2024-02-13 17:54:24 +08:00
</div>
</div>
2024-05-21 09:18:10 +08:00
</div>
<script>
// globalProduct = JSON.parse(globalProductEn)
// console.log(globalProductEn)
function selectVariation(variation) {
globalVariation = variation;
console.log("Variation selected: ", variation);
document.getElementById("productDescription").innerHTML = variation
.specifications;
document.getElementById("shortDescription").innerHTML = variation
.product_description;
document.getElementById("productTitle").innerText = variation.product_name;
document.getElementById("product_Id").value = variation._id;
var productImage = variation.images ? variation.images.split(',')[0] :
'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
$('.zoom-image-hover').trigger('zoom.destroy');
document.getElementById('mainProductImage').src = productImage;
$('.zoom-image-hover').zoom();
document.getElementById("productTitlemodal").innerText = variation
.product_name;
document.getElementById('mainProductImagemodal').src = productImage;
if (variation.regular_price || variation.sale_price) {
document.getElementById("productPrice").innerText = variation
.sale_price ? variation.sale_price : variation.regular_price;
document.getElementById("productStock").innerText = variation.stock;
document.getElementById('addToCartButton').disabled = false;
document.getElementById("addToCartButton").style.display = "block";
document.getElementById("contactSellerButton").style.display = "none";
} else {
document.getElementById("productPrice").innerText =
"Contact seller for price";
document.getElementById("productStock").innerText = "Available";
document.getElementById('addToCartButton').disabled = true;
document.getElementById("addToCartButton").style.display = "none";
document.getElementById("contactSellerButton").style.display = "block";
}
}
</script>
2024-02-13 17:54:24 +08:00
<?php
}
?>
2024-02-27 09:11:14 +08:00
<!-- 20240212 Jun Jihad Include Parent Product in the Variation Selection -->
2024-02-13 17:54:24 +08:00
2024-02-27 09:11:14 +08:00
<!-- 02-22-2024 Stacy modified this block of code -->
2024-02-12 10:35:09 +08:00
<div class="ec-single-qty">
2024-02-27 09:11:14 +08:00
<div class="qty-plus-minuses" style="display:flex; overflow:visible;">
<!-- <div class="qty-btn" style="color:#ffaa00; font-size:35px; padding-right:5px; cursor: pointer;" onclick="decrement()">-</div>
<input class="qty-inputs" style="width:100px; height:40px" type="number" name="ec_qtybtn" value="<?php #echo (!empty($product_details['minimum_order'])) ? $product_details['minimum_order'] : "1";
?>" id="qty-input" />
2024-02-27 09:11:14 +08:00
<div class="qty-btn" style="color:#ffaa00; font-size:25px; padding-left:5px; cursor: pointer;" onclick="increment()">+</div> -->
2024-05-21 09:18:10 +08:00
<div class="ec-single-cart"
style="display:flex; flex-direction:row; width:80%; overflow:visible; text-align:center; align-items:center; ">
<!-- 02-13-24 Jun Jihad Contact Seller will appear to Variable products with no price -->
<?php
$product_price = (!empty($product_details['sale_price'])) ? $product_details['sale_price'] : $product_details['regular_price'] ;
if ($_SESSION["isCustomer"]) {
2024-05-21 09:18:10 +08:00
// if ($product_details['product_type'] === "variables") {
// echo '<div class="qty-btn" style="color:#ffaa00; font-size:35px; padding-right:5px; cursor: pointer;" onclick="decrement()"
// onmouseover="this.style.color=\'#a15d00\'" onmouseout="this.style.color=\'#ffaa00\'">-</div>';
// echo '<input class="qty-inputs" style="width:110px; height:40px" type="number" name="ec_qtybtn" value="';
// echo (!empty($product_details['minimum_order'])) ? $product_details['minimum_order'] : "1";
// echo '" id="qty-input" oninput="handleInput()" />';
// echo '<div class="qty-btn" style="color:#ffaa00; font-size:25px; padding-left:5px; cursor: pointer;" onclick="increment()"
// onmouseover="this.style.color=\'#a15d00\'" onmouseout="this.style.color=\'#ffaa00\'">+</div>';
// echo '<div style="display:flex; margin-left:45px;"><button type="button" class="btn btn-primary" id="contactSellerButton" style="background:#ffaa00; width:190px;"
// onmouseover="this.style.background=\'#df9000\'" onmouseout="this.style.background=\'#ffaa00\'"
// data-bs-toggle="modal" data-bs-target="#priceModal"><i class="fi-rr-envelope" style="font-size:20px; margin-bottom:-3px; margin-right:10px;"></i>Contact Seller</button>';
// echo '<button class="btn btn-primary" id="addToCartButton" style="display:none">Add To Cart</button>';
// echo '<div class="ec-single-wishlist">
// <a class="ec-btn-group wishlist" title="Wishlist" onclick="wishlist()"><i class="fi fi-rr-heart" style="color:#B80F0A; font-size:20px;"></i></a>
// </div></div>';
// } else {
2024-02-27 09:11:14 +08:00
if (!empty($product_details['regular_price']) || !empty($product_details['sale_price'])) {
echo '<div class="qty-btn" style="color:#ffaa00; font-size:35px; margin-right:5px; cursor: pointer;" onclick="decrement()"
onmouseover="this.style.color=\'#a15d00\'" onmouseout="this.style.color=\'#ffaa00\'">-</div>';
2024-02-27 09:11:14 +08:00
echo '<input class="qty-inputs" style="width:100px; height:40px" type="number" name="ec_qtybtn" value="';
echo (!empty($product_details['minimum_order'])) ? $product_details['minimum_order'] : "1";
echo '" id="qty-input" oninput="handleInput()" />';
echo '<div class="qty-btn" style="color:#ffaa00; font-size:25px; margin-left:5px; cursor: pointer;" onclick="increment()"
onmouseover="this.style.color=\'#a15d00\'" onmouseout="this.style.color=\'#ffaa00\'">+</div>';
echo '<div> <div id="addToCartMessage" style="padding-left:45px;"></div> <button class="btn btn-primary" id="addToCartButton" style="text-wrap:nowrap;
background:#ffaa00; margin-left:55px;" onmouseover="this.style.background=\'#df9000\'" onmouseout="this.style.background=\'#ffaa00\'">
<i class="fi-rr-shopping-bag" style="font-size:20px; margin-bottom:-3px; margin-right:10px;"></i>Add To Cart</button></div>';
2024-02-27 09:11:14 +08:00
echo '<div class="ec-single-wishlist">
<a class="ec-btn-group wishlist" title="Wishlist" onclick="wishlist()"><i class="fi fi-rr-heart" style="color:#B80F0A; font-size:20px;"></i></a>
</div>';
} else {
2024-05-21 09:18:10 +08:00
// echo '<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#priceModal" style="text-wrap:nowrap;" >Contact seller</button>';
echo '<button type="button" class="btn" id="contactSellerButton" style="background:#ffaa00; min-width:200px; display:flex; padding: 10px; align-items:center; justify-content:center; color:#fff ;"
onmouseover="this.style.background=\'#df9000\'" onmouseout="this.style.background=\'#ffaa00\'"
data-bs-toggle="modal"data-message="product" data-bs-target="#chatModal"><i class="fi-rr-envelope" style="font-size:16px; margin-bottom:-3px; margin-right:10px;"></i>Contact Seller</button>';
2024-02-27 09:11:14 +08:00
}
2024-05-21 09:18:10 +08:00
// }
} else if (($_SESSION["isCustomer"] == false) && ($_SESSION["isVendor"] == false)) {
2024-02-27 09:11:14 +08:00
echo '<div class="login-button" style=""><p style="color:red; text-wrap:nowrap;">Please log in to your account.</p>';
echo '<a href="login.php" style="margin-left:-2px;"><button type="button" class="btn btn-primary" style="margin-left:-2px; margin-top:-20px; background:#ffaa00;
border-radius:10px; letter-spacing:1px;" onmouseover="this.style.background=\'#df9000\'" onmouseout="this.style.background=\'#ffaa00\'"
data-bs-toggle="modal">LOGIN</button></a></div>';
2024-02-27 09:11:14 +08:00
}
?>
<!-- <div class="ec-single-wishlist" style="border: 1px solid yellow;">
2024-02-27 09:11:14 +08:00
<a class="ec-btn-group wishlist" style="padding-left:40px;" title="Wishlist" onclick="wishlist()"><i class="fi fi-rr-heart"></i></a>
</div> -->
<!-- 02-22-2024 Stacy modified this block of code -->
<!-- 02-13-24 Jun Jihad Contact Seller will appear to Variable products with no price -->
<!-- <?php
// if ($_SESSION["isLoggedIn"]) {
// if ($product_details['product_type'] === "variable") {
// echo '<button class="btn btn-primary" id="addToCartButton" disabled>Add To Cart</button>';
// echo '<button type="button" class="btn btn-primary" id="contactSellerButton" style="display:none" data-bs-toggle="modal" data-bs-target="#priceModal">Contact seller</button>';
// } elseif ($product_details['regular_price'] && $product_details['regular_price'] !== "") {
// echo '<div id="addToCartMessage"></div>';
// echo '<button class="btn btn-primary" id="addToCartButton">Add To Cart</button>';
// } else {
// echo '<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#priceModal">Contact seller</button>';
// }
// } else {
// echo '<p>Please log in to add to cart.</p>';
// }
?> -->
2024-02-27 09:11:14 +08:00
</div>
2024-02-13 17:54:24 +08:00
</div>
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
<div class="modal fade" id="priceModal" tabindex="-1" role="dialog"
aria-labelledby="priceModalLabel" aria-hidden="true">
2024-02-12 10:35:09 +08:00
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
2024-05-21 09:18:10 +08:00
<button type="button" class="close" data-bs-dismiss="modal"
aria-label="Close">
2024-02-12 10:35:09 +08:00
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<!-- Add your modal content here -->
<div class="seller-email">
<div class="row align-items-center">
<div class="col-md-1">
<b class="mb-0">To:</b>
</div>
<div class="col-md-1">
2024-02-20 15:01:07 +08:00
<span><?php echo $_SESSION["sales_email"] ?></span>
2024-02-12 10:35:09 +08:00
</div>
</div>
</div>
2024-05-21 09:18:10 +08:00
<div class="product-details align-items-center"
style="margin-top: 10px; width: 100%;">
2024-02-12 10:35:09 +08:00
<div class="row">
<div class="col-md-2 col-2">
2024-05-21 09:18:10 +08:00
<div class="single-slide zoom-image-hover"
style="height: 70px; border: 1px solid #ddd; text-align: center; overflow: hidden;">
2024-02-12 10:35:09 +08:00
<?php
$placeholderImage = 'https://upload.wikimedia.org/wikipedia/commons/6/65/No-Image-Placeholder.svg';
$productImage = isset($product_details["product_image"]) ? $product_details["product_image"] : $placeholderImage;
?>
2024-05-21 09:18:10 +08:00
<img loading="lazy"
id="mainProductImagemodal"
class="img-responsive"
src="<?php echo $productImage; ?>"
alt=""
style="width: 100%; height: 100%; object-fit: cover;">
2024-02-12 10:35:09 +08:00
</div>
</div>
<div class="col-md-8 col-8">
<div class="product-name text-center">
2024-05-21 09:18:10 +08:00
<h6 id="productTitlemodal">
<?php echo $product_details['product_name']; ?>
</h6>
2024-02-12 10:35:09 +08:00
</div>
</div>
<div class="col-md-2 col-2">
<div class="qty-plus text-center">
2024-05-21 09:18:10 +08:00
<input class="qty-inputs" type="number"
name="product_quantity"
value="<?php echo (!empty($product_details['minimum_order'])) ? $product_details['minimum_order'] : "1"; ?>"
id="qty-input"
min="<?php echo (!empty($product_details['minimum_order'])) ? $product_details['minimum_order'] : "1"; ?>" />
2024-02-12 10:35:09 +08:00
</div>
</div>
</div>
</div>
2024-05-21 09:18:10 +08:00
<div class="inquiry-form"
style="margin-top: 10px; background-color:#eeeeee;padding:20px; ">
2024-02-12 10:35:09 +08:00
<div class="text-information">
<b class="text">DETAILED REQUIREMENTS</b>
</div>
<!-- 02-19-2024 Stacy modified this block of code -->
<form action="contact-seller-action.php" method="post">
2024-05-21 09:18:10 +08:00
<label for="">Enter product details such as
color,size,materials,etc. and other
specification requirements to receive an
accurate quote</label>
<textarea name="message" id="" cols="30"
rows="5"></textarea>
<input name="product_name" type="hidden"
value='<?php echo $product_details['product_name']; ?>' />
<input class="qty-inputs" type="hidden"
name="product_quantityf"
value="<?php echo (!empty($product_details['minimum_order'])) ? $product_details['minimum_order'] : "1"; ?>"
id="qty-input"
min="<?php echo (!empty($product_details['minimum_order'])) ? $product_details['minimum_order'] : "1"; ?>" />
<input name="product_id" type="hidden"
value='<?php echo $product_details['_id']; ?>' />
<!-- <input name="product_quantity" type="number"/> -->
<div class="modal-footer">
2024-05-21 09:18:10 +08:00
<button type="submit" class="btn btn-secondary"
data-bs-dismiss="modal">Send</button>
</div>
2024-02-12 10:35:09 +08:00
</form>
<!-- 02-19-2024 Stacy modified this block of code -->
2024-02-12 10:35:09 +08:00
</div>
</div>
<!-- <div class="modal-footer">
2024-02-12 10:35:09 +08:00
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Send</button>
</div> -->
2024-02-12 10:35:09 +08:00
</div>
</div>
</div>
2024-02-27 09:11:14 +08:00
<!-- <div class="ec-single-wishlist">
2024-02-12 10:35:09 +08:00
<a class="ec-btn-group wishlist" title="Wishlist" onclick="wishlist()"><i class="fi fi-rr-heart"></i></a>
2024-02-27 09:11:14 +08:00
</div> -->
2024-02-12 10:35:09 +08:00
<!-- <div class="ec-single-quickview">
<a href="#" class="ec-btn-group quickview" data-link-action="quickview" title="Quick view" data-bs-toggle="modal" data-bs-target="#ec_quickview_modal"><i class="fi-rr-eye"></i></a>
</div> -->
</div>
<script>
2024-05-21 09:18:10 +08:00
function updateButtonMessage(buttonId, newMessage) {
var button = document.getElementById(buttonId);
button.setAttribute('data-message', newMessage);
}
2024-05-21 09:18:10 +08:00
// Example of updating the message before opening the modal
var contactSellerButton = document.getElementById('contactSellerButton');
contactSellerButton.addEventListener('click', function() {
updateButtonMessage('contactSellerButton',
'This is a new message!');
});
/* 04-18-24 raymart added functioning the quantity to handle if the product has price matrix */
function handleInput(action) {
var qtyInput = document.getElementById('qty-input');
var currentQuantity = parseInt(qtyInput.value);
var minimumOrder =
<?php echo (!empty($product_details['minimum_order'])) ? $product_details['minimum_order'] : "1"; ?>;
/* default to quantity 1 if input is empty */
if (!currentQuantity || isNaN(currentQuantity)) {
currentQuantity = 1;
}
/* default to minimum quantity if the product has minimun order */
if (currentQuantity < minimumOrder) {
currentQuantity = minimumOrder;
console.log("The minimum order quantity is " + minimumOrder);
}
2024-05-21 09:18:10 +08:00
/* Ensure the quantity never goes below 1 */
if (action === 'increment') {
currentQuantity += 1;
} else if (action === 'decrement' && currentQuantity > 1) {
currentQuantity -= 1;
}
currentQuantity = Math.max(currentQuantity, 1);
qtyInput.value = currentQuantity;
globalQuantity = currentQuantity;
var handlePrice = document.getElementById('productNewPrice') || document
.getElementById('productPrice');
var product_price = '<?php echo $product_price; ?>';
var priceMatrices =
<?php echo (!empty($product_details['price_matrix'])) ? json_encode($product_details['price_matrix']) : "[]"; ?>;
var foundPrice = false;
for (var m = 0; m < priceMatrices.length; m++) {
var priceMatrix = priceMatrices[m];
for (var i = 0; i < priceMatrix.length; i++) {
var matrixQuantity = parseFloat(priceMatrix[i].quantity);
var nextMatrixQuantity = (i < priceMatrix.length - 1) ? parseFloat(
priceMatrix[i + 1].quantity) : Infinity;
if (currentQuantity >= matrixQuantity && currentQuantity <
nextMatrixQuantity) {
var unitPrice = parseFloat(priceMatrix[i].price);
handlePrice.innerText = unitPrice.toFixed(2).toString().replace(
/\.00$/, '');
foundPrice = true;
2024-05-21 09:18:10 +08:00
break;
}
}
2024-05-21 09:18:10 +08:00
if (foundPrice) {
break;
}
}
2024-05-21 09:18:10 +08:00
if (!foundPrice) {
// Handle when quantity exceeds the highest price matrix
var lastMatrix = priceMatrices[priceMatrices.length - 1];
var highestQuantity = parseFloat(lastMatrix[lastMatrix.length - 1]
.quantity);
if (currentQuantity >= highestQuantity) {
var highestPrice = parseFloat(lastMatrix[lastMatrix.length - 1]
.price);
handlePrice.innerText = highestPrice.toFixed(2).replace(/\.00$/,
'');
foundPrice = true;
}
}
// If original price is within the quantity range
if (!foundPrice) {
handlePrice.innerText = product_price;
}
}
2024-05-21 09:18:10 +08:00
function increment() {
var qtyInput = document.getElementById('qty-input');
var currentQuantity = parseInt(qtyInput.value);
currentQuantity++;
qtyInput.value = currentQuantity;
globalQuantity = currentQuantity;
var incrementPrice;
if (document.getElementById('productNewPrice')) {
incrementPrice = document.getElementById('productNewPrice');
} else {
incrementPrice = document.getElementById('productPrice');
}
// var productPrice = document.getElementById('productPrice');
var product_price = '<?php echo $product_price; ?>';
var foundPrice = false;
var priceMatrix =
<?php echo (!empty($product_details['price_matrix'])) ? json_encode($product_details['price_matrix']) : "[]"; ?>;
/* to determine if regular price or price matrix but it depends to the quantity */
if (priceMatrix.length > 0) {
for (var i = 0; i < priceMatrix.length; i++) {
for (var j = 0; j < priceMatrix[i].length; j++) {
var matrixQuantity = parseFloat(priceMatrix[i][j].quantity);
var nextMatrixQuantity = (j < priceMatrix[i].length - 1) ?
parseFloat(priceMatrix[i][j + 1].quantity) : Infinity;
if (currentQuantity >= matrixQuantity && currentQuantity <
nextMatrixQuantity) {
var regularPrice = parseFloat(priceMatrix[i][j].price);
var nextPrice = (j < priceMatrix[i].length - 1) ?
parseFloat(priceMatrix[i][j + 1].price) : product_price;
var unitPrice = regularPrice;
incrementPrice.innerText = parseFloat(unitPrice.toFixed(2))
.toString(); // Convert to floating-point number and then to string
foundPrice = true;
break;
}
}
2024-05-21 09:18:10 +08:00
if (foundPrice) {
break;
}
}
2024-02-12 10:35:09 +08:00
}
2024-05-21 09:18:10 +08:00
}
/* function increment() {
var qtyInput = document.getElementById('qty-input');
qtyInput.value = parseInt(qtyInput.value) + 1;
} */
/* function decrement() {
var qtyInput = document.getElementById('qty-input');
var currentQuantity = parseInt(qtyInput.value);
<?php if (!empty($product_details['minimum_order'])) : ?>
var minimumOrder = <?php echo $product_details['minimum_order']; ?>;
if (currentQuantity > minimumOrder) {
qtyInput.value = currentQuantity - 1;
}
<?php else : ?>
// If there is no minimum order, allow decrementing
if (currentQuantity > 1) {
qtyInput.value = currentQuantity - 1;
}
<?php endif; ?>
} */
function decrement() {
var qtyInput = document.getElementById('qty-input');
var currentQuantity = parseInt(qtyInput.value);
var minimumOrder =
<?php echo (!empty($product_details['minimum_order'])) ? $product_details['minimum_order'] : "1"; ?>;
if (currentQuantity <= minimumOrder) {
console.log("The minimum order quantity is " + minimumOrder);
return;
}
2024-05-21 09:18:10 +08:00
if (currentQuantity > 1) {
currentQuantity--;
} else {
return; // Don't decrement further if quantity is already 1
}
qtyInput.value = currentQuantity;
globalQuantity = currentQuantity;
var decrementPrice;
if (document.getElementById('productNewPrice')) {
decrementPrice = document.getElementById('productNewPrice');
} else {
decrementPrice = document.getElementById('productPrice');
}
// var productPrice = document.getElementById('productPrice');
var product_price = '<?php echo $product_price; ?>';
var foundPrice = false;
var priceMatrix =
<?php echo (!empty($product_details['price_matrix'])) ? json_encode($product_details['price_matrix']) : "[]"; ?>;
/* to determine if regular price or price matrix but it depends to the quantity */
if (priceMatrix.length > 0) {
for (var i = 0; i < priceMatrix.length; i++) {
for (var j = 0; j < priceMatrix[i].length; j++) {
var matrixQuantity = parseFloat(priceMatrix[i][j].quantity);
var nextMatrixQuantity = (j < priceMatrix[i].length - 1) ?
parseFloat(priceMatrix[i][j + 1].quantity) : Infinity;
if (currentQuantity >= matrixQuantity && currentQuantity <
nextMatrixQuantity) {
var regularPrice = parseFloat(priceMatrix[i][j].price);
var nextPrice = (j < priceMatrix[i].length - 1) ?
parseFloat(priceMatrix[i][j + 1].price) : product_price;
var unitPrice = regularPrice;
decrementPrice.innerText = parseFloat(unitPrice.toFixed(2))
.toString(); /* Convert to floating-point number and then to string */
foundPrice = true;
break;
} else if (currentQuantity < matrixQuantity) {
/* If current quantity is less than the minimum in the price matrix, display the regular price */
decrementPrice.innerText = parseFloat(product_price)
.toFixed(2).replace(/\.00$/,
''); /* Remove trailing .00 */
foundPrice = true;
break;
}
}
2024-05-21 09:18:10 +08:00
if (foundPrice) {
break;
}
}
2024-02-12 10:35:09 +08:00
}
2024-05-21 09:18:10 +08:00
}
/* 04-18-24 raymart added functioning the quantity to handle if the product has price matrix */
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
<?php
2024-02-12 10:35:09 +08:00
echo "var product_details = " . json_encode($product_details) . ";";
?>
2024-05-21 09:18:10 +08:00
function wishlist() {
var wishCustomerId = '<?php echo $customer_data[0]['_id'] ?>';
var wishProductId = '<?php echo $product_details['_id']; ?>';
fetch('https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/customers/' +
wishCustomerId)
.then(response => response.json())
.then(data => {
const existingWishlist = data.favorites ?? {
products: [],
vendors: []
};
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
// Check if the product already exists in the wishlist
const isAlreadyAdded = existingWishlist.products.some(product =>
product._id === wishProductId);
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
if (!isAlreadyAdded) {
const newFavorites = {
products: [{
...
product_details, // Use the spread operator to include all properties from product_details
}]
};
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
existingWishlist.products.push(newFavorites.products[0]);
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
return fetch(
'https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/customers/' +
wishCustomerId, {
2024-02-12 10:35:09 +08:00
method: 'PATCH',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
favorites: existingWishlist
}),
});
2024-05-21 09:18:10 +08:00
} else {
console.log("Product already exists in favorites");
// Optionally, you can notify the user that the product is already in their favorites
// alert("Product already exists in favorites");
return Promise
.resolve(); // Resolve the promise to continue the chain
}
})
.then(response => {
if (response && response.ok) {
// Handle success (e.g., show a success message)
console.log("Added to favorites")
// location.reload();
} else if (response) {
// Handle error
console.error('Failed to submit data');
alert('Failed to submit data');
}
})
.catch(error => {
// Handle network or other errors
console.error('Error:', error);
alert('Error submitting data');
});
}
2024-02-12 10:35:09 +08:00
</script>
<script>
2024-05-21 09:18:10 +08:00
var sessionToken =
'<?php echo isset($_SESSION["token"]) ? $_SESSION["token"] : ""; ?>';
var email =
'<?php echo isset($_SESSION["email"]) ? $_SESSION["email"] : ""; ?>';
var password =
'<?php echo isset($_SESSION["password"]) ? $_SESSION["password"] : ""; ?>';
function login(username, password, callback) {
fetch("https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/login", {
method: "POST",
headers: {
"Content-Type": "application/json",
"X-Api-Key": "{{apiKey}}"
},
body: JSON.stringify({
username: username,
password: password
2024-02-12 10:35:09 +08:00
})
2024-05-21 09:18:10 +08:00
})
.then(response => {
if (response.ok) {
return response.json();
} else {
throw new Error("Unable to login");
}
})
.then(data => {
fetch("update-token-session.php", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
token: data.token
2024-02-12 10:35:09 +08:00
})
2024-05-21 09:18:10 +08:00
})
.then(response => response.json())
.then(result => {
if (result.status === 'success') {
sessionToken = data.token;
console.log("New Token:", sessionToken);
callback(sessionToken);
} else {
throw new Error(
"Unable to update session token");
}
});
})
.catch(error => {
console.error("Error:", error.message);
});
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
document.getElementById("addToCartButton").addEventListener("click",
function() {
2024-02-12 10:35:09 +08:00
console.log("Button clicked");
login(email, password, function(token) {
2024-05-21 09:18:10 +08:00
var priceMatrix =
<?php echo (!empty($product_details['price_matrix'])) ? json_encode($product_details['price_matrix']) : "[]"; ?>;
var quantityValue = document.getElementById("qty-input")
.value;
var minimumOrder =
<?php echo (!empty($product_details['minimum_order'])) ? $product_details['minimum_order'] : "1"; ?>;
var shippingFee =
"<?php echo isset($product_details['shipping_fee']) && $product_details['shipping_fee'] !== '' ? $product_details['shipping_fee'] : '50'; ?>";
2024-02-12 10:35:09 +08:00
if (parseInt(quantityValue) < minimumOrder) {
quantityValue = minimumOrder;
2024-05-21 09:18:10 +08:00
alert("The minimum order quantity is " +
minimumOrder);
}
/* else {
if (priceMatrix.length > 0) {
var selectedPrice = null;
for (var i = 0; i < priceMatrix.length; i++) {
if (parseInt(priceMatrix[i].quantity) === parseInt(quantityValue)) {
selectedPrice = priceMatrix[i].price;
break;
}
}
if (selectedPrice !== null) {
document.getElementById("price-display").innerText = "Price: $" + selectedPrice;
} else {
document.getElementById("price-display").innerText = "Price not available for this quantity";
}
}
} */
2024-02-12 10:35:09 +08:00
// April 3, 2024 Jun Jihad Apply Matrix
var productPrice;
var foundPrice = false;
// if (priceMatrix.length > 0) {
// for (var i = 0; i < priceMatrix.length; i++) {
// for (var j = 0; j < priceMatrix[i].length; j++) {
// if (quantityValue <= parseInt(priceMatrix[i][j].quantity)) {
// productPrice = parseFloat(priceMatrix[i][j].price);
// foundPrice = true;
// break;
// }
// }
// if (foundPrice) {
// break;
// }
// }
// }
if (priceMatrix.length > 0) {
for (var i = 0; i < priceMatrix.length; i++) {
2024-05-21 09:18:10 +08:00
for (var j = 0; j < priceMatrix[i]
.length; j++) {
var currentQuantity = parseFloat(
priceMatrix[i][j].quantity);
var nextQuantity = (j < priceMatrix[i]
.length - 1) ? parseFloat(
priceMatrix[i][j + 1].quantity) :
Infinity;
if (quantityValue >= currentQuantity &&
quantityValue < nextQuantity) {
productPrice = parseFloat(priceMatrix[i]
[j].price);
foundPrice = true;
break;
}
}
if (foundPrice) {
break;
}
}
}
if (!foundPrice) {
2024-05-21 09:18:10 +08:00
productPrice = parseFloat(document.getElementById(
"productNewPrice") ? document
.getElementById("productNewPrice")
.innerText : document.getElementById(
"productPrice").innerText);
}
2024-02-12 10:35:09 +08:00
var productData = {
product: {
2024-05-21 09:18:10 +08:00
product_image: document.getElementById(
"mainProductImage").getAttribute(
'src'),
product_id: document.getElementById(
"product_Id").value,
name: document.getElementById(
"productTitle").innerText,
2024-02-12 10:35:09 +08:00
},
price: productPrice,
2024-02-12 10:35:09 +08:00
quantity: quantityValue,
vendor_id: "<?php echo $vendor_details['_id'] ?>",
vendor_name: "<?php echo $vendor_details['user_login'] ?>",
};
// April 3, 2024 Jun Jihad Apply Matrix
2024-02-12 10:35:09 +08:00
console.log("Product data:", productData);
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
var totalAmount = productData.price * productData
.quantity;
2024-02-12 10:35:09 +08:00
var customerData = {
customer_id: "<?php $customer = $customer_data[0];
echo $customer['_id']; ?>",
name: "<?php echo $customer['first_name']; ?> <?php echo $customer['last_name']; ?>",
};
console.log("Customer data:", customerData);
2024-02-12 10:35:09 +08:00
// Check if the product is already in the order API
var existingOrder;
var orderCheckXhr = new XMLHttpRequest();
2024-05-21 09:18:10 +08:00
orderCheckXhr.open("GET",
"https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/orders/customer/" +
customerData.customer_id, true);
2024-02-12 10:35:09 +08:00
orderCheckXhr.onreadystatechange = function() {
if (orderCheckXhr.readyState === 4) {
if (orderCheckXhr.status === 200) {
2024-05-21 09:18:10 +08:00
var orders = JSON.parse(orderCheckXhr
.responseText);
2024-02-12 10:35:09 +08:00
var existingItemId;
2024-05-21 09:18:10 +08:00
var ordersFiltered = orders.filter((
e) => e.status === "CART" ||
e
.status === "Cart")
existingOrder = ordersFiltered.find(
order => order.items.some(
item => item.product
.product_id === productData
.product.product_id));
2024-02-12 10:35:09 +08:00
console.log("exist? " + existingOrder)
if (existingOrder) {
2024-05-21 09:18:10 +08:00
var existingItemId = existingOrder
.items[0]._id;
2024-02-12 10:35:09 +08:00
// If the product is found in an existing CART order, update the order
2024-05-21 09:18:10 +08:00
updateOrder(existingOrder._id,
existingItemId);
2024-02-12 10:35:09 +08:00
} else {
// If the product is not found or the order is not a CART, create a new order
console.log("No Order Yet!")
createNewOrder()
}
} else if (orderCheckXhr.status === 404) {
// If the customer has no orders, create a new order
console.log("No Order Yet!")
createNewOrder();
} else {
// Handle error response from the server when checking orders
2024-05-21 09:18:10 +08:00
console.log("Error checking orders:",
orderCheckXhr.responseText);
2024-02-12 10:35:09 +08:00
}
}
};
orderCheckXhr.send();
function createNewOrder() {
var xhr = new XMLHttpRequest();
// Declare requestData before sending the request
var requestData = {
items: [productData],
customer: [customerData],
status: "CART",
total_amount: totalAmount,
shipping_fee: shippingFee,
};
console.log("Request data:", requestData);
2024-02-12 10:35:09 +08:00
// const token = '<?php echo $_SESSION["token"] ?>';
2024-05-21 09:18:10 +08:00
xhr.open("POST",
"https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/orders",
true);
xhr.setRequestHeader("Content-Type",
"application/json", );
xhr.setRequestHeader("Authorization", "Bearer " +
token);
2024-02-12 10:35:09 +08:00
xhr.onreadystatechange = function() {
if (xhr.readyState === 4) {
if (xhr.status === 201) {
2024-05-21 09:18:10 +08:00
var response = JSON.parse(xhr
.responseText);
2024-02-12 10:35:09 +08:00
console.log("Response:", response);
2024-02-12 10:35:09 +08:00
// Update the cart dynamically
2024-05-21 09:18:10 +08:00
var cartList = document
.querySelector(
".eccart-pro-items");
var newOrder = document
.createElement("li");
newOrder.id =
`order_${response._id}`;
2024-02-12 10:35:09 +08:00
console.log(response)
newOrder.innerHTML = `
<a href="shop-left-sidebar-col-4.php" class="sidekka_pro_img">
<img loading="lazy" src="${response.items[0].product.product_image}" alt="product">
</a>
<div class="ec-pro-content">
<a href="shop-left-sidebar-col-4.php" class="cart_pro_title">${response.items[0].product.name}</a>
<span class="cart-price" id="cart-price">
Unit Price: <span>${response.items[0].price}</span>
</span>
<span id="subtotal-${response._id}" class="subtotal-${response._id}">Subtotal: ${totalAmount}</span>
<!-- 02-16-2024 Stacy added style -->
<div class="qty-plus-minuses" style="display:flex; overflow:visible; align-items:center; margin-top:5px;">
<div class="qty-btn" style="color:#ffaa00; font-size:35px; margin-right:5px; cursor: pointer;" onclick="qtyDecrement('${response._id}', '${response.items[0]._id}', true)"
onmouseover="this.style.color='#a15d00'" onmouseout="this.style.color='#ffaa00'">-</div>
<input style="width:100px; height:40px" id="qty-input-${response.items[0]._id}" class="qty-input" type="number" name="ec_qtybtn" value="${productData.quantity}" oninput="handleQtyInput(this, '${response._id}', '${response.items[0]._id}', true)"/>
<div class="qty-btn" style="color:#ffaa00; font-size:30px; margin-left:5px; cursor: pointer;" onclick="qtyIncrement('${response._id}', '${response.items[0]._id}', true)"
onmouseover="this.style.color='#a15d00'" onmouseout="this.style.color='#ffaa00'">+</div>
<a href="#" class="removeCart" style="margin-left:30px;" onclick="deleteOrder('${response._id}')">
<i class="ecicon eci-trash" style="color:#7e7e7e;" onmouseover="this.style.color='#aaaaaa'"
onmouseout="this.style.color='#7e7e7e'"></i></a>
</div>
<!-- 02-16-2024 Stacy added style -->
</div>
`;
2024-02-12 10:35:09 +08:00
getLatestOrders()
updateCartItemCount()
cartList.appendChild(newOrder);
2024-05-21 09:18:10 +08:00
document.getElementById(
"addToCartMessage")
.innerText =
"Product added to cart!";
2024-02-12 10:35:09 +08:00
setTimeout(function() {
2024-05-21 09:18:10 +08:00
document.getElementById(
"addToCartMessage"
).innerText = "";
2024-02-12 10:35:09 +08:00
}, 1000);
} else {
// Handle error response from the server
2024-05-21 09:18:10 +08:00
console.log(
"Error response from the server"
);
console.log(xhr
.responseText
); // Log the server's response
2024-02-12 10:35:09 +08:00
}
}
};
xhr.send(JSON.stringify(requestData));
}
function getLatestOrders() {
2024-05-21 09:18:10 +08:00
var customerId =
'<?php echo $customer_data[0]['_id'] ?>'
2024-02-12 10:35:09 +08:00
// Fetch the order data
2024-05-21 09:18:10 +08:00
fetch(
`https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/orders/customer/${customerId}`
)
2024-02-12 10:35:09 +08:00
.then(response => response.json())
.then(orderData => {
if (orderData && orderData !== "") {
console.log(orderData)
2024-05-21 09:18:10 +08:00
const filteredOrders = orderData
.filter(order => order.status
.toUpperCase() === 'CART');
const totalAmountSum =
filteredOrders.reduce((sum,
order) => {
const totalAmount =
parseFloat(order
.total_amount);
return sum +
totalAmount;
}, 0);
console.log('Total Amount Sum:',
totalAmountSum);
document.getElementById(
`floatCartTotalAmount`)
.innerText = totalAmountSum;
2024-02-12 10:35:09 +08:00
} else {
alert('Error fetching order data');
}
})
.catch(error => console.error('Error:', error));
}
function updateOrder(orderId, existingItemId) {
var updateOrderXhr = new XMLHttpRequest();
// const token = '<?php echo $_SESSION["token"] ?>';
2024-05-21 09:18:10 +08:00
updateOrderXhr.open("PUT",
`https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/orders/${orderId}/items/${existingItemId}`,
true);
updateOrderXhr.setRequestHeader("Content-Type",
"application/json");
updateOrderXhr.setRequestHeader("Authorization",
"Bearer " + token);
updateOrderXhr.onreadystatechange = function() {
if (updateOrderXhr.readyState === 4) {
if (updateOrderXhr.status === 200) {
2024-05-21 09:18:10 +08:00
var response = JSON.parse(
updateOrderXhr.responseText);
console.log("Order updated:",
response);
2024-05-21 09:18:10 +08:00
var cartItem = document
.getElementById(
`order_${response._id}`);
if (cartItem) {
2024-05-21 09:18:10 +08:00
var updatedQuantity = response
.items[0].quantity;
var totalAmount = response
.items[0].price *
updatedQuantity;
// If the cart item already exists, update its content using innerHTML
cartItem.innerHTML = `
<a href="shop-left-sidebar-col-4.php" class="sidekka_pro_img">
<img loading="lazy" src="${response.items[0].product.product_image}" alt="product">
</a>
<div class="ec-pro-content">
<a href="shop-left-sidebar-col-4.php" class="cart_pro_title">${response.items[0].product.name}</a>
<span class="cart-price" id="cart-price">
Unit Price: <span>${response.items[0].price}</span>
</span>
<span id="subtotal-${response._id}" class="subtotal-${response._id}">Subtotal: ${totalAmount}</span>
<!-- 04-17-2024 Stacy added style -->
<div class="qty-plus-minuses" style="display:flex; overflow:visible; align-items:center; margin-top:5px;">
<div class="qty-btn" style="color:#ffaa00; font-size:35px; margin-right:5px; cursor: pointer;" onclick="qtyDecrement('${response._id}', '${response.items[0]._id}', true)"
onmouseover="this.style.color='#a15d00'" onmouseout="this.style.color='#ffaa00'">-</div>
<input style="width:100px; height:40px" id="qty-input-${response.items[0]._id}" class="qty-input" type="number" name="ec_qtybtn" value="${productData.quantity}" oninput="handleQtyInput(this, '${response._id}', '${response.items[0]._id}', true)"/>
<div class="qty-btn" style="color:#ffaa00; font-size:30px; margin-left:5px; cursor: pointer;" onclick="qtyIncrement('${response._id}', '${response.items[0]._id}', true)"
onmouseover="this.style.color='#a15d00'" onmouseout="this.style.color='#ffaa00'">+</div>
<a href="#" class="removeCart" style="margin-left:30px;" onclick="deleteOrder('${response._id}')">
<i class="ecicon eci-trash" style="color:#7e7e7e;" onmouseover="this.style.color='#aaaaaa'"
onmouseout="this.style.color='#7e7e7e'"></i></a>
</div>
<!-- 04-17-2024 Stacy added style -->
</div>
`;
2024-05-21 09:18:10 +08:00
document.getElementById(
`qty-input-${response.items[0]._id}`
).value =
updatedQuantity;
} else {
// If the cart item doesn't exist, create a new one
2024-05-21 09:18:10 +08:00
console.log(
"Error updating order:",
updateOrderXhr
.responseText);
}
getLatestOrders();
updateCartItemCount();
2024-05-21 09:18:10 +08:00
document.getElementById(
"addToCartMessage")
.innerText =
"Product added to cart!";
setTimeout(function() {
2024-05-21 09:18:10 +08:00
document.getElementById(
"addToCartMessage"
).innerText = "";
}, 1000);
} else {
// Handle error response from the server
2024-05-21 09:18:10 +08:00
console.log(
"Error response from the server"
);
console.log(xhr
.responseText
); // Log the server's response
}
}
};
2024-05-21 09:18:10 +08:00
var existingQuantity = parseInt(existingOrder.items[
0].quantity, 10);
var newQuantity = parseInt(quantityValue, 10);
2024-05-21 09:18:10 +08:00
var updatedQuantity = existingQuantity +
newQuantity;
// Check if the updated quantity exceeds the previous price matrix
var newProductPrice = productPrice;
var foundNewPrice = false;
if (priceMatrix.length > 0) {
for (var i = 0; i < priceMatrix.length; i++) {
2024-05-21 09:18:10 +08:00
for (var j = 0; j < priceMatrix[i]
.length; j++) {
var currentQuantity = parseFloat(
priceMatrix[i][j].quantity);
var nextQuantity = (j < priceMatrix[i]
.length - 1) ? parseFloat(
priceMatrix[i][j + 1].quantity
) : Infinity;
if (updatedQuantity >=
currentQuantity && updatedQuantity <
nextQuantity) {
newProductPrice = parseFloat(
priceMatrix[i][j].price);
foundNewPrice = true;
break;
}
}
if (foundNewPrice) {
break;
}
}
}
2024-02-12 10:35:09 +08:00
if (foundNewPrice) {
productPrice = newProductPrice;
}
2024-02-12 10:35:09 +08:00
var updateData = {
quantity: updatedQuantity,
price: productPrice // Update the price for the item
};
2024-02-12 10:35:09 +08:00
updateOrderXhr.send(JSON.stringify(updateData));
2024-02-12 10:35:09 +08:00
// Patch the total amount of the order with the updated price and quantity
var patchTotalAmountXhr = new XMLHttpRequest();
2024-05-21 09:18:10 +08:00
patchTotalAmountXhr.open("PATCH",
`https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/orders/${orderId}`,
true);
patchTotalAmountXhr.setRequestHeader("Content-Type",
"application/json");
patchTotalAmountXhr.setRequestHeader(
"Authorization", "Bearer " + token);
2024-02-12 10:35:09 +08:00
var totalAmount = productPrice * updatedQuantity;
var patchData = {
total_amount: totalAmount
};
patchTotalAmountXhr.send(JSON.stringify(patchData));
}
2024-02-12 10:35:09 +08:00
});
});
</script>
<!-- <div class="ec-single-social">
<ul class="mb-0">
<li class="list-inline-item facebook"><a href="#"><i class="ecicon eci-facebook"></i></a></li>
<li class="list-inline-item twitter"><a href="#"><i class="ecicon eci-twitter"></i></a></li>
<li class="list-inline-item instagram"><a href="#"><i class="ecicon eci-instagram"></i></a></li>
<li class="list-inline-item youtube-play"><a href="#"><i class="ecicon eci-youtube-play"></i></a></li>
<li class="list-inline-item behance"><a href="#"><i class="ecicon eci-behance"></i></a></li>
<li class="list-inline-item whatsapp"><a href="#"><i class="ecicon eci-whatsapp"></i></a></li>
<li class="list-inline-item plus"><a href="#"><i class="ecicon eci-plus"></i></a></li>
</ul>
</div> -->
</div>
</div>
</div>
</div>
</div>
<!--Single product content End -->
<div class="ec-single-pro-tab">
<div class="single-tab">
<button class="tab-button" onclick="openTab('description')">Description</button>
<button class="tab-button" onclick="openTab('review')">Review</button>
</div>
<div id="description" class="tab-content">
<div class="ec-single-pro-tab-desc" id="productDescription">
<?php echo ($product_details["specifications"]); ?>
</div>
</div>
2024-05-21 09:18:10 +08:00
<!-- ?/-------------------------------------------------------------------------------------------------------------------------------------------- -->
2024-02-12 10:35:09 +08:00
<div id="review" class="tab-content">
2024-05-21 09:18:10 +08:00
<!-- <img loading="lazy"
src="https://api.obanana.com/images/storage/web_images/1705042187464-viber_image_2023-12-12_16-04-25-151.png"
alt="" /> -->
<!-- <div id="ec-spt-nav-review" class="tab-pane fade"> -->
<!-- </div> -->
<style>
.rating_con {
height: 100%;
width: 100%;
border-radius: 5px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
}
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
.comments_con {
height: 100%;
width: 100%;
border-radius: 5px;
display: flex;
justify-content: center;
align-items: center;
margin: 10px;
flex-direction: column;
}
.comments_wrap {
height: 100%;
width: 100%;
border-radius: 5px;
display: flex;
justify-content: center;
align-items: center;
margin: 10px;
2024-02-12 10:35:09 +08:00
}
2024-05-21 09:18:10 +08:00
.comment_header {
font-size: 16px;
color: #000;
font-weight: bold;
padding: 10px;
margin: 0px;
}
.comment_card_wrap {
height: 100%;
width: 100%;
border-radius: 5px;
display: flex;
justify-content: center;
align-items: center;
}
.comment_card {
height: auto;
width: 100%;
border-radius: 15px;
display: flex;
align-items: center;
padding: 10px;
background-color: #fff;
border-radius: 10px;
border: 1px solid #eee;
flex-direction: column;
}
.user_info {
display: flex;
width: 100%;
justify-content: space-between;
align-items: center;
flex-direction: row;
padding: 10px;
}
.user_info .left {
display: flex;
width: 70%;
justify-content: flex-start;
align-items: center;
flex-direction: row;
}
.user_info .right {
display: flex;
justify-content: flex-end;
align-items: center;
flex-direction: row;
}
.user_img {
height: 30px;
width: 30px;
border-radius: 100px;
margin: 0px 10px;
}
.user_name {
font-size: 16px;
color: #000;
font-weight: bold;
padding: 10px;
margin: 0px;
}
.rate_star {
display: flex;
justify-content: flex-start;
align-items: center;
flex-direction: row;
padding: 10px;
}
.comment_details {}
.comment_text {}
.comment_media {}
.comment_footer {
width: 100%;
display: flex;
flex-direction: row;
2024-02-12 10:35:09 +08:00
}
2024-05-21 09:18:10 +08:00
</style>
<div class="rating_con">
<div class="comments_con">
<p class="comment_header">
Total Reviews: 20
</p>
<ul class="comments_wrap">
<li class="comment_card_wrap">
<div class="comment_card">
<div class="user_info">
<div class="left">
<img loading="lazy" class="user_img"
src="
https://api.obanana.com/images/storage/web_images/1705042187464-viber_image_2023-12-12_16-04-25-151.png"
alt="" />
<p class="user_name">Juan Dela Cruz</p>
<div class="rate_star">
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star-o"></i>
</div>
</div>
<div class="right">
<p class="date_feedback">
July 23,2023
</p>
</div>
</div>
<div class="comment_details">
<p class="comment_text">Lorem ipsum dolor sit amet
consectetur
adipisicing elit.
Dolor,
facilis nesciunt id perferendis doloremque dolores, amet
laboriosam dolorem beatae sit eius doloribus dolorum
autem
enim
quos in suscipit odit vitae?</p>
<div class="comment_media">
</div>
</div>
</div>
</li>
</ul>
</div>
<!-- <div class="comment_footer">
<div class="gallery-icon">
2024-02-12 10:35:09 +08:00
2024-05-21 09:18:10 +08:00
<label for="file-input" class=""><i class="fa-regular fa-images"></i></label>
<input type="file" class="hide" id="file-input" accept="image/*,video/*">
</div>
<span class="remove-prev hide" id="remove-preview" style=""
aria-hidden="true">&times;</span>
<div id="message-preview" class="hide">
</div>
<textarea type="text" id="message-input" placeholder="Type a message..."></textarea>
<button id="send-btn">SEND</button>
</div> -->
</div>
</div>
</div>
<script>
function openTab(tabName) {
var i, tabContent, tabButtons;
tabContent = document.getElementsByClassName("tab-content");
tabButtons = document.getElementsByClassName("tab-button");
for (i = 0; i < tabContent.length; i++) {
tabContent[i].style.display = "none";
}
for (i = 0; i < tabButtons.length; i++) {
tabButtons[i].classList.remove("active");
2024-02-12 10:35:09 +08:00
}
2024-05-21 09:18:10 +08:00
document.getElementById(tabName).style.display = "block";
event.currentTarget.classList.add("active");
}
// Set "Description" tab as active by default
window.onload = function() {
openTab('description');
};
2024-02-12 10:35:09 +08:00
</script>
<!-- Single product tab start -->
<!-- <div class="ec-single-pro-tab">
<div class="ec-single-pro-tab-wrapper">
<div class="ec-single-pro-tab-nav">
<ul class="nav nav-tabs">
<li class="nav-item">
<a class="nav-link active" data-bs-toggle="tab" data-bs-target="#ec-spt-nav-details" role="tablist">Detail</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" data-bs-target="#ec-spt-nav-info" role="tablist">More Information</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" data-bs-target="#ec-spt-nav-review" role="tablist">Reviews</a>
</li>
</ul>
</div>
<div class="tab-content ec-single-pro-tab-content">
<div id="ec-spt-nav-details" class="tab-pane fade show active">
<div class="ec-single-pro-tab-desc">
<?php echo nl2br($product_details["specifications"]); ?>
</div>
</div>
<div id="ec-spt-nav-info" class="tab-pane fade">
<div class="ec-single-pro-tab-moreinfo">
<ul>
<li><span>Weight</span> 1000 g</li>
<li><span>Dimensions</span> 35 × 30 × 7 cm</li>
<li><span>Color</span> Black, Pink, Red, White</li>
</ul>
</div>
</div>
<div id="ec-spt-nav-review" class="tab-pane fade">
<div class="row">
<div class="ec-t-review-wrapper">
<div class="ec-t-review-item">
<div class="ec-t-review-avtar">
<img loading="lazy" src="assets/images/review-image/1.jpg" alt="" />
2024-02-12 10:35:09 +08:00
</div>
<div class="ec-t-review-content">
<div class="ec-t-review-top">
<div class="ec-t-review-name">Jeny Doe</div>
<div class="ec-t-review-rating">
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star-o"></i>
</div>
</div>
<div class="ec-t-review-bottom">
<p>Lorem Ipsum is simply dummy text of the printing and
typesetting industry. Lorem Ipsum has been the industry's
standard dummy text ever since the 1500s, when an unknown
printer took a galley of type and scrambled it to make a
type specimen.
</p>
</div>
</div>
</div>
<div class="ec-t-review-item">
<div class="ec-t-review-avtar">
<img loading="lazy" src="assets/images/review-image/2.jpg" alt="" />
2024-02-12 10:35:09 +08:00
</div>
<div class="ec-t-review-content">
<div class="ec-t-review-top">
<div class="ec-t-review-name">Linda Morgus</div>
<div class="ec-t-review-rating">
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star-o"></i>
<i class="ecicon eci-star-o"></i>
</div>
</div>
<div class="ec-t-review-bottom">
<p>Lorem Ipsum is simply dummy text of the printing and
typesetting industry. Lorem Ipsum has been the industry's
standard dummy text ever since the 1500s, when an unknown
printer took a galley of type and scrambled it to make a
type specimen.
</p>
</div>
</div>
</div>
</div>
<div class="ec-ratting-content">
<h3>Add a Review</h3>
<div class="ec-ratting-form">
<form action="#">
<div class="ec-ratting-star">
<span>Your rating:</span>
<div class="ec-t-review-rating">
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star-o"></i>
<i class="ecicon eci-star-o"></i>
<i class="ecicon eci-star-o"></i>
</div>
</div>
<div class="ec-ratting-input">
<input name="your-name" placeholder="Name" type="text" />
</div>
<div class="ec-ratting-input">
<input name="your-email" placeholder="Email*" type="email" required />
</div>
<div class="ec-ratting-input form-submit">
<textarea name="your-commemt" placeholder="Enter Your Comment"></textarea>
<button class="btn btn-primary" type="submit" value="Submit">Submit</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div> -->
<!-- product details description area end -->
</div>
<!-- Sidebar Area Start -->
<div class="ec-pro-leftside ec-common-leftside col-lg-3 order-lg-first col-md-12 order-md-last">
<div class="ec-sidebar-wrap">
<!-- Sidebar Category Block -->
<div class="ec-sidebar-block">
<div class="ec-sb-title">
<h3 class="ec-sidebar-title">Discover More Products By Category</h3>
</div>
<div class="ec-sidebar-sub-item">
<ul>
<li>
2024-05-21 09:18:10 +08:00
<div class="ec-sidebar-block-item"><a
href="search_product_action.php?category=Electronics">Electronics</a>
</div>
2024-02-12 10:35:09 +08:00
</li>
<li>
2024-05-21 09:18:10 +08:00
<div class="ec-sidebar-block-item"><a
href="search_product_action.php?category=Solar">Solar</a></div>
2024-02-12 10:35:09 +08:00
</li>
<li>
2024-05-21 09:18:10 +08:00
<div class="ec-sidebar-block-item"><a
href="search_product_action.php?category=E-bike">E-Bike</a></div>
2024-02-12 10:35:09 +08:00
</li>
<li>
2024-05-21 09:18:10 +08:00
<div class="ec-sidebar-block-item"><a
href="search_product_action.php?category=E-vehicle">E-Vehicle</a></div>
2024-02-12 10:35:09 +08:00
</li>
<li>
2024-05-21 09:18:10 +08:00
<div class="ec-sidebar-block-item"><a
href="search_product_action.php?category=Appliance">Appliance</a></div>
2024-02-12 10:35:09 +08:00
</li>
<li>
2024-05-21 09:18:10 +08:00
<div class="ec-sidebar-block-item"><a
href="search_product_action.php?category=Smart Home">Smart Home</a>
</div>
2024-02-12 10:35:09 +08:00
</li>
<li>
2024-05-21 09:18:10 +08:00
<div class="ec-sidebar-block-item"><a
href="search_product_action.php?category=Home">Home</a></div>
2024-02-12 10:35:09 +08:00
</li>
<li>
2024-05-21 09:18:10 +08:00
<div class="ec-sidebar-block-item"><a
href="search_product_action.php?category=Apparell">Apparell</a></div>
2024-02-12 10:35:09 +08:00
</li>
<li>
2024-05-21 09:18:10 +08:00
<div class="ec-sidebar-block-item"><a
href="search_product_action.php?category=Heavy Equipment">Heavy
Equipment</a></div>
2024-02-12 10:35:09 +08:00
</li>
</ul>
</div>
<!-- <div class="ec-sb-block-content">
<ul>
<li>
<div class="ec-sidebar-block-item">clothes</div>
<ul style="display: block;">
<li>
<div class="ec-sidebar-sub-item"><a href="#">Men <span>-25</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Women <span>-52</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Boy <span>-40</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Girl <span>-35</span></a>
</div>
</li>
</ul>
</li>
</ul>
</div>
<div class="ec-sb-block-content">
<ul>
<li>
<div class="ec-sidebar-block-item">shoes</div>
<ul>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Men <span>-25</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Women <span>-52</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Boy <span>-40</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Girl <span>-35</span></a>
</div>
</li>
</ul>
</li>
</ul>
</div>
<div class="ec-sb-block-content">
<ul>
<li>
<div class="ec-sidebar-block-item">bag</div>
<ul>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Men <span>-25</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Women <span>-52</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Boy <span>-40</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Girl <span>-35</span></a>
</div>
</li>
</ul>
</li>
</ul>
</div>
<div class="ec-sb-block-content">
<ul>
<li>
<div class="ec-sidebar-block-item">cosmetics</div>
<ul>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Men <span>-25</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Women <span>-52</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Boy <span>-40</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Girl <span>-35</span></a>
</div>
</li>
</ul>
</li>
</ul>
</div>
<div class="ec-sb-block-content">
<ul>
<li>
<div class="ec-sidebar-block-item">electronics</div>
<ul>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Men <span>-25</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Women <span>-52</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Boy <span>-40</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Girl <span>-35</span></a>
</div>
</li>
</ul>
</li>
</ul>
</div>
<div class="ec-sb-block-content">
<ul>
<li>
<div class="ec-sidebar-block-item">phone</div>
<ul>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Men <span>-25</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Women <span>-52</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Boy <span>-40</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Girl <span>-35</span></a>
</div>
</li>
</ul>
</li>
</ul>
</div>
<div class="ec-sb-block-content">
<ul>
<li>
<div class="ec-sidebar-block-item">accessories</div>
<ul>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Men <span>-25</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Women <span>-52</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Boy <span>-40</span></a>
</div>
</li>
<li>
<div class="ec-sidebar-sub-item"><a href="#">Girl <span>-35</span></a>
</div>
</li>
</ul>
</li>
</ul>
</div> -->
</div>
<!-- Sidebar Category Block -->
</div>
<div class="ec-sidebar-slider">
<div class="ec-sb-slider-title">Best Sellers</div>
<div class="ec-sb-pro-sl">
<div>
<?php
$productBestSellers = simpleProducts("");
$array = array_filter($productBestSellers, function ($var) {
return (fnmatch("Solar*", $var['product_category']) || fnmatch("E-bike*", $var['product_category'])
|| fnmatch("Appliance*", $var['product_category']) || fnmatch("E-Vehicle*", $var['product_category'])
|| fnmatch("Electronics*", $var['product_category']) || fnmatch("Smart Home*", $var['product_category'])
|| fnmatch("Heavy Equipment*", $var['product_category']) || fnmatch("Home*", $var['product_category']));
});
$bestSellers = array_values($array);
for ($x = 0; $x <= 3; $x++) {
$pid = rand(0, count($bestSellers) - 1);
?>
2024-05-21 09:18:10 +08:00
<div class="ec-sb-pro-sl-item">
<a href="product-left-sidebar.php?id=<?php echo $bestSellers[$pid]["_id"]; ?>"
class="sidekka_pro_img"><img loading="lazy"
src="<?php echo $bestSellers[$pid]["product_image"] ?>" alt="product" /></a>
<div class="ec-pro-content">
<h5 class="ec-pro-title"><a
href="product-left-sidebar.php?id=<?php echo $bestSellers[$pid]["_id"]; ?>"><?php echo $bestSellers[$pid]["product_name"] ?></a>
</h5>
<!-- <div class="ec-pro-rating">
2024-02-12 10:35:09 +08:00
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star"></i>
</div> -->
2024-05-21 09:18:10 +08:00
<span class="ec-price">
<?php if (isset($bestSellers[$pid]["sale_price"]) && $bestSellers[$pid]["sale_price"] > 0) : ?>
<span
class="old-price">&#8369;<?php echo number_format($bestSellers[$pid]["regular_price"], 2, ".", ",") ?></span>
<span
class="new-price">&#8369;<?php echo number_format($bestSellers[$pid]["sale_price"], 2, ".", ",") ?></span>
<?php elseif (isset($bestSellers[$pid]["regular_price"]) && $bestSellers[$pid]["regular_price"] != "") : ?>
<span
class="new-price">&#8369;<?php echo number_format($bestSellers[$pid]["regular_price"], 2, ".", ",") ?></span>
<?php elseif ($bestSellers[$pid]["regular_price"] == "" || $bestSellers[$pid]["regular_price"] == null) : ?>
<span class="inquire-text">Inquire</span>
<?php else : ?>
<span class="inquire-text">Inquire</span>
<?php endif; ?>
</span>
2024-02-12 10:35:09 +08:00
</div>
2024-05-21 09:18:10 +08:00
</div>
2024-02-12 10:35:09 +08:00
<?php } ?>
</div>
</div>
</div>
<!-- Sidebar Area Start -->
</div>
</div>
</section>
<!-- End Single product -->
<!-- Related Product Start -->
<section class="section ec-releted-product section-space-p">
<div class="container">
<div class="row">
<div class="col-md-12 text-center">
<div class="section-title">
<h2 class="ec-bg-title">Related products</h2>
<h2 class="ec-title">Related products</h2>
<p class="sub-title">Browse The Collection of Top Products</p>
</div>
</div>
</div>
<div class="row margin-minus-b-30">
<!-- Related Product Content -->
<?php
$array = array_filter($related_products, function ($var) use ($current_category) {
return fnmatch("$current_category*", $var['product_category']);
});
$similar_products = array_values($array);
for ($x = 0; $x < 4 && $x < count($similar_products); $x++) {
$pid = rand(0, count($similar_products) - 1);
#02-21-2024 Stacy added
$vendorOfProduct = getVendorbyId($similar_products[$pid]['vendor_api_id']);
2024-02-12 10:35:09 +08:00
?>
2024-05-21 09:18:10 +08:00
<div class="col-lg-3 col-md-6 col-sm-6 col-xs-6 mb-6 pro-gl-content">
<div class="ec-product-inner">
<div class="ec-pro-image-outer">
<div class="ec-pro-image">
<!-- <a href="shop-left-sidebar-col-4.php" class="image"> -->
<!-- 02-21-2024 Stacy changed link for image -->
<a class="image"
href="product-left-sidebar.php?id=<?php echo $similar_products[$pid]["_id"] ?>">
<img loading="lazy" class="main-image"
src="<?php echo $similar_products[$pid]["product_image"] ?>" />
<img loading="lazy" class="hover-image"
src="<?php echo $similar_products[$pid]["product_image"] ?>" />
</a>
<!-- 02-21-2024 Stacy commented out -->
<!-- <span class="percentage">20%</span> -->
<!-- <a href="#" class="quickview" data-link-action="quickview" title="Quick view" data-bs-toggle="modal" data-bs-target="#ec_quickview_modal"><i class="fi-rr-eye"></i></a> -->
<!-- <div class="ec-pro-actions">
2024-02-12 10:35:09 +08:00
<a href="compare.html" class="ec-btn-group compare" title="Compare"><i class="fi fi-rr-arrows-repeat"></i></a>
<button title="Add To Cart" class="add-to-cart"><i class="fi-rr-shopping-basket"></i> Add To Cart</button>
<a class="ec-btn-group wishlist" title="Wishlist"><i class="fi fi-rr-heart"></i>
</div> -->
2024-05-21 09:18:10 +08:00
<!-- 02-21-2024 Stacy commented out -->
<!-- 02-21-2024 Stacy added -->
<div class="ec-pro-actions" style="bottom: -36px;">
<!-- 02-29-2024 Stacy disabling hover add to cart if there's no price -->
<?php if (isset($similar_products[$pid]["sale_price"]) && $similar_products[$pid]["sale_price"] > 0) : ?>
<button title="Add To Cart"
onclick="popupAddToCart(`<?php echo htmlspecialchars(json_encode($similar_products[$pid]), ENT_QUOTES, 'UTF-8'); ?>`,`<?php echo htmlspecialchars($vendorOfProduct, ENT_QUOTES, 'UTF-8'); ?>`, `<?php echo isset($_SESSION['token']) ? $_SESSION['token'] : ''; ?>` , `<?php echo isset($_SESSION['email']) ? $_SESSION['email'] : ''; ?>` , `<?php echo isset($_SESSION['password']) ? $_SESSION['password'] : ''; ?>` , `<?php echo htmlspecialchars(json_encode($customer_data), ENT_QUOTES, 'UTF-8'); ?>`);"
class="add-to-cart"><i class="fi-rr-shopping-basket"></i> Add To Cart</button>
<a class="ec-btn-group wishlist" title="Wishlist"
onclick="popupWishlist('<?php echo htmlspecialchars(json_encode($similar_products[$pid]), ENT_QUOTES, 'UTF-8'); ?>', '<?php echo htmlspecialchars(json_encode($customer_data), ENT_QUOTES, 'UTF-8'); ?>');"><i
class="fi-rr-heart"></i></a>
2024-05-21 09:18:10 +08:00
<?php elseif (isset($similar_products[$pid]["regular_price"]) && $similar_products[$pid]["regular_price"] != "") : ?>
<button title="Add To Cart"
onclick="popupAddToCart(`<?php echo htmlspecialchars(json_encode($similar_products[$pid]), ENT_QUOTES, 'UTF-8'); ?>`,`<?php echo htmlspecialchars($vendorOfProduct, ENT_QUOTES, 'UTF-8'); ?>`, `<?php echo isset($_SESSION['token']) ? $_SESSION['token'] : ''; ?>` , `<?php echo isset($_SESSION['email']) ? $_SESSION['email'] : ''; ?>` , `<?php echo isset($_SESSION['password']) ? $_SESSION['password'] : ''; ?>` , `<?php echo htmlspecialchars(json_encode($customer_data), ENT_QUOTES, 'UTF-8'); ?>`);"
class="add-to-cart"><i class="fi-rr-shopping-basket"></i> Add To Cart</button>
<a class="ec-btn-group wishlist" title="Wishlist"
onclick="popupWishlist('<?php echo htmlspecialchars(json_encode($similar_products[$pid]), ENT_QUOTES, 'UTF-8'); ?>', '<?php echo htmlspecialchars(json_encode($customer_data), ENT_QUOTES, 'UTF-8'); ?>');"><i
class="fi-rr-heart"></i></a>
<?php else : ($similar_products[$pid]["regular_price"] == "" || $similar_products[$pid]["regular_price"] == null) ?>
<a class="ec-btn-group wishlist" title="Wishlist"
onclick="popupWishlist('<?php echo htmlspecialchars(json_encode($similar_products[$pid]), ENT_QUOTES, 'UTF-8'); ?>', '<?php echo htmlspecialchars(json_encode($customer_data), ENT_QUOTES, 'UTF-8'); ?>');"><i
class="fi-rr-heart"></i></a>
2024-05-21 09:18:10 +08:00
<?php endif; ?>
<!-- 02-29-2024 Stacy disabling hover add to cart if there's no price -->
2024-05-21 09:18:10 +08:00
<!-- <button title="Add To Cart" onclick="popupAddToCart(`<?php echo htmlspecialchars(json_encode($similar_products[$pid]), ENT_QUOTES, 'UTF-8'); ?>`,`<?php echo htmlspecialchars($vendorOfProduct, ENT_QUOTES, 'UTF-8'); ?>`, `<?php echo isset($_SESSION['token']) ? $_SESSION['token'] : ''; ?>` , `<?php echo isset($_SESSION['email']) ? $_SESSION['email'] : ''; ?>` , `<?php echo isset($_SESSION['password']) ? $_SESSION['password'] : ''; ?>` , `<?php echo htmlspecialchars(json_encode($customer_data), ENT_QUOTES, 'UTF-8'); ?>`);" class="add-to-cart"><i class="fi-rr-shopping-basket"></i> Add To Cart</button>
2024-03-07 10:53:15 +08:00
<a class="ec-btn-group wishlist" title="Wishlist" onclick="popupWishlist('<?php echo htmlspecialchars(json_encode($similar_products[$pid]), ENT_QUOTES, 'UTF-8'); ?>', '<?php echo htmlspecialchars(json_encode($customer_data), ENT_QUOTES, 'UTF-8'); ?>');"><i class="fi-rr-heart"></i></a> -->
2024-02-12 10:35:09 +08:00
</div>
2024-05-21 09:18:10 +08:00
<!-- 02-21-2024 Stacy added -->
2024-02-12 10:35:09 +08:00
</div>
2024-05-21 09:18:10 +08:00
</div>
<div class="ec-pro-content">
<!-- 02-21-2024 Stacy updated link for product name -->
<!-- <h5 class="ec-pro-title"><a href="shop-left-sidebar-col-4.php?id=<?php #echo $similar_products[$pid]["_id"]
?>"><?php #echo $similar_products[$pid]["product_name"]
?></a></h5> -->
2024-05-21 09:18:10 +08:00
<h5 class="ec-pro-title"><a
href="product-left-sidebar.php?id=<?php echo $similar_products[$pid]["_id"]; ?>"><?php echo $similar_products[$pid]["product_name"] ?></a>
</h5>
<!-- 02-21-2024 Stacy updated link for product name -->
2024-05-21 09:18:10 +08:00
<!-- 02-20-2024 Stacy commented ratings -->
<!-- <div class="ec-pro-rating">
2024-02-12 10:35:09 +08:00
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star"></i>
</div> -->
2024-05-21 09:18:10 +08:00
<!-- 02-20-2024 Stacy commented ratings -->
<div class="ec-pro-list-desc">Lorem Ipsum is simply dummy text of the printing and
typesetting industry. Lorem Ipsum is simply dutmmy text ever since the 1500s, when an
unknown printer took a galley.</div>
<span class="ec-price">
<!-- 02-20-2024 Stacy added product price in peso -->
<?php if (isset($similar_products[$pid]["sale_price"]) && $similar_products[$pid]["sale_price"] > 0) : ?>
<span
class="old-price">&#8369;<?php echo number_format($similar_products[$pid]["regular_price"], 2, ".", ",") ?></span>
<span
class="new-price">&#8369;<?php echo number_format($similar_products[$pid]["sale_price"], 2, ".", ",") ?></span>
<?php elseif (isset($similar_products[$pid]["regular_price"]) && $similar_products[$pid]["regular_price"] != "") : ?>
<span
class="new-price">&#8369;<?php echo number_format($similar_products[$pid]["regular_price"], 2, ".", ",") ?></span>
<?php elseif ($similar_products[$pid]["regular_price"] == "" || $similar_products[$pid]["regular_price"] == null) : ?>
<span class="inquire-text">Inquire</span>
<?php else : ?>
<span class="inquire-text">Inquire</span>
<?php endif; ?>
<!-- 02-20-2024 Stacy added product price in peso -->
<!-- <span class="old-price">$27.00</span>
<span class="new-price">$22.00</span> -->
2024-05-21 09:18:10 +08:00
</span>
<!-- 02-20-2024 Stacy commented out variations -->
<!-- <div class="ec-pro-option">
2024-02-12 10:35:09 +08:00
<div class="ec-pro-color">
<span class="ec-pro-opt-label">Color</span>
<ul class="ec-opt-swatch ec-change-img">
<li class="active"><a href="#" class="ec-opt-clr-img" data-src="assets/images/product-image/6_1.jpg" data-src-hover="assets/images/product-image/6_1.jpg" data-tooltip="Gray"><span style="background-color:#e8c2ff;"></span></a></li>
<li><a href="#" class="ec-opt-clr-img" data-src="assets/images/product-image/6_2.jpg" data-src-hover="assets/images/product-image/6_2.jpg" data-tooltip="Orange"><span style="background-color:#9cfdd5;"></span></a></li>
</ul>
</div>
<div class="ec-pro-size">
<span class="ec-pro-opt-label">Size</span>
<ul class="ec-opt-size">
<li class="active"><a href="#" class="ec-opt-sz" data-old="$25.00" data-new="$20.00" data-tooltip="Small">S</a></li>
<li><a href="#" class="ec-opt-sz" data-old="$27.00" data-new="$22.00" data-tooltip="Medium">M</a></li>
<li><a href="#" class="ec-opt-sz" data-old="$35.00" data-new="$30.00" data-tooltip="Extra Large">XL</a></li>
</ul>
</div>
</div> -->
2024-05-21 09:18:10 +08:00
<!-- 02-20-2024 Stacy commented out variations -->
2024-02-12 10:35:09 +08:00
</div>
</div>
2024-05-21 09:18:10 +08:00
</div>
2024-02-12 10:35:09 +08:00
<?php
}
?>
</div>
</div>
</section>
<!-- Related Product end -->
2024-02-20 15:01:07 +08:00
2024-02-12 10:35:09 +08:00
<!-- Footer Start -->
<?php include "footer.php" ?>
<!-- Footer Area End -->
<!-- Modal -->
<div class="modal fade" id="ec_quickview_modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<button type="button" class="btn-close qty_close" data-bs-dismiss="modal" aria-label="Close"></button>
<div class="modal-body">
<div class="row">
<div class="col-md-5 col-sm-12 col-xs-12">
<!-- Swiper -->
<div class="qty-product-cover">
<div class="qty-slide">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="img-responsive" src="assets/images/product-image/3_1.jpg"
alt="">
2024-02-12 10:35:09 +08:00
</div>
<div class="qty-slide">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="img-responsive" src="assets/images/product-image/3_2.jpg"
alt="">
2024-02-12 10:35:09 +08:00
</div>
<div class="qty-slide">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="img-responsive" src="assets/images/product-image/3_3.jpg"
alt="">
2024-02-12 10:35:09 +08:00
</div>
<div class="qty-slide">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="img-responsive" src="assets/images/product-image/3_4.jpg"
alt="">
2024-02-12 10:35:09 +08:00
</div>
<div class="qty-slide">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="img-responsive" src="assets/images/product-image/3_5.jpg"
alt="">
2024-02-12 10:35:09 +08:00
</div>
</div>
<div class="qty-nav-thumb">
<div class="qty-slide">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="img-responsive" src="assets/images/product-image/3_1.jpg"
alt="">
2024-02-12 10:35:09 +08:00
</div>
<div class="qty-slide">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="img-responsive" src="assets/images/product-image/3_2.jpg"
alt="">
2024-02-12 10:35:09 +08:00
</div>
<div class="qty-slide">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="img-responsive" src="assets/images/product-image/3_3.jpg"
alt="">
2024-02-12 10:35:09 +08:00
</div>
<div class="qty-slide">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="img-responsive" src="assets/images/product-image/3_4.jpg"
alt="">
2024-02-12 10:35:09 +08:00
</div>
<div class="qty-slide">
2024-05-21 09:18:10 +08:00
<img loading="lazy" class="img-responsive" src="assets/images/product-image/3_5.jpg"
alt="">
2024-02-12 10:35:09 +08:00
</div>
</div>
</div>
<div class="col-md-7 col-sm-12 col-xs-12">
<div class="quickview-pro-content">
2024-05-21 09:18:10 +08:00
<h5 class="ec-quick-title"><a href="shop-left-sidebar-col-4.php">Handbag leather purse
for women</a>
2024-02-12 10:35:09 +08:00
</h5>
<div class="ec-quickview-rating">
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star"></i>
</div>
<div class="ec-quickview-desc">Lorem Ipsum is simply dummy text of the printing and
typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever
since the 1500s,</div>
<div class="ec-quickview-price">
<span class="old-price">$100.00</span>
<span class="new-price">$80.00</span>
</div>
<div class="ec-pro-variation">
<div class="ec-pro-variation-inner ec-pro-variation-color">
<span>Color</span>
<div class="ec-pro-color">
<ul class="ec-opt-swatch">
<li><span style="background-color:#696d62;"></span></li>
<li><span style="background-color:#d73808;"></span></li>
<li><span style="background-color:#577023;"></span></li>
<li><span style="background-color:#2ea1cd;"></span></li>
</ul>
</div>
</div>
<div class="ec-pro-variation-inner ec-pro-variation-size ec-pro-size">
<span>Size</span>
<div class="ec-pro-variation-content">
<ul class="ec-opt-size">
2024-05-21 09:18:10 +08:00
<li class="active"><a href="#" class="ec-opt-sz"
data-tooltip="Small">S</a></li>
2024-02-12 10:35:09 +08:00
<li><a href="#" class="ec-opt-sz" data-tooltip="Medium">M</a></li>
<li><a href="#" class="ec-opt-sz" data-tooltip="Large">X</a></li>
<li><a href="#" class="ec-opt-sz" data-tooltip="Extra Large">XL</a></li>
</ul>
</div>
</div>
</div>
<div class="ec-quickview-qty">
<div class="qty-plus-minus">
<input class="qty-input" type="text" name="ec_qtybtn" value="1" />
</div>
<div class="ec-quickview-cart ">
<button class="btn btn-primary"><i class="fi-rr-heart"></i> Add To Cart</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Modal end -->
<!-- Footer navigation panel for responsive display -->
2024-05-03 16:31:55 +08:00
<!-- <div class="ec-nav-toolbar">
2024-02-12 10:35:09 +08:00
<div class="container">
<div class="ec-nav-panel">
<div class="ec-nav-panel-icons">
<a href="#ec-mobile-menu" class="navbar-toggler-btn ec-header-btn ec-side-toggle"><i class="fi-rr-menu-burger"></i></a>
</div>
<div class="ec-nav-panel-icons">
<a href="#ec-side-cart" class="toggle-cart ec-header-btn ec-side-toggle"><i class="fi-rr-shopping-bag"></i><span class="ec-cart-noti ec-header-count cart-count-lable">3</span></a>
</div>
<div class="ec-nav-panel-icons">
<a href="index.php" class="ec-header-btn"><i class="fi-rr-home"></i></a>
</div>
<div class="ec-nav-panel-icons">
<a href="wishlist.html" class="ec-header-btn"><i class="fi-rr-heart"></i><span class="ec-cart-noti">4</span></a>
</div>
<div class="ec-nav-panel-icons">
<a href="login.php" class="ec-header-btn"><i class="fi-rr-user"></i></a>
</div>
</div>
</div>
2024-05-03 16:31:55 +08:00
</div> -->
2024-02-12 10:35:09 +08:00
<!-- Footer navigation panel for responsive display end -->
<!-- Recent Purchase Popup -->
<!-- 02-20-2024 Stacy commented out -->
<!-- <div class="recent-purchase">
<img loading="lazy" src="assets/images/product-image/1.jpg" alt="payment image">
<div class="detail">
<p>Someone in new just bought</p>
<h6>stylish baby shoes</h6>
<p>10 Minutes ago</p>
</div>
<a href="javascript:void(0)" class="icon-btn recent-close">×</a>
</div> -->
<!-- 02-20-2024 Stacy commented out -->
2024-02-12 10:35:09 +08:00
<!-- Recent Purchase Popup end -->
<!-- Cart Floating Button -->
<div class="ec-cart-float">
<a href="#ec-side-cart" class="ec-header-btn ec-side-toggle">
<div class="header-icon"><i class="fi-rr-shopping-basket"></i>
</div>
<span class="ec-cart-count cart-count-lable">3</span>
</a>
</div>
<!-- Cart Floating Button end -->
2024-05-21 09:18:10 +08:00
2024-02-12 10:35:09 +08:00
<!-- Feature tools -->
<div class="ec-tools-sidebar-overlay"></div>
<div class="ec-tools-sidebar">
<div class="tool-title">
<h3>Features</h3>
</div>
<a href="#" class="ec-tools-sidebar-toggle in-out">
<img loading="lazy" alt="icon" src="assets/images/common/settings.png" />
2024-02-12 10:35:09 +08:00
</a>
<div class="ec-tools-detail">
<div class="ec-tools-sidebar-content ec-change-color ec-color-desc">
<h3>Color Scheme</h3>
<ul class="bg-panel">
<li class="active" data-color="01"><a href="#" class="colorcode1"></a></li>
<li data-color="02"><a href="#" class="colorcode2"></a></li>
<li data-color="03"><a href="#" class="colorcode3"></a></li>
<li data-color="04"><a href="#" class="colorcode4"></a></li>
<li data-color="05"><a href="#" class="colorcode5"></a></li>
</ul>
</div>
<div class="ec-tools-sidebar-content">
<h3>Backgrounds</h3>
<ul class="bg-panel">
<li class="bg"><a class="back-bg-1" id="bg-1">Background-1</a></li>
<li class="bg"><a class="back-bg-2" id="bg-2">Background-2</a></li>
<li class="bg"><a class="back-bg-3" id="bg-3">Background-3</a></li>
<li class="bg"><a class="back-bg-4" id="bg-4">Default</a></li>
</ul>
</div>
<div class="ec-tools-sidebar-content">
<h3>Full Screen mode</h3>
<div class="ec-fullscreen-mode">
<div class="ec-fullscreen-switch">
<div class="ec-fullscreen-btn">Mode</div>
<div class="ec-fullscreen-on">On</div>
<div class="ec-fullscreen-off">Off</div>
</div>
</div>
</div>
<div class="ec-tools-sidebar-content">
<h3>Dark mode</h3>
<div class="ec-change-mode">
<div class="ec-mode-switch">
<div class="ec-mode-btn">Mode</div>
<div class="ec-mode-on">On</div>
<div class="ec-mode-off">Off</div>
</div>
</div>
</div>
<div class="ec-tools-sidebar-content">
<h3>RTL mode</h3>
<div class="ec-change-rtl">
<div class="ec-rtl-switch">
<div class="ec-rtl-btn">Rtl</div>
<div class="ec-rtl-on">On</div>
<div class="ec-rtl-off">Off</div>
</div>
</div>
</div>
<div class="ec-tools-sidebar-content">
<h3>Clear local storage</h3>
<a class="clear-cach" href="javascript:void(0)">Clear Cache & Default</a>
</div>
</div>
</div>
<!-- Feature tools end -->
<!-- Vendor JS -->
<script src="assets/js/vendor/jquery-3.5.1.min.js"></script>
<script src="assets/js/vendor/popper.min.js"></script>
<script src="assets/js/vendor/bootstrap.min.js"></script>
<script src="assets/js/vendor/jquery-migrate-3.3.0.min.js"></script>
<script src="assets/js/vendor/modernizr-3.11.2.min.js"></script>
<!--Plugins JS-->
<script src="assets/js/plugins/swiper-bundle.min.js"></script>
<script src="assets/js/plugins/countdownTimer.min.js"></script>
<script src="assets/js/plugins/scrollup.js"></script>
<script src="assets/js/plugins/jquery.zoom.min.js"></script>
<script src="assets/js/plugins/slick.min.js"></script>
<script src="assets/js/plugins/infiniteslidev2.js"></script>
<script src="assets/js/vendor/jquery.magnific-popup.min.js"></script>
<script src="assets/js/plugins/jquery.sticky-sidebar.js"></script>
<!-- Main Js -->
<script src="assets/js/vendor/index.js"></script>
<script src="assets/js/main.js"></script>
<script src="assets/js/newjs.js"></script>
<!-- 02-21-2024 Stacy added js link -->
<?php
if ($_SESSION["is_test"] == true) {
echo '<script src="assets/js/tester11.js"></script>';
} else {
echo '<script src="assets/js/produc3.js"></script>';
}
?>
<!-- 02-21-2024 Stacy added js link -->
2024-02-12 10:35:09 +08:00
</body>
</html>