<?php
session_start();
$status="";
if (isset($_POST['action']) && $_POST['action']=="remove"){
if(!empty($_SESSION["shopping_cart"])) {
	foreach($_SESSION["shopping_cart"] as $key => $value) {
		if($_POST["code"] == $key){
		unset($_SESSION["shopping_cart"][$key]);
		$status = "<div class='delete-box'> Product successfully  removed from in your cart !</div>";
		}
		if(empty($_SESSION["shopping_cart"]))
		unset($_SESSION["shopping_cart"]);
			}		
		}
}

if (isset($_POST['action']) && $_POST['action']=="change"){
  foreach($_SESSION["shopping_cart"] as &$value){
    if($value['code'] === $_POST["code"]){
        $value['quantity'] = $_POST["quantity"];
        break; // Stop the loop after we've found the product
    }
}
  	
}
?>

<html lang="en">
<head>
    <link rel="icon" type="image/png" href="images/logo.png"/>
    <title>Aberdare Hardware - Affordable General hardware tools and Equipments under one roof</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  <link rel="preconnect" href="https://fonts.gstatic.com">
  <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;900&display=swap" rel="stylesheet">

</head>
<style type="text/css">
* {  box-sizing: border-box; }
body {  background-image: linear-gradient(to right,whitesmoke, whitesmoke);  margin: 0; font-family: "Nunito", sans-serif; }

.header{ background:white; padding: 5px;  width: 100%; border-bottom: 2px solid whitesmoke;   }
.col-cart-a { float: left; background: white;  width: 60%; padding: 15px; margin-bottom:3%;}
.col-cart-b { float: left;  width: 40%; padding: 15px; margin-bottom:3%;}
.col-cart-bb { background: white;  padding: 15px; width: 100%; border-bottom: 2px solid #006A4E;}

.delete-box { width: 100%; float: left; padding: 15px ; font-size: small; color: red; }
span {  background: orange; padding:10px; border-radius: 50%;  font-weight: bold; font-size: small; font-size: x-small; color: white; }
.shop-cart {float: right; color: orange;}
.cart-section {float: left; padding: 15px; font-size: small; width: 100%; border:  1px solid orange; background: whitesmoke; border-radius: 5px; color: gray; font-weight: bold; margin-bottom: 2%;}
.body-d { width: 97%; margin: auto;}
.footer { background: #36454F;   width: 100%; float: left; color:#F5F5F5 ; border-top: 0px solid white; margin-top: 10%;}
/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

td {  padding:4px;border-bottom: 1px solid #ddd !important; font-size: xx-small; }

th {  padding:10px;border: 1px solid #ddd !important;  white; opacity: .8;text-align: left;  font-size:x-small; border-spacing: 1; background:  whitesmoke; color:#006A4E;  padding:7px; font-weight: bold;}

table { margin: auto; border-spacing: 1; width:100%;  overflow-x: auto;  background: white;  }

.table-1{overflow-x: auto; scrollbar-width: thin; float: left; width: 100%;}

.remove { background: none; border: none; font-size: x-small; color: red; text-decoration: none;  margin-top: 5%;}

.msg-box { float: left; width: 100%; background: white; padding: 10px; font-size: x-small; color: red; border: 1px solid whitesmoke; border-radius: 4px; margin-bottom: 1%;  }
.get-total { text-align: right; font-weight: bold; font-size:small; padding:8px;  }

.cart{ width: 90%; margin: auto; padding: 15px; }

.btn-continue-shopping { float: left; color: #006A4E; background: none; padding: 10px; border:1px solid  #006A4E; border-radius: 5px; margin-top: 3%;}
.btn-continue-shopping:hover { background: whitesmoke; }

.form-billing { padding: 15px; }

.form-billing input[type=text], .form-billing select { border-radius: 5px; background: whitesmoke;
  width: 100%;  padding: 13px;  margin: 5px 0 22px 0;  border: none;   border:  1px solid  #f1f1f1;
}
.form-billing label { font-size:small; margin-left: 1%; }

.col-cart-bb h4 {color: gray; font-size: small;}

.form-billing input[type=submit]{ background:#006A4E; float: right; padding: 10px; border: none; color: white;border-radius: 3px; }

.form-billing input[type=text]:focus{ background-color: white; border: 1px solid #006A4E; outline: none;}

.form-billing input[type=submit]:hover { opacity: .8; }

.fa-user { margin-right: 5%; }

@media screen and (max-width:1000px) {
  body{font-size: small;}
.header{padding: 1px;  width: 100%; position: fixed; z-index: 1;  }
.wrapper {width: 100%;}
.a-footer {margin-top: 0%; }
.cart { width: 95%;  }
.col-cart-a { width: 100%; height: auto; margin-top: 20%; }
.col-cart-b { width: 100%; height: auto; }



}

</style>
<body>
<div class="header"><?php include("header.php"); ?></div>

<nav class="cart">

<div class="col-cart-a" >
<?php
if(!empty($_SESSION["shopping_cart"])) {
$cart_count = count(array_keys($_SESSION["shopping_cart"]));
?>
<div class="cart-section">
<a>  <i class="fa fa-shopping-cart shop-cart"></i>  <span><?php echo $cart_count; ?></span> items in cart </a>
</div>

<?php
}
?>

<div class="message_box" style="margin:10px 0px;">
<?php echo $status; ?>
</div>



<div class="table-1">
<?php
if(isset($_SESSION["shopping_cart"])){
    $total_price = 0;
?>	
<table>
<tbody>
<tr>
<th>Item </th>
<th>Name</th>
<th>Size</th>
<th>Quantity</th>
<th>Unit Price</th>
<th>Total Price</th>
</tr> 
<?php		
foreach ($_SESSION["shopping_cart"] as $product){
?>
<tr>
<td><img src='product-images/<?php echo $product["image"]; ?>' width="50" height="40" /></td>
<td><?php  echo $product["name"]; ?>

<form method='post' action=''>
<input type='hidden' name='code' value="<?php echo $product["code"]; ?>" />
<input type='hidden' name='action' value="remove" />
<button type='submit' class='remove'> <i class="fa fa-close"></i> Remove Item</button>
</form>
</td>
<td><?php echo $product["size"]; ?><br />
<td>
<form method='post' action=''>
<input type='hidden' name='code' value="<?php echo $product["code"]; ?>" />
<input type='hidden' name='action' value="change" />
<select name='quantity' class='quantity' onchange="this.form.submit()">
<option <?php if($product["quantity"]==1) echo "selected";?> value="1">1</option>
<option <?php if($product["quantity"]==2) echo "selected";?> value="2">2</option>
<option <?php if($product["quantity"]==3) echo "selected";?> value="3">3</option>
<option <?php if($product["quantity"]==4) echo "selected";?> value="4">4</option>
<option <?php if($product["quantity"]==5) echo "selected";?> value="5">5</option>
</select>
</form>
</td>
<td><?php echo "Ksh ".$product["price"]; ?></td>
<td><?php echo "Ksh ".$product["price"]*$product["quantity"]; ?></td>
</tr>
<?php
$total_price += ($product["price"]*$product["quantity"]);
}
?>
<tr>
<td colspan="6"  class="get-total">
<strong> <a style="margin-right: 10%;">GRAND TOTAL: <?php echo "Ksh ".$total_price; ?> /= </a></strong>
</td>
</tr>
</tbody>
</table>		
  <?php
}else{
	echo "<h3>Your cart is empty!</h3>";
	}
?>

<button  onclick="location.href = 'index.php'; return false;" class="btn-continue-shopping"> <i class="fa fa-arrow-left"></i> Continue Shopping</button>

</div>
</div>

<div class="col-cart-b"> 
  <nav class="col-cart-bb">
  <center><h4> <i class="fa fa-user"></i> Complete the following to place an order  </h4>  </center>
  <form class="form-billing" method="post" action="">
    <input type="text" name="customer" placeholder="Full name eg. Joseph Doe" required >
    <input type="text" name="phone" id="name" onFocus="this.value = '';" onBlur="if (this.value == '') 
{this.value = '07*******';}" required pattern="[0-9]{9,10}"
  placeholder="Your phone no">
    <input type="text" name="residence" placeholder="Place of Residence eg. Thika, Kiganjo" required >
    <input type="text" name="delivery_point" placeholder="Delivery Point e.g Home, Runda" required >
    <label>Select mode of Payment</label>
  <select name ="mode">
      <option>On Delivery</option>
      <option>MPESA</option>
    </select>

    <input type="submit" name="order" value="ORDER NOW">

  </form>


<?php
 include 'inc/config.php'; 

if (isset($_POST["order"])) { 
$customer = $_POST['customer' ];
$phone=$_POST['phone'];  $residence= $_POST['residence'];  $delivery_point= $_POST['delivery_point']; $mode= $_POST['mode'];
$receipt = uniqid('Order-');  $amount = $total_price;
 

foreach($_SESSION["shopping_cart"] as $product) {
 $name = $product["name"];  $code = $product["code"];  $size = $product["size"];    $quantity = $product["quantity"];  
 $price = $product["price"]; $total_price = $price *  $quantity; 
$sql_1 = "INSERT INTO ordered_items ( code, name, size,quantity, price, total_price, receipt_no) 
            VALUES ('$code', '$name', '$size', '$quantity', '$price' , '$total_price', '$receipt')";

$db->query($sql_1);       
}

$sql = "INSERT INTO orders ( customer, phone, residence, delivery_point,amount, mode, receipt_no) 
            VALUES ('$customer', '$phone', '$residence', '$delivery_point', '$amount' , '$mode', '$receipt')";

           

if ( ($db->query($sql) === TRUE)  ) {

 echo "<script type= 'text/javascript'>alert('[ $customer ] we have received your order, you will be contancted soon for more info.');</script>";

  unset($_SESSION["shopping_cart"]);
  echo "<script type='text/javascript'>location.href = 'index.php';</script>";
  }
else{echo "<script type= 'text/javascript'>alert('Error');</script>";
  }
}
 

 
?>



</nav>


</div>


</nav>


<nav class="footer"><?php include ("footer.php"); ?>   </nav>

</body>
</html>


