BLACKSITE


	: 216.73.217.4
	: 104.37.75.190 / alpenpass.ca
	: Linux server3.pointsplan.com 5.14.0-503.38.1.el9_5.x86_64 #1 SMP PREEMPT_DYNAMIC Fri Apr 18 08:52:10 EDT 2025 x86_64
: /home/apca/public_html/
files >> /home/apca/public_html/product-details.php
 <?php 
session_start();

include('includes/config.php');


$head.="
<style>
    .imageBox {
        position: relative;
        max-height: 400px;
        text-align: center;
    }

    .imageBox img {
        display: block;
        margin: 0 auto;
        object-fit: contain;
        max-height: 400px;
        width: auto;
    }

    .arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        font-size: 6rem;
        cursor: pointer;
        color: #333;
        user-select: none;
        z-index: 100;
    }

    .arrow.left {
        left: 10px;
    }

    .arrow.right {
        right: 10px;
    }

    .thumbnail-container {
        display: flex;
        justify-content: center; /* Center thumbnails */
        gap: 10px; /* Space between thumbnails */
        overflow-x: auto; /* Enable horizontal scrolling */
        padding: 10px 0;
        scroll-behavior: smooth; /* Smooth scrolling for better UX */
        margin-top: 50px !important;
    }

    .thumbnail-container::-webkit-scrollbar {
        height: 8px; /* Adjust scrollbar height */
    }

    .thumbnail-container::-webkit-scrollbar-thumb {
        background-color: #ccc; /* Scrollbar color */
        border-radius: 4px;
    }

    .thumbnail-container img {
        cursor: pointer;
        flex: 0 0 auto; /* Prevent shrinking */
        max-width: 100px;
        max-height: 80px;
        object-fit: cover;
        border: 2px solid transparent;
        transition: border-color 0.3s;
    }

    .thumbnail-container img:hover {
        border-color: #007bff;
    }


.imageStyle{
    
    width: 100%;
    object-fit: contain; 
    min-height: 450px;
}
#rateList .currency{
    text-align:right;
}

#rateList td{
    font-weight: bold;
}

   .error-message {
            color: red;
            font-size: 0.9em;
            margin-top: 5px;
            display: none;
            position: relative; /* changed from absolute to relative */
        }
        .form-group {
            position: relative;
            margin-bottom: 20px;
        }
        .form-group.has-error {
            margin-bottom: 40px; /* Increase margin when error is shown */
        }
    </style>";

include("includes/head.php");
include("includes/header.php");



$phid=intval($_GET['phid']);






$sql = "SELECT tblproducts.*,tblbrands.BrandName,tblbrands.id as bid  from tblproducts join tblbrands on tblbrands.id=tblproducts.ProductsBrnd where tblproducts.id=:phid";
$query = $dbh -> prepare($sql);
$query->bindParam(':phid',$phid, PDO::PARAM_STR);
$query->execute();
$results=$query->fetchAll(PDO::FETCH_OBJ);
$cnt=1;
if($query->rowCount() > 0)
{
foreach($results as $result)
{  
$_SESSION['brndid']=$result->bid;  
?>  
<?php
/**	
<section id="listing_img_slider">
  <div class="imageBox" ><img src="admin/img/productimages/<?php echo htmlentities($result->Pimage1);?>" class="img-responsive imageStyle" alt="image"  ></div>
  <div   class="imageBox" ><img src="admin/img/productimages/<?php echo htmlentities($result->Pimage2);?>" class="img-responsive imageStyle" alt="image" ></div>
  <div  class="imageBox" ><img src="admin/img/productimages/<?php echo htmlentities($result->Pimage3);?>" class="img-responsive imageStyle" alt="image" ></div>
  <div class="imageBox" ><img src="admin/img/productimages/<?php echo htmlentities($result->Pimage4);?>" class="img-responsive imageStyle"  alt="image"  ></div>
  <?php if($result->Pimage5=="")
{

} else {
  ?>
  <div class="imageBox" ><img src="admin/img/productimages/<?php echo htmlentities($result->Pimage5);?>" class="img-responsive  imageStyle" alt="image" style="object-fit: cover; min-height: 450px;"></div>
  <?php } ?>
</section>
<!--/Listing-Image-Slider-->
*/
?>
<section>
    <div class="container" style="width: 90vw !important;">
        <!-- Primary Image with Arrows -->
        <div class="imageBox">
            <div class="arrow left" id="prevImage">&lt;</div>
            <img id="primaryImage" src="admin/img/productimages/<?php echo htmlentities($result->Pimage1); ?>" 
                 class="img-responsive imageStyle" alt="Primary Image">
            <div class="arrow right" id="nextImage">&gt;</div>
        </div>

        <!-- Scrollable Thumbnails -->
        <div class="thumbnail-container">
            <?php 
            $images = [];
            for ($i = 1; $i <= 10; $i++) { // Increased loop to include Pimage1 to Pimage10
                $imageField = "Pimage" . $i;
                if (!empty($result->$imageField)) {
                    $images[] = "admin/img/productimages/" . htmlentities($result->$imageField);
                    echo '<img src="admin/img/productimages/' . htmlentities($result->$imageField) . '" 
                          class="thumbnail" 
                          alt="Thumbnail ' . $i . '" 
                          data-index="' . (count($images) - 1) . '">';
                }
            }
            ?>
        </div>
    </div>
</section>
<!--Listing-detail-->
<section class="listing-detail">
  <div class="container"  style="width:90vw !important;">
  
  <?php
	if($rateName){
?>
  <div style="padding: 50px; text-align:center; border-radius: 20px; background-color: #FFFF99;"><?php echo $rateName; ?></div></div>
  <?php } ?>
  
  
  
    <div class="listing_detail_head row">
      <div class="col-md-9">
        <h1><?php 
        $productName=  htmlentities($result->BrandName)." ".htmlentities($result->ProductsTitle);
        
        echo $productName
        ?></h1>
        
        <input type="hidden" name="ProductsGSTRate" value="<?php echo $result->ProductsGSTRate; ?>"/>
        <input type="hidden" name="ProductsPSTRate" value="<?php echo $result->ProductsPSTRate; ?>"/>
        
        
        
        
        
        
        
        
      </div>

    </div>
    <div class="row">
      <div class="col-md-9">

        <div class="listing_more_info" style="padding-top: 0px;">
          <div class="listing_detail_wrap"> 
            <!-- Nav tabs -->
            <ul class="nav nav-tabs gray-bg" role="tablist">
              <li role="presentation" class="active"><a href="#product-overview " aria-controls="product-overview" role="tab" data-toggle="tab">Product Overview </a></li>
          
              <!--
<li role="presentation"><a href="#accessories" aria-controls="accessories" role="tab" data-toggle="tab">Specifications</a></li>
-->
            </ul>
            
            <!-- Tab panes -->
            <div class="tab-content"> 
              <!-- product-overview -->
              <div role="tabpanel" class="tab-pane active" id="product-overview">
                
                <?php echo $result->ProductsOverview;?>
              </div>
              
              
              <!-- Accessories -->
              <div role="tabpanel" class="tab-pane" id="accessories"> 
                <!--Accessories-->
                <table>
                  <thead>
                    <tr>
                      <th colspan="2">Specifications</th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr>

                    <?php
$specs=array("ProductsTitle",	"ProductsBrand",	"EngineType",	"ModelYear",	"EngineCapacity",	"GasTankCapacity",	"Range1",	"horsepower",	"transmission",	"Usage1",	"Passenger",	"LicenseType",	"Weight",	"RiderExperience",	"ABS",	"model");

foreach($specs as $value){
?>
                    
       <td><?php echo  trim(ucwords(preg_replace('/(?<!^)([A-Z])/', ' \\1', $value)),"1");?></td>              
                    
                    
                    
                    
                <td><?php echo $result->$value; ?></i></td>
 </tr>
<?php } ?>


                  </tbody>
                </table>
              </div>
            </div>
          </div>
          
        </div>
<?php }} ?>
   
      </div>
      
      <!--Side-Bar-->
      <aside class="col-md-3">

        <div class="price_info">
        <form method="post" action="add_to_cart.php">
        <input type="hidden" name="ProductName" value="<?php echo $productName;?>"/><input type="hidden" name="productID" value="<?php echo $result->id?>"/>
        <table id="rateList">
        <th colspan="3" style="background-color: #000; font-size:24px; color:#fff;">PRICE</th>
        <tr>
          <?php
          echo"<td colspan='2'><div style='font-size: 48px; font-weight:bold; text-align: center;'>".number_format(htmlentities($result->ProductsRetail),2)."</div></td></tr>";
        
        echo"<input type='hidden' name='price' value='".$result->ProductsRetail."'>";
        
        
      
	$rateList=array(" Model Number"=>"ProductsModelNumber","Category"=>"ProductsCategory","Size"=>"ProductsSize",	"Color"=>"ProductsColor","Weight"=>"ProductsWeight","UPC"=>"ProductsUPC");
    
    foreach($rateList as $key=>$value){
        
        if(!$result->seasonal_discount){continue;}
        
        $percentSymbol=($rate=="seasonal_discount" AND $result->seasonal_discount>0)? "%" : "";
        
      //  $chooseRate=($rate=="seasonal_discount" AND $result->seasonal_discount>0)? "" : "<input type='radio' name='bookingRate' value='".$result->$rate."' required >";
        
        
        
        echo"<td>".ucwords(str_replace("_"," ",preg_replace('/(?<!^)([A-Z])/', ' \\1', $key)))."$addAsterisk</td><td class='currency'>".$result->$value."$percentSymbol </td></tr>
        <input type='hidden' name ='$key' value='".$result->$value."'>";
        
        
        
    }
    
    
    
?>
        
        </table>
<p>PST and GST are extra</p>

        </div>
<?php
	/**
        <div class="share_product">
          <p>Share: <a href="#"><i class="fa fa-facebook-square" aria-hidden="true"></i></a> <a href="#"><i class="fa fa-twitter-square" aria-hidden="true"></i></a> <a href="#"><i class="fa fa-linkedin-square" aria-hidden="true"></i></a> <a href="#"><i class="fa fa-google-plus-square" aria-hidden="true"></i></a> </p>
        </div>
        */
?>

        <div class="sidebar_widget">
          
         <?php
	if($_SESSION['login']){?>
	   
       
      <div style="display: inline;"></div>Quantity: &nbsp;&nbsp;&nbsp;<select name="quantity" class="form-control" style="display: inline; width: 40%; margin-bottom: 10px;;">
       <?php
	for($q=1; $q<=12; $q++){

     echo "<option value='$q'>$q</option>";
       } ?>
       </select>

     <?php       }
           
           
	// <div class="form-group">
//              <textarea rows="4" class="form-control" name="message" placeholder="Message" required></textarea>
//            </div>
?>
          <?php if($_SESSION['login'])
              {?>
              <div class="form-group">
                <input type="submit" class="btn btn-md"  name="submit" value="Add to Cart">
               
              </div>
              <?php } else { ?>
<a href="#loginform" class="btn btn-md uppercase" data-toggle="modal" data-dismiss="modal" style="font-size: 14px !important;">Login or Create Account to Buy</a>

              <?php } ?>
          </form>
          
        </div>
      </aside>
      <!--/Side-Bar--> 
    </div>
    
    <div class="space-20"></div>
    <div class="divider"></div>
    
    <!--Similar-Products-->
    <div class="similar_cars">
      <h3>Similar Products</h3>
      <div class="row">
<?php 
$bid=$result->ProductsCategory;

$sql="SELECT tblproducts.ProductsTitle,tblproducts.ProductsCategory,tblproducts.ProductsModelNumber,tblproducts.ProductsSize,tblproducts.ProductsColor,tblproducts.id,tblproducts.ProductsOverview,tblproducts.ProductsRetail,tblproducts.Pimage1 from tblproducts where tblproducts.ProductsCategory=:bid  AND tblproducts.status='Active'  LIMIT 4"; 




$query = $dbh -> prepare($sql);
$query->bindParam(':bid',$bid, PDO::PARAM_STR);
$query->execute();
$results=$query->fetchAll(PDO::FETCH_OBJ);
$cnt=1;
if($query->rowCount() > 0)
{  
foreach($results as $result)
{ ?>      
        <div class="col-md-3 grid_listing">
          <div class="product-listing-m gray-bg">
            <div class="product-listing-img"> <a href="product-details.php?phid=<?php echo htmlentities($result->id);?>"><img src="admin/img/productimages/<?php echo htmlentities($result->Pimage1);?>" class="img-responsive" alt="image" style="width:100%;    height:100%;    object-fit: contain;    overflow: hidden;"/> </a>
            </div>
            <div class="product-listing-content">
              <h3 ><a href="vehical-details.php?phid=<?php echo htmlentities($result->id);?>" style="color: #000;"><?php echo htmlentities($result->BrandName);?> <?php echo htmlentities($result->ProductsTitle);?></a></h3>
              <p class="list-price"><span style="font-size:  12px; font-weight:normal;"></span>$<?php echo htmlentities($result->ProductsRetail);?></p>
          
              <ul class="features_list">
                
             <li><i class="fa fa-user" aria-hidden="true"></i> Size: <?php echo htmlentities($result->ProductsSize);?></li>
                <li><i class="fa fa-calendar" aria-hidden="true"></i>Color: <?php echo htmlentities($result->ProductsColor);?> </li>
                <li style="width: 100% !important;"><i class="fa fa-motorcycle" aria-hidden="true"></i>Model #: <?php echo htmlentities($result->ProductsModelNumber);?></li>
              </ul>
            </div>
          </div>
        </div>
 <?php }} ?>       

      </div>
    </div>
    <!--/Similar-Motorcycles--> 
    
  </div>
</section>
<!--/Listing-detail--> 

<!--Footer -->
<?php include('includes/footer.php');?>
<!-- /Footer--> 

<!--Back to top-->
<div id="back-top" class="back-top"> <a href="#top"><i class="fa fa-angle-up" aria-hidden="true"></i> </a> </div>
<!--/Back to top--> 

<!--Login-Form -->
<?php include('includes/login.php');?>
<!--/Login-Form --> 

<!--Register-Form -->
<?php include('includes/registration.php');?>

<!--/Register-Form --> 

<!--Forgot-password-Form -->
<?php include('includes/forgotpassword.php');?>

<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script> 
<script src="assets/js/interface.js"></script> 
<script src="assets/switcher/js/switcher.js"></script>
<script src="assets/js/bootstrap-slider.min.js"></script> 
<script src="assets/js/slick.min.js"></script> 
<script src="assets/js/owl.carousel.min.js"></script>
 <script>
        $(document).ready(function () {
            function validateDates() {
                const pickupDateTime = new Date($('#pickupDateTime').val());
                const dropoffDateTime = new Date($('#dropoffDateTime').val());
                let isValid = true;

                // Hide any previous error messages
                $('.error-message').hide();
                $('.form-group').removeClass('has-error'); // Reset additional spacing

                // Check if the pickup date is later than the dropoff date
                if (pickupDateTime && dropoffDateTime && pickupDateTime > dropoffDateTime) {
                    $('#pickupError').show(); // Show error message near pickup date
                    $('#pickupGroup').addClass('has-error'); // Add spacing to avoid overlap
                    isValid = false;
                }

                return isValid;
            }

            $('#pickupDateTime, #dropoffDateTime').on('change', validateDates);

            $('#rentalForm').on('submit', function (e) {
                if (!validateDates()) {
                    e.preventDefault(); // Prevent form submission if dates are invalid
                }
            });
        });
    </script>
  
<script>
    // JavaScript to handle image switching
    const images = <?php echo json_encode($images); ?>;
    let currentIndex = 0;

    const primaryImage = document.getElementById('primaryImage');
    const thumbnails = document.querySelectorAll('.thumbnail');
    const prevImage = document.getElementById('prevImage');
    const nextImage = document.getElementById('nextImage');

    // Update the primary image and highlight the active thumbnail
    function updateImage(index) {
        currentIndex = index;
        primaryImage.src = images[currentIndex];

        // Highlight the active thumbnail
        thumbnails.forEach((thumb, idx) => {
            thumb.style.borderColor = idx === currentIndex ? '#007bff' : 'transparent';
        });
    }

    // Event listeners for navigation arrows
    prevImage.addEventListener('click', () => {
        const newIndex = (currentIndex - 1 + images.length) % images.length;
        updateImage(newIndex);
    });

    nextImage.addEventListener('click', () => {
        const newIndex = (currentIndex + 1) % images.length;
        updateImage(newIndex);
    });

    // Event listeners for thumbnails
    thumbnails.forEach((thumbnail, index) => {
        thumbnail.addEventListener('click', () => {
            updateImage(index);
        });
    });

    // Initialize the first image
    updateImage(0);
</script>
</body>
</html>