File "market_research_form.php"

Full Path: /home/ccipcixf/public_html/miportal/market_research_form.php
File size: 5.75 KB
MIME-type: text/x-php
Charset: utf-8

 
Open Edit   Advanced Editor   Back 
<?php
session_start();
include("admin/includes/config.php"); // Include your PDO configuration

// Ensure the user is logged in
if (!isset($_SESSION['user_acc_id'])) {
    die("Unauthorized access. Please log in first.");
}

$user_id = $_SESSION['user_acc_id'];

try {
    // Query to check if the user has already attempted and qualified for the test
    $query = "SELECT status FROM mystery_shopper_certification WHERE user_id = :user_id LIMIT 1";
    $stmt = $pdo->prepare($query);
    $stmt->execute(['user_id' => $user_id]);
    $user_attempt = $stmt->fetch();

    // If user is "Qualified," prevent test retake; if "Not Qualified," allow retake
    if ($user_attempt && $user_attempt['status'] === 'Qualified') {
        $status_message = "You have already passed the test and are qualified as a Mystery Shopper.";
        
        echo "<div style='text-align: center; margin-top: 50px;'>
                <h3>Test Access Restricted</h3>
                <p>$status_message</p>
                <a href='user_dashboard.php' class='btn btn-primary'>Return to Dashboard</a>
              </div>";
        exit; // Prevents further code execution if the user has already qualified
    }

    // If "Not Qualified," allow the user to reattempt the test (no need to display a message here)
} catch (PDOException $e) {
    error_log("Query error: " . $e->getMessage());
    die("An error occurred. Please try again later.");
}

// If no "Qualified" record is found, show the test form here
?>

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.1.0/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <title>Mystery Shopping Training</title>
    <style>
        
        .slide-container {
            max-width: 950px;
            margin: 0 auto;
            text-align: center;
        }

        .slide-image {
            width: 100%;
            height: auto;
            display: none;
        }

        .slide-image.active {
            display: block;
        }

        .navigation-buttons {
            margin-top: 20px;
        }
    </style>
</head>

<body>
    <div class="slide-container">
        <!-- <h2>Training Slides</h2> -->

        <!-- Slides (make sure each image is named accordingly and available in the 'slides' folder) -->
        <img src="slides/assignment/marketresearch/1.png" class="slide-image active" id="slide-1">
        <img src="slides/assignment/marketresearch/2.png" class="slide-image" id="slide-2">
        <img src="slides/assignment/marketresearch/3.png" class="slide-image" id="slide-3">
        <img src="slides/assignment/marketresearch/4.png" class="slide-image" id="slide-4">
        <img src="slides/assignment/marketresearch/5.png" class="slide-image" id="slide-5">
        <img src="slides/assignment/marketresearch/6.png" class="slide-image" id="slide-6">
        <img src="slides/assignment/marketresearch/7.png" class="slide-image" id="slide-7">
        <img src="slides/assignment/marketresearch/8.png" class="slide-image" id="slide-8">
        <img src="slides/assignment/marketresearch/9.png" class="slide-image" id="slide-9">
        <img src="slides/assignment/marketresearch/10.png" class="slide-image" id="slide-10">
        <img src="slides/assignment/marketresearch/11.png" class="slide-image" id="slide-11">
        
        <div class="navigation-buttons">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <button class="btn btn-dark" type="button" onclick="prevSlide()">Previous</button>
                        <button class="btn btn-primary" type="button" id="next-btn" onclick="nextSlide()">Next</button>
                        <div style="display: flex; justify-content: center;" class="p-2">
                            <button class="btn btn-success text-center" id="take-test-btn" onclick="location.href='mr_test.php'">Take Test</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>


    </div>

    <script>
        // JavaScript to handle slide navigation
        let currentSlide = 1;
        const totalSlides = 11; // Total number of slides

        function showSlide(slideNum) {
            // Hide all slides
            document.querySelectorAll('.slide-image').forEach(slide => slide.classList.remove('active'));

            // Show the specified slide
            document.getElementById('slide-' + slideNum).classList.add('active');

            // Display "Take Test" button only on the last slide, and hide "Next" button
            document.getElementById('take-test-btn').style.display = slideNum === totalSlides ? 'block' : 'none';
            document.getElementById('next-btn').style.display = slideNum === totalSlides ? 'none' : 'inline-block';
        }

        function nextSlide() {
            if (currentSlide < totalSlides) {
                currentSlide++;
                showSlide(currentSlide);
            }
        }

        function prevSlide() {
            if (currentSlide > 1) {
                currentSlide--;
                showSlide(currentSlide);
            }
        }

        // Initialize the first slide
        showSlide(currentSlide);
    </script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/2.9.2/umd/popper.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.1.0/js/bootstrap.min.js"></script>
</body>

</html>