<?php session_start();?>
<!DOCTYPE html>
<html lang="en">
<?php
    if(!isset($_SESSION['id'])){
        echo"<script>alert('you have to log back in to continue');</script>";
        header("Location: Logout.php");
      
    }
?>
<html lang="en">
<head>
    
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css">

    <title>Customer Loyalty</title>
    <?php
    include("db.php");
    $sql="SELECT Points FROM User WHERE User_id = ?";
    $stmt=mysqli_stmt_init($conn);
    mysqli_stmt_prepare($stmt,$sql);
    mysqli_stmt_bind_param($stmt,"i",$_SESSION['id']);

    if(mysqli_stmt_execute($stmt)){
        $result=mysqli_stmt_get_result($stmt);
        $row=mysqli_fetch_assoc($result);
        $points=$row['Points'];
    };
    mysqli_stmt_close($stmt);


    ?>
</head>
<style>
    .pill-navbar{
        border-radius: 50px;  
        padding:10px 20px;
        
    }
    @media(max-width:900px){
        
        .pill-navbar{
        border-radius: 25px;  
        margin-top:10px;

        }
        .pill-navbar .collapse-navbar{
            margin-top:10px;
            padding-top:10px;
            border-top:1px#eee
        }
    }
    .card{
        max-width:50vw;
        border-radius: 40px;  
        padding: 50px;
        max-height:fit-content;
        min-width: 320px;
        min-height:576px;
        overflow-y:auto;
        overflow-x:hidden;
    }

   
    .button{
        min-height:5vh;
        max-height:5vh;
    }

    body{

        background-image: linear-gradient(rgba(0,0,0,0.2),rgba(0,0,0,0.7)), url("Dark-theme.jpg");
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        min-height:100vh;
      
    }
    .form-group{
        margin-bottom:1rem;
    }

</style>
<body>
    <?php
    if($_SERVER["REQUEST_METHOD"]=="POST"){
        include('db.php');
        $id=$_POST['id'];

        // adds the discount to the user's info
        $sql="UPDATE User u JOIN  discount d on d.id=? SET u.DiscountValue = d.DiscountValue WHERE u.id =? ";
        $stmt=mysqli_stmt_init($conn);
        mysqli_stmt_prepare($stmt,$sql);
        mysqli_stmt_bind_param($stmt,"ii",$id,$_SESSION['id']);
        mysqli_stmt_execute($stmt);
        mysqli_stmt_close($stmt);

        // gets the discount cost
        $sql="SELECT * FROM discount WHERE Discount_id = ? ";
        $stmt=mysqli_stmt_init($conn);
        mysqli_stmt_prepare($stmt,$sql);
        mysqli_stmt_bind_param($stmt,"i",$id);
        mysqli_stmt_execute($stmt);
        $result=mysqli_stmt_get_result($stmt);
        $row=mysqli_fetch_assoc($result);
        $cost=$row['DiscountPrice'];
        mysqli_stmt_close($stmt);

        // subtracts the cost with points
        $points=$points-$cost;
        
        // Updates the user's points
        $sql="UPDATE User SET `Points`='?' WHERE `User_id` = ?";
        $stmt=mysqli_stmt_init($conn);
        mysqli_stmt_prepare($stmt,$sql);
        mysqli_stmt_bind_param($stmt,"ii",$points,$_SESSION['id']);
        mysqli_stmt_execute($stmt);
    }  
  ?>
  
    
    
    <!-- navbar -->
    <nav class="navbar navbar-expand-lg navbar-light bg-light shadow pill-navbar w-50 mx-auto my-4 ">
    
        <a class="navbar-brand" href="#">Logo</a>

        <!-- expand/collapse button -->
        <button
            class="navbar-toggler"
            type="button"
            data-bs-toggle="collapse"
            data-bs-target="#Navbar">
            <span class="navbar-toggler-icon"></span>
        </button>

        <!-- nav links -->
        <div class="collapse navbar-collapse ms-4" id="Navbar">
            <ul class="navbar-nav mt-auto">
                <li class="nav-item"><a class="nav-link" href="CustomerProducts.php">Products</a></li>
                <li class="nav-item"><a class="nav-link" href="CustomerSuppliers.php">Suppliers</a></li>
                <li class="nav-item"><a class="nav-link" href="CustomerOrders.php">Orders</a></li>
                <li class="nav-item"><a class="nav-link" href="CustomerLoyalty.php">Loyalty</a></li>
            </ul>
            <!-- right side nav links -->
            <ul class="navbar-nav ms-auto ">
                <li class="nav-item"><a class="nav-link" href="Logout.php">Log out<span class="bi bi-person-fill"></span></a></li>
                <li class="nav-item"><a class="nav-link" href="">Settings<span class="bi bi-gear-fill"></span></a></li>
            </ul>
        </div>

    </nav>

    
    
    <!-- main content -->
   <div class="container p-auto mt-5 ">
        <div class="col-lg-7 mx-auto">
            <div class="card mx-auto">
                <div class="header">
                    <div class="card-title text-center">  
                        <h1>Spend your loyalty points</h1>
                        <div class="row  mt-5">
                            <div class="col-sm-12 col-lg-6 "><h2>Points:<?php echo $points; ?></h2></div>
                            <div class="col-sm-12 col-lg-6 text-muted"><h5>Loyaty points are gained with each order made with the website. You get 10 points per pound spent, rounded up of course</h5></div>
                        </div>
                    </div>
                </div>
                <div class="card-body px-auto mt-3">
                    <h3 class="card-sutitle text-center">Offers</h3>

                    <div class="card-text mt-5 px-auto">
                        <form action="CustomerLoyalty.php">

                            <div class="row border-top border-bottom">
                                <div class="row ms-5 mt-3 ">
                                    <div class="col-6 border-bottom" style="border-block-width:100px;">
                                        <h1>200</h1>
                                    </div>
                                </div>

                                <div class="row ms-5 mt-2 mb-3">
                                    <div class="col-6">
                                        <button class="btn btn-primary"<?php if ($points<200)echo "disabled";?> type="submit" name="id" value="5"><h4>10% off</h4></button>
                                    </div>
                                </div>
                            </div>
                
                            
                            <div class="row border-top border-bottom">
                                <div class="row ms-5 mt-3 ">
                                    <div class="col-6 border-bottom" style="border-block-width:100px;">
                                        <h2>350</h2>
                                    </div>
                                </div>

                                <div class="row ms-5 mt-2 mb-3">
                                    <div class="col-6">
                                        <button class="btn btn-primary"<?php if ($points<350)echo 'disabled';?> type="submit" name="id" value="6"><h4>30% off</h4></button>
                                    </div>
                                </div>
                            </div>


                            <div class="row border-top border-bottom">
                                <div class="row ms-5 mt-3 ">
                                    <div class="col-6 border-bottom" style="border-block-width:100px;">
                                        <h2>600</h2>
                                    </div>
                                </div>

                                <div class="row ms-5 mt-2 mb-3">
                                    <div class="col-6">
                                        <button class="btn btn-primary"<?php if ($points<600)echo "disabled";?> type="submit" name="id" value="7"><h4>50% off</h4></button>
                                    </div>
                                </div>
                            </div>

                        </form>
                    </div>
                </div>
            </div>
            

        </div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</body>
</html>