From a35fd02277f7a91c0f757abee83aa587f2921219 Mon Sep 17 00:00:00 2001
From: Stream <stream@openclaw>
Date: Sun, 19 Apr 2026 22:20:01 +0300
Subject: [PATCH] auto-sync: 2026-04-19 22:20:01

---
 .../flightradar24/frontend/static/index.html  | 27 ++++++++++++++++---
 1 file changed, 23 insertions(+), 4 deletions(-)

diff --git a/tasks/flightradar24/frontend/static/index.html b/tasks/flightradar24/frontend/static/index.html
index c7f1b8a..1fa3b1b 100644
--- a/tasks/flightradar24/frontend/static/index.html
+++ b/tasks/flightradar24/frontend/static/index.html
@@ -39,6 +39,15 @@
   <h2>✈ FR24 Live</h2>
   <div class="stat">Aircraft: <span id="ac-count">—</span></div>
   <div class="stat">Updated: <span id="last-update">—</span></div>
+  <div class="stat" style="margin-top:6px;">
+    Period: <select id="period-select" style="background:#161b22;color:#c9d1d9;border:1px solid #30363d;border-radius:4px;font-size:12px;padding:2px 4px;">
+      <option value="60">1 hour</option>
+      <option value="360">6 hours</option>
+      <option value="720">12 hours</option>
+      <option value="1440">1 day</option>
+      <option value="4320" selected>3 days</option>
+    </select>
+  </div>
   <div class="stat" id="status-line"></div>
   <a href="/monitoring">📊 Monitoring</a>
 </div>
@@ -58,6 +67,16 @@
 
 <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
 <script>
+function getMinutes() {
+  const sel = document.getElementById('period-select');
+  return sel ? parseInt(sel.value) : 4320;
+}
+
+document.addEventListener('DOMContentLoaded', () => {
+  const sel = document.getElementById('period-select');
+  if (sel) sel.addEventListener('change', () => refresh());
+});
+
 const map = L.map('map').setView([55.75, 37.62], 7);
 
 L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
@@ -106,7 +125,7 @@ function closePopup() {
 
 async function refreshTracks() {
   try {
-    const res = await fetch('/api/tracks?minutes=180');
+    const res = await fetch('/api/tracks?minutes=' + getMinutes());
     if (!res.ok) return;
     const geojson = await res.json();
     let features = geojson.features || [];
@@ -123,8 +142,8 @@ async function refreshTracks() {
       const callsign = f.properties.callsign || f.properties.icao24;
       const line = L.polyline(coords, {
         color: '#58a6ff',
-        weight: 1.5,
-        opacity: 0.4,
+        weight: 3,
+        opacity: 0.7,
       }).addTo(map);
       line.bindPopup(callsign);
       trackLayers.push(line);
@@ -135,7 +154,7 @@ async function refreshTracks() {
 async function refresh() {
   try {
     const [acRes] = await Promise.all([
-      fetch('/api/aircraft/live?minutes=180'),
+      fetch('/api/aircraft/live?minutes=' + getMinutes()),
       refreshTracks(),
     ]);
     if (!acRes.ok) throw new Error('HTTP ' + acRes.status);