<?php
include_once('admin/config.php');

function isAllowedMessage($message) {
    $allowedChars = '/^[a-zA-Z0-9,@. ]*$/';
    return preg_match($allowedChars, $message);
}

if ($_SERVER["REQUEST_METHOD"] === "POST") {
    if (isset($_POST['submit-popup'])) {
        $name = $_POST['name'];
        $phone = $_POST['phone'];
        $message = $_POST['message'];
        $service = $_POST['service'];
        date_default_timezone_set("Asia/Kolkata");
        $currentTime = date("Y-m-d H:i:s");
        $errors = array();

        // Validate input
        if (empty($name)) {
            $errors[] = "Name field is required.";
        } elseif (!preg_match('/^[a-zA-Z ]+$/', $name)) {
            $errors[] = "Name can only contain alphabets.";
        }

        if (empty($phone)) {
            $errors[] = "Phone field is required.";
        } elseif (!preg_match('/^\d{10}$/', $phone)) {
            $errors[] = "Phone number should have exactly 10 digits.";
        }

        // Sanitize input
        $name = filter_var($name, FILTER_SANITIZE_STRING);
        $phone = filter_var($phone, FILTER_SANITIZE_NUMBER_INT);
        $message = htmlspecialchars($message, ENT_QUOTES, 'UTF-8');
        
        if (!isAllowedMessage($message)) {
            $errors[] = "Your message contains potentially malicious content or disallowed characters.";
        }
        
        if (empty($errors)) {
            $query = "INSERT INTO `tb7_user_issue` (`name`, `phone`, `message`, `subject`, `datetime`) VALUES (?, ?, ?, ?, ?)";
            $stmt = mysqli_prepare($db, $query);

            if ($stmt) {
                mysqli_stmt_bind_param($stmt, "sssss", $name, $phone, $message, $service, $currentTime);
                $result = mysqli_stmt_execute($stmt);
                mysqli_stmt_close($stmt);

                if ($result) {
                      
                      echo "<script>
                            window.location.href = 'thanks.php';
                        </script>";
                    
                        // echo "<script>
                        //     window.alert('Successfully Sent! We will contact you soon');
                        //     window.location.href = 'index.html';
                        // </script>";
                } else {
                    $errors[] = "Error in processing your request. Please try again later.";
                }
            } else {
                $errors[] = "Error in preparing the statement.";
            }
        } else {
            // Display validation errors in an alert
            echo "<script>
                var errorMessage = '";
            foreach ($errors as $error) {
                echo addslashes($error) . "\\n";
            }
            echo "';
                window.alert(errorMessage);
            </script>";
        }
    }
}
?>
<style>
    .popup-form {
        display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        width: 30%; /* Default width */
        transform: translate(-50%, -50%);
        background-color: rgba(255, 255, 255, 0.9); /* Transparent background */
        padding: 20px;
        border: 1px solid #ccc;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
        z-index: 9999;
    }

    /* Media query for mobile view */
    @media (max-width: 768px) {
        .popup-form {
            width: 90%; /* Set width to 90% for mobile view */
        }
    }

    /* Add blur effect to background */
    .popup-background {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.8); /* Semi-transparent black background */
        z-index: 9998; /* Lower z-index to be behind the popup */
    }

    #popup-form .close-btn {
        float: right;
    }

    .popup-form form input {
        display: block;
        width: 100%;
        margin: 10px 0;
        border: none;
        border-bottom: 1.5px solid #0e0e0e;
        outline: none;
        height: 45px;
        padding-left: 6px;
    }

    .popup-form form button {
        display: block;
        width: 100%;
        height: 40px;
        background-color: #c5700a;
        font-size: 20px;
        color: #fefefe;
        padding-top: 8px;
        padding-bottom:30px;
    }

    .popup-form .close-btn {
        border-radius: 50%;
        background-color: #f3a951;
        border: none;
        color: #050505;
        font-size: 20px;
        width: 20px;
    }
    .popup-form h2{
     color: #0e0e0e;
     text-align: center;
     font-size: 2.5rem;
     font-weight: 700;

}

.popup-form p{
  color: #0e0e0e;
  text-align: center;
  font-size: 1rem;
  font-weight: 500;
}
    
  #popup-form select{
       display: block;
        width: 100%;
        margin: 10px 0;
        border: none;
        border-bottom: 1.5px solid #0e0e0e;
        outline: none;
        height: 45px;
        padding-left: 6px;
  }

</style>

<div class="popup-background"></div>

<div style="width: 100%; background: black;">
    <div id="popup-form" class="popup-form">
        <button id="close-btn" class="close-btn">&times;</button>
        <!--<h4>Fill Form for contact us</h4>-->
        <a src="#" width="100%" alt="shreya" style="padding: 20px 60px;"><a/>
    <div>
          <h2>Want 10% Off </h2>
        <p>Enter Your Name & Phone No To Make It Happen !</p>
        </div>
        <form action="<?php $_PHP_SELF?>" method="POST">
            <!-- Your form fields here -->
            <input type="text" name="name" placeholder="Your Name" required>
			<?php if (isset($errors) && in_array("Name field is required.", $errors)) { ?>
                <p class="error">Name field is required.</p>
            <?php } elseif (isset($errors) && in_array("Name can only contain alphabets.", $errors)) { ?>
                <p class="error">Name can only contain alphabets.</p>
            <?php } ?>
            
            <input type="text" name="phone" placeholder="Your Phone Number" minlength="10" maxlength="10" onkeypress="return isNumberKey(event)" pattern=".{10,10}" onpaste="return false;" required>
            <?php if (isset($errors) && in_array("Phone field is required.", $errors)) { ?>
                <p class="error">Phone field is required.</p>
            <?php } elseif (isset($errors) && in_array("Phone number should have exactly 10 digits.", $errors)) { ?>
                <p class="error">Phone number should have exactly 10 digits.</p>
            <?php } ?>
               
            <input name="message" type="text" placeholder="Address" required>
                   
            <select id="cars" required name="service">
                <option value="">Choose Service</option>
                <option value="Split AC">Split A/C</option>
                <option value="Window AC">Window A/C</option>
                <option value="Washing Machine">Washing Machine</option>
                <option value="L.E.D TV" >L.E.D TV</option>
                <option value="Deep Freezer" >Deep Freezer</option>
                <option value="Dispenser" >Dispenser</option>
                <option value="R.O" >R.O</option>
                <option value="Home Theatre Or Speakers" >Home Theatre/Speakers</option>
                <option value="Home Theatre or Speakers" >Microwave</option>
                <option value="Refrigerator" >Refrigerator</option>
                <option value="Geyser" >Geyser</option>
                <option value="Other" >Other</option>
            </select>
            <button type="submit" name="submit-popup">Submit</button>
            
        </form>
    </div>
</div>
<script>
    document.addEventListener("DOMContentLoaded", function() {
        var popupForm = document.getElementById("popup-form");
        var closeButton = document.getElementById("close-btn");
        var popupBackground = document.querySelector(".popup-background");

        setTimeout(function() {
            displayPopup();
        }, 1000);

        closeButton.addEventListener("click", function() {
            closePopup();
        });

        function displayPopup() {
            popupForm.style.display = "block";
            popupBackground.style.display = "block";
        }

        function closePopup() {
            popupForm.style.display = "none";
            popupBackground.style.display = "none";
        }
    });
</script>