<?php 
if(!isset($_SESSION)) { 
  session_start(); 
  include('includes/dbcon.php');
}

$sql = "SELECT item_id,item_name, description, sales_price,image_path FROM item_master WHERE active_status = 1";
$result1 = mysqli_query($con, $sql);



$query=mysqli_query($con,"SELECT * from company_master")or die(mysqli_error()); 
 while($row=mysqli_fetch_array($query)){  
     $rcount=$rcount+1;
     $cost_name=$row['cost_name'];
     $telephone=$row['telephone'];
     $email=$row['email'];
 }
 
 
 
 /////product searching
 
 // Default query for fetching all active items
$sql = "SELECT item_id, item_name, description, sales_price, image_path FROM item_master WHERE active_status = 1";

// Check if there is a search term and modify the query to filter the results
if (isset($_GET['search']) && !empty($_GET['search'])) {
    $search_term = mysqli_real_escape_string($con, $_GET['search']);
    $sql .= " AND (item_name LIKE '%$search_term%' OR description LIKE '%$search_term%')";
}

$result1 = mysqli_query($con, $sql);

?>


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Product Catalog</title>
    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- Font Awesome for icons -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">


    <!-- jQuery (Required for Bootstrap 4) -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <!-- Libraries Stylesheet -->
    <!-- Libraries Stylesheet -->
    <link href="lib/animate/animate.min.css" rel="stylesheet">
    <link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">


    <!-- Custom CSS -->
    <link rel="stylesheet" href="styles.css">
    
</head>
<body>

 <?php include('header.php');?>

    <main class="container my-5">
        <div class="row">
            <div class="col-12">
                <h1>Welcome to Our Product Catalog</h1>
                <p>This is a sample product catalog page. You can add your products here.</p>
            </div>
        </div>
    </main>

 <!-- Product Listing Section -->
   <!-- Product Listing Section -->
<div class="container mt-4">
    <div class="product-listing">
        <?php while ($row1 = mysqli_fetch_assoc($result1)) { ?>
            <div class="product">
                <div class="product-image">
    
 <img src="../pages/uploads/<?php echo htmlspecialchars($row1['image_path']); ?>" alt="<?php echo htmlspecialchars($row1['item_name']); ?>">


    <!-- Hover Icons -->
    <div class="hover-icons">
        <i class="fas fa-heart"></i>        
            <i class="fas fa-eye"></i>       
         <a href="#" class="text-decoration-none toggle-cart" data-id="<?php echo $row1['item_id']; ?>">
    <i class="fas fa-shopping-cart"></i>
</a>

    </div>
</div>
                <h3><?php echo htmlspecialchars($row1['item_name']); ?></h3>
                <p><?php echo htmlspecialchars($row1['description']); ?></p>
                <p><strong>Price:</strong> Rs. <?php echo number_format($row1['sales_price'], 2); ?></p>


                <!-- Quantity and Add to Cart (Initially Hidden) -->
<div class="add-to-cart-form" id="cart-form-<?php echo $row1['item_id']; ?>" style="display: none; margin-top: 10px; text-align: center;">
    <label for="quantity-<?php echo $row1['item_id']; ?>" class="form-label">Quantity:</label>
    <input type="number" id="quantity-<?php echo $row1['item_id']; ?>" class="form-control quantity-input" min="1" value="1" style="width: 100px; margin-bottom: 5px;">
    <input type="hidden" id="image-<?php echo $row1['item_id']; ?>" value="<?php echo htmlspecialchars($row1['image_path']); ?>">
    <button class="add-to-cart-btn btn btn-success" data-id="<?php echo $row1['item_id']; ?>">
        <i class="fas fa-shopping-cart"></i> Add to Cart
    </button>
</div>
<!-- End of  Quantity and Add to Cart-->
            </div>
        <?php } ?>
    </div>
</div>
        <!-- Add more products as needed -->
    </div>


    <!-- Main Content Section -->
   

    <!-- Bootstrap JS and dependencies -->
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

</body>
</html>

<script>
document.addEventListener('click', function (event) {
    const dropdowns = document.querySelectorAll('.dropdown-menu');
    dropdowns.forEach(dropdown => {
        if (!event.target.closest('.dropdown')) {
            dropdown.classList.remove('show');
        }
    });
});
</script>


<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
    // Show quantity input when clicking on product image
    $(".product-click").click(function() {
        var item_id = $(this).data("id");
        $("#cart-form-" + item_id).toggle(); // Toggle visibility
    });

    // Add to Cart Click Event
    $(".add-to-cart-btn").click(function() {
        var item_id = $(this).data("id");
        var quantity = $("#quantity-" + item_id).val();
         //var image_path = $("#image-" + item_id).val(); 
        //alert(image_path);
        $.ajax({
            url: "add_to_cart.php",
            type: "POST",
            data: { item_id: item_id, quantity: quantity  },
            success: function(response) {
                alert("Added " + quantity + " item(s) to cart!");
                // Hide the form after adding to the cart
                $("#cart-form-" + item_id).hide();
            },
            error: function() {
                alert("Failed to add item.");
            }
        });
    });
});
</script>




<script>
$(document).ready(function() {
    $(".product-click, .toggle-cart").click(function(event) {
        event.preventDefault(); // Prevent default action if needed
        var productId = $(this).data("id");
        $("#cart-form-" + productId).toggle();
    });
});
</script>
