Side by Side

api/curl_log.txt

@@ -1,6 +1,16 @@
-2025-10-14 18:45:03 - Script started for lat: 12.7413, lon: -163.8591
+Array
-2025-10-14 18:45:03 - Fetching URL: https://api.open-meteo.com/v1/forecast?latitude=12.7413&longitude=-163.8591&hourly=temperature_2m,relative_humidity_2m,wind_speed_10m&models=gfs_global
+(
-2025-10-14 18:45:33 - cURL HTTP code: 0
+    [success] => 
-2025-10-14 18:45:33 - cURL error: Connection timed out after 30000 milliseconds
+    [error] => An unexpected error occurred.
-2025-10-14 18:45:33 - Raw API response:
+    [message] => SQLSTATE[42S22]: Column not found: 1054 Unknown column 'city' in 'SELECT'
-No response body
+    [file] => /home/ubuntu/executor/workspace/api/facilities.php
+    [line] => 165
+)
+Array
+(
+    [success] => 
+    [error] => An unexpected error occurred.
+    [message] => SQLSTATE[42S22]: Column not found: 1054 Unknown column 'city' in 'SELECT'
+    [file] => /home/ubuntu/executor/workspace/api/facilities.php
+    [line] => 12
+)

api/facilities.php

@@ -0,0 +1,164 @@
+<?php
+require_once __DIR__ . '/../db/config.php';
+
+header('Content-Type: application/json');
+ini_set('display_errors', 0);
+
+// --- Utility Functions ---
+
+function pointInPolygon($point, $polygon) {
+    $inside = false;
+    $x = $point[0];
+    $y = $point[1];
+    for ($i = 0, $j = count($polygon) - 1; $i < count($polygon); $j = $i++) {
+        $xi = $polygon[$i][0]; $yi = $polygon[$i][1];
+        $xj = $polygon[$j][0]; $yj = $polygon[$j][1];
+        $intersect = (($yi > $y) != ($yj > $y)) && ($x < ($xj - $xi) * ($y - $yi) / ($yj - $yi) + $xi);
+        if ($intersect) $inside = !$inside;
+    }
+    return $inside;
+}
+
+function haversineDistance($lat1, $lon1, $lat2, $lon2) {
+    $earthRadius = 6371; // km
+    $dLat = deg2rad($lat2 - $lat1);
+    $dLon = deg2rad($lon2 - $lon1);
+    $a = sin($dLat / 2) * sin($dLat / 2) + cos(deg2rad($lat1)) * cos(deg2rad($lat2)) * sin($dLon / 2) * sin($dLon / 2);
+    $c = 2 * atan2(sqrt($a), sqrt(1 - $a));
+    return $earthRadius * $c;
+}
+
+// --- Risk Calculation Functions ---
+
+function getWildfireRisk($lat, $lon) {
+    try {
+        $wildfireUrl = 'https://services3.arcgis.com/T4QMspbfLg3qTGWY/arcgis/rest/services/WFIGS_Interagency_Fire_Perimeters_Current/FeatureServer/0/query?where=1%3D1&outFields=poly_IncidentName,poly_GISAcres,attr_InitialLatitude,attr_InitialLongitude&outSR=4326&f=json';
+        $context = stream_context_create(['http' => ['timeout' => 10]]);
+        $wildfireDataJson = @file_get_contents($wildfireUrl, false, $context);
+        if (!$wildfireDataJson) throw new Exception('Could not fetch wildfire data from source.');
+
+        $wildfireData = json_decode($wildfireDataJson, true);
+        if (!$wildfireData || !isset($wildfireData['features'])) return ['score' => 0, 'details' => 'No active wildfires found or data invalid.'];
+
+        $risk = 0;
+        $closest_distance = PHP_INT_MAX;
+        $closest_fire = null;
+
+        foreach ($wildfireData['features'] as $fire) {
+            $fireLat = $fire['attributes']['attr_InitialLatitude'];
+            $fireLon = $fire['attributes']['attr_InitialLongitude'];
+            if ($fireLat && $fireLon) {
+                $distance = haversineDistance($lat, $lon, $fireLat, $fireLon);
+                if ($distance < $closest_distance) {
+                    $closest_distance = $distance;
+                    $closest_fire = $fire['attributes']['poly_IncidentName'];
+                }
+            }
+        }
+
+        if ($closest_distance < 50) { // 50km threshold
+            $risk = 100 - ($closest_distance / 50) * 100;
+        }
+
+        return ['score' => round($risk), 'details' => $closest_fire ? "Closest fire: {$closest_fire} (" . round($closest_distance) . " km away)" : "No fires within 50km."];
+    } catch (Exception $e) {
+        error_log("Wildfire Risk Error: " . $e->getMessage());
+        return ['score' => 0, 'details' => 'Error calculating wildfire risk.'];
+    }
+}
+
+function getHurricaneRisk($lat, $lon) {
+    try {
+        $localApiUrl = 'http://localhost/api/hurricanes.php';
+        $context = stream_context_create(['http' => ['timeout' => 15]]);
+        $geoJsonData = @file_get_contents($localApiUrl, false, $context);
+        if (!$geoJsonData) throw new Exception('Could not fetch local hurricane data.');
+
+        $hurricaneData = json_decode($geoJsonData, true);
+        if (!$hurricaneData || empty($hurricaneData['features'])) return ['score' => 0, 'details' => 'No active hurricane data found.'];
+
+        $risk = 0;
+        $details = [];
+        $point = [(float)$lon, (float)$lat];
+
+        foreach ($hurricaneData['features'] as $feature) {
+            if (isset($feature['properties']['layer']) && $feature['properties']['layer'] === 'cone' && $feature['geometry']['type'] === 'Polygon') {
+                $polygon = $feature['geometry']['coordinates'][0];
+                if (pointInPolygon($point, $polygon)) {
+                    $risk = 100;
+                    $stormName = $feature['properties']['STORMNAME'] ?? 'Unnamed Storm';
+                    $details[] = "Inside the forecast cone for " . $stormName;
+                    break;
+                }
+            }
+        }
+        return ['score' => $risk, 'details' => !empty($details) ? implode(', ', $details) : 'Not in any active hurricane forecast cones.'];
+    } catch (Exception $e) {
+        error_log("Hurricane Risk Error: " . $e->getMessage());
+        return ['score' => 0, 'details' => 'Error calculating hurricane risk.'];
+    }
+}
+
+function getHistoricalHurricaneRisk($lat, $lon) {
+    try {
+        $pdo = db();
+        if (!$pdo) return ['score' => 0, 'details' => 'Database connection failed.'];
+
+        $radius = 1.0; 
+        $stmt = $pdo->prepare("SELECT COUNT(DISTINCT storm_id) as storm_count FROM hurricanes WHERE ABS(lat - :lat) < :radius AND ABS(lon - :lon) < :radius");
+        $stmt->execute(['lat' => $lat, 'lon' => $lon, 'radius' => $radius]);
+        $result = $stmt->fetch(PDO::FETCH_ASSOC);
+        $count = $result['storm_count'] ?? 0;
+        $score = min($count * 10, 100);
+        return ['score' => $score, 'details' => "{$count} historical storms passed within ~111km."];
+    } catch (Exception $e) {
+        error_log("Historical Hurricane Risk Error: " . $e->getMessage());
+        return ['score' => 0, 'details' => 'Error calculating historical hurricane risk.'];
+    }
+}
+
+function calculateRiskScore($lat, $lon) {
+    $wildfireRisk = getWildfireRisk((float)$lat, (float)$lon);
+    $hurricaneRisk = getHurricaneRisk((float)$lat, (float)$lon);
+    $historicalRisk = getHistoricalHurricaneRisk((float)$lat, (float)$lon);
+    $totalScore = ($wildfireRisk['score'] * 0.4) + ($hurricaneRisk['score'] * 0.4) + ($historicalRisk['score'] * 0.2);
+    return round($totalScore);
+}
+
+try {
+    $pdo = db();
+    $method = $_SERVER['REQUEST_METHOD'];
+
+    if ($method === 'GET') {
+        $stmt = $pdo->query('SELECT id, name, latitude, longitude, city, state FROM facilities ORDER BY created_at DESC');
+        $allFacilities = $stmt->fetchAll(PDO::FETCH_ASSOC);
+
+        $sampleSize = ceil(count($allFacilities) * 0.1);
+        if ($sampleSize < 1 && count($allFacilities) > 0) $sampleSize = 1;
+        
+        shuffle($allFacilities);
+        $facilitiesSample = array_slice($allFacilities, 0, $sampleSize);
+
+        $facilitiesWithRisk = [];
+        foreach ($facilitiesSample as $facility) {
+            $facility['risk'] = calculateRiskScore($facility['latitude'], $facility['longitude']);
+            $facilitiesWithRisk[] = $facility;
+        }
+
+        echo json_encode(['success' => true, 'facilities' => $facilitiesWithRisk]);
+
+    } else {
+        http_response_code(405);
+        echo json_encode(['success' => false, 'error' => 'Method Not Allowed']);
+    }
+} catch (Exception $e) {
+    http_response_code(500);
+    $error = [
+        'success' => false,
+        'error' => 'An unexpected error occurred in facilities API.',
+        'message' => $e->getMessage(),
+    ];
+    error_log(print_r($error, true));
+    echo json_encode($error);
+}
+?>

api/hurricanes.php

@@ -1,43 +1,57 @@
 <?php
-require_once __DIR__ . '/../db/config.php';
+// Fetches live hurricane data from NOAA/NHC and returns as GeoJSON
-
 header('Content-Type: application/json');
 
-try {
+// Base URL for the NHC's ArcGIS REST service
-    $pdo = db();
+$baseUrl = 'https://services9.arcgis.com/RHVPKKiFTONKtxq3/arcgis/rest/services/Active_Hurricanes_v1/FeatureServer/';
 
-    if (isset($_GET['id'])) {
+// Function to fetch data from a URL
-        // Fetch track for a specific hurricane
+function get_json($url) {
-        $hurricaneId = $_GET['id'];
+    $ch = curl_init();
-        $stmt = $pdo->prepare('SELECT name, season, lat, lon, wind_speed FROM hurricanes WHERE storm_id = ? ORDER BY iso_time ASC');
+    curl_setopt($ch, CURLOPT_URL, $url);
-        $stmt->execute([$hurricaneId]);
+    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
-        $trackData = $stmt->fetchAll(PDO::FETCH_ASSOC);
+    curl_setopt($ch, CURLOPT_USERAGENT, 'worldsphere.ai bot');
+    curl_setopt($ch, CURLOPT_TIMEOUT, 15);
+    $response = curl_exec($ch);
+    $http_code = curl_getinfo($ch, CURLINFO_HTTP_CODE);
+    curl_close($ch);
 
-        if (!$trackData) {
+    if ($http_code !== 200) {
-            http_response_code(404);
+        return null;
-            echo json_encode(['error' => 'Hurricane not found']);
+    }
-            exit;
+    return json_decode($response, true);
+}
+
+// Main function to get all active hurricane data
+function get_active_hurricanes() {
+    global $baseUrl;
+    $features = [];
+
+    // Layer IDs for forecast points, tracks, and cones
+    $layerIds = [
+        0, // Forecast Position
+        2, // Forecast Track
+        4, // Forecast Error Cone
+    ];
+
+    foreach ($layerIds as $layerId) {
+        $queryUrl = "{$baseUrl}{$layerId}/query?where=1%3D1&outFields=*&f=geojson";
+        $data = get_json($queryUrl);
+
+        if ($data && !empty($data['features'])) {
+            foreach($data['features'] as $feature) {
+                $features[] = $feature;
+            }
         }
-
-        // Format for existing frontend: [lon, lat, wind]
-        $formattedTrack = array_map(function($point) {
-            return [(float)$point['lon'], (float)$point['lat'], (int)$point['wind_speed']];
-        }, $trackData);
-
-        echo json_encode([
-            'name' => $trackData[0]['name'] . ' (' . $trackData[0]['season'] . ')',
-            'track' => $formattedTrack
-        ]);
-
-    } else {
-        // Fetch list of all hurricanes
-        $stmt = $pdo->query('SELECT storm_id as id, name, season as year FROM hurricanes GROUP BY storm_id, name, season ORDER BY season DESC, name ASC');
-        $hurricanes = $stmt->fetchAll(PDO::FETCH_ASSOC);
-        echo json_encode($hurricanes);
     }
 
-} catch (PDOException $e) {
+    return [
-    http_response_code(500);
+        'type' => 'FeatureCollection',
-    echo json_encode(['error' => 'Database error: ' . $e->getMessage()]);
+        'features' => $features
+    ];
 }
+
+$data = get_active_hurricanes();
+echo json_encode($data);
+
 ?>

api/risk_score.php

@@ -0,0 +1,210 @@
+<?php
+// api/risk_score.php
+
+/**
+ * Calculates a risk score for a given latitude and longitude.
+ *
+ * The risk score is based on:
+ * 1. Proximity to active wildfires.
+ * 2. Location within an active hurricane's forecast cone.
+ * 3. Historical hurricane activity in the area.
+ */
+
+header('Content-Type: application/json');
+ini_set('display_errors', 0); // Don't show errors to the user
+
+require_once __DIR__ . '/../db/config.php';
+
+// --- Utility Functions ---
+
+/**
+ * Point in Polygon check.
+ * Ray-casting algorithm.
+ * @param array $point The point to check: [$lon, $lat]
+ * @param array $polygon The polygon vertices: [[$lon, $lat], [$lon, $lat], ...]
+ * @return bool True if the point is in the polygon.
+ */
+function pointInPolygon($point, $polygon) {
+    $inside = false;
+    $x = $point[0];
+    $y = $point[1];
+    
+    for ($i = 0, $j = count($polygon) - 1; $i < count($polygon); $j = $i++) {
+        $xi = $polygon[$i][0];
+        $yi = $polygon[$i][1];
+        $xj = $polygon[$j][0];
+        $yj = $polygon[$j][1];
+        
+        $intersect = (($yi > $y) != ($yj > $y))
+            && ($x < ($xj - $xi) * ($y - $yi) / ($yj - $yi) + $xi);
+        if ($intersect) {
+            $inside = !$inside;
+        }
+    }
+    
+    return $inside;
+}
+
+/**
+ * Haversine formula for distance between two points on a sphere.
+ * @param float $lat1
+ * @param float $lon1
+ * @param float $lat2
+ * @param float $lon2
+ * @return float Distance in kilometers.
+ */
+function haversineDistance($lat1, $lon1, $lat2, $lon2) {
+    $earthRadius = 6371; // km
+    
+    $dLat = deg2rad($lat2 - $lat1);
+    $dLon = deg2rad($lon2 - $lon1);
+    
+    $a = sin($dLat / 2) * sin($dLat / 2) +
+         cos(deg2rad($lat1)) * cos(deg2rad($lat2)) *
+         sin($dLon / 2) * sin($dLon / 2);
+    
+    $c = 2 * atan2(sqrt($a), sqrt(1 - $a));
+    
+    return $earthRadius * $c;
+}
+
+
+// --- Risk Calculation Functions ---
+
+function getWildfireRisk($lat, $lon) {
+    $wildfireUrl = 'https://services3.arcgis.com/T4QMspbfLg3qTGWY/arcgis/rest/services/WFIGS_Interagency_Fire_Perimeters_Current/FeatureServer/0/query?where=1%3D1&outFields=poly_IncidentName,poly_GISAcres,attr_InitialLatitude,attr_InitialLongitude&outSR=4326&f=json';
+    
+    $context = stream_context_create(['http' => ['timeout' => 10]]);
+    $wildfireDataJson = @file_get_contents($wildfireUrl, false, $context);
+    if (!$wildfireDataJson) {
+        return ['score' => 0, 'details' => 'Could not fetch wildfire data.'];
+    }
+    $wildfireData = json_decode($wildfireDataJson, true);
+
+    if (!$wildfireData || empty($wildfireData['features'])) {
+        return ['score' => 0, 'details' => 'No active wildfires found.'];
+    }
+    
+    $risk = 0;
+    $closest_distance = PHP_INT_MAX;
+    $closest_fire = null;
+
+    foreach ($wildfireData['features'] as $fire) {
+        $fireLat = $fire['attributes']['attr_InitialLatitude'];
+        $fireLon = $fire['attributes']['attr_InitialLongitude'];
+        
+        if ($fireLat && $fireLon) {
+            $distance = haversineDistance($lat, $lon, $fireLat, $fireLon);
+            if ($distance < $closest_distance) {
+                $closest_distance = $distance;
+                $closest_fire = $fire['attributes']['poly_IncidentName'];
+            }
+        }
+    }
+
+    if ($closest_distance < 50) { // 50km threshold
+        $risk = 100 - ($closest_distance / 50) * 100;
+    }
+
+    return [
+        'score' => round($risk), 
+        'details' => $closest_fire ? "Closest fire: {$closest_fire} (" . round($closest_distance) . " km away)" : "No fires within 50km."
+    ];
+}
+
+function getHurricaneRisk($lat, $lon) {
+    // Construct the URL to the local hurricanes API
+    $localApiUrl = 'http://localhost/api/hurricanes.php';
+
+    $context = stream_context_create(['http' => ['timeout' => 15]]);
+    $geoJsonData = @file_get_contents($localApiUrl, false, $context);
+
+    if (!$geoJsonData) {
+        return ['score' => 0, 'details' => 'Could not fetch local hurricane data.'];
+    }
+
+    $hurricaneData = json_decode($geoJsonData, true);
+
+    if (!$hurricaneData || empty($hurricaneData['features'])) {
+        return ['score' => 0, 'details' => 'No active hurricane data found.'];
+    }
+
+    $risk = 0;
+    $details = [];
+    $point = [(float)$lon, (float)$lat];
+
+    foreach ($hurricaneData['features'] as $feature) {
+        // We are only interested in the forecast cone polygons
+        if (isset($feature['properties']['layer']) && $feature['properties']['layer'] === 'cone' && $feature['geometry']['type'] === 'Polygon') {
+            $polygon = $feature['geometry']['coordinates'][0];
+            if (pointInPolygon($point, $polygon)) {
+                $risk = 100; // Max risk if inside the cone
+                $stormName = $feature['properties']['STORMNAME'] ?? 'Unnamed Storm';
+                $details[] = "Inside the forecast cone for " . $stormName;
+                break; // Exit after finding the first cone
+            }
+        }
+    }
+
+    return [
+        'score' => $risk,
+        'details' => !empty($details) ? implode(', ', $details) : 'Not in any active hurricane forecast cones.'
+    ];
+}
+
+function getHistoricalHurricaneRisk($lat, $lon) {
+    $pdo = db();
+    if (!$pdo) {
+        return ['score' => 0, 'details' => 'Database connection failed.'];
+    }
+
+    // Search for storms within a 1-degree radius (~111 km)
+    $radius = 1.0; 
+    $stmt = $pdo->prepare(
+        "SELECT COUNT(DISTINCT storm_id) as storm_count FROM hurricanes WHERE ABS(lat - :lat) < :radius AND ABS(lon - :lon) < :radius"
+    );
+    $stmt->execute(['lat' => $lat, 'lon' => $lon, 'radius' => $radius]);
+    $result = $stmt->fetch(PDO::FETCH_ASSOC);
+
+    $count = $result['storm_count'] ?? 0;
+    
+    // Simple scoring: 10 points per storm, max 100
+    $score = min($count * 10, 100);
+
+    return [
+        'score' => $score,
+        'details' => "{$count} historical storms passed within ~111km."
+    ];
+}
+
+
+// --- Main Execution ---
+
+$lat = $_GET['lat'] ?? null;
+$lon = $_GET['lon'] ?? null;
+
+if (!$lat || !$lon) {
+    http_response_code(400);
+    echo json_encode(['error' => 'Latitude and longitude are required.']);
+    exit;
+}
+
+$wildfireRisk = getWildfireRisk((float)$lat, (float)$lon);
+$hurricaneRisk = getHurricaneRisk((float)$lat, (float)$lon);
+$historicalRisk = getHistoricalHurricaneRisk((float)$lat, (float)$lon);
+
+// Weighted average for the total score
+$totalScore = ($wildfireRisk['score'] * 0.4) + ($hurricaneRisk['score'] * 0.4) + ($historicalRisk['score'] * 0.2);
+
+$response = [
+    'latitude' => (float)$lat,
+    'longitude' => (float)$lon,
+    'risk_score' => round($totalScore),
+    'factors' => [
+        'wildfire' => $wildfireRisk,
+        'live_hurricane' => $hurricaneRisk,
+        'historical_hurricane' => $historicalRisk,
+    ]
+];
+
+echo json_encode($response, JSON_PRETTY_PRINT);

assets/css/custom.css

@@ -35,3 +35,39 @@
     text-decoration: none;
     cursor: pointer;
 }
+
+/* Split-screen layout */
+#split-container {
+    display: flex;
+    width: 100%;
+    height: calc(100vh - 100px); /* Fill space between top/bottom bars */
+}
+
+#left-panel {
+    width: 50%;
+    height: 100%;
+    overflow-y: auto;
+    background-color: var(--primary-bg);
+    padding: 2rem;
+    box-sizing: border-box;
+}
+
+#right-panel {
+    width: 50%;
+    height: 100%;
+}
+
+#cesiumContainer {
+    width: 100%;
+    height: 100%;
+}
+
+/* Remove padding from content divs as it's now on the parent */
+#dashboard-content,
+#analytics-content,
+#reports-content,
+#settings-content,
+#summary-content,
+#help-content {
+    padding: 0 !important; /* Override dashboard.css */
+}

assets/css/dashboard.css

@@ -0,0 +1,357 @@
+:root {
+    --primary-bg: #1a1d21;
+    --secondary-bg: #2a2d31;
+    --primary-text: #f0f0f0;
+    --secondary-text: #a0a0a0;
+    --accent-color: #00aaff;
+    --border-color: #3a3d41;
+}
+
+body {
+    font-family: 'Inter', sans-serif;
+    margin: 0;
+    padding: 0;
+    background-color: var(--primary-bg);
+    color: var(--primary-text);
+    overflow: hidden;
+}
+
+#app-container {
+    display: flex;
+    height: 100vh;
+}
+
+#sidebar {
+    width: 320px;
+    background-color: var(--primary-bg);
+    border-right: 1px solid var(--border-color);
+    display: flex;
+    flex-direction: column;
+    padding: 1.5rem;
+    box-shadow: 2px 0 10px rgba(0,0,0,0.2);
+}
+
+#app-header h1 {
+    font-size: 1.5rem;
+    font-weight: 700;
+    margin: 0 0 2rem 0;
+}
+
+#app-nav {
+    overflow-y: auto;
+}
+
+.control-group {
+    margin-bottom: 2rem;
+    border-top: 1px solid var(--border-color);
+    padding-top: 1.5rem;
+}
+
+.control-group:first-child {
+    border-top: none;
+    padding-top: 0;
+}
+
+.control-group h3 {
+    font-size: 1rem;
+    font-weight: 600;
+    margin: 0 0 1rem 0;
+    color: var(--accent-color);
+}
+
+.control-group label {
+    display: block;
+    margin-bottom: 0.75rem;
+    font-size: 0.9rem;
+    cursor: pointer;
+}
+
+#main-content {
+    flex: 1;
+    position: relative;
+}
+
+#cesiumContainer {
+    width: 100%;
+    height: 100%;
+}
+
+/* Facility Portfolio */
+#facility-list-container {
+    max-height: 200px;
+    overflow-y: auto;
+    margin-bottom: 1rem;
+}
+
+#facility-list {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+}
+
+#facility-list li {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0.5rem;
+    border-radius: 4px;
+    margin-bottom: 0.5rem;
+    background-color: var(--secondary-bg);
+}
+
+#facility-list .delete-facility-btn {
+    background: none;
+    border: none;
+    color: #ff4d4d;
+    cursor: pointer;
+    font-size: 1rem;
+}
+
+#add-facility-form input {
+    width: calc(100% - 1rem);
+    padding: 0.5rem;
+    margin-bottom: 0.5rem;
+    background-color: var(--secondary-bg);
+    border: 1px solid var(--border-color);
+    color: var(--primary-text);
+    border-radius: 4px;
+}
+
+#add-facility-form button {
+    width: 100%;
+    padding: 0.75rem;
+    background-color: var(--accent-color);
+    border: none;
+    color: white;
+    font-weight: 600;
+    border-radius: 4px;
+    cursor: pointer;
+}
+
+#add-facility-form small {
+    display: block;
+    text-align: center;
+    margin-top: 0.5rem;
+    color: var(--secondary-text);
+}
+
+/* Modal */
+.modal {
+    display: none;
+    position: fixed;
+    z-index: 1000;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.6);
+    align-items: center;
+    justify-content: center;
+}
+
+.modal-content {
+    background-color: var(--secondary-bg);
+    padding: 2rem;
+    border-radius: 8px;
+    width: 80%;
+    max-width: 800px;
+    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
+}
+
+.close-button {
+    color: var(--secondary-text);
+    float: right;
+    font-size: 28px;
+    font-weight: bold;
+    cursor: pointer;
+}
+
+/* New styles for hamburger menu and layout */
+#top-bar {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    padding: 1rem;
+    background: linear-gradient(to bottom, rgba(26, 29, 33, 0.7), transparent);
+    z-index: 100;
+}
+
+#hamburger-menu {
+    background: none;
+    border: none;
+    cursor: pointer;
+    padding: 0.5rem;
+    margin-right: 1rem;
+}
+
+#hamburger-menu span {
+    display: block;
+    width: 24px;
+    height: 3px;
+    background-color: var(--primary-text);
+    margin: 4px 0;
+    transition: all 0.3s;
+}
+
+#top-header h2 {
+    margin: 0;
+    font-size: 1.2rem;
+    font-weight: 600;
+}
+
+#sidebar.sidebar-hidden {
+    transform: translateX(-100%);
+}
+
+#main-content.sidebar-hidden {
+    margin-left: 0;
+}
+
+#sidebar {
+    transition: transform 0.3s ease-in-out;
+    z-index: 200;
+    position: absolute;
+    left: 0;
+    top: 0;
+    height: 100%;
+}
+
+#main-content {
+    transition: margin-left 0.3s ease-in-out;
+    margin-left: 320px;
+}
+
+/* New Nav Bars */
+.top-nav, .bottom-nav {
+    display: flex;
+    align-items: center;
+    background-color: var(--secondary-bg);
+    padding: 0 1rem;
+    height: 50px;
+    z-index: 99;
+}
+
+.top-nav {
+    flex-grow: 1;
+    margin-left: 2rem;
+}
+
+.bottom-nav {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    border-top: 1px solid var(--border-color);
+}
+
+.nav-item {
+    color: var(--primary-text);
+    text-decoration: none;
+    padding: 0 1rem;
+    font-size: 0.9rem;
+    font-weight: 500;
+    transition: color 0.2s;
+}
+
+.nav-item:hover {
+    color: var(--accent-color);
+}
+
+.bottom-nav .nav-item:last-child {
+    margin-left: auto;
+    color: var(--secondary-text);
+}
+
+
+
+#dashboard-content {
+    padding: 2rem;
+}
+
+.table {
+    width: 100%;
+    border-collapse: collapse;
+    margin-top: 2rem;
+}
+
+.table th, .table td {
+    padding: 1rem;
+    text-align: left;
+    border-bottom: 1px solid var(--border-color);
+}
+
+.table th {
+    background-color: var(--secondary-bg);
+    font-weight: 600;
+}
+
+.table tbody tr:nth-child(even) {
+    background-color: var(--secondary-bg);
+}
+
+.risk-high {
+    color: #ff4d4d;
+    font-weight: 700;
+}
+
+.risk-medium {
+    color: #ffb347;
+    font-weight: 700;
+}
+
+.risk-low {
+    color: #fdfd96;
+}
+
+.risk-very-low {
+    color: #a4d0a4;
+}
+
+
+#cesiumContainer {
+    height: calc(100vh - 100px);
+}
+
+#top-bar {
+    background: var(--secondary-bg);
+    border-bottom: 1px solid var(--border-color);
+    padding: 0 1rem;
+    height: 50px;
+}
+
+#top-header {
+    display: none; /* Replaced by top-nav */
+}
+
+#settings-form .form-group {
+    margin-bottom: 1rem;
+}
+
+#settings-form label {
+    display: block;
+    margin-bottom: 0.5rem;
+}
+
+#settings-form input,
+#settings-form select {
+    width: 100%;
+    padding: 0.5rem;
+    border-radius: 4px;
+    border: 1px solid var(--border-color);
+    background-color: var(--secondary-bg);
+    color: var(--primary-text);
+}
+
+#settings-form button {
+    padding: 0.75rem 1.5rem;
+    background-color: var(--accent-color);
+    border: none;
+    color: white;
+    font-weight: 600;
+    border-radius: 4px;
+    cursor: pointer;
+}
+

assets/js/wind.js

@@ -131,6 +131,10 @@ class WindLayer {
         });
     }
 
+    isPlaying() {
+        return this.particleSystem && this.particleSystem.isPlaying;
+    }
+
     setParticleDensity(density) {
         this.readyPromise.then(() => {
             if (this.particleSystem) {
@@ -149,6 +153,7 @@ class ParticleSystem {
         // Use a polyline collection instead of a point collection
         this.polylines = this.scene.primitives.add(new Cesium.PolylineCollection());
         this.particles = [];
+        this.isPlaying = true;
 
         this.createParticles();
 
@@ -295,10 +300,12 @@ class ParticleSystem {
     }
 
     pause() {
+        this.isPlaying = false;
         this.scene.preRender.removeEventListener(this.update, this);
     }
 
     play() {
+        this.isPlaying = true;
         this.scene.preRender.addEventListener(this.update, this);
     }
 }

db/migrations/20251017_create_facilities_table.sql

@@ -0,0 +1,7 @@
+CREATE TABLE IF NOT EXISTS facilities (
+    id INT AUTO_INCREMENT PRIMARY KEY,
+    name VARCHAR(255) NOT NULL,
+    latitude DECIMAL(10, 8) NOT NULL,
+    longitude DECIMAL(11, 8) NOT NULL,
+    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
+);

index.php

@@ -4,136 +4,159 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Worldsphere.ai - 3D Weather Map</title>
+    <title>Worldsphere - Healthcare Risk Management</title>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
     <link href="assets/cesium/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
+        <link rel="stylesheet" href="assets/css/dashboard.css?v=<?php echo time(); ?>">
     <link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
-    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
 </head>
 <body>
-    <div id="cesiumContainer"></div>
+    <div id="app-container">
-    <div id="controls">
+        <aside id="sidebar" class="sidebar-hidden">
-        <div class="control-group">
+            <header id="app-header">
-            <h3>Layers</h3>
+                <a href="#" id="home-link"><h1>Menu</h1></a>
-            <label>
+            </header>
-                <input type="checkbox" id="weatherLayerCheckbox" checked> Weather
+            <nav id="app-nav">
-            </label>
+                
-            <label>
+                <div class="control-group">
-                <input type="checkbox" id="wildfireLayerCheckbox" checked> Wildfires
+                    <h3>Layers</h3>
-            </label>
+                    <label><input type="checkbox" id="weatherLayerCheckbox" checked> Weather</label>
-            <label>
+                    <label><input type="checkbox" id="wildfireLayerCheckbox" checked> Wildfires</label>
-                <input type="checkbox" id="spcLayerCheckbox" checked> SPC Outlook
+                    <label><input type="checkbox" id="spcLayerCheckbox" checked> SPC Outlook</label>
-            </label>
+                    <label><input type="checkbox" id="weatherAlertsLayerCheckbox" checked> Weather Alerts</label>
-            <label>
+                    <label><input type="checkbox" id="hurricaneLayerCheckbox" checked> Hurricanes</label>
-                <input type="checkbox" id="weatherAlertsLayerCheckbox" checked> Weather Alerts
+                    <label><input type="checkbox" id="windLayerCheckbox" checked> Wind</label>
-            </label>
+                </div>
-            <label>
+
-                <input type="checkbox" id="windLayerCheckbox" checked> Wind
+                <div class="control-group">
-            </label>
+                    <h3>Wind Animation</h3>
-        </div>
+                    <label>Altitude: <span id="windAltitudeLabel">10000 m</span></label>
-        <div class="control-group">
+                    <input type="range" id="windAltitudeSlider" min="0" max="15000" step="500" value="10000">
-            <h3>Display Mode</h3>
+                    <label>Particle Density:</label>
-            <select id="displayModeSelect">
-                <option value="wind">Global Wind</option>
-                <option value="cat">CAT Simulation</option>
-            </select>
-        </div>
-        <div id="wind-controls">
-            <div class="control-group">
-                <h3>Wind Altitude</h3>
-                <input type="range" id="windAltitudeSlider" min="0" max="15000" step="500" value="10000">
-                <span id="windAltitudeLabel">10000 m</span>
-            </div>
-            <div class="control-group">
-                <h3>Wind Animation</h3>
-                <button id="playPauseWind">Pause</button>
-                <label>
-                    Particle Density:
                     <input type="range" id="particleDensitySlider" min="0.1" max="1.0" step="0.1" value="0.5">
-                </label>
+                    <button id="playPauseWind">Pause</button>
+                </div>
+            </nav>
+        </aside>
+
+        <main id="main-content">
+            <div id="top-bar">
+                <button id="hamburger-menu">
+                    <span></span>
+                    <span></span>
+                    <span></span>
+                </button>
+                <nav class="top-nav">
+                    <a href="#" id="dashboard-nav-link" class="nav-item">Dashboard</a>
+                    <a href="#" id="analytics-nav-link" class="nav-item">Analytics</a>
+                    <a href="#" id="reports-nav-link" class="nav-item">Reports</a>
+                    <a href="#" id="settings-nav-link" class="nav-item">Settings</a>
+                </nav>
+            </div>
+            <div id="split-container">
+                <div id="left-panel">
+                    <div id="dashboard-content" class="hidden">
+                        <h2>Facilities Dashboard</h2>
+                        <table class="table">
+                            <thead>
+                                <tr>
+                                    <th>Facility Name</th>
+                                    <th>City</th>
+                                    <th>State</th>
+                                    <th>Risk Score</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <!-- Facility data will be loaded here -->
+                            </tbody>
+                        </table>
+                    </div>
+                    <div id="analytics-content" class="hidden">
+                        <h2>Analytics</h2>
+                        <p>This feature is under development. Detailed analytics and visualizations will be available here soon.</p>
+                        <canvas id="facilitiesByStateChart"></canvas>
+                    </div>
+                    <div id="reports-content" class="hidden">
+                        <h2>Reports</h2>
+                        <p>Generate and download reports for your facilities.</p>
+                        <button id="download-report-btn">Download Facility Risk Report (CSV)</button>
+                    </div>
+                    <div id="settings-content" class="hidden">
+                        <h2>Settings</h2>
+                        <p>Configure your application settings.</p>
+                        <form id="settings-form">
+                            <div class="form-group">
+                                <label for="setting1">Example Setting 1</label>
+                                <input type="text" id="setting1" name="setting1" value="Example Value">
+                            </div>
+                            <div class="form-group">
+                                <label for="setting2">Example Setting 2</label>
+                                <select id="setting2" name="setting2">
+                                    <option>Option 1</option>
+                                    <option>Option 2</option>
+                                    <option>Option 3</option>
+                                </select>
+                            </div>
+                            <button type="submit">Save Settings</button>
+                        </form>
+                    </div>
+                    <div id="summary-content" class="hidden">
+                        <h2>Summary</h2>
+                        <p>This feature is under development. A summary of key information will be available here soon.</p>
+                    </div>
+                    <div id="help-content" class="hidden">
+                        <h2>Help</h2>
+                        <p>This feature is under development. Help and documentation will be available here soon.</p>
+                    </div>
+                </div>
+                <div id="right-panel">
+                    <div id="cesiumContainer"></div>
+                </div>
+            </div>
+            <nav class="bottom-nav">
+                <a href="#" id="summary-nav-link" class="nav-item">Summary</a>
+                <a href="#" id="show-alerts-btn" class="nav-item">Alerts</a>
+                <a href="#" id="help-nav-link" class="nav-item">Help</a>
+                <a href="#" class="nav-item">&copy; 2025 Worldsphere</a>
+            </nav>
+        </main>
+    </div>
+
+    <!-- Modals -->
+    <div id="alertsModal" class="modal">
+        <div class="modal-content">
+            <span class="close-button">&times;</span>
+            <h2>Active Weather Alerts</h2>
+            <div id="alerts-list-container">
+                <p>Loading alerts...</p>
             </div>
         </div>
-        <div id="cat-controls" style="display: none;">
+    </div>
-            <div class="control-group">
-                <h3>CAT Simulation</h3>
-                <label for="hurricane-select">Select Hurricane:</label>
-                <select id="hurricane-select" name="hurricane-select">
-                    <option value="">Loading storms...</option>
-                </select>
-                <label for="portfolio-select">Sample Portfolio:</label>
-                <select id="portfolio-select" name="portfolio-select">
-                    <option value="">Select a portfolio</option>
-                    <option value="assets/portfolios/fl_coastal.csv">Florida Coastal</option>
-                    <option value="assets/portfolios/fl_inland.csv">Florida Inland</option>
-                    <option value="assets/portfolios/la_coastal.csv">Louisiana Coastal</option>
-                </select>
-                <label for="portfolio-upload">Custom Portfolio (CSV):</label>
-                <small>CSV must contain 'lat', 'lon', 'tiv', and optionally 'deductible' and 'limit' headers.</small>
-                <input type="file" id="portfolio-upload" accept=".csv" />
-                <div id="portfolio-status"></div>
-                <button id="runCatSimulation">Run Simulation</button>
-                <div id="cat-simulation-results" style="display: none;">
-                    <h4>Simulation Results</h4>
-                    <p>Total Loss: <span id="total-loss-value">$0</span></p>
-                </div>
-            </div>
-            <div class="control-group">
-                <h3>Probabilistic Analysis</h3>
-                <button id="runProbabilisticAnalysis">Run Analysis</button>
-                <div id="probabilistic-results" style="display: none;">
-                    <h4>Analysis Results</h4>
-                    <p>Average Annual Loss (AAL): <span id="aal-value">$0</span></p>
-                    <canvas id="epCurveChart"></canvas>
-                </div>
 
-                <hr>
-
-                <h4>Portfolio Comparison</h4>
-                <label for="portfolio-upload-2">Portfolio 2 (CSV):</label>
-                <input type="file" id="portfolio-upload-2" accept=".csv" />
-                <div id="portfolio-status-2"></div>
-                <button id="runComparison">Compare Portfolios</button>
-                <div id="comparison-results" style="display: none;">
-                    <h4>Comparison Results</h4>
-                    <p>Portfolio 1 AAL: <span id="aal-value-1">$0</span></p>
-                    <p>Portfolio 2 AAL: <span id="aal-value-2">$0</span></p>
-                </div>
-            </div>
-            <div class="control-group">
-                <h3>Weather Overlays</h3>
-                <div id="spc-controls">
-                    <h4>SPC Outlook</h4>
-                    <label><input type="checkbox" class="spc-checkbox" value="TSTM" checked> Thunderstorm</label>
-                    <label><input type="checkbox" class="spc-checkbox" value="MRGL" checked> Marginal</label>
-                    <label><input type="checkbox" class="spc-checkbox" value="SLGT" checked> Slight</label>
-                    <label><input type="checkbox" class="spc-checkbox" value="ENH" checked> Enhanced</label>
-                    <label><input type="checkbox" class="spc-checkbox" value="MDT" checked> Moderate</label>
-                    <label><input type="checkbox" class="spc-checkbox" value="HIGH" checked> High</label>
-                </div>
-                <div id="alert-controls">
-                    <h4>Weather Alerts</h4>
-                    <label><input type="checkbox" class="alert-checkbox" value="tornado" checked> Tornado</label>
-                    <label><input type="checkbox" class="alert-checkbox" value="thunderstorm" checked> Thunderstorm</label>
-                    <label><input type="checkbox" class="alert-checkbox" value="flood" checked> Flood</label>
-                    <label><input type="checkbox" class="alert-checkbox" value="wind" checked> Wind</label>
-                    <label><input type="checkbox" class="alert-checkbox" value="snow_ice" checked> Snow/Ice</label>
-                    <label><input type="checkbox" class="alert-checkbox" value="fog" checked> Fog</label>
-                    <label><input type="checkbox" class="alert-checkbox" value="extreme_high_temperature" checked> Extreme Temp</label>
-                </div>
-            </div>
-        </div>
-    <script src="assets/cesium/Build/Cesium/Cesium.js"></script>
-    <script src="assets/js/wind.js?v=<?php echo time(); ?>"></script>
-        <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
-    <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
-
-    <!-- Cross-section Modal -->
     <div id="crossSectionModal" class="modal">
         <div class="modal-content">
             <span class="close-button">&times;</span>
+            <div id="riskScoreContainer">
+                <h3>Location Risk Assessment</h3>
+                <div id="riskScoreSummary">
+                    <strong>Overall Risk Score:</strong> <span id="riskScoreValue">Calculating...</span>
+                </div>
+                <div id="riskFactors">
+                    <p><strong>Wildfire Risk:</strong> <span id="wildfireRisk">Calculating...</span></p>
+                    <p><strong>Hurricane Risk (Live):</strong> <span id="hurricaneRisk">Calculating...</span></p>
+                    <p><strong>Hurricane Risk (Historical):</strong> <span id="historicalHurricaneRisk">Calculating...</span></p>
+                </div>
+            </div>
+            <hr>
             <h2>Atmospheric Cross-Section</h2>
             <div id="loadingIndicator" style="display: none;">Loading data...</div>
             <canvas id="crossSectionChart"></canvas>
         </div>
     </div>
+
+    <script src="assets/cesium/Build/Cesium/Cesium.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+    <script src="assets/js/wind.js?v=<?php echo time(); ?>"></script>
+    <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
 </body>
-</html>
+</html>