refactor: Migrate index.html to use unified nav partial

- Replace 100+ lines of duplicated nav markup with partial include
- Add is_index_page variable to nav partial for conditional behavior
- Satellite/SSTV use switchMode on index, link to dashboard elsewhere
- Reduces code duplication, single source of truth for navigation

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Smittix
2026-01-30 10:04:48 +00:00
parent 94fcea0e99
commit e1e05523d2
2 changed files with 20 additions and 104 deletions
+16 -3
View File
@@ -8,11 +8,11 @@
Variables:
- active_mode: Current active mode (e.g., 'pager', 'adsb', 'wifi')
- show_mode_switcher: If true (default), shows mode switching nav for index.html
If false, shows simplified dashboard nav
- is_index_page: If true, Satellite/SSTV use switchMode (panel mode)
If false (default), Satellite links to dashboard
#}
{% set show_mode_switcher = show_mode_switcher|default(true) %}
{% set is_index_page = is_index_page|default(false) %}
{# Desktop Navigation - uses existing CSS class names for compatibility #}
<nav class="mode-nav" id="mainNav">
@@ -105,10 +105,17 @@
<span class="dropdown-arrow icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg></span>
</button>
<div class="mode-nav-dropdown-menu">
{% if is_index_page %}
<button class="mode-nav-btn {% if active_mode == 'satellite' %}active{% endif %}" onclick="switchMode('satellite')">
<span class="nav-icon icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M13 7L9 3 5 7l4 4"/><path d="m17 11 4 4-4 4-4-4"/><path d="m8 12 4 4 6-6-4-4-6 6"/><path d="m16 8 3-3"/><path d="M9 21a6 6 0 0 0-6-6"/></svg></span>
<span class="nav-label">Satellite</span>
</button>
{% else %}
<a href="/satellite/dashboard" class="mode-nav-btn {% if active_mode == 'satellite' %}active{% endif %}" style="text-decoration: none;">
<span class="nav-icon icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M13 7L9 3 5 7l4 4"/><path d="m17 11 4 4-4 4-4-4"/><path d="m8 12 4 4 6-6-4-4-6 6"/><path d="m16 8 3-3"/><path d="M9 21a6 6 0 0 0-6-6"/></svg></span>
<span class="nav-label">Satellite</span>
</a>
{% endif %}
<button class="mode-nav-btn {% if active_mode == 'sstv' %}active{% endif %}" onclick="switchMode('sstv')">
<span class="nav-icon icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="12" cy="12" r="3"/><path d="M3 9h2"/><path d="M19 9h2"/><path d="M3 15h2"/><path d="M19 15h2"/></svg></span>
<span class="nav-label">ISS SSTV</span>
@@ -186,9 +193,15 @@
<button class="mobile-nav-btn {% if active_mode == 'tscm' %}active{% endif %}" data-mode="tscm" onclick="switchMode('tscm')">
<span class="icon icon--sm"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg></span> TSCM
</button>
{% if is_index_page %}
<button class="mobile-nav-btn {% if active_mode == 'satellite' %}active{% endif %}" data-mode="satellite" onclick="switchMode('satellite')">
<span class="icon icon--sm"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M13 7L9 3 5 7l4 4"/><path d="m17 11 4 4-4 4-4-4"/><path d="m8 12 4 4 6-6-4-4-6 6"/></svg></span> Sat
</button>
{% else %}
<a href="/satellite/dashboard" class="mobile-nav-btn {% if active_mode == 'satellite' %}active{% endif %}" style="text-decoration: none;">
<span class="icon icon--sm"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M13 7L9 3 5 7l4 4"/><path d="m17 11 4 4-4 4-4-4"/><path d="m8 12 4 4 6-6-4-4-6 6"/></svg></span> Sat
</a>
{% endif %}
<button class="mobile-nav-btn {% if active_mode == 'sstv' %}active{% endif %}" data-mode="sstv" onclick="switchMode('sstv')">
<span class="icon icon--sm"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="12" cy="12" r="3"/></svg></span> SSTV
</button>