V17

assets/css/main.css

@@ -524,4 +524,25 @@ main {
     width: 100%;
     padding: 15px;
     font-size: 1.1rem;
+}
+
+/* --- Back to Home Button --- */
+.back-to-home-btn {
+    display: inline-block;
+    margin-top: 10px;
+    margin-bottom: -10px; /* to reduce space */
+    padding: 8px 15px;
+    background-color: #f8f9fa;
+    color: var(--text-light);
+    border-radius: 50px;
+    font-size: 0.9rem;
+    font-weight: 700;
+    border: 1px solid var(--border-color);
+    transition: var(--transition);
+}
+
+.back-to-home-btn:hover {
+    background-color: #e9ecef;
+    color: var(--text-dark);
+    border-color: #ccc;
 }

driver_signup.php

@@ -1,35 +1,152 @@
 <?php include 'header.php'; ?>
 
-<main>
-    <div class="auth-container">
-        <h1>Become a Driver</h1>
-        <form action="driver_signup_process.php" method="POST">
-            <div class="form-group">
-                <label for="full_name">Full Name</label>
-                <input type="text" id="full_name" name="full_name" required>
+<style>
+    .driver-signup-container {
+        display: flex;
+        min-height: 80vh;
+        align-items: stretch;
+        background-color: #f8f9fa;
+    }
+
+    .driver-signup-promo {
+        flex: 1;
+        background: url('assets/images/hero.jpg') no-repeat center center;
+        background-size: cover;
+        color: white;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        text-align: center;
+        padding: 40px;
+    }
+
+    .driver-signup-promo h1 {
+        font-size: 3rem;
+        font-weight: bold;
+        text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);
+    }
+
+    .driver-signup-promo p {
+        font-size: 1.25rem;
+        margin-top: 10px;
+        text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.7);
+    }
+    
+    .driver-signup-promo .benefits {
+        margin-top: 30px;
+        list-style: none;
+        padding: 0;
+    }
+    
+    .driver-signup-promo .benefits li {
+        font-size: 1.1rem;
+        margin-bottom: 10px;
+        background-color: rgba(0,0,0,0.5);
+        padding: 10px;
+        border-radius: 5px;
+    }
+
+    .driver-signup-form-container {
+        flex: 1;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        padding: 40px;
+    }
+
+    .driver-signup-form {
+        width: 100%;
+        max-width: 450px;
+    }
+
+    .driver-signup-form h2 {
+        font-size: 2rem;
+        margin-bottom: 20px;
+        color: #333;
+    }
+
+    .form-group {
+        margin-bottom: 15px;
+    }
+
+    .form-group label {
+        display: block;
+        margin-bottom: 5px;
+        font-weight: bold;
+        color: #555;
+    }
+
+    .form-group input {
+        width: 100%;
+        padding: 10px;
+        border: 1px solid #ccc;
+        border-radius: 5px;
+    }
+
+    .btn-submit {
+        width: 100%;
+        padding: 12px;
+        background-color: #ff8c00;
+        color: white;
+        border: none;
+        border-radius: 5px;
+        font-size: 1.1rem;
+        cursor: pointer;
+        transition: background-color 0.3s;
+    }
+
+    .btn-submit:hover {
+        background-color: #e07b00;
+    }
+    
+    .form-footer {
+        margin-top: 20px;
+        text-align: center;
+    }
+</style>
+
+<div class="driver-signup-container">
+    <div class="driver-signup-promo">
+        <h1>Drive with MajuroEats</h1>
+        <p>Earn money on your own schedule.</p>
+        <ul class="benefits">
+            <li>✓ Flexible Hours</li>
+            <li>✓ Weekly Payments</li>
+            <li>✓ Be Your Own Boss</li>
+        </ul>
+    </div>
+    <div class="driver-signup-form-container">
+        <div class="driver-signup-form">
+            <h2>Create Your Driver Account</h2>
+            <form action="driver_signup_process.php" method="POST">
+                <div class="form-group">
+                    <label for="full_name">Full Name</label>
+                    <input type="text" id="full_name" name="full_name" required>
+                </div>
+                <div class="form-group">
+                    <label for="email">Email</label>
+                    <input type="email" id="email" name="email" required>
+                </div>
+                <div class="form-group">
+                    <label for="password">Password</label>
+                    <input type="password" id="password" name="password" required>
+                </div>
+                <div class="form-group">
+                    <label for="phone_number">Phone Number</label>
+                    <input type="text" id="phone_number" name="phone_number" required>
+                </div>
+                <div class="form-group">
+                    <label for="vehicle_details">Vehicle Details (e.g., 2023 Toyota Camry, Blue)</label>
+                    <input type="text" id="vehicle_details" name="vehicle_details" required>
+                </div>
+                <button type="submit" class="btn-submit">Start Earning</button>
+            </form>
+            <div class="form-footer">
+                <p>Already have an account? <a href="login.php">Log in</a></p>
             </div>
-            <div class="form-group">
-                <label for="email">Email</label>
-                <input type="email" id="email" name="email" required>
-            </div>
-            <div class="form-group">
-                <label for="password">Password</label>
-                <input type="password" id="password" name="password" required>
-            </div>
-            <div class="form-group">
-                <label for="phone_number">Phone Number</label>
-                <input type="text" id="phone_number" name="phone_number" required>
-            </div>
-            <div class="form-group">
-                <label for="vehicle_details">Vehicle Details (e.g., 2023 Toyota Camry, Blue)</label>
-                <input type="text" id="vehicle_details" name="vehicle_details" required>
-            </div>
-            <button type="submit" class="btn-submit">Sign Up</button>
-        </form>
-        <div class="form-footer">
-            <p>Already have an account? <a href="login.php">Log in</a></p>
         </div>
     </div>
-</main>
+</div>
 
-<?php include 'footer.php'; ?>
+<?php include 'footer.php'; ?>

header.php

@@ -16,6 +16,9 @@ session_start();
 <body>
     <header>
     <div class="container">
+        <?php if (basename($_SERVER['PHP_SELF']) != 'index.php'): ?>
+            <a href="/" class="back-to-home-btn">← Back to Home</a>
+        <?php endif; ?>
         <nav class="main-nav">
             <a href="/" class="logo">
                 <span class="logo-icon">🌊</span>

index.php

@@ -1,3 +1,43 @@
+<?php
+// Handle AJAX request for nearby restaurants
+if (isset($_GET['action']) && $_GET['action'] == 'get_restaurants' && isset($_GET['lat']) && isset($_GET['lng'])) {
+    require_once 'db/config.php';
+    header('Content-Type: application/json');
+
+    $lat = (float)$_GET['lat'];
+    $lng = (float)$_GET['lng'];
+    $radius = 10; // Search radius in kilometers
+
+    $db = db();
+    // Haversine formula to calculate distance
+    $stmt = $db->prepare("
+        SELECT r.id, r.name, r.image_url, AVG(rt.rating) as average_rating,
+               (6371 * acos(cos(radians(?)) * cos(radians(latitude)) * cos(radians(longitude) - radians(?)) + sin(radians(?)) * sin(radians(latitude)))) AS distance
+        FROM restaurants r
+        LEFT JOIN ratings rt ON r.id = rt.restaurant_id
+        WHERE latitude IS NOT NULL AND longitude IS NOT NULL
+        GROUP BY r.id
+        HAVING distance < ?
+        ORDER BY distance
+        LIMIT 12
+    ");
+
+    $stmt->execute([$lat, $lng, $lat, $radius]);
+    $restaurants = $stmt->fetchAll(PDO::FETCH_ASSOC);
+
+    // Get cuisines for each restaurant
+    $cuisine_sql = "SELECT c.name FROM cuisines c JOIN restaurant_cuisines rc ON c.id = rc.cuisine_id WHERE rc.restaurant_id = ?";
+    $cuisine_stmt = $db->prepare($cuisine_sql);
+
+    foreach ($restaurants as &$restaurant) {
+        $cuisine_stmt->execute([$restaurant['id']]);
+        $restaurant['cuisines'] = $cuisine_stmt->fetchAll(PDO::FETCH_COLUMN);
+    }
+
+    echo json_encode($restaurants);
+    exit;
+}
+?>
 <?php include 'header.php'; ?>
 <?php include 'hero.php'; ?>
 
@@ -19,45 +59,12 @@
     </section>
 
     <section class="featured-restaurants">
-        <h2 class="section-title">Featured Restaurants</h2>
-        <div class="restaurant-grid">
-            <?php
-            require_once 'db/config.php';
-            $db = db();
-            $stmt = $db->query("SELECT r.id, r.name, r.image_url, AVG(rt.rating) as average_rating 
-                                 FROM restaurants r
-                                 LEFT JOIN ratings rt ON r.id = rt.restaurant_id
-                                 GROUP BY r.id
-                                 ORDER BY average_rating DESC, r.id DESC
-                                 LIMIT 6");
-            $restaurants = $stmt->fetchAll(PDO::FETCH_ASSOC);
-
-            foreach ($restaurants as $restaurant) {
-                // Get cuisines for this restaurant
-                $cuisine_sql = "SELECT c.name FROM cuisines c JOIN restaurant_cuisines rc ON c.id = rc.cuisine_id WHERE rc.restaurant_id = ?";
-                $cuisine_stmt = db()->prepare($cuisine_sql);
-                $cuisine_stmt->execute([$restaurant['id']]);
-                $restaurant_cuisines_list = $cuisine_stmt->fetchAll(PDO::FETCH_COLUMN);
-
-                echo '<a href="menu.php?restaurant_id=' . htmlspecialchars($restaurant['id']) . '" class="restaurant-card">';
-                echo '<div class="card-image" style="background-image: url(\\''.htmlspecialchars($restaurant['image_url'] ? $restaurant['image_url'] : 'assets/images/hero.jpg').'\\\')"></div>';
-                echo '<div class="card-content">';
-                echo '<h3>' . htmlspecialchars($restaurant['name']) . '</h3>';
-                echo '<p class="cuisine-tags">' . htmlspecialchars(implode(', ', $restaurant_cuisines_list)) . '</p>';
-                echo '<div class="restaurant-info">';
-                if ($restaurant['average_rating']) {
-                    echo '<div class="rating-display"><span class="star">★</span> ' . number_format($restaurant['average_rating'], 1) . '</div>';
-                } else {
-                    echo '<div class="rating-display">New</div>';
-                }
-                echo '<div class="delivery-info">25-35 min</div>';
-                echo '</div>';
-                echo '</div>';
-                echo '</a>';
-            }
-            ?>
+        <h2 class="section-title">Featured Restaurants Near You</h2>
+        <div id="restaurant-grid" class="restaurant-grid">
+            <!-- Restaurants will be loaded here by JavaScript -->
+            <p id="restaurants-placeholder">Set your location to see nearby restaurants.</p>
         </div>
-        <div class="see-all-container">
+        <div class="see-all-container" style="display: none;">
             <a href="index.php" class="see-all-btn">See all restaurants</a>
         </div>
     </section>
@@ -73,4 +80,52 @@
     </div>
 </div>
 
-<?php include 'footer.php'; ?>
+<?php include 'footer.php'; ?>
+
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+    const locationData = sessionStorage.getItem('userLocation');
+    const restaurantGrid = document.getElementById('restaurant-grid');
+    const placeholder = document.getElementById('restaurants-placeholder');
+
+    if (locationData) {
+        const { lat, lng } = JSON.parse(locationData);
+        placeholder.textContent = 'Finding restaurants near you...';
+
+        fetch(`index.php?action=get_restaurants&lat=${lat}&lng=${lng}`)
+            .then(response => response.json())
+            .then(restaurants => {
+                restaurantGrid.innerHTML = ''; // Clear placeholder
+                if (restaurants.length > 0) {
+                    restaurants.forEach(restaurant => {
+                        const card = `
+                            <a href="menu.php?restaurant_id=${restaurant.id}" class="restaurant-card">
+                                <div class="card-image" style="background-image: url('${restaurant.image_url || 'assets/images/hero.jpg'}')"></div>
+                                <div class="card-content">
+                                    <h3>${restaurant.name}</h3>
+                                    <p class="cuisine-tags">${restaurant.cuisines.join(', ')}</p>
+                                    <div class="restaurant-info">
+                                        <div class="rating-display">
+                                            ${restaurant.average_rating ? `<span class="star">★</span> ${parseFloat(restaurant.average_rating).toFixed(1)}` : 'New'}
+                                        </div>
+                                        <div class="delivery-info">${Math.round(restaurant.distance * 5) + 15}-${Math.round(restaurant.distance * 5) + 25} min</div>
+                                    </div>
+                                </div>
+                            </a>
+                        `;
+                        restaurantGrid.innerHTML += card;
+                    });
+                    document.querySelector('.see-all-container').style.display = 'block';
+                } else {
+                    placeholder.textContent = 'No restaurants found delivering to your location.';
+                    restaurantGrid.appendChild(placeholder);
+                }
+            })
+            .catch(error => {
+                console.error('Error fetching restaurants:', error);
+                placeholder.textContent = 'Could not load restaurants. Please try again later.';
+                restaurantGrid.appendChild(placeholder);
+            });
+    }
+});
+</script>

migrations/20251016_add_lat_lng_to_restaurants.sql

@@ -0,0 +1,8 @@
+
+ALTER TABLE restaurants
+ADD COLUMN latitude DECIMAL(10, 8),
+ADD COLUMN longitude DECIMAL(11, 8);
+
+UPDATE restaurants SET latitude = 7.1136, longitude = 171.3772 WHERE name = 'The Gourmet Kitchen';
+UPDATE restaurants SET latitude = 7.0915, longitude = 171.3806 WHERE name = 'Pizza Palace';
+UPDATE restaurants SET latitude = 7.0667, longitude = 171.3833 WHERE name = 'Taco Town';