CHANGELOG.md

@@ -5,12 +5,59 @@ All notable changes to Seismo Fleet Manager will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [0.4.1] - 2026 1-5
+## [0.4.2] - 2026-01-05
-### Added
-- **SLM integration**: Sound Level meters are now managable in SFM
 
-## Fixed ##
+### Added
-- Fixed an issue where unit status wat loading from a saved cache and not based on when it was actually heard from last. Unit status is now accurate.
+- **SLM Configuration Interface**: Sound Level Meters can now be configured directly from the SLM dashboard
+  - Configuration modal with comprehensive SLM parameter editing
+  - TCP port configuration for SLM control connections (default: 2255)
+  - FTP port configuration for SLM data retrieval (default: 21)
+  - Modem assignment for network access or direct IP connection support
+  - Test Modem button with ping-based connectivity verification (shows IP and response time)
+  - Test SLM Connection button for end-to-end connectivity validation
+  - Dynamic form fields that hide/show based on modem selection
+- **SLM Dashboard Endpoints**: New API routes for SLM management
+  - `GET /api/slm-dashboard/config/{unit_id}` - Load SLM configuration form
+  - `POST /api/slm-dashboard/config/{unit_id}` - Save SLM configuration
+  - `GET /api/slm-dashboard/test-modem/{modem_id}` - Ping modem for connectivity test
+- **Database Schema Updates**: Added `slm_ftp_port` column to roster table
+  - Migration script: `scripts/add_slm_ftp_port.py`
+  - Supports both TCP (control) and FTP (data) port configuration per SLM unit
+- **Docker Environment Enhancements**:
+  - Added `iputils-ping` and `curl` packages to Docker image for network diagnostics
+  - Health check endpoint support via curl
+
+### Fixed
+- **Form Validation**: Fixed 400 Bad Request error when adding modem units
+  - Form fields for device-specific parameters now properly disabled when hidden
+  - Empty string values for integer fields no longer cause validation failures
+  - JavaScript now disables hidden form sections to prevent unwanted data submission
+- **Unit Status Accuracy**: Fixed issue where unit status was loading from a saved cache instead of actual last-heard time
+  - Unit status now accurately reflects real-time connectivity
+  - Status determination based on actual `slm_last_check` timestamp
+
+### Changed
+- **Roster Form Behavior**: Device-specific form fields are now disabled (not just hidden) when not applicable
+  - Prevents SLM fields from submitting when adding modems
+  - Prevents modem fields from submitting when adding SLMs
+  - Cleaner form submissions with only relevant data
+- **Port Field Handling**: Backend now accepts port fields as strings and converts to integers
+  - Handles empty string values gracefully
+  - Proper type conversion with None fallback for empty values
+
+### Technical Details
+- Added `setFieldsDisabled()` helper function for managing form field state
+- Updated `toggleDeviceFields()` and `toggleEditDeviceFields()` to disable/enable fields
+- Backend type conversion: `slm_tcp_port` and `slm_ftp_port` accept strings, convert to int with empty string handling
+- Modem ping uses subprocess with 1 packet, 2-second timeout, returns response time in milliseconds
+- Configuration form uses 3-column grid layout for TCP Port, FTP Port, and Direct IP fields
+
+## [0.4.1] - 2026-01-05
+### Added
+- **SLM Integration**: Sound Level Meters are now manageable in SFM
+
+### Fixed
+- Fixed an issue where unit status was loading from a saved cache and not based on when it was actually heard from last. Unit status is now accurate.
 
 
 ## [0.4.0] - 2025-12-16
@@ -301,6 +348,8 @@ No database migration required for v0.4.0. All new features use existing databas
 - Photo management per unit
 - Automated status categorization (OK/Pending/Missing)
 
+[0.4.2]: https://github.com/serversdwn/seismo-fleet-manager/compare/v0.4.1...v0.4.2
+[0.4.1]: https://github.com/serversdwn/seismo-fleet-manager/compare/v0.4.0...v0.4.1
 [0.4.0]: https://github.com/serversdwn/seismo-fleet-manager/compare/v0.3.3...v0.4.0
 [0.3.3]: https://github.com/serversdwn/seismo-fleet-manager/compare/v0.3.2...v0.3.3
 [0.3.2]: https://github.com/serversdwn/seismo-fleet-manager/compare/v0.3.1...v0.3.2

Dockerfile

@@ -3,6 +3,11 @@ FROM python:3.11-slim
 # Set working directory
 WORKDIR /app
 
+# Install system dependencies (ping for network diagnostics)
+RUN apt-get update && \
+    apt-get install -y --no-install-recommends iputils-ping curl && \
+    rm -rf /var/lib/apt/lists/*
+
 # Copy requirements first for better caching
 COPY requirements.txt .
 

README.md

@@ -1,4 +1,4 @@
-# Seismo Fleet Manager v0.4.1
+# Seismo Fleet Manager v0.4.2
 Backend API and HTMX-powered web interface for managing a mixed fleet of seismographs and field modems. Track deployments, monitor health in real time, merge roster intent with incoming telemetry, and control your fleet through a unified database and dashboard.
 
 ## Features

backend/main.py

@@ -9,7 +9,7 @@ from typing import List, Dict
 from pydantic import BaseModel
 
 from backend.database import engine, Base, get_db
-from backend.routers import roster, units, photos, roster_edit, dashboard, dashboard_tabs, activity, slmm, slm_ui
+from backend.routers import roster, units, photos, roster_edit, dashboard, dashboard_tabs, activity, slmm, slm_ui, slm_dashboard, seismo_dashboard
 from backend.services.snapshot import emit_status_snapshot
 from backend.models import IgnoredUnit
 
@@ -20,7 +20,7 @@ Base.metadata.create_all(bind=engine)
 ENVIRONMENT = os.getenv("ENVIRONMENT", "production")
 
 # Initialize FastAPI app
-VERSION = "0.4.0"
+VERSION = "0.4.2"
 app = FastAPI(
     title="Seismo Fleet Manager",
     description="Backend API for managing seismograph fleet status",
@@ -70,6 +70,8 @@ app.include_router(dashboard_tabs.router)
 app.include_router(activity.router)
 app.include_router(slmm.router)
 app.include_router(slm_ui.router)
+app.include_router(slm_dashboard.router)
+app.include_router(seismo_dashboard.router)
 
 from backend.routers import settings
 app.include_router(settings.router)
@@ -109,6 +111,18 @@ async def settings_page(request: Request):
     return templates.TemplateResponse("settings.html", {"request": request})
 
 
+@app.get("/sound-level-meters", response_class=HTMLResponse)
+async def sound_level_meters_page(request: Request):
+    """Sound Level Meters management dashboard"""
+    return templates.TemplateResponse("sound_level_meters.html", {"request": request})
+
+
+@app.get("/seismographs", response_class=HTMLResponse)
+async def seismographs_page(request: Request):
+    """Seismographs management dashboard"""
+    return templates.TemplateResponse("seismographs.html", {"request": request})
+
+
 # ===== PWA ROUTES =====
 
 @app.get("/sw.js")

backend/models.py

@@ -39,7 +39,9 @@ class RosterUnit(Base):
     # Seismograph-specific fields (nullable for modems and SLMs)
     last_calibrated = Column(Date, nullable=True)
     next_calibration_due = Column(Date, nullable=True)
-    deployed_with_modem_id = Column(String, nullable=True)  # FK to another RosterUnit
+
+    # Modem assignment (shared by seismographs and SLMs)
+    deployed_with_modem_id = Column(String, nullable=True)  # FK to another RosterUnit (device_type=modem)
 
     # Modem-specific fields (nullable for seismographs and SLMs)
     ip_address = Column(String, nullable=True)
@@ -49,6 +51,7 @@ class RosterUnit(Base):
     # Sound Level Meter-specific fields (nullable for seismographs and modems)
     slm_host = Column(String, nullable=True)  # Device IP or hostname
     slm_tcp_port = Column(Integer, nullable=True)  # TCP control port (default 2255)
+    slm_ftp_port = Column(Integer, nullable=True)  # FTP data retrieval port (default 21)
     slm_model = Column(String, nullable=True)  # NL-43, NL-53, etc.
     slm_serial_number = Column(String, nullable=True)  # Device serial number
     slm_frequency_weighting = Column(String, nullable=True)  # A, C, Z

backend/routers/roster_edit.py

@@ -57,8 +57,25 @@ def add_roster_unit(
     ip_address: str = Form(None),
     phone_number: str = Form(None),
     hardware_model: str = Form(None),
+    # Sound Level Meter-specific fields
+    slm_host: str = Form(None),
+    slm_tcp_port: str = Form(None),
+    slm_ftp_port: str = Form(None),
+    slm_model: str = Form(None),
+    slm_serial_number: str = Form(None),
+    slm_frequency_weighting: str = Form(None),
+    slm_time_weighting: str = Form(None),
+    slm_measurement_range: str = Form(None),
     db: Session = Depends(get_db)
 ):
+    import logging
+    logger = logging.getLogger(__name__)
+    logger.info(f"Adding unit: id={id}, device_type={device_type}, slm_tcp_port={slm_tcp_port}, slm_ftp_port={slm_ftp_port}")
+
+    # Convert port strings to integers
+    slm_tcp_port_int = int(slm_tcp_port) if slm_tcp_port and slm_tcp_port.strip() else None
+    slm_ftp_port_int = int(slm_ftp_port) if slm_ftp_port and slm_ftp_port.strip() else None
+
     if db.query(RosterUnit).filter(RosterUnit.id == id).first():
         raise HTTPException(status_code=400, detail="Unit already exists")
 
@@ -97,12 +114,38 @@ def add_roster_unit(
         ip_address=ip_address if ip_address else None,
         phone_number=phone_number if phone_number else None,
         hardware_model=hardware_model if hardware_model else None,
+        # Sound Level Meter-specific fields
+        slm_host=slm_host if slm_host else None,
+        slm_tcp_port=slm_tcp_port_int,
+        slm_ftp_port=slm_ftp_port_int,
+        slm_model=slm_model if slm_model else None,
+        slm_serial_number=slm_serial_number if slm_serial_number else None,
+        slm_frequency_weighting=slm_frequency_weighting if slm_frequency_weighting else None,
+        slm_time_weighting=slm_time_weighting if slm_time_weighting else None,
+        slm_measurement_range=slm_measurement_range if slm_measurement_range else None,
     )
     db.add(unit)
     db.commit()
     return {"message": "Unit added", "id": id, "device_type": device_type}
 
 
+@router.get("/modems")
+def get_modems_list(db: Session = Depends(get_db)):
+    """Get list of all modem units for dropdown selection"""
+    modems = db.query(RosterUnit).filter_by(device_type="modem", retired=False).order_by(RosterUnit.id).all()
+
+    return [
+        {
+            "id": modem.id,
+            "ip_address": modem.ip_address,
+            "phone_number": modem.phone_number,
+            "hardware_model": modem.hardware_model,
+            "deployed": modem.deployed
+        }
+        for modem in modems
+    ]
+
+
 @router.get("/{unit_id}")
 def get_roster_unit(unit_id: str, db: Session = Depends(get_db)):
     """Get a single roster unit by ID"""
@@ -127,6 +170,14 @@ def get_roster_unit(unit_id: str, db: Session = Depends(get_db)):
         "ip_address": unit.ip_address or "",
         "phone_number": unit.phone_number or "",
         "hardware_model": unit.hardware_model or "",
+        "slm_host": unit.slm_host or "",
+        "slm_tcp_port": unit.slm_tcp_port or "",
+        "slm_ftp_port": unit.slm_ftp_port or "",
+        "slm_model": unit.slm_model or "",
+        "slm_serial_number": unit.slm_serial_number or "",
+        "slm_frequency_weighting": unit.slm_frequency_weighting or "",
+        "slm_time_weighting": unit.slm_time_weighting or "",
+        "slm_measurement_range": unit.slm_measurement_range or "",
     }
 
 
@@ -150,12 +201,25 @@ def edit_roster_unit(
     ip_address: str = Form(None),
     phone_number: str = Form(None),
     hardware_model: str = Form(None),
+    # Sound Level Meter-specific fields
+    slm_host: str = Form(None),
+    slm_tcp_port: str = Form(None),
+    slm_ftp_port: str = Form(None),
+    slm_model: str = Form(None),
+    slm_serial_number: str = Form(None),
+    slm_frequency_weighting: str = Form(None),
+    slm_time_weighting: str = Form(None),
+    slm_measurement_range: str = Form(None),
     db: Session = Depends(get_db)
 ):
     unit = db.query(RosterUnit).filter(RosterUnit.id == unit_id).first()
     if not unit:
         raise HTTPException(status_code=404, detail="Unit not found")
 
+    # Convert port strings to integers
+    slm_tcp_port_int = int(slm_tcp_port) if slm_tcp_port and slm_tcp_port.strip() else None
+    slm_ftp_port_int = int(slm_ftp_port) if slm_ftp_port and slm_ftp_port.strip() else None
+
     # Parse date fields if provided
     last_cal_date = None
     if last_calibrated:
@@ -198,6 +262,16 @@ def edit_roster_unit(
     unit.phone_number = phone_number if phone_number else None
     unit.hardware_model = hardware_model if hardware_model else None
 
+    # Sound Level Meter-specific fields
+    unit.slm_host = slm_host if slm_host else None
+    unit.slm_tcp_port = slm_tcp_port_int
+    unit.slm_ftp_port = slm_ftp_port_int
+    unit.slm_model = slm_model if slm_model else None
+    unit.slm_serial_number = slm_serial_number if slm_serial_number else None
+    unit.slm_frequency_weighting = slm_frequency_weighting if slm_frequency_weighting else None
+    unit.slm_time_weighting = slm_time_weighting if slm_time_weighting else None
+    unit.slm_measurement_range = slm_measurement_range if slm_measurement_range else None
+
     # Record history entries for changed fields
     if old_note != note:
         record_history(db, unit_id, "note_change", "note", old_note, note, "manual")

backend/routers/seismo_dashboard.py

@@ -0,0 +1,81 @@
+"""
+Seismograph Dashboard API Router
+Provides endpoints for the seismograph-specific dashboard
+"""
+
+from fastapi import APIRouter, Request, Depends, Query
+from fastapi.responses import HTMLResponse
+from fastapi.templating import Jinja2Templates
+from sqlalchemy.orm import Session
+from backend.database import get_db
+from backend.models import RosterUnit
+
+router = APIRouter(prefix="/api/seismo-dashboard", tags=["seismo-dashboard"])
+templates = Jinja2Templates(directory="templates")
+
+
+@router.get("/stats", response_class=HTMLResponse)
+async def get_seismo_stats(request: Request, db: Session = Depends(get_db)):
+    """
+    Returns HTML partial with seismograph statistics summary
+    """
+    # Get all seismograph units
+    seismos = db.query(RosterUnit).filter_by(
+        device_type="seismograph",
+        retired=False
+    ).all()
+
+    total = len(seismos)
+    deployed = sum(1 for s in seismos if s.deployed)
+    benched = sum(1 for s in seismos if not s.deployed)
+
+    # Count modems assigned to deployed seismographs
+    with_modem = sum(1 for s in seismos if s.deployed and s.deployed_with_modem_id)
+    without_modem = deployed - with_modem
+
+    return templates.TemplateResponse(
+        "partials/seismo_stats.html",
+        {
+            "request": request,
+            "total": total,
+            "deployed": deployed,
+            "benched": benched,
+            "with_modem": with_modem,
+            "without_modem": without_modem
+        }
+    )
+
+
+@router.get("/units", response_class=HTMLResponse)
+async def get_seismo_units(
+    request: Request,
+    db: Session = Depends(get_db),
+    search: str = Query(None)
+):
+    """
+    Returns HTML partial with filterable seismograph unit list
+    """
+    query = db.query(RosterUnit).filter_by(
+        device_type="seismograph",
+        retired=False
+    )
+
+    # Apply search filter
+    if search:
+        search_lower = search.lower()
+        query = query.filter(
+            (RosterUnit.id.ilike(f"%{search}%")) |
+            (RosterUnit.note.ilike(f"%{search}%")) |
+            (RosterUnit.address.ilike(f"%{search}%"))
+        )
+
+    seismos = query.order_by(RosterUnit.id).all()
+
+    return templates.TemplateResponse(
+        "partials/seismo_unit_list.html",
+        {
+            "request": request,
+            "units": seismos,
+            "search": search or ""
+        }
+    )

backend/routers/slm_dashboard.py

@@ -0,0 +1,308 @@
+"""
+SLM Dashboard Router
+
+Provides API endpoints for the Sound Level Meters dashboard page.
+"""
+
+from fastapi import APIRouter, Request, Depends, Query
+from fastapi.templating import Jinja2Templates
+from fastapi.responses import HTMLResponse
+from sqlalchemy.orm import Session
+from sqlalchemy import func
+from datetime import datetime, timedelta
+import httpx
+import logging
+
+from backend.database import get_db
+from backend.models import RosterUnit
+
+logger = logging.getLogger(__name__)
+
+router = APIRouter(prefix="/api/slm-dashboard", tags=["slm-dashboard"])
+templates = Jinja2Templates(directory="templates")
+
+
+@router.get("/stats", response_class=HTMLResponse)
+async def get_slm_stats(request: Request, db: Session = Depends(get_db)):
+    """
+    Get summary statistics for SLM dashboard.
+    Returns HTML partial with stat cards.
+    """
+    # Query all SLMs
+    all_slms = db.query(RosterUnit).filter_by(device_type="sound_level_meter").all()
+
+    # Count deployed vs benched
+    deployed_count = sum(1 for slm in all_slms if slm.deployed and not slm.retired)
+    benched_count = sum(1 for slm in all_slms if not slm.deployed and not slm.retired)
+    retired_count = sum(1 for slm in all_slms if slm.retired)
+
+    # Count recently active (checked in last hour)
+    one_hour_ago = datetime.utcnow() - timedelta(hours=1)
+    active_count = sum(1 for slm in all_slms
+                      if slm.slm_last_check and slm.slm_last_check > one_hour_ago)
+
+    return templates.TemplateResponse("partials/slm_stats.html", {
+        "request": request,
+        "total_count": len(all_slms),
+        "deployed_count": deployed_count,
+        "benched_count": benched_count,
+        "active_count": active_count,
+        "retired_count": retired_count
+    })
+
+
+@router.get("/units", response_class=HTMLResponse)
+async def get_slm_units(
+    request: Request,
+    db: Session = Depends(get_db),
+    search: str = Query(None)
+):
+    """
+    Get list of SLM units for the sidebar.
+    Returns HTML partial with unit cards.
+    """
+    query = db.query(RosterUnit).filter_by(device_type="sound_level_meter")
+
+    # Filter by search term if provided
+    if search:
+        search_term = f"%{search}%"
+        query = query.filter(
+            (RosterUnit.id.like(search_term)) |
+            (RosterUnit.slm_model.like(search_term)) |
+            (RosterUnit.address.like(search_term))
+        )
+
+    # Only show deployed units by default
+    units = query.filter_by(deployed=True, retired=False).order_by(RosterUnit.id).all()
+
+    return templates.TemplateResponse("partials/slm_unit_list.html", {
+        "request": request,
+        "units": units
+    })
+
+
+@router.get("/live-view/{unit_id}", response_class=HTMLResponse)
+async def get_live_view(request: Request, unit_id: str, db: Session = Depends(get_db)):
+    """
+    Get live view panel for a specific SLM unit.
+    Returns HTML partial with live metrics and chart.
+    """
+    # Get unit from database
+    unit = db.query(RosterUnit).filter_by(id=unit_id, device_type="sound_level_meter").first()
+
+    if not unit:
+        return templates.TemplateResponse("partials/slm_live_view_error.html", {
+            "request": request,
+            "error": f"Unit {unit_id} not found"
+        })
+
+    # Get modem information if assigned
+    modem = None
+    modem_ip = None
+    if unit.deployed_with_modem_id:
+        modem = db.query(RosterUnit).filter_by(id=unit.deployed_with_modem_id, device_type="modem").first()
+        if modem:
+            modem_ip = modem.ip_address
+        else:
+            logger.warning(f"SLM {unit_id} is assigned to modem {unit.deployed_with_modem_id} but modem not found")
+
+    # Fallback to direct slm_host if no modem assigned (backward compatibility)
+    if not modem_ip and unit.slm_host:
+        modem_ip = unit.slm_host
+        logger.info(f"Using legacy slm_host for {unit_id}: {modem_ip}")
+
+    # Try to get current status from SLMM
+    current_status = None
+    measurement_state = None
+    is_measuring = False
+
+    try:
+        async with httpx.AsyncClient(timeout=5.0) as client:
+            # Get measurement state
+            state_response = await client.get(
+                f"http://localhost:8100/api/nl43/{unit_id}/measurement-state"
+            )
+            if state_response.status_code == 200:
+                state_data = state_response.json()
+                measurement_state = state_data.get("measurement_state", "Unknown")
+                is_measuring = state_data.get("is_measuring", False)
+
+            # Get live status
+            status_response = await client.get(
+                f"http://localhost:8100/api/nl43/{unit_id}/live"
+            )
+            if status_response.status_code == 200:
+                status_data = status_response.json()
+                current_status = status_data.get("data", {})
+    except Exception as e:
+        logger.error(f"Failed to get status for {unit_id}: {e}")
+
+    return templates.TemplateResponse("partials/slm_live_view.html", {
+        "request": request,
+        "unit": unit,
+        "modem": modem,
+        "modem_ip": modem_ip,
+        "current_status": current_status,
+        "measurement_state": measurement_state,
+        "is_measuring": is_measuring
+    })
+
+
+@router.post("/control/{unit_id}/{action}")
+async def control_slm(unit_id: str, action: str):
+    """
+    Send control commands to SLM (start, stop, pause, resume, reset).
+    Proxies to SLMM backend.
+    """
+    valid_actions = ["start", "stop", "pause", "resume", "reset"]
+
+    if action not in valid_actions:
+        return {"status": "error", "detail": f"Invalid action. Must be one of: {valid_actions}"}
+
+    try:
+        async with httpx.AsyncClient(timeout=10.0) as client:
+            response = await client.post(
+                f"http://localhost:8100/api/nl43/{unit_id}/{action}"
+            )
+
+            if response.status_code == 200:
+                return response.json()
+            else:
+                return {
+                    "status": "error",
+                    "detail": f"SLMM returned status {response.status_code}"
+                }
+    except Exception as e:
+        logger.error(f"Failed to control {unit_id}: {e}")
+        return {
+            "status": "error",
+            "detail": str(e)
+        }
+
+@router.get("/config/{unit_id}", response_class=HTMLResponse)
+async def get_slm_config(request: Request, unit_id: str, db: Session = Depends(get_db)):
+    """
+    Get configuration form for a specific SLM unit.
+    Returns HTML partial with configuration form.
+    """
+    unit = db.query(RosterUnit).filter_by(id=unit_id, device_type="sound_level_meter").first()
+
+    if not unit:
+        return HTMLResponse(
+            content=f'<div class="text-red-500">Unit {unit_id} not found</div>',
+            status_code=404
+        )
+
+    return templates.TemplateResponse("partials/slm_config_form.html", {
+        "request": request,
+        "unit": unit
+    })
+
+
+@router.post("/config/{unit_id}")
+async def save_slm_config(request: Request, unit_id: str, db: Session = Depends(get_db)):
+    """
+    Save SLM configuration.
+    Updates unit parameters in the database.
+    """
+    unit = db.query(RosterUnit).filter_by(id=unit_id, device_type="sound_level_meter").first()
+
+    if not unit:
+        return {"status": "error", "detail": f"Unit {unit_id} not found"}
+
+    try:
+        # Get form data
+        form_data = await request.form()
+
+        # Update SLM-specific fields
+        unit.slm_model = form_data.get("slm_model") or None
+        unit.slm_serial_number = form_data.get("slm_serial_number") or None
+        unit.slm_frequency_weighting = form_data.get("slm_frequency_weighting") or None
+        unit.slm_time_weighting = form_data.get("slm_time_weighting") or None
+        unit.slm_measurement_range = form_data.get("slm_measurement_range") or None
+
+        # Update network configuration
+        modem_id = form_data.get("deployed_with_modem_id")
+        unit.deployed_with_modem_id = modem_id if modem_id else None
+
+        # Always update TCP and FTP ports (used regardless of modem assignment)
+        unit.slm_tcp_port = int(form_data.get("slm_tcp_port")) if form_data.get("slm_tcp_port") else None
+        unit.slm_ftp_port = int(form_data.get("slm_ftp_port")) if form_data.get("slm_ftp_port") else None
+
+        # Only update direct IP if no modem is assigned
+        if not modem_id:
+            unit.slm_host = form_data.get("slm_host") or None
+        else:
+            # Clear legacy direct IP field when modem is assigned
+            unit.slm_host = None
+
+        db.commit()
+        logger.info(f"Updated configuration for SLM {unit_id}")
+
+        return {"status": "success", "unit_id": unit_id}
+
+    except Exception as e:
+        db.rollback()
+        logger.error(f"Failed to save config for {unit_id}: {e}")
+        return {"status": "error", "detail": str(e)}
+
+
+@router.get("/test-modem/{modem_id}")
+async def test_modem_connection(modem_id: str, db: Session = Depends(get_db)):
+    """
+    Test modem connectivity with a simple ping/health check.
+    Returns response time and connection status.
+    """
+    import subprocess
+    import time
+
+    # Get modem from database
+    modem = db.query(RosterUnit).filter_by(id=modem_id, device_type="modem").first()
+
+    if not modem:
+        return {"status": "error", "detail": f"Modem {modem_id} not found"}
+
+    if not modem.ip_address:
+        return {"status": "error", "detail": f"Modem {modem_id} has no IP address configured"}
+
+    try:
+        # Ping the modem (1 packet, 2 second timeout)
+        start_time = time.time()
+        result = subprocess.run(
+            ["ping", "-c", "1", "-W", "2", modem.ip_address],
+            capture_output=True,
+            text=True,
+            timeout=3
+        )
+        response_time = int((time.time() - start_time) * 1000)  # Convert to milliseconds
+
+        if result.returncode == 0:
+            return {
+                "status": "success",
+                "modem_id": modem_id,
+                "ip_address": modem.ip_address,
+                "response_time": response_time,
+                "message": "Modem is responding to ping"
+            }
+        else:
+            return {
+                "status": "error",
+                "modem_id": modem_id,
+                "ip_address": modem.ip_address,
+                "detail": "Modem not responding to ping"
+            }
+
+    except subprocess.TimeoutExpired:
+        return {
+            "status": "error",
+            "modem_id": modem_id,
+            "ip_address": modem.ip_address,
+            "detail": "Ping timeout (> 2 seconds)"
+        }
+    except Exception as e:
+        logger.error(f"Failed to ping modem {modem_id}: {e}")
+        return {
+            "status": "error",
+            "modem_id": modem_id,
+            "detail": str(e)
+        }

docs/DEVICE_TYPE_DASHBOARDS.md

@@ -0,0 +1,276 @@
+# Device Type Dashboards
+
+This document describes the separate dashboard system for different device types in SFM.
+
+## Overview
+
+SFM now has dedicated dashboards for each device type:
+- **Main Dashboard** (`/`) - Combined overview of all devices
+- **Seismographs Dashboard** (`/seismographs`) - Seismograph-specific view
+- **Sound Level Meters Dashboard** (`/sound-level-meters`) - SLM-specific view
+- **Fleet Roster** (`/roster`) - All devices with filtering and management
+
+## Architecture
+
+### 1. Main Dashboard
+
+**Route**: `/`
+**Template**: [templates/dashboard.html](../templates/dashboard.html)
+**Purpose**: Combined overview showing all device types
+
+**Features**:
+- Fleet summary card now includes device type breakdown
+- Shows count of seismographs and SLMs separately
+- Links to dedicated dashboards for each device type
+- Shared components: map, alerts, recent photos, fleet status
+
+**Device Type Counts**:
+The dashboard calculates device type counts in JavaScript from the snapshot data:
+
+```javascript
+// Device type counts
+let seismoCount = 0;
+let slmCount = 0;
+Object.values(data.units || {}).forEach(unit => {
+    if (unit.retired) return; // Don't count retired units
+    const deviceType = unit.device_type || 'seismograph';
+    if (deviceType === 'seismograph') {
+        seismoCount++;
+    } else if (deviceType === 'sound_level_meter') {
+        slmCount++;
+    }
+});
+```
+
+### 2. Seismographs Dashboard
+
+**Route**: `/seismographs`
+**Template**: [templates/seismographs.html](../templates/seismographs.html)
+**Router**: [backend/routers/seismo_dashboard.py](../backend/routers/seismo_dashboard.py)
+
+**API Endpoints**:
+- `GET /api/seismo-dashboard/stats` - Statistics summary (HTML partial)
+- `GET /api/seismo-dashboard/units?search=<query>` - Unit list with search (HTML partial)
+
+**Features**:
+- Statistics cards (total, deployed, benched, with/without modem)
+- Searchable unit list with real-time filtering
+- Shows modem assignments
+- Links to individual unit detail pages
+
+**Stats Calculation** ([backend/routers/seismo_dashboard.py:18](../backend/routers/seismo_dashboard.py#L18)):
+
+```python
+seismos = db.query(RosterUnit).filter_by(
+    device_type="seismograph",
+    retired=False
+).all()
+
+total = len(seismos)
+deployed = sum(1 for s in seismos if s.deployed)
+benched = sum(1 for s in seismos if not s.deployed)
+with_modem = sum(1 for s in seismos if s.deployed and s.deployed_with_modem_id)
+```
+
+### 3. Sound Level Meters Dashboard
+
+**Route**: `/sound-level-meters`
+**Template**: [templates/sound_level_meters.html](../templates/sound_level_meters.html)
+**Router**: [backend/routers/slm_dashboard.py](../backend/routers/slm_dashboard.py)
+
+**API Endpoints**:
+- `GET /api/slm-dashboard/stats` - Statistics summary (HTML partial)
+- `GET /api/slm-dashboard/units?search=<query>` - Unit list with search (HTML partial)
+- `GET /api/slm-dashboard/live-view/{unit_id}` - Live view panel (HTML partial)
+
+**Features**:
+- Statistics cards (total, deployed, benched, measuring)
+- Searchable unit list
+- Live view panel with real-time measurement data
+- WebSocket integration for DRD streaming
+- Shows modem assignments and IP resolution
+
+See [SOUND_LEVEL_METERS_DASHBOARD.md](SOUND_LEVEL_METERS_DASHBOARD.md) for detailed SLM dashboard documentation.
+
+## Navigation
+
+The sidebar navigation ([templates/base.html:116-128](../templates/base.html#L116-L128)) includes links to both dashboards:
+
+```html
+<a href="/seismographs">
+    <svg>...</svg>
+    Seismographs
+</a>
+
+<a href="/sound-level-meters">
+    <svg>...</svg>
+    Sound Level Meters
+</a>
+```
+
+Active page highlighting is automatic based on `request.url.path`.
+
+## Database Queries
+
+All dashboards filter by device type using SQLAlchemy:
+
+### Seismographs Query
+```python
+seismos = db.query(RosterUnit).filter_by(
+    device_type="seismograph",
+    retired=False
+).all()
+```
+
+### Sound Level Meters Query
+```python
+slms = db.query(RosterUnit).filter_by(
+    device_type="sound_level_meter",
+    retired=False
+).all()
+```
+
+### With Search Filter
+```python
+query = db.query(RosterUnit).filter_by(
+    device_type="seismograph",
+    retired=False
+)
+
+if search:
+    query = query.filter(
+        (RosterUnit.id.ilike(f"%{search}%")) |
+        (RosterUnit.note.ilike(f"%{search}%")) |
+        (RosterUnit.address.ilike(f"%{search}%"))
+    )
+```
+
+## UI Components
+
+### Stats Cards (Partials)
+
+**Seismograph Stats**: [templates/partials/seismo_stats.html](../templates/partials/seismo_stats.html)
+- Total Seismographs
+- Deployed
+- Benched
+- With Modem (showing X / Y deployed)
+
+**SLM Stats**: [templates/partials/slm_stats.html](../templates/partials/slm_stats.html)
+- Total SLMs
+- Deployed
+- Benched
+- Currently Measuring (from live status)
+
+### Unit Lists (Partials)
+
+**Seismograph List**: [templates/partials/seismo_unit_list.html](../templates/partials/seismo_unit_list.html)
+
+Table columns:
+- Unit ID (link to detail page)
+- Status (Deployed/Benched badge)
+- Modem (link to modem unit)
+- Location (address or coordinates)
+- Notes
+- Actions (View Details link)
+
+**SLM List**: [templates/partials/slm_unit_list.html](../templates/partials/slm_unit_list.html)
+
+Table columns:
+- Unit ID (link to detail page)
+- Model (NL-43, NL-53)
+- Status (Deployed/Benched badge)
+- Modem (link to modem unit)
+- Location
+- Actions (View Details, Live View)
+
+## HTMX Integration
+
+Both dashboards use HTMX for dynamic updates:
+
+### Auto-refresh Stats
+```html
+<div hx-get="/api/seismo-dashboard/stats"
+     hx-trigger="load, every 30s"
+     hx-swap="innerHTML">
+```
+
+### Search with Debouncing
+```html
+<input type="text"
+       hx-get="/api/seismo-dashboard/units"
+       hx-trigger="keyup changed delay:300ms"
+       hx-target="#seismo-units-list"
+       name="search" />
+```
+
+## Adding New Device Types
+
+To add support for a new device type (e.g., "modem"):
+
+1. **Create Router** (`backend/routers/modem_dashboard.py`):
+```python
+@router.get("/stats", response_class=HTMLResponse)
+async def get_modem_stats(request: Request, db: Session = Depends(get_db)):
+    modems = db.query(RosterUnit).filter_by(
+        device_type="modem",
+        retired=False
+    ).all()
+    # Calculate stats and return partial
+```
+
+2. **Create Templates**:
+   - `templates/modems.html` - Main dashboard page
+   - `templates/partials/modem_stats.html` - Stats cards
+   - `templates/partials/modem_unit_list.html` - Unit list table
+
+3. **Register in main.py**:
+```python
+from backend.routers import modem_dashboard
+app.include_router(modem_dashboard.router)
+
+@app.get("/modems", response_class=HTMLResponse)
+async def modems_page(request: Request):
+    return templates.TemplateResponse("modems.html", {"request": request})
+```
+
+4. **Add to Navigation** (`templates/base.html`):
+```html
+<a href="/modems">
+    <svg>...</svg>
+    Modems
+</a>
+```
+
+5. **Update Main Dashboard** (`templates/dashboard.html`):
+Add modem count to the device type breakdown:
+```html
+<div class="flex justify-between items-center">
+    <a href="/modems">Modems</a>
+    <span id="modem-count">--</span>
+</div>
+```
+
+Update JavaScript to count modems:
+```javascript
+let modemCount = 0;
+Object.values(data.units || {}).forEach(unit => {
+    if (unit.device_type === 'modem' && !unit.retired) {
+        modemCount++;
+    }
+});
+document.getElementById('modem-count').textContent = modemCount;
+```
+
+## Benefits
+
+1. **Separation of Concerns**: Each device type has its own dedicated interface
+2. **Scalability**: Easy to add new device types following the established pattern
+3. **Performance**: Queries are filtered by device type, reducing data transfer
+4. **User Experience**: Users can focus on specific device types without clutter
+5. **Maintainability**: Each dashboard is self-contained and easy to modify
+
+## Related Documentation
+
+- [SOUND_LEVEL_METERS_DASHBOARD.md](SOUND_LEVEL_METERS_DASHBOARD.md) - SLM dashboard details
+- [DEVICE_TYPE_SLM_SUPPORT.md](DEVICE_TYPE_SLM_SUPPORT.md) - Adding SLM device type support
+- [MODEM_INTEGRATION.md](MODEM_INTEGRATION.md) - Modem assignment architecture

docs/DEVICE_TYPE_SLM_SUPPORT.md

@@ -0,0 +1,159 @@
+# Sound Level Meter Device Type Support
+
+## Overview
+
+Added full support for "Sound Level Meter" as a device type in the roster management system. Users can now create, edit, and manage SLM units through the Fleet Roster interface.
+
+## Changes Made
+
+### 1. Frontend - Unit Detail Page
+
+**File**: `templates/unit_detail.html`
+
+#### Added Device Type Option
+- Added "Sound Level Meter" option to device type dropdown (line 243)
+- Value: `sound_level_meter`
+
+#### Added SLM-Specific Fields Section (lines 320-370)
+New form fields for Sound Level Meter configuration:
+
+- **Host (IP Address)**: Device network address
+  - Field name: `slm_host`
+  - Example: `192.168.1.100`
+
+- **TCP Port**: Control port (default 2255)
+  - Field name: `slm_tcp_port`
+  - Type: number
+
+- **Model**: Device model designation
+  - Field name: `slm_model`
+  - Example: `NL-43`, `NL-53`
+
+- **Serial Number**: Manufacturer serial number
+  - Field name: `slm_serial_number`
+
+- **Frequency Weighting**: Sound measurement weighting curve
+  - Field name: `slm_frequency_weighting`
+  - Options: A-weighting, C-weighting, Z-weighting (Flat)
+
+- **Time Weighting**: Temporal averaging method
+  - Field name: `slm_time_weighting`
+  - Options: Fast (125ms), Slow (1s), Impulse (35ms)
+
+- **Measurement Range**: Device measurement capability
+  - Field name: `slm_measurement_range`
+  - Example: `30-130 dB`
+
+#### Updated JavaScript Functions
+
+**toggleDetailFields()** (lines 552-571)
+- Now handles three device types: seismograph, modem, sound_level_meter
+- Hides all device-specific sections, then shows only the relevant one
+- Shows `slmFields` section when device type is `sound_level_meter`
+
+**populateEditForm()** (lines 527-558)
+- Populates all 7 SLM-specific fields from unit data
+- Sets empty string as default if field is null
+
+### 2. Backend - API Endpoints
+
+**File**: `backend/routers/roster_edit.py`
+
+#### Updated Add Unit Endpoint
+`POST /api/roster/add`
+
+**New Parameters** (lines 61-67):
+- `slm_host`: str (optional)
+- `slm_tcp_port`: int (optional)
+- `slm_model`: str (optional)
+- `slm_serial_number`: str (optional)
+- `slm_frequency_weighting`: str (optional)
+- `slm_time_weighting`: str (optional)
+- `slm_measurement_range`: str (optional)
+
+**Unit Creation** (lines 108-115):
+All SLM fields are set when creating new unit.
+
+#### Updated Get Unit Endpoint
+`GET /api/roster/{unit_id}`
+
+**New Response Fields** (lines 146-152):
+Returns all 7 SLM fields in the response, with empty string as default if null.
+
+#### Updated Edit Unit Endpoint
+`POST /api/roster/edit/{unit_id}`
+
+**New Parameters** (lines 177-183):
+Same 7 SLM-specific parameters as add endpoint.
+
+**Unit Update** (lines 232-239):
+All SLM fields are updated when editing existing unit.
+
+### 3. Database Schema
+
+**File**: `backend/models.py`
+
+The database schema already included SLM fields (no changes needed):
+- All fields are nullable to support multiple device types
+- Fields are only relevant when `device_type = "sound_level_meter"`
+
+## Usage
+
+### Creating a New SLM Unit
+
+1. Go to Fleet Roster page
+2. Click "Add Unit" or edit an existing unit
+3. Select "Sound Level Meter" from Device Type dropdown
+4. Fill in SLM-specific fields (Host, Port, Model, etc.)
+5. Save
+
+### Converting Existing Unit to SLM
+
+1. Open unit detail page
+2. Click "Edit Unit"
+3. Change Device Type to "Sound Level Meter"
+4. SLM fields section will appear
+5. Fill in required SLM configuration
+6. Save changes
+
+### Field Visibility
+
+The form automatically shows/hides relevant fields based on device type:
+- **Seismograph**: Shows calibration dates, modem deployment info
+- **Modem**: Shows IP, phone number, hardware model
+- **Sound Level Meter**: Shows host, port, model, serial, weightings, range
+
+## Integration with SLMM Dashboard
+
+Units with `device_type = "sound_level_meter"` will:
+- Appear in the Sound Level Meters dashboard (`/sound-level-meters`)
+- Be available for live monitoring and control
+- Use the configured `slm_host` and `slm_tcp_port` for device communication
+
+## Testing
+
+Test SLM units have been added via `add_test_slms.py`:
+- `nl43-001` - Deployed at construction site A
+- `nl43-002` - Deployed at construction site B
+- `nl53-001` - Deployed at residential area
+- `nl43-003` - Benched for calibration
+
+You can edit any of these units to verify the form works correctly.
+
+## Files Modified
+
+1. `templates/unit_detail.html` - Added dropdown option, SLM fields section, updated JavaScript
+2. `backend/routers/roster_edit.py` - Added SLM parameters to add/edit/get endpoints
+3. `backend/models.py` - No changes (schema already supported SLM)
+
+## Backward Compatibility
+
+- Existing seismograph and modem units are unaffected
+- All SLM fields are optional/nullable
+- Forms gracefully handle units with missing device_type (defaults to seismograph)
+
+---
+
+**Version**: 1.0.0
+**Date**: January 5, 2026
+**Related**: SOUND_LEVEL_METERS_DASHBOARD.md

docs/DEV_DATABASE_SETUP.md

@@ -0,0 +1,132 @@
+# DEV Database Setup Instructions
+
+## Current Situation
+
+The test SLM and modem data was accidentally added to the **PRODUCTION** database (`data/seismo_fleet.db`).
+
+**Good news**: I've already removed it! The production database is clean.
+
+**Issue**: The DEV database (`data-dev/seismo_fleet.db`) is:
+1. Owned by root (read-only for your user)
+2. Missing the SLM-specific columns in its schema
+
+## What You Need to Do
+
+### Step 1: Fix DEV Database Permissions
+
+Run this command to make the DEV database writable:
+
+```bash
+cd /home/serversdown/sfm/seismo-fleet-manager
+sudo chown serversdown:serversdown data-dev/seismo_fleet.db
+sudo chmod 664 data-dev/seismo_fleet.db
+```
+
+### Step 2: Migrate DEV Database Schema
+
+Add the SLM columns to the DEV database:
+
+```bash
+python3 scripts/migrate_dev_db.py
+```
+
+This will add these columns to the `roster` table:
+- `slm_host`
+- `slm_tcp_port`
+- `slm_model`
+- `slm_serial_number`
+- `slm_frequency_weighting`
+- `slm_time_weighting`
+- `slm_measurement_range`
+- `slm_last_check`
+
+### Step 3: Add Test Data to DEV
+
+Now you can safely add test data to the DEV database:
+
+```bash
+# Add test SLMs
+python3 scripts/add_test_slms.py
+
+# Add test modems and assign to SLMs
+python3 scripts/add_test_modems.py
+```
+
+This will create:
+- 4 test SLM units (nl43-001, nl43-002, nl53-001, nl43-003)
+- 4 test modem units (modem-001, modem-002, modem-003, modem-004)
+- Assign modems to the SLMs
+
+## Production Database Status
+
+✅ **Production database is CLEAN** - all test data has been removed.
+
+The production database (`data/seismo_fleet.db`) is ready for real production use.
+
+## Test Scripts
+
+All test scripts have been updated to use the DEV database:
+
+### Scripts Updated:
+1. `scripts/add_test_slms.py` - Now uses `data-dev/seismo_fleet.db`
+2. `scripts/add_test_modems.py` - Now uses `data-dev/seismo_fleet.db`
+
+### Scripts Created:
+1. `scripts/remove_test_data_from_prod.py` - Removes test data from production (already run)
+2. `scripts/update_dev_db_schema.py` - Updates schema (doesn't work for SQLite ALTER)
+3. `scripts/migrate_dev_db.py` - Adds SLM columns to DEV database
+
+All helper scripts are located in the `scripts/` directory. See [scripts/README.md](../scripts/README.md) for detailed usage instructions.
+
+## Verification
+
+After running the steps above, verify everything worked:
+
+```bash
+# Check DEV database has test data
+sqlite3 data-dev/seismo_fleet.db "SELECT id, device_type FROM roster WHERE device_type IN ('sound_level_meter', 'modem');"
+```
+
+You should see:
+```
+nl43-001|sound_level_meter
+nl43-002|sound_level_meter
+nl53-001|sound_level_meter
+nl43-003|sound_level_meter
+modem-001|modem
+modem-002|modem
+modem-003|modem
+modem-004|modem
+```
+
+## Development vs Production
+
+### When to Use DEV Database
+
+To use the DEV database, set the environment variable:
+
+```bash
+# Not implemented yet, but you could add this to database.py:
+export DATABASE_ENV=dev
+```
+
+Or modify `backend/database.py` to check for an environment variable.
+
+### Current Setup
+
+Right now, the application always uses `data/seismo_fleet.db` (production).
+
+For development/testing, you could:
+1. Point SFM to use the DEV database temporarily
+2. Or keep test data in production (not recommended)
+3. Or implement environment-based database selection
+
+## Summary
+
+- ✅ Production DB cleaned (no test data)
+- ⚠️  DEV DB needs permission fix (run sudo commands above)
+- ⚠️  DEV DB needs schema migration (run scripts/migrate_dev_db.py)
+- ✅ Test scripts updated to use DEV DB
+- ✅ All test data ready to be added to DEV DB
+
+Run the commands above and you'll be all set!

docs/FIX_DEV_PERMISSIONS.md

@@ -0,0 +1,62 @@
+# Fix DEV Database Permissions
+
+## The Problem
+
+SQLite needs write access to both the database file AND the directory it's in (to create temporary files like journals and WAL files).
+
+Currently:
+- ✅ Database file: `data-dev/seismo_fleet.db` - permissions fixed
+- ❌ Directory: `data-dev/` - still owned by root
+
+## The Fix
+
+Run this command to fix the directory ownership:
+
+```bash
+sudo chown -R serversdown:serversdown /home/serversdown/sfm/seismo-fleet-manager/data-dev/
+```
+
+Then run the migration again:
+
+```bash
+python3 scripts/migrate_dev_db.py
+```
+
+## Full Setup Commands
+
+Here's the complete sequence:
+
+```bash
+cd /home/serversdown/sfm/seismo-fleet-manager
+
+# Fix directory ownership (includes all files inside)
+sudo chown -R serversdown:serversdown data-dev/
+
+# Migrate schema
+python3 scripts/migrate_dev_db.py
+
+# Add test data
+python3 scripts/add_test_slms.py
+python3 scripts/add_test_modems.py
+```
+
+## Verify It Worked
+
+After running the migration, you should see:
+
+```
+Migrating DEV database to add SLM columns...
+============================================================
+✓ Added column: slm_host
+✓ Added column: slm_tcp_port
+✓ Added column: slm_model
+✓ Added column: slm_serial_number
+✓ Added column: slm_frequency_weighting
+✓ Added column: slm_time_weighting
+✓ Added column: slm_measurement_range
+✓ Added column: slm_last_check
+============================================================
+DEV database migration completed!
+```
+
+Then the test data scripts should work without errors!

docs/MODEM_INTEGRATION.md

@@ -0,0 +1,375 @@
+# Modem Integration System
+
+## Overview
+
+The modem integration system allows Sound Level Meters (SLMs) and Seismographs to be deployed with network connectivity modems. Instead of storing IP addresses directly on each device, units are assigned to modems which provide the network connection. This enables:
+
+- Centralized modem management and tracking
+- IP address updates in one place
+- Future modem API integration for diagnostics
+- Proper asset tracking for network equipment
+
+## Architecture
+
+### Database Design
+
+**Modem Units**: Stored as `RosterUnit` with `device_type = "modem"`
+
+**Modem-Specific Fields**:
+- `ip_address`: Network IP address or hostname
+- `phone_number`: Cellular phone number (if applicable)
+- `hardware_model`: Modem hardware (e.g., "Raven XTV", "Sierra Wireless AirLink")
+
+**Device Assignment**:
+- Both SLMs and Seismographs use `deployed_with_modem_id` to reference their modem
+- This is a foreign key to another `RosterUnit.id` where `device_type = "modem"`
+
+### How It Works
+
+1. **Create Modem Units**
+   - Add modems as regular roster units with `device_type = "modem"`
+   - Set IP address, phone number, and hardware model
+   - Deploy or bench modems like any other asset
+
+2. **Assign Devices to Modems**
+   - When editing an SLM or Seismograph, select modem from dropdown
+   - The `deployed_with_modem_id` field stores the modem ID
+   - IP address is fetched from the assigned modem at runtime
+
+3. **Runtime Resolution**
+   - When SLM dashboard needs to connect to a device:
+     1. Load SLM unit data
+     2. Check `deployed_with_modem_id`
+     3. Fetch modem unit
+     4. Use modem's `ip_address` for connection
+     5. Fallback to legacy `slm_host` if no modem assigned
+
+## Implementation Details
+
+### Frontend Changes
+
+#### Unit Detail Page (`templates/unit_detail.html`)
+
+**SLM Fields** (lines 320-375):
+- Removed direct "Host (IP Address)" field
+- Added "Deployed With Modem" dropdown selector
+- Dropdown populated with all active modems via JavaScript
+- Shows modem ID, IP address, and hardware model in dropdown
+
+**JavaScript** (lines 456-485):
+```javascript
+async function loadModemsList() {
+    // Fetches all modems from /api/roster/modems
+    // Populates both seismograph and SLM modem dropdowns
+    // Shows format: "modem-001 (192.168.1.100) - Raven XTV"
+}
+```
+
+#### SLM Dashboard (`backend/routers/slm_dashboard.py`)
+
+**Live View Endpoint** (lines 84-148):
+```python
+# Get modem information if assigned
+modem = None
+modem_ip = None
+if unit.deployed_with_modem_id:
+    modem = db.query(RosterUnit).filter_by(
+        id=unit.deployed_with_modem_id,
+        device_type="modem"
+    ).first()
+    if modem:
+        modem_ip = modem.ip_address
+
+# Fallback to direct slm_host (backward compatibility)
+if not modem_ip and unit.slm_host:
+    modem_ip = unit.slm_host
+```
+
+**Live View Template** (`templates/partials/slm_live_view.html`):
+- Displays modem information in header
+- Shows "via Modem: modem-001 (192.168.1.100)"
+- Warning if no modem assigned
+
+### Backend Changes
+
+#### New API Endpoint (`backend/routers/roster_edit.py`)
+
+```python
+GET /api/roster/modems
+```
+
+Returns list of all non-retired modem units:
+```json
+[
+    {
+        "id": "modem-001",
+        "ip_address": "192.168.1.100",
+        "phone_number": "+1-555-0100",
+        "hardware_model": "Raven XTV",
+        "deployed": true
+    }
+]
+```
+
+Used by frontend to populate modem selection dropdowns.
+
+#### Database Schema (`backend/models.py`)
+
+**Modem Assignment Field** (line 44):
+```python
+# Shared by seismographs and SLMs
+deployed_with_modem_id = Column(String, nullable=True)
+```
+
+**Modem Fields** (lines 46-48):
+```python
+ip_address = Column(String, nullable=True)
+phone_number = Column(String, nullable=True)
+hardware_model = Column(String, nullable=True)
+```
+
+**Legacy SLM Fields** (kept for backward compatibility):
+```python
+slm_host = Column(String, nullable=True)  # Deprecated - use modem instead
+slm_tcp_port = Column(Integer, nullable=True)  # Still used
+```
+
+## Usage
+
+### Creating Modem Units
+
+1. Go to Fleet Roster
+2. Click "Add Unit"
+3. Set Device Type to "Modem"
+4. Fill in:
+   - Unit ID (e.g., "modem-001")
+   - IP Address (e.g., "192.168.1.100")
+   - Phone Number (if cellular)
+   - Hardware Model (e.g., "Raven XTV")
+   - Address/Coordinates (physical location)
+5. Set Deployed status
+6. Save
+
+### Assigning Modem to SLM
+
+1. Open SLM unit detail page
+2. Click "Edit Unit"
+3. Ensure Device Type is "Sound Level Meter"
+4. In "Deployed With Modem" dropdown, select modem
+5. Verify TCP Port (default 2255)
+6. Save
+
+### Assigning Modem to Seismograph
+
+Same process - both device types use the same modem selection field.
+
+## Test Data
+
+Use the included script to create test modems:
+
+```bash
+python3 add_test_modems.py
+```
+
+This creates:
+- **modem-001**: 192.168.1.100, Raven XTV → assigned to nl43-001
+- **modem-002**: 192.168.1.101, Raven XTV → assigned to nl43-002
+- **modem-003**: 192.168.1.102, Sierra Wireless → assigned to nl53-001
+- **modem-004**: Spare modem (not deployed)
+
+## Benefits
+
+### For Operations
+
+1. **Centralized IP Management**
+   - Update modem IP once, affects all assigned devices
+   - Easy to track which modem serves which devices
+   - Inventory management for network equipment
+
+2. **Asset Tracking**
+   - Modems are first-class assets in the roster
+   - Track deployment status, location, notes
+   - Can bench/retire modems independently
+
+3. **Future Capabilities**
+   - Modem API integration (signal strength, data usage)
+   - Automatic IP updates from DHCP/cellular network
+   - Modem health monitoring
+   - Remote modem diagnostics
+
+### For Maintenance
+
+1. **Easier Troubleshooting**
+   - See which modem serves a device
+   - Check modem status separately
+   - Swap modems without reconfiguring devices
+
+2. **Configuration Changes**
+   - Change IP addresses system-wide
+   - Move devices between modems
+   - Test with backup modems
+
+## Migration from Legacy System
+
+### For Existing SLMs with Direct IP
+
+Legacy SLMs with `slm_host` set still work:
+- System checks `deployed_with_modem_id` first
+- Falls back to `slm_host` if no modem assigned
+- Logs fallback usage for visibility
+
+### Migration Steps
+
+1. Create modem units for each IP address
+2. Assign SLMs to their modems
+3. System will use modem IP automatically
+4. Legacy `slm_host` can be cleared (optional)
+
+Script `add_test_modems.py` demonstrates this:
+```python
+# Clear legacy field after modem assignment
+slm.slm_host = None
+slm.deployed_with_modem_id = "modem-001"
+```
+
+## Future Enhancements
+
+### Near-term
+
+1. **Modem Status Dashboard**
+   - List all modems with connection status
+   - Show which devices use each modem
+   - Signal strength, data usage indicators
+
+2. **Automatic IP Discovery**
+   - Query cellular provider API for modem IPs
+   - Auto-update IP addresses in database
+   - Alert on IP changes
+
+3. **Modem Health Monitoring**
+   - Ping modems periodically
+   - Check cellular signal quality
+   - Data usage tracking
+
+### Long-term
+
+1. **Modem API Integration**
+   - Direct modem management (Raven, Sierra APIs)
+   - Remote reboot capability
+   - Configuration backup/restore
+   - Firmware updates
+
+2. **Network Topology View**
+   - Graphical view of modem-device relationships
+   - Network health visualization
+   - Troubleshooting tools
+
+3. **Multi-Modem Support**
+   - Failover between modems
+   - Load balancing
+   - Automatic fallback on modem failure
+
+## API Reference
+
+### Get Modems List
+
+**Endpoint**: `GET /api/roster/modems`
+
+**Response**:
+```json
+[
+    {
+        "id": "modem-001",
+        "ip_address": "192.168.1.100",
+        "phone_number": "+1-555-0100",
+        "hardware_model": "Raven XTV",
+        "deployed": true
+    }
+]
+```
+
+**Used By**:
+- Unit detail page (modem dropdown)
+- Future modem management dashboard
+
+### Get Unit with Modem Info
+
+**Endpoint**: `GET /api/roster/{unit_id}`
+
+**Response** (for SLM):
+```json
+{
+    "id": "nl43-001",
+    "device_type": "sound_level_meter",
+    "deployed_with_modem_id": "modem-001",
+    "slm_tcp_port": 2255,
+    "slm_model": "NL-43",
+    ...
+}
+```
+
+Then fetch modem separately or use dashboard endpoint which resolves it automatically.
+
+### SLM Live View (with modem resolution)
+
+**Endpoint**: `GET /api/slm-dashboard/live-view/{unit_id}`
+
+**Process**:
+1. Loads SLM unit
+2. Resolves `deployed_with_modem_id` to modem unit
+3. Extracts `modem.ip_address`
+4. Uses IP to connect to SLMM backend
+5. Returns live view HTML with modem info
+
+## Files Modified/Created
+
+### Modified
+1. `backend/models.py` - Clarified modem assignment field
+2. `templates/unit_detail.html` - Added modem selector for SLMs
+3. `backend/routers/roster_edit.py` - Added modems list endpoint
+4. `backend/routers/slm_dashboard.py` - Modem resolution logic
+5. `templates/partials/slm_live_view.html` - Display modem info
+
+### Created
+1. `add_test_modems.py` - Script to create test modems and assignments
+2. `docs/MODEM_INTEGRATION.md` - This documentation
+
+## Troubleshooting
+
+### SLM shows "No modem assigned"
+
+**Cause**: Unit has no `deployed_with_modem_id` set
+
+**Solution**:
+1. Edit the SLM unit
+2. Select a modem from dropdown
+3. Save
+
+### Modem dropdown is empty
+
+**Cause**: No modem units in database
+
+**Solution**:
+1. Create modem units first
+2. Set `device_type = "modem"`
+3. Ensure they're not retired
+
+### Can't connect to SLM
+
+**Possible Causes**:
+1. Modem IP is incorrect
+2. Modem is offline
+3. SLM TCP port is wrong
+4. Network routing issue
+
+**Debug Steps**:
+1. Check modem unit's IP address
+2. Ping the modem IP
+3. Check SLM's `slm_tcp_port` (default 2255)
+4. Review logs for connection errors
+
+---
+
+**Version**: 1.0.0
+**Date**: January 5, 2026
+**Related**: SOUND_LEVEL_METERS_DASHBOARD.md, DEVICE_TYPE_SLM_SUPPORT.md

docs/SLM_CONFIGURATION.md

@@ -0,0 +1,275 @@
+# SLM Configuration Interface
+
+This document describes the SLM configuration interface added to the Sound Level Meters dashboard.
+
+## Overview
+
+Sound Level Meters can now be configured directly from the dashboard without needing to navigate to the unit detail page. A configuration button appears on each SLM unit card on hover, opening a modal with all configurable parameters.
+
+## Features
+
+### 1. Quick Access Configuration Button
+
+- **Location**: Appears on each SLM unit card in the unit list
+- **Behavior**: Shows on hover (desktop) or always visible (mobile)
+- **Icon**: Gear/settings icon in top-right corner of unit card
+
+### 2. Configuration Modal
+
+The configuration modal provides a comprehensive interface for all SLM parameters:
+
+#### Device Information
+- **Model**: Dropdown selection (NL-43, NL-53)
+- **Serial Number**: Text input for device serial number
+
+#### Measurement Parameters
+- **Frequency Weighting**: A, C, or Z (Linear)
+- **Time Weighting**: Fast (125ms), Slow (1s), or Impulse
+- **Measurement Range**: 30-130 dB, 40-140 dB, or 50-140 dB
+
+#### Network Configuration
+- **Assigned Modem**: Dropdown list of available modems
+  - Shows modem ID and IP address
+  - Option for "No modem (direct connection)"
+- **Direct IP Address**: Only shown when no modem assigned
+- **TCP Port**: Only shown when no modem assigned (default: 502)
+
+### 3. Actions
+
+The modal provides three action buttons:
+
+- **Test Connection**: Tests network connectivity to the SLM
+  - Uses current form values (not saved values)
+  - Shows toast notification with results
+  - Green: Connection successful
+  - Yellow: Connection failed or device offline
+  - Red: Test error
+
+- **Cancel**: Closes modal without saving changes
+
+- **Save Configuration**: Saves all changes to database
+  - Shows success/error toast
+  - Refreshes unit list on success
+  - Auto-closes modal after 2 seconds
+
+## Implementation
+
+### Frontend Components
+
+#### Unit List Partial
+**File**: [templates/partials/slm_unit_list.html](../templates/partials/slm_unit_list.html)
+
+```html
+<!-- Configure button (appears on hover) -->
+<button onclick="event.stopPropagation(); openConfigModal('{{ unit.id }}');"
+        class="absolute top-2 right-2 opacity-0 group-hover:opacity-100...">
+    <svg>...</svg>
+</button>
+```
+
+#### Configuration Modal
+**File**: [templates/sound_level_meters.html](../templates/sound_level_meters.html#L73)
+
+```html
+<!-- Configuration Modal -->
+<div id="config-modal" class="hidden fixed inset-0 bg-black bg-opacity-50...">
+    <div id="config-modal-content">
+        <!-- Content loaded via HTMX -->
+    </div>
+</div>
+```
+
+#### Configuration Form
+**File**: [templates/partials/slm_config_form.html](../templates/partials/slm_config_form.html)
+
+Form fields mapped to database columns:
+- `slm_model` → `unit.slm_model`
+- `slm_serial_number` → `unit.slm_serial_number`
+- `slm_frequency_weighting` → `unit.slm_frequency_weighting`
+- `slm_time_weighting` → `unit.slm_time_weighting`
+- `slm_measurement_range` → `unit.slm_measurement_range`
+- `deployed_with_modem_id` → `unit.deployed_with_modem_id`
+- `slm_host` → `unit.slm_host` (legacy, only if no modem)
+- `slm_tcp_port` → `unit.slm_tcp_port` (legacy, only if no modem)
+
+### Backend Endpoints
+
+#### GET /api/slm-dashboard/config/{unit_id}
+**File**: [backend/routers/slm_dashboard.py:184](../backend/routers/slm_dashboard.py#L184)
+
+Returns configuration form HTML partial with current unit values pre-populated.
+
+**Response**: HTML partial (slm_config_form.html)
+
+#### POST /api/slm-dashboard/config/{unit_id}
+**File**: [backend/routers/slm_dashboard.py:203](../backend/routers/slm_dashboard.py#L203)
+
+Saves configuration changes to database.
+
+**Request**: Form data with configuration parameters
+
+**Response**: JSON
+```json
+{
+  "status": "success",
+  "unit_id": "nl43-001"
+}
+```
+
+**Behavior**:
+- Updates all SLM-specific fields from form data
+- If modem is assigned: clears legacy `slm_host` and `slm_tcp_port`
+- If no modem: uses direct IP fields from form
+
+### JavaScript Functions
+
+#### openConfigModal(unitId)
+**File**: [templates/sound_level_meters.html:127](../templates/sound_level_meters.html#L127)
+
+Opens configuration modal and loads form via HTMX.
+
+```javascript
+function openConfigModal(unitId) {
+    const modal = document.getElementById('config-modal');
+    modal.classList.remove('hidden');
+
+    htmx.ajax('GET', `/api/slm-dashboard/config/${unitId}`, {
+        target: '#config-modal-content',
+        swap: 'innerHTML'
+    });
+}
+```
+
+#### closeConfigModal()
+**File**: [templates/sound_level_meters.html:136](../templates/sound_level_meters.html#L136)
+
+Closes configuration modal.
+
+#### handleConfigSave(event)
+**File**: [templates/partials/slm_config_form.html:109](../templates/partials/slm_config_form.html#L109)
+
+Handles HTMX response after form submission:
+- Shows success/error toast
+- Refreshes unit list
+- Auto-closes modal after 2 seconds
+
+#### testConnection(unitId)
+**File**: [templates/partials/slm_config_form.html:129](../templates/partials/slm_config_form.html#L129)
+
+Tests connection to SLM unit:
+```javascript
+async function testConnection(unitId) {
+    const response = await fetch(`/api/slmm/${unitId}/status`);
+    const data = await response.json();
+
+    if (response.ok && data.status === 'online') {
+        // Show success toast
+    } else {
+        // Show warning toast
+    }
+}
+```
+
+#### loadModemsForConfig()
+**File**: [templates/partials/slm_config_form.html:87](../templates/partials/slm_config_form.html#L87)
+
+Loads available modems from `/api/roster/modems` and populates dropdown.
+
+## User Workflow
+
+### Configuring an SLM
+
+1. Navigate to Sound Level Meters dashboard ([/sound-level-meters](../sound-level-meters))
+2. Hover over desired SLM unit card in the list
+3. Click the gear icon that appears in top-right corner
+4. Configuration modal opens with current values pre-filled
+5. Modify desired parameters:
+   - Update model/serial if needed
+   - Set measurement parameters (frequency/time weighting, range)
+   - Choose network configuration:
+     - **Option A**: Select a modem from dropdown (recommended)
+     - **Option B**: Enter direct IP address and port
+6. (Optional) Click "Test Connection" to verify network settings
+7. Click "Save Configuration"
+8. Modal shows success message and auto-closes
+9. Unit list refreshes to show updated information
+
+### Network Configuration Options
+
+**Modem Assignment (Recommended)**:
+- Select modem from dropdown
+- IP address automatically resolved from modem's `ip_address` field
+- Direct IP/port fields hidden
+- Enables modem tracking and management
+
+**Direct Connection (Legacy)**:
+- Select "No modem (direct connection)"
+- Enter IP address and TCP port manually
+- Direct IP/port fields become visible
+- Useful for temporary setups or non-modem connections
+
+## Database Schema
+
+The configuration interface updates these `roster` table columns:
+
+```sql
+-- SLM-specific fields
+slm_model VARCHAR               -- Device model (NL-43, NL-53)
+slm_serial_number VARCHAR       -- Serial number
+slm_frequency_weighting VARCHAR -- A, C, or Z weighting
+slm_time_weighting VARCHAR      -- Fast, Slow, or Impulse
+slm_measurement_range VARCHAR   -- Measurement range (30-130, 40-140, 50-140)
+
+-- Network configuration
+deployed_with_modem_id VARCHAR  -- FK to modem unit (preferred method)
+slm_host VARCHAR                -- Legacy direct IP (only if no modem)
+slm_tcp_port INTEGER            -- Legacy TCP port (only if no modem)
+```
+
+## UI/UX Design
+
+### Modal Behavior
+- **Opens**: Via configure button on unit card
+- **Closes**:
+  - Cancel button
+  - X button in header
+  - Escape key
+  - Clicking outside modal (on backdrop)
+- **Auto-close**: After successful save (2 second delay)
+
+### Responsive Design
+- **Desktop**: Configuration button appears on hover
+- **Mobile**: Configuration button always visible
+- **Modal**: Responsive width, scrollable on small screens
+- **Form**: Two-column layout on desktop, single column on mobile
+
+### Visual Feedback
+- **Loading**: Skeleton loader while form loads
+- **Saving**: HTMX handles form submission
+- **Success**: Green toast notification
+- **Error**: Red toast notification
+- **Testing**: Blue toast while testing, then green/yellow/red based on result
+
+### Accessibility
+- **Keyboard**: Modal can be closed with Escape key
+- **Focus**: Modal traps focus when open
+- **Labels**: All form fields have proper labels
+- **Colors**: Sufficient contrast in dark/light modes
+
+## Future Enhancements
+
+Potential improvements for future versions:
+
+1. **Bulk Configuration**: Configure multiple SLMs at once
+2. **Configuration Templates**: Save and apply configuration presets
+3. **Configuration History**: Track configuration changes over time
+4. **Remote Configuration**: Push configuration directly to device via SLMM
+5. **Validation**: Real-time validation of IP addresses and ports
+6. **Advanced Settings**: Additional NL-43/NL-53 specific parameters
+7. **Configuration Import/Export**: JSON/CSV configuration files
+
+## Related Documentation
+
+- [SOUND_LEVEL_METERS_DASHBOARD.md](SOUND_LEVEL_METERS_DASHBOARD.md) - Main SLM dashboard
+- [MODEM_INTEGRATION.md](MODEM_INTEGRATION.md) - Modem assignment architecture
+- [DEVICE_TYPE_SLM_SUPPORT.md](DEVICE_TYPE_SLM_SUPPORT.md) - SLM device type implementation

docs/SOUND_LEVEL_METERS_DASHBOARD.md

@@ -0,0 +1,333 @@
+# Sound Level Meters Dashboard
+
+## Overview
+
+The Sound Level Meters dashboard is a new feature in SFM (soon to be rebranded as Terra-view) that provides real-time monitoring and control of Rion NL-43/NL-53 sound level meters through the SLMM backend integration.
+
+## Features
+
+### 1. Dashboard Summary Statistics
+- **Total Units**: Count of all SLM devices in the system
+- **Deployed Units**: Active devices currently in the field
+- **Active Now**: Units that have checked in within the last hour
+- **Benched Units**: Devices not currently deployed
+
+### 2. Unit List (Sidebar)
+- Searchable list of all deployed SLM units
+- Real-time status indicators:
+  - 🟢 Green: Active (recently checked in)
+  - ⚪ Gray: No check-in data
+- Quick unit information:
+  - Device model (NL-43, NL-53, etc.)
+  - Location/address
+  - Network address (IP:port)
+- Click any unit to view its live data
+
+### 3. Live View Panel
+
+When a unit is selected, the live view panel displays:
+
+#### Control Buttons
+- **Start**: Begin measurement
+- **Pause**: Pause current measurement
+- **Stop**: Stop measurement
+- **Reset**: Reset measurement data
+- **Start Live Stream**: Open WebSocket connection for real-time DRD data
+
+#### Real-time Metrics
+- **Lp (Current)**: Instantaneous sound level in dB
+- **Leq (Average)**: Equivalent continuous sound level
+- **Lmax (Peak)**: Maximum sound level recorded
+- **Lmin**: Minimum sound level recorded
+
+#### Live Chart
+- Real-time line chart showing Lp and Leq over time
+- 60-second rolling window (adjustable)
+- Chart.js-powered visualization with dark mode support
+- No animation for smooth real-time updates
+
+#### Device Information
+- Battery level and power source
+- Frequency weighting (A, C, Z)
+- Time weighting (F, S, I)
+- SD card remaining space
+
+## Architecture
+
+### Frontend Components
+
+#### Main Template
+**File**: `templates/sound_level_meters.html`
+
+The main dashboard page that includes:
+- Page header and navigation integration
+- Stats summary section (auto-refreshes every 10s)
+- Two-column layout: unit list (left) + live view (right)
+- JavaScript functions for unit selection and WebSocket streaming
+
+#### Partial Templates
+
+1. **slm_stats.html** - Summary statistics cards
+   - Auto-loads on page load
+   - Refreshes every 10 seconds via HTMX
+
+2. **slm_unit_list.html** - Searchable unit list
+   - Auto-loads on page load
+   - Refreshes every 10 seconds via HTMX
+   - Supports search filtering
+
+3. **slm_live_view.html** - Live data panel for selected unit
+   - Loaded on-demand when unit is selected
+   - Includes Chart.js for visualization
+   - WebSocket connection for streaming data
+
+4. **slm_live_view_error.html** - Error state display
+
+### Backend Components
+
+#### Router: `backend/routers/slm_dashboard.py`
+
+**Endpoints:**
+
+```python
+GET /api/slm-dashboard/stats
+```
+Returns HTML partial with summary statistics.
+
+```python
+GET /api/slm-dashboard/units?search={term}
+```
+Returns HTML partial with filtered unit list.
+
+```python
+GET /api/slm-dashboard/live-view/{unit_id}
+```
+Returns HTML partial with live view panel for specific unit.
+- Fetches unit details from database
+- Queries SLMM API for current measurement state
+- Queries SLMM API for live status (DOD data)
+
+```python
+POST /api/slm-dashboard/control/{unit_id}/{action}
+```
+Sends control commands to SLMM backend.
+- Valid actions: start, stop, pause, resume, reset
+- Proxies to `http://localhost:8100/api/nl43/{unit_id}/{action}`
+
+### Integration with SLMM
+
+The dashboard communicates with the SLMM backend service running on port 8100:
+
+**REST API Calls:**
+- `GET /api/nl43/{unit_id}/measurement-state` - Check if measuring
+- `GET /api/nl43/{unit_id}/live` - Get current DOD data
+- `POST /api/nl43/{unit_id}/start|stop|pause|resume|reset` - Control commands
+
+**WebSocket Streaming:**
+- `WS /api/nl43/{unit_id}/live` - Real-time DRD data stream
+- Proxied through SFM at `/api/slmm/{unit_id}/live`
+- Streams continuous measurement data for live charting
+
+### Database Schema
+
+**Table**: `roster`
+
+SLM-specific fields in the RosterUnit model:
+
+```python
+device_type = "sound_level_meter"  # Distinguishes SLMs from seismographs
+slm_host = String                   # Device IP or hostname
+slm_tcp_port = Integer               # TCP control port (default 2255)
+slm_model = String                   # NL-43, NL-53, etc.
+slm_serial_number = String           # Device serial number
+slm_frequency_weighting = String     # A, C, or Z weighting
+slm_time_weighting = String          # F (Fast), S (Slow), I (Impulse)
+slm_measurement_range = String       # e.g., "30-130 dB"
+slm_last_check = DateTime            # Last communication timestamp
+```
+
+## Navigation
+
+The Sound Level Meters page is accessible from:
+- **URL**: `/sound-level-meters`
+- **Sidebar**: "Sound Level Meters" menu item (between Fleet Roster and Projects)
+- **Icon**: Speaker/sound wave SVG icon
+
+## Real-time Updates
+
+The dashboard uses three mechanisms for real-time updates:
+
+1. **HTMX Polling** (10-second intervals)
+   - Summary statistics
+   - Unit list
+   - Ensures data freshness even without user interaction
+
+2. **On-Demand Loading** (HTMX)
+   - Live view panel loads when unit is selected
+   - Control button responses
+
+3. **WebSocket Streaming** (continuous)
+   - Real-time DRD data for live charting
+   - User-initiated via "Start Live Stream" button
+   - Automatically closed on page unload or unit change
+
+## Measurement Duration Tracking
+
+**Important**: The NL-43/NL-53 devices do not expose measurement duration via their API. Elapsed time and interval counts are only visible on the device's on-screen display (OSD).
+
+**Solution**: Track measurement start time in your application when calling the `/start` endpoint:
+
+```javascript
+// When starting measurement
+const startTime = new Date();
+localStorage.setItem(`slm_${unitId}_start`, startTime.toISOString());
+
+// Calculate elapsed time
+const startTime = new Date(localStorage.getItem(`slm_${unitId}_start`));
+const elapsed = (new Date() - startTime) / 1000; // seconds
+```
+
+**Future Enhancement**: SLMM backend could store measurement start times in a database table to track duration across sessions.
+
+## Testing
+
+### Add Test Data
+
+Use the included script to add test SLM units:
+
+```bash
+python3 add_test_slms.py
+```
+
+This creates:
+- 3 deployed test units (nl43-001, nl43-002, nl53-001)
+- 1 benched unit (nl43-003)
+
+### Running the Dashboard
+
+1. Start SLMM backend (port 8100):
+   ```bash
+   cd /home/serversdown/slmm
+   uvicorn main:app --host 0.0.0.0 --port 8100
+   ```
+
+2. Start SFM (port 8000):
+   ```bash
+   cd /home/serversdown/sfm/seismo-fleet-manager
+   uvicorn backend.main:app --host 0.0.0.0 --port 8000 --reload
+   ```
+
+3. Access dashboard:
+   ```
+   http://localhost:8000/sound-level-meters
+   ```
+
+### Testing Without Physical Devices
+
+The dashboard will work without physical NL-43 devices connected:
+- Unit list will display based on database records
+- Live view will show connection errors (gracefully handled)
+- Mock data can be added to SLMM for testing
+
+## Future Enhancements
+
+### Near-term
+1. **Measurement Duration Tracking**
+   - Add database table to track measurement sessions
+   - Display elapsed time in live view
+   - Store start/stop timestamps
+
+2. **Historical Data View**
+   - Chart historical Leq intervals
+   - Export measurement data
+   - Comparison between units
+
+3. **Alerts & Thresholds**
+   - Configurable sound level alerts
+   - Email/SMS notifications when thresholds exceeded
+   - Visual indicators on dashboard
+
+### Long-term
+1. **Map View**
+   - Display all SLMs on a map (like seismographs)
+   - Click map markers to view live data
+   - Color-coded by current sound level
+
+2. **Batch Operations**
+   - Start/stop multiple units simultaneously
+   - Synchronized measurements
+   - Group configurations
+
+3. **Advanced Analytics**
+   - Noise compliance reports
+   - Statistical summaries
+   - Trend analysis
+
+## Integration with Terra-view
+
+When SFM is rebranded to Terra-view:
+
+1. **Multi-Module Dashboard**
+   - Sound Level Meters module (this dashboard)
+   - Seismograph Fleet Manager module (existing)
+   - Future monitoring modules
+
+2. **Project Management**
+   - Link SLMs to projects
+   - Combined project view with seismographs + SLMs
+   - Project-level reporting
+
+3. **Unified Navigation**
+   - Top-level module switcher
+   - Consistent UI/UX across modules
+   - Shared authentication and settings
+
+## Technical Notes
+
+### HTMX Integration
+The dashboard extensively uses HTMX for dynamic updates without full page reloads:
+- `hx-get`: Fetch and swap content
+- `hx-trigger`: Auto-refresh intervals
+- `hx-swap`: Content replacement strategy
+- `hx-target`: Specify update target
+
+### Dark Mode Support
+All components support dark mode:
+- Chart.js colors adapt to theme
+- Tailwind dark: classes throughout
+- Automatic theme detection
+
+### Performance Considerations
+- WebSocket connections are per-unit (only one active at a time)
+- Chart data limited to 60 points (1 minute) to prevent memory bloat
+- Polling intervals balanced for responsiveness vs server load
+- Lazy loading of live view panel (only when unit selected)
+
+## Files Modified/Created
+
+### New Files
+- `templates/sound_level_meters.html`
+- `templates/partials/slm_stats.html`
+- `templates/partials/slm_unit_list.html`
+- `templates/partials/slm_live_view.html`
+- `templates/partials/slm_live_view_error.html`
+- `backend/routers/slm_dashboard.py`
+- `add_test_slms.py`
+- `docs/SOUND_LEVEL_METERS_DASHBOARD.md`
+
+### Modified Files
+- `backend/main.py` - Added route and router import
+- `templates/base.html` - Added navigation menu item
+
+## Support
+
+For issues or questions:
+- Check SLMM API documentation: `/home/serversdown/slmm/docs/API.md`
+- Review SFM changelog: `CHANGELOG.md`
+- Submit issues to project repository
+
+---
+
+**Version**: 1.0.0
+**Created**: January 2026
+**Last Updated**: January 5, 2026

scripts/README.md

@@ -0,0 +1,120 @@
+# Helper Scripts
+
+This directory contains helper scripts for database management and testing.
+
+## Database Migration Scripts
+
+### migrate_dev_db.py
+Migrates the DEV database schema to add SLM-specific columns to the `roster` table.
+
+**Usage:**
+```bash
+cd /home/serversdown/sfm/seismo-fleet-manager
+python3 scripts/migrate_dev_db.py
+```
+
+**What it does:**
+- Adds 8 SLM-specific columns to the DEV database (data-dev/seismo_fleet.db)
+- Columns: slm_host, slm_tcp_port, slm_model, slm_serial_number, slm_frequency_weighting, slm_time_weighting, slm_measurement_range, slm_last_check
+- Safe to run multiple times (skips existing columns)
+
+### update_dev_db_schema.py
+Inspects and displays the DEV database schema.
+
+**Usage:**
+```bash
+python3 scripts/update_dev_db_schema.py
+```
+
+**What it does:**
+- Shows all tables in the DEV database
+- Lists all columns in the roster table
+- Useful for verifying schema after migrations
+
+## Test Data Scripts
+
+### add_test_slms.py
+Adds test Sound Level Meter units to the DEV database.
+
+**Usage:**
+```bash
+python3 scripts/add_test_slms.py
+```
+
+**What it creates:**
+- nl43-001: NL-43 SLM at Construction Site A
+- nl43-002: NL-43 SLM at Construction Site B
+- nl53-001: NL-53 SLM at Residential Area
+- nl43-003: NL-43 SLM (not deployed, spare unit)
+
+### add_test_modems.py
+Adds test modem units to the DEV database and assigns them to SLMs.
+
+**Usage:**
+```bash
+python3 scripts/add_test_modems.py
+```
+
+**What it creates:**
+- modem-001, modem-002, modem-003: Deployed modems (Raven XTV and Sierra Wireless)
+- modem-004: Spare modem (not deployed)
+
+**Modem assignments:**
+- nl43-001 → modem-001
+- nl43-002 → modem-002
+- nl53-001 → modem-003
+
+## Cleanup Scripts
+
+### remove_test_data_from_prod.py
+**⚠️ PRODUCTION DATABASE CLEANUP**
+
+Removes test data from the production database (data/seismo_fleet.db).
+
+**Status:** Already executed successfully. Production database is clean.
+
+**What it removed:**
+- All test SLM units (nl43-001, nl43-002, nl53-001, nl43-003)
+- All test modem units (modem-001, modem-002, modem-003, modem-004)
+
+## Database Cloning
+
+### clone_db_to_dev.py
+Clones the production database to create/update the DEV database.
+
+**Usage:**
+```bash
+python3 scripts/clone_db_to_dev.py
+```
+
+**What it does:**
+- Copies data/seismo_fleet.db → data-dev/seismo_fleet.db
+- Useful for syncing DEV database with production schema/data
+
+## Setup Sequence
+
+To set up a fresh DEV database with test data:
+
+```bash
+cd /home/serversdown/sfm/seismo-fleet-manager
+
+# 1. Fix permissions (if needed)
+sudo chown -R serversdown:serversdown data-dev/
+
+# 2. Migrate schema
+python3 scripts/migrate_dev_db.py
+
+# 3. Add test data
+python3 scripts/add_test_slms.py
+python3 scripts/add_test_modems.py
+
+# 4. Verify
+sqlite3 data-dev/seismo_fleet.db "SELECT id, device_type FROM roster WHERE device_type IN ('sound_level_meter', 'modem');"
+```
+
+## Important Notes
+
+- **DEV Database**: `data-dev/seismo_fleet.db` - Used for development and testing
+- **Production Database**: `data/seismo_fleet.db` - Used by the running application
+- All test scripts are configured to use the DEV database only
+- Never run test data scripts against production

scripts/add_slm_ftp_port.py

@@ -0,0 +1,39 @@
+#!/usr/bin/env python3
+"""
+Add slm_ftp_port column to roster table for FTP data retrieval port
+"""
+
+from sqlalchemy import create_engine, text
+import os
+
+# Determine database based on environment
+ENVIRONMENT = os.getenv("ENVIRONMENT", "production")
+if ENVIRONMENT == "development":
+    DB_URL = "sqlite:///./data-dev/seismo_fleet.db"
+else:
+    DB_URL = "sqlite:///./data/seismo_fleet.db"
+
+def add_ftp_port_column():
+    print(f"Adding slm_ftp_port column to {DB_URL}...")
+    print("=" * 60)
+
+    engine = create_engine(DB_URL, connect_args={"check_same_thread": False})
+
+    with engine.connect() as conn:
+        try:
+            # Try to add the column
+            conn.execute(text("ALTER TABLE roster ADD COLUMN slm_ftp_port INTEGER"))
+            conn.commit()
+            print("✓ Added column: slm_ftp_port (INTEGER)")
+        except Exception as e:
+            if "duplicate column name" in str(e).lower():
+                print("  Column slm_ftp_port already exists, skipping")
+            else:
+                print(f"✗ Error adding slm_ftp_port: {e}")
+                raise
+
+    print("=" * 60)
+    print("Migration completed!")
+
+if __name__ == "__main__":
+    add_ftp_port_column()

scripts/add_test_modems.py

@@ -0,0 +1,105 @@
+#!/usr/bin/env python3
+"""
+Add test modem units and assign them to SLMs in DEV database
+"""
+
+from sqlalchemy import create_engine
+from sqlalchemy.orm import sessionmaker
+from backend.models import RosterUnit
+from datetime import datetime
+
+# DEV database
+DEV_DB_URL = "sqlite:///./data-dev/seismo_fleet.db"
+
+def add_test_modems():
+    engine = create_engine(DEV_DB_URL, connect_args={"check_same_thread": False})
+    SessionLocal = sessionmaker(autocommit=False, autoflush=False, bind=engine)
+    db = SessionLocal()
+
+    # Test modems
+    test_modems = [
+        {
+            "id": "modem-001",
+            "device_type": "modem",
+            "deployed": True,
+            "retired": False,
+            "note": "Raven XTV modem for Construction Site A",
+            "address": "123 Main St, Construction Site A",
+            "coordinates": "34.0522,-118.2437",
+            "ip_address": "192.168.1.100",
+            "phone_number": "+1-555-0100",
+            "hardware_model": "Raven XTV"
+        },
+        {
+            "id": "modem-002",
+            "device_type": "modem",
+            "deployed": True,
+            "retired": False,
+            "note": "Raven XTV modem for Construction Site B",
+            "address": "456 Oak Ave, Construction Site B",
+            "coordinates": "34.0622,-118.2537",
+            "ip_address": "192.168.1.101",
+            "phone_number": "+1-555-0101",
+            "hardware_model": "Raven XTV"
+        },
+        {
+            "id": "modem-003",
+            "device_type": "modem",
+            "deployed": True,
+            "retired": False,
+            "note": "Sierra Wireless modem for Residential Area",
+            "address": "789 Elm St, Residential Area",
+            "coordinates": "34.0722,-118.2637",
+            "ip_address": "192.168.1.102",
+            "phone_number": "+1-555-0102",
+            "hardware_model": "Sierra Wireless AirLink"
+        },
+        {
+            "id": "modem-004",
+            "device_type": "modem",
+            "deployed": False,
+            "retired": False,
+            "note": "Spare modem - not deployed",
+            "ip_address": None,
+            "phone_number": "+1-555-0103",
+            "hardware_model": "Raven XTV"
+        }
+    ]
+
+    for modem_data in test_modems:
+        # Check if modem already exists
+        existing = db.query(RosterUnit).filter_by(id=modem_data["id"]).first()
+        if existing:
+            print(f"Modem {modem_data['id']} already exists, skipping...")
+            continue
+
+        modem = RosterUnit(**modem_data)
+        db.add(modem)
+        print(f"Added {modem_data['id']}")
+
+    # Assign modems to existing SLMs
+    slm_modem_assignments = {
+        "nl43-001": "modem-001",
+        "nl43-002": "modem-002",
+        "nl53-001": "modem-003"
+    }
+
+    for slm_id, modem_id in slm_modem_assignments.items():
+        slm = db.query(RosterUnit).filter_by(id=slm_id).first()
+        if slm:
+            slm.deployed_with_modem_id = modem_id
+            # Remove legacy slm_host since we're using modems now
+            slm.slm_host = None
+            print(f"Assigned {slm_id} to {modem_id}")
+        else:
+            print(f"SLM {slm_id} not found, skipping assignment...")
+
+    db.commit()
+    db.close()
+    print("\nTest modems added and assigned to SLMs successfully in DEV database (data-dev/seismo_fleet.db)!")
+    print("\nModem assignments:")
+    for slm_id, modem_id in slm_modem_assignments.items():
+        print(f"  {slm_id} → {modem_id}")
+
+if __name__ == "__main__":
+    add_test_modems()

scripts/add_test_slms.py

@@ -0,0 +1,106 @@
+#!/usr/bin/env python3
+"""
+Add test Sound Level Meter units to the DEV database
+"""
+
+from sqlalchemy import create_engine
+from sqlalchemy.orm import sessionmaker
+from backend.models import RosterUnit
+from datetime import datetime
+
+# DEV database
+DEV_DB_URL = "sqlite:///./data-dev/seismo_fleet.db"
+
+def add_test_slms():
+    engine = create_engine(DEV_DB_URL, connect_args={"check_same_thread": False})
+    SessionLocal = sessionmaker(autocommit=False, autoflush=False, bind=engine)
+    db = SessionLocal()
+
+    test_slms = [
+        {
+            "id": "nl43-001",
+            "device_type": "sound_level_meter",
+            "deployed": True,
+            "retired": False,
+            "note": "Test unit at construction site A",
+            "address": "123 Main St, Construction Site A",
+            "coordinates": "34.0522,-118.2437",
+            "slm_host": "192.168.1.100",
+            "slm_tcp_port": 2255,
+            "slm_model": "NL-43",
+            "slm_serial_number": "123456",
+            "slm_frequency_weighting": "A",
+            "slm_time_weighting": "F",
+            "slm_measurement_range": "30-130 dB",
+            "slm_last_check": datetime.utcnow()
+        },
+        {
+            "id": "nl43-002",
+            "device_type": "sound_level_meter",
+            "deployed": True,
+            "retired": False,
+            "note": "Test unit at construction site B",
+            "address": "456 Oak Ave, Construction Site B",
+            "coordinates": "34.0622,-118.2537",
+            "slm_host": "192.168.1.101",
+            "slm_tcp_port": 2255,
+            "slm_model": "NL-43",
+            "slm_serial_number": "123457",
+            "slm_frequency_weighting": "A",
+            "slm_time_weighting": "S",
+            "slm_measurement_range": "30-130 dB",
+            "slm_last_check": datetime.utcnow()
+        },
+        {
+            "id": "nl53-001",
+            "device_type": "sound_level_meter",
+            "deployed": True,
+            "retired": False,
+            "note": "Test unit at residential monitoring",
+            "address": "789 Elm St, Residential Area",
+            "coordinates": "34.0722,-118.2637",
+            "slm_host": "192.168.1.102",
+            "slm_tcp_port": 2255,
+            "slm_model": "NL-53",
+            "slm_serial_number": "234567",
+            "slm_frequency_weighting": "C",
+            "slm_time_weighting": "F",
+            "slm_measurement_range": "25-140 dB",
+            "slm_last_check": datetime.utcnow()
+        },
+        {
+            "id": "nl43-003",
+            "device_type": "sound_level_meter",
+            "deployed": False,
+            "retired": False,
+            "note": "Benched for calibration",
+            "address": None,
+            "coordinates": None,
+            "slm_host": None,
+            "slm_tcp_port": None,
+            "slm_model": "NL-43",
+            "slm_serial_number": "123458",
+            "slm_frequency_weighting": "A",
+            "slm_time_weighting": "F",
+            "slm_measurement_range": "30-130 dB",
+            "slm_last_check": None
+        }
+    ]
+
+    for slm_data in test_slms:
+        # Check if unit already exists
+        existing = db.query(RosterUnit).filter_by(id=slm_data["id"]).first()
+        if existing:
+            print(f"Unit {slm_data['id']} already exists, skipping...")
+            continue
+
+        unit = RosterUnit(**slm_data)
+        db.add(unit)
+        print(f"Added {slm_data['id']}")
+
+    db.commit()
+    db.close()
+    print("\nTest SLM units added successfully to DEV database (data-dev/seismo_fleet.db)!")
+
+if __name__ == "__main__":
+    add_test_slms()

scripts/migrate_dev_db.py

@@ -0,0 +1,46 @@
+#!/usr/bin/env python3
+"""
+Migrate DEV database to add SLM-specific columns
+"""
+
+from sqlalchemy import create_engine, text
+
+# DEV database
+DEV_DB_URL = "sqlite:///./data-dev/seismo_fleet.db"
+
+def migrate_dev_database():
+    print("Migrating DEV database to add SLM columns...")
+    print("=" * 60)
+
+    engine = create_engine(DEV_DB_URL, connect_args={"check_same_thread": False})
+
+    # SLM columns to add
+    slm_columns = [
+        ("slm_host", "VARCHAR"),
+        ("slm_tcp_port", "INTEGER"),
+        ("slm_model", "VARCHAR"),
+        ("slm_serial_number", "VARCHAR"),
+        ("slm_frequency_weighting", "VARCHAR"),
+        ("slm_time_weighting", "VARCHAR"),
+        ("slm_measurement_range", "VARCHAR"),
+        ("slm_last_check", "DATETIME"),
+    ]
+
+    with engine.connect() as conn:
+        for column_name, column_type in slm_columns:
+            try:
+                # Try to add the column
+                conn.execute(text(f"ALTER TABLE roster ADD COLUMN {column_name} {column_type}"))
+                conn.commit()
+                print(f"✓ Added column: {column_name}")
+            except Exception as e:
+                if "duplicate column name" in str(e).lower():
+                    print(f"  Column {column_name} already exists, skipping")
+                else:
+                    print(f"✗ Error adding {column_name}: {e}")
+
+    print("=" * 60)
+    print("DEV database migration completed!")
+
+if __name__ == "__main__":
+    migrate_dev_database()

scripts/remove_test_data_from_prod.py

@@ -0,0 +1,45 @@
+#!/usr/bin/env python3
+"""
+Remove test SLMs and modems from PRODUCTION database
+"""
+
+from sqlalchemy import create_engine
+from sqlalchemy.orm import sessionmaker
+from backend.models import RosterUnit
+
+# PRODUCTION database
+PROD_DB_URL = "sqlite:///./data/seismo_fleet.db"
+
+def remove_test_data():
+    engine = create_engine(PROD_DB_URL, connect_args={"check_same_thread": False})
+    SessionLocal = sessionmaker(autocommit=False, autoflush=False, bind=engine)
+    db = SessionLocal()
+
+    # IDs to remove
+    test_slm_ids = ["nl43-001", "nl43-002", "nl53-001", "nl43-003"]
+    test_modem_ids = ["modem-001", "modem-002", "modem-003", "modem-004"]
+
+    all_test_ids = test_slm_ids + test_modem_ids
+
+    removed = []
+    for unit_id in all_test_ids:
+        unit = db.query(RosterUnit).filter_by(id=unit_id).first()
+        if unit:
+            db.delete(unit)
+            removed.append(unit_id)
+            print(f"Removed {unit_id}")
+
+    if removed:
+        db.commit()
+        print(f"\nRemoved {len(removed)} test units from PRODUCTION database")
+    else:
+        print("No test units found in production database")
+
+    db.close()
+
+if __name__ == "__main__":
+    print("Removing test data from PRODUCTION database...")
+    print("=" * 60)
+    remove_test_data()
+    print("=" * 60)
+    print("Done! Production database is clean.")

scripts/update_dev_db_schema.py

@@ -0,0 +1,39 @@
+#!/usr/bin/env python3
+"""
+Update DEV database schema to match current models
+"""
+
+from sqlalchemy import create_engine, inspect
+from backend.models import Base
+
+# DEV database
+DEV_DB_URL = "sqlite:///./data-dev/seismo_fleet.db"
+
+def update_schema():
+    print("Updating DEV database schema...")
+    print("=" * 60)
+
+    engine = create_engine(DEV_DB_URL, connect_args={"check_same_thread": False})
+
+    # Create all tables (will update existing tables with new columns)
+    Base.metadata.create_all(bind=engine)
+
+    # Inspect to see what we have
+    inspector = inspect(engine)
+    tables = inspector.get_table_names()
+
+    print(f"Tables in DEV database: {tables}")
+
+    if 'roster' in tables:
+        columns = [col['name'] for col in inspector.get_columns('roster')]
+        print(f"\nColumns in roster table:")
+        for col in sorted(columns):
+            print(f"  - {col}")
+
+    print("=" * 60)
+    print("DEV database schema updated successfully!")
+    print("\nNote: SQLite doesn't support ALTER COLUMN, so existing")
+    print("columns won't be modified, but new columns will be added.")
+
+if __name__ == "__main__":
+    update_schema()

templates/base.html

@@ -113,6 +113,20 @@
                     Fleet Roster
                 </a>
 
+                <a href="/seismographs" class="flex items-center px-4 py-3 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 {% if request.url.path == '/seismographs' %}bg-gray-100 dark:bg-gray-700{% endif %}">
+                    <svg class="w-5 h-5 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
+                    </svg>
+                    Seismographs
+                </a>
+
+                <a href="/sound-level-meters" class="flex items-center px-4 py-3 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 {% if request.url.path == '/sound-level-meters' %}bg-gray-100 dark:bg-gray-700{% endif %}">
+                    <svg class="w-5 h-5 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z"></path>
+                    </svg>
+                    Sound Level Meters
+                </a>
+
                 <a href="#" class="flex items-center px-4 py-3 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 opacity-50 cursor-not-allowed">
                     <svg class="w-5 h-5 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"></path>

templates/dashboard.html

@@ -57,6 +57,27 @@
                     <span class="text-gray-600 dark:text-gray-400">Benched</span>
                     <span id="benched-units" class="text-3xl md:text-2xl font-bold text-gray-600 dark:text-gray-400">--</span>
                 </div>
+                <div class="border-t border-gray-200 dark:border-gray-700 pt-3 mt-3">
+                    <p class="text-xs text-gray-500 dark:text-gray-500 mb-2 italic">By Device Type:</p>
+                    <div class="flex justify-between items-center mb-1">
+                        <div class="flex items-center">
+                            <svg class="w-4 h-4 mr-1.5 text-blue-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
+                            </svg>
+                            <a href="/seismographs" class="text-sm text-gray-600 dark:text-gray-400 hover:text-blue-600 dark:hover:text-blue-400">Seismographs</a>
+                        </div>
+                        <span id="seismo-count" class="font-semibold text-blue-600 dark:text-blue-400">--</span>
+                    </div>
+                    <div class="flex justify-between items-center mb-2">
+                        <div class="flex items-center">
+                            <svg class="w-4 h-4 mr-1.5 text-purple-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z"></path>
+                            </svg>
+                            <a href="/sound-level-meters" class="text-sm text-gray-600 dark:text-gray-400 hover:text-purple-600 dark:hover:text-purple-400">Sound Level Meters</a>
+                        </div>
+                        <span id="slm-count" class="font-semibold text-purple-600 dark:text-purple-400">--</span>
+                    </div>
+                </div>
                 <div class="border-t border-gray-200 dark:border-gray-700 pt-3 mt-3">
                     <p class="text-xs text-gray-500 dark:text-gray-500 mb-2 italic">Deployed Status:</p>
                     <div class="flex justify-between items-center mb-2" title="Units reporting normally (last seen < 12 hours)">
@@ -343,6 +364,21 @@ function updateDashboard(event) {
         document.getElementById('status-pending').textContent = data.summary?.pending ?? 0;
         document.getElementById('status-missing').textContent = data.summary?.missing ?? 0;
 
+        // ===== Device type counts =====
+        let seismoCount = 0;
+        let slmCount = 0;
+        Object.values(data.units || {}).forEach(unit => {
+            if (unit.retired) return; // Don't count retired units
+            const deviceType = unit.device_type || 'seismograph';
+            if (deviceType === 'seismograph') {
+                seismoCount++;
+            } else if (deviceType === 'sound_level_meter') {
+                slmCount++;
+            }
+        });
+        document.getElementById('seismo-count').textContent = seismoCount;
+        document.getElementById('slm-count').textContent = slmCount;
+
         // ===== Alerts =====
         const alertsList = document.getElementById('alerts-list');
         // Only show alerts for deployed units that are MISSING (not pending)

templates/partials/seismo_stats.html

@@ -0,0 +1,56 @@
+<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
+    <!-- Total Seismographs -->
+    <div class="rounded-lg shadow bg-white dark:bg-slate-800 p-6">
+        <div class="flex items-center justify-between">
+            <div>
+                <p class="text-gray-600 dark:text-gray-400 text-sm">Total Seismographs</p>
+                <p class="text-3xl font-bold text-gray-900 dark:text-white mt-2">{{ total }}</p>
+            </div>
+            <svg class="w-12 h-12 text-blue-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
+            </svg>
+        </div>
+    </div>
+
+    <!-- Deployed -->
+    <div class="rounded-lg shadow bg-white dark:bg-slate-800 p-6">
+        <div class="flex items-center justify-between">
+            <div>
+                <p class="text-gray-600 dark:text-gray-400 text-sm">Deployed</p>
+                <p class="text-3xl font-bold text-green-600 dark:text-green-400 mt-2">{{ deployed }}</p>
+            </div>
+            <svg class="w-12 h-12 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+            </svg>
+        </div>
+    </div>
+
+    <!-- Benched -->
+    <div class="rounded-lg shadow bg-white dark:bg-slate-800 p-6">
+        <div class="flex items-center justify-between">
+            <div>
+                <p class="text-gray-600 dark:text-gray-400 text-sm">Benched</p>
+                <p class="text-3xl font-bold text-gray-600 dark:text-gray-400 mt-2">{{ benched }}</p>
+            </div>
+            <svg class="w-12 h-12 text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"></path>
+            </svg>
+        </div>
+    </div>
+
+    <!-- With Modem -->
+    <div class="rounded-lg shadow bg-white dark:bg-slate-800 p-6">
+        <div class="flex items-center justify-between">
+            <div>
+                <p class="text-gray-600 dark:text-gray-400 text-sm">With Modem</p>
+                <p class="text-3xl font-bold text-blue-600 dark:text-blue-400 mt-2">{{ with_modem }}<span class="text-base text-gray-500">/ {{ deployed }}</span></p>
+                {% if without_modem > 0 %}
+                <p class="text-xs text-orange-600 dark:text-orange-400 mt-1">{{ without_modem }} without modem</p>
+                {% endif %}
+            </div>
+            <svg class="w-12 h-12 text-blue-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.111 16.404a5.5 5.5 0 017.778 0M12 20h.01m-7.08-7.071c3.904-3.905 10.236-3.905 14.141 0M1.394 9.393c5.857-5.857 15.355-5.857 21.213 0"></path>
+            </svg>
+        </div>
+    </div>
+</div>

templates/partials/seismo_unit_list.html

@@ -0,0 +1,97 @@
+{% if units %}
+<div class="overflow-x-auto">
+    <table class="w-full">
+        <thead class="bg-gray-50 dark:bg-slate-700 border-b border-gray-200 dark:border-gray-600">
+            <tr>
+                <th class="px-4 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">Unit ID</th>
+                <th class="px-4 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">Status</th>
+                <th class="px-4 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">Modem</th>
+                <th class="px-4 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">Location</th>
+                <th class="px-4 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">Notes</th>
+                <th class="px-4 py-3 text-right text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">Actions</th>
+            </tr>
+        </thead>
+        <tbody class="divide-y divide-gray-200 dark:divide-gray-700">
+            {% for unit in units %}
+            <tr class="hover:bg-gray-50 dark:hover:bg-slate-700 transition-colors">
+                <td class="px-4 py-3 whitespace-nowrap">
+                    <a href="/unit/{{ unit.id }}" class="font-medium text-blue-600 dark:text-blue-400 hover:underline">
+                        {{ unit.id }}
+                    </a>
+                </td>
+                <td class="px-4 py-3 whitespace-nowrap">
+                    {% if unit.deployed %}
+                    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200">
+                        <svg class="w-3 h-3 mr-1" fill="currentColor" viewBox="0 0 20 20">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        Deployed
+                    </span>
+                    {% else %}
+                    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-300">
+                        <svg class="w-3 h-3 mr-1" fill="currentColor" viewBox="0 0 20 20">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8 7a1 1 0 00-1 1v4a1 1 0 001 1h4a1 1 0 001-1V8a1 1 0 00-1-1H8z" clip-rule="evenodd"></path>
+                        </svg>
+                        Benched
+                    </span>
+                    {% endif %}
+                </td>
+                <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900 dark:text-gray-300">
+                    {% if unit.deployed_with_modem_id %}
+                    <a href="/unit/{{ unit.deployed_with_modem_id }}" class="text-blue-600 dark:text-blue-400 hover:underline">
+                        {{ unit.deployed_with_modem_id }}
+                    </a>
+                    {% else %}
+                    <span class="text-gray-400 dark:text-gray-600">None</span>
+                    {% endif %}
+                </td>
+                <td class="px-4 py-3 text-sm text-gray-900 dark:text-gray-300">
+                    {% if unit.address %}
+                    <span class="truncate max-w-xs inline-block" title="{{ unit.address }}">{{ unit.address }}</span>
+                    {% elif unit.coordinates %}
+                    <span class="text-gray-500 dark:text-gray-400">{{ unit.coordinates }}</span>
+                    {% else %}
+                    <span class="text-gray-400 dark:text-gray-600">—</span>
+                    {% endif %}
+                </td>
+                <td class="px-4 py-3 text-sm text-gray-700 dark:text-gray-400">
+                    {% if unit.note %}
+                    <span class="truncate max-w-xs inline-block" title="{{ unit.note }}">{{ unit.note }}</span>
+                    {% else %}
+                    <span class="text-gray-400 dark:text-gray-600">—</span>
+                    {% endif %}
+                </td>
+                <td class="px-4 py-3 whitespace-nowrap text-right text-sm">
+                    <a href="/unit/{{ unit.id }}" class="text-blue-600 dark:text-blue-400 hover:underline">
+                        View Details →
+                    </a>
+                </td>
+            </tr>
+            {% endfor %}
+        </tbody>
+    </table>
+</div>
+
+{% if search %}
+<div class="mt-4 text-sm text-gray-600 dark:text-gray-400">
+    Found {{ units|length }} seismograph(s) matching "{{ search }}"
+</div>
+{% endif %}
+
+{% else %}
+<div class="text-center py-12">
+    <svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
+    </svg>
+    <h3 class="mt-2 text-sm font-medium text-gray-900 dark:text-white">No seismographs found</h3>
+    {% if search %}
+    <p class="mt-1 text-sm text-gray-500 dark:text-gray-400">No seismographs match "{{ search }}"</p>
+    <button onclick="document.getElementById('seismo-search').value = ''; htmx.trigger('#seismo-search', 'keyup');"
+            class="mt-3 text-blue-600 dark:text-blue-400 hover:underline">
+        Clear search
+    </button>
+    {% else %}
+    <p class="mt-1 text-sm text-gray-500 dark:text-gray-400">Get started by adding a seismograph unit from the roster page.</p>
+    {% endif %}
+</div>
+{% endif %}

templates/partials/slm_config_form.html

@@ -0,0 +1,288 @@
+<form id="slm-config-form"
+      hx-post="/api/slm-dashboard/config/{{ unit.id }}"
+      hx-swap="none"
+      hx-on::after-request="handleConfigSave(event)">
+
+    <div class="mb-6">
+        <h4 class="text-lg font-semibold text-gray-900 dark:text-white mb-2">Unit: {{ unit.id }}</h4>
+        <p class="text-sm text-gray-600 dark:text-gray-400">Configure measurement parameters for this sound level meter</p>
+    </div>
+
+    <!-- Model & Serial -->
+    <div class="grid grid-cols-2 gap-4 mb-4">
+        <div>
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Model</label>
+            <select name="slm_model" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
+                <option value="">Select model...</option>
+                <option value="NL-43" {% if unit.slm_model == 'NL-43' %}selected{% endif %}>NL-43</option>
+                <option value="NL-53" {% if unit.slm_model == 'NL-53' %}selected{% endif %}>NL-53</option>
+            </select>
+        </div>
+        <div>
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Serial Number</label>
+            <input type="text" name="slm_serial_number" value="{{ unit.slm_serial_number or '' }}"
+                   class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white"
+                   placeholder="e.g., SN123456">
+        </div>
+    </div>
+
+    <!-- Frequency & Time Weighting -->
+    <div class="grid grid-cols-2 gap-4 mb-4">
+        <div>
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Frequency Weighting</label>
+            <select name="slm_frequency_weighting" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
+                <option value="">Select...</option>
+                <option value="A" {% if unit.slm_frequency_weighting == 'A' %}selected{% endif %}>A-weighting</option>
+                <option value="C" {% if unit.slm_frequency_weighting == 'C' %}selected{% endif %}>C-weighting</option>
+                <option value="Z" {% if unit.slm_frequency_weighting == 'Z' %}selected{% endif %}>Z-weighting (Linear)</option>
+            </select>
+        </div>
+        <div>
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Time Weighting</label>
+            <select name="slm_time_weighting" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
+                <option value="">Select...</option>
+                <option value="Fast" {% if unit.slm_time_weighting == 'Fast' %}selected{% endif %}>Fast (125ms)</option>
+                <option value="Slow" {% if unit.slm_time_weighting == 'Slow' %}selected{% endif %}>Slow (1s)</option>
+                <option value="Impulse" {% if unit.slm_time_weighting == 'Impulse' %}selected{% endif %}>Impulse</option>
+            </select>
+        </div>
+    </div>
+
+    <!-- Measurement Range -->
+    <div class="mb-4">
+        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Measurement Range</label>
+        <select name="slm_measurement_range" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
+            <option value="">Select range...</option>
+            <option value="30-130" {% if unit.slm_measurement_range == '30-130' %}selected{% endif %}>30-130 dB</option>
+            <option value="40-140" {% if unit.slm_measurement_range == '40-140' %}selected{% endif %}>40-140 dB</option>
+            <option value="50-140" {% if unit.slm_measurement_range == '50-140' %}selected{% endif %}>50-140 dB</option>
+        </select>
+    </div>
+
+    <!-- Network Configuration -->
+    <div class="border-t border-gray-200 dark:border-gray-700 pt-4 mt-6 mb-4">
+        <h5 class="text-md font-semibold text-gray-900 dark:text-white mb-3">Network Configuration</h5>
+
+        <div class="mb-4">
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Assigned Modem</label>
+            <div class="flex gap-2">
+                <select name="deployed_with_modem_id" id="config-modem-select" class="flex-1 px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
+                    <option value="">No modem (direct connection)</option>
+                    <!-- Options loaded via JavaScript -->
+                </select>
+                <button type="button" id="test-modem-btn" onclick="testModemConnection()"
+                        class="px-4 py-2 text-blue-700 dark:text-blue-300 bg-blue-100 dark:bg-blue-900 hover:bg-blue-200 dark:hover:bg-blue-800 rounded-lg transition-colors {% if not unit.deployed_with_modem_id %}opacity-50 cursor-not-allowed{% endif %}"
+                        {% if not unit.deployed_with_modem_id %}disabled{% endif %}
+                        title="Ping modem to test connectivity">
+                    <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.111 16.404a5.5 5.5 0 017.778 0M12 20h.01m-7.08-7.071c3.904-3.905 10.236-3.905 14.141 0M1.394 9.393c5.857-5.857 15.355-5.857 21.213 0"></path>
+                    </svg>
+                </button>
+            </div>
+            <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">Select a modem for network access, or leave blank for direct IP connection</p>
+        </div>
+
+        <!-- Port Configuration (always visible) -->
+        <div class="grid grid-cols-3 gap-4 mb-4">
+            <div>
+                <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">TCP Port</label>
+                <input type="number" name="slm_tcp_port" value="{{ unit.slm_tcp_port or '2255' }}"
+                       class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white font-mono text-sm"
+                       placeholder="2255">
+                <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">Control port</p>
+            </div>
+            <div>
+                <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">FTP Port</label>
+                <input type="number" name="slm_ftp_port" value="{{ unit.slm_ftp_port or '21' }}"
+                       class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white font-mono text-sm"
+                       placeholder="21">
+                <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">Data transfer</p>
+            </div>
+            <div id="direct-ip-field" class="{% if unit.deployed_with_modem_id %}hidden{% endif %}">
+                <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Direct IP</label>
+                <input type="text" name="slm_host" value="{{ unit.slm_host or '' }}"
+                       class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white font-mono text-sm"
+                       placeholder="192.168.1.100">
+                <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">If no modem</p>
+            </div>
+        </div>
+    </div>
+
+    <!-- Action Buttons -->
+    <div class="flex justify-end gap-3 mt-6">
+        <button type="button" onclick="closeConfigModal()"
+                class="px-4 py-2 text-gray-700 dark:text-gray-300 bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 rounded-lg transition-colors">
+            Cancel
+        </button>
+        <button type="button" onclick="testSLMConnection('{{ unit.id }}')"
+                class="px-4 py-2 text-blue-700 dark:text-blue-300 bg-blue-100 dark:bg-blue-900 hover:bg-blue-200 dark:hover:bg-blue-800 rounded-lg transition-colors">
+            Test SLM Connection
+        </button>
+        <button type="submit"
+                class="px-4 py-2 text-white bg-seismo-orange hover:bg-seismo-burgundy rounded-lg transition-colors">
+            Save Configuration
+        </button>
+    </div>
+</form>
+
+<script>
+// Load modems list for dropdown
+async function loadModemsForConfig() {
+    try {
+        const response = await fetch('/api/roster/modems');
+        const modems = await response.json();
+
+        const select = document.getElementById('config-modem-select');
+        const currentValue = '{{ unit.deployed_with_modem_id or "" }}';
+
+        // Keep the "No modem" option
+        modems.forEach(modem => {
+            const option = document.createElement('option');
+            option.value = modem.id;
+            const ipText = modem.ip_address ? ' (' + modem.ip_address + ')' : '';
+            option.textContent = modem.id + ipText;
+            if (modem.id === currentValue) {
+                option.selected = true;
+            }
+            select.appendChild(option);
+        });
+    } catch (error) {
+        console.error('Failed to load modems:', error);
+    }
+}
+
+// Toggle direct IP field and test modem button based on modem selection
+document.getElementById('config-modem-select')?.addEventListener('change', function() {
+    const directIpField = document.getElementById('direct-ip-field');
+    const testModemBtn = document.getElementById('test-modem-btn');
+
+    if (this.value === '') {
+        directIpField.classList.remove('hidden');
+        testModemBtn.disabled = true;
+        testModemBtn.classList.add('opacity-50', 'cursor-not-allowed');
+    } else {
+        directIpField.classList.add('hidden');
+        testModemBtn.disabled = false;
+        testModemBtn.classList.remove('opacity-50', 'cursor-not-allowed');
+    }
+});
+
+// Handle save response
+function handleConfigSave(event) {
+    if (event.detail.successful) {
+        // Show success message
+        const toast = document.createElement('div');
+        toast.className = 'fixed bottom-4 right-4 bg-green-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+        toast.textContent = 'Configuration saved successfully!';
+        document.body.appendChild(toast);
+
+        setTimeout(() => {
+            toast.remove();
+            closeConfigModal();
+            // Refresh the unit list
+            htmx.trigger('#slm-list', 'load');
+        }, 2000);
+    } else {
+        // Show error message
+        const toast = document.createElement('div');
+        toast.className = 'fixed bottom-4 right-4 bg-red-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+        toast.textContent = 'Failed to save configuration';
+        document.body.appendChild(toast);
+
+        setTimeout(() => {
+            toast.remove();
+        }, 3000);
+    }
+}
+
+// Test connection to modem (health ping)
+async function testModemConnection() {
+    const modemSelect = document.getElementById('config-modem-select');
+    const modemId = modemSelect.value;
+
+    if (!modemId) {
+        alert('Please select a modem first');
+        return;
+    }
+
+    const toast = document.createElement('div');
+    toast.className = 'fixed bottom-4 right-4 bg-blue-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+    toast.textContent = 'Pinging modem...';
+    document.body.appendChild(toast);
+
+    try {
+        const response = await fetch('/api/slm-dashboard/test-modem/' + modemId);
+        const data = await response.json();
+
+        toast.remove();
+
+        const resultToast = document.createElement('div');
+        if (response.ok && data.status === 'success') {
+            resultToast.className = 'fixed bottom-4 right-4 bg-green-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+            const ipAddr = data.ip_address || modemId;
+            const respTime = data.response_time || 'N/A';
+            resultToast.innerHTML = '✓ Modem responding!<br><span class="text-xs">' + ipAddr + ' - ' + respTime + 'ms</span>';
+        } else {
+            resultToast.className = 'fixed bottom-4 right-4 bg-yellow-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+            resultToast.textContent = '⚠ Modem not responding: ' + (data.detail || 'Unknown error');
+        }
+        document.body.appendChild(resultToast);
+
+        setTimeout(() => {
+            resultToast.remove();
+        }, 4000);
+    } catch (error) {
+        toast.remove();
+        const errorToast = document.createElement('div');
+        errorToast.className = 'fixed bottom-4 right-4 bg-red-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+        errorToast.textContent = '✗ Failed to ping modem: ' + error.message;
+        document.body.appendChild(errorToast);
+
+        setTimeout(() => {
+            errorToast.remove();
+        }, 3000);
+    }
+}
+
+// Test connection to SLM
+async function testSLMConnection(unitId) {
+    const toast = document.createElement('div');
+    toast.className = 'fixed bottom-4 right-4 bg-blue-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+    toast.textContent = 'Testing SLM connection...';
+    document.body.appendChild(toast);
+
+    try {
+        const response = await fetch('/api/slmm/' + unitId + '/status');
+        const data = await response.json();
+
+        toast.remove();
+
+        const resultToast = document.createElement('div');
+        if (response.ok && data.status === 'online') {
+            resultToast.className = 'fixed bottom-4 right-4 bg-green-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+            resultToast.textContent = '✓ SLM connection successful! ' + (data.model || 'SLM') + ' responding';
+        } else {
+            resultToast.className = 'fixed bottom-4 right-4 bg-yellow-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+            resultToast.textContent = '⚠ SLM connection failed or device offline';
+        }
+        document.body.appendChild(resultToast);
+
+        setTimeout(() => {
+            resultToast.remove();
+        }, 3000);
+    } catch (error) {
+        toast.remove();
+        const errorToast = document.createElement('div');
+        errorToast.className = 'fixed bottom-4 right-4 bg-red-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+        errorToast.textContent = '✗ SLM connection test failed: ' + error.message;
+        document.body.appendChild(errorToast);
+
+        setTimeout(() => {
+            errorToast.remove();
+        }, 3000);
+    }
+}
+
+// Load modems on page load
+loadModemsForConfig();
+</script>

templates/partials/slm_config_form_old.html

@@ -0,0 +1,215 @@
+<form id="slm-config-form"
+      hx-post="/api/slm-dashboard/config/{{ unit.id }}"
+      hx-swap="none"
+      hx-on::after-request="handleConfigSave(event)">
+
+    <div class="mb-6">
+        <h4 class="text-lg font-semibold text-gray-900 dark:text-white mb-2">Unit: {{ unit.id }}</h4>
+        <p class="text-sm text-gray-600 dark:text-gray-400">Configure measurement parameters for this sound level meter</p>
+    </div>
+
+    <!-- Model & Serial -->
+    <div class="grid grid-cols-2 gap-4 mb-4">
+        <div>
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Model</label>
+            <select name="slm_model" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
+                <option value="">Select model...</option>
+                <option value="NL-43" {% if unit.slm_model == 'NL-43' %}selected{% endif %}>NL-43</option>
+                <option value="NL-53" {% if unit.slm_model == 'NL-53' %}selected{% endif %}>NL-53</option>
+            </select>
+        </div>
+        <div>
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Serial Number</label>
+            <input type="text" name="slm_serial_number" value="{{ unit.slm_serial_number or '' }}"
+                   class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white"
+                   placeholder="e.g., SN123456">
+        </div>
+    </div>
+
+    <!-- Frequency & Time Weighting -->
+    <div class="grid grid-cols-2 gap-4 mb-4">
+        <div>
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Frequency Weighting</label>
+            <select name="slm_frequency_weighting" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
+                <option value="">Select...</option>
+                <option value="A" {% if unit.slm_frequency_weighting == 'A' %}selected{% endif %}>A-weighting</option>
+                <option value="C" {% if unit.slm_frequency_weighting == 'C' %}selected{% endif %}>C-weighting</option>
+                <option value="Z" {% if unit.slm_frequency_weighting == 'Z' %}selected{% endif %}>Z-weighting (Linear)</option>
+            </select>
+        </div>
+        <div>
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Time Weighting</label>
+            <select name="slm_time_weighting" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
+                <option value="">Select...</option>
+                <option value="Fast" {% if unit.slm_time_weighting == 'Fast' %}selected{% endif %}>Fast (125ms)</option>
+                <option value="Slow" {% if unit.slm_time_weighting == 'Slow' %}selected{% endif %}>Slow (1s)</option>
+                <option value="Impulse" {% if unit.slm_time_weighting == 'Impulse' %}selected{% endif %}>Impulse</option>
+            </select>
+        </div>
+    </div>
+
+    <!-- Measurement Range -->
+    <div class="mb-4">
+        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Measurement Range</label>
+        <select name="slm_measurement_range" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
+            <option value="">Select range...</option>
+            <option value="30-130" {% if unit.slm_measurement_range == '30-130' %}selected{% endif %}>30-130 dB</option>
+            <option value="40-140" {% if unit.slm_measurement_range == '40-140' %}selected{% endif %}>40-140 dB</option>
+            <option value="50-140" {% if unit.slm_measurement_range == '50-140' %}selected{% endif %}>50-140 dB</option>
+        </select>
+    </div>
+
+    <!-- Network Configuration -->
+    <div class="border-t border-gray-200 dark:border-gray-700 pt-4 mt-6 mb-4">
+        <h5 class="text-md font-semibold text-gray-900 dark:text-white mb-3">Network Configuration</h5>
+
+        <div class="mb-4">
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Assigned Modem</label>
+            <select name="deployed_with_modem_id" id="config-modem-select" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
+                <option value="">No modem (direct connection)</option>
+                <!-- Options loaded via JavaScript -->
+            </select>
+            <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">Select a modem for network access, or leave blank for direct IP connection</p>
+        </div>
+
+        <!-- Legacy direct connection (shown only if no modem selected) -->
+        <div id="direct-connection-fields" class="{% if unit.deployed_with_modem_id %}hidden{% endif %}">
+            <div class="grid grid-cols-2 gap-4">
+                <div>
+                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Direct IP Address</label>
+                    <input type="text" name="slm_host" value="{{ unit.slm_host or '' }}"
+                           class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white font-mono text-sm"
+                           placeholder="192.168.1.100">
+                </div>
+                <div>
+                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">TCP Port</label>
+                    <input type="number" name="slm_tcp_port" value="{{ unit.slm_tcp_port or '' }}"
+                           class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white font-mono text-sm"
+                           placeholder="502">
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- Action Buttons -->
+    <div class="flex justify-end gap-3 mt-6">
+        <button type="button" onclick="closeConfigModal()"
+                class="px-4 py-2 text-gray-700 dark:text-gray-300 bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 rounded-lg transition-colors">
+            Cancel
+        </button>
+        <button type="button" onclick="testConnection('{{ unit.id }}')"
+                class="px-4 py-2 text-blue-700 dark:text-blue-300 bg-blue-100 dark:bg-blue-900 hover:bg-blue-200 dark:hover:bg-blue-800 rounded-lg transition-colors">
+            Test Connection
+        </button>
+        <button type="submit"
+                class="px-4 py-2 text-white bg-seismo-orange hover:bg-seismo-burgundy rounded-lg transition-colors">
+            Save Configuration
+        </button>
+    </div>
+</form>
+
+<script>
+// Load modems list for dropdown
+async function loadModemsForConfig() {
+    try {
+        const response = await fetch('/api/roster/modems');
+        const modems = await response.json();
+
+        const select = document.getElementById('config-modem-select');
+        const currentValue = '{{ unit.deployed_with_modem_id or "" }}';
+
+        // Keep the "No modem" option
+        modems.forEach(modem => {
+            const option = document.createElement('option');
+            option.value = modem.id;
+            option.textContent = `${modem.id}${modem.ip_address ? ' (' + modem.ip_address + ')' : ''}`;
+            if (modem.id === currentValue) {
+                option.selected = true;
+            }
+            select.appendChild(option);
+        });
+    } catch (error) {
+        console.error('Failed to load modems:', error);
+    }
+}
+
+// Toggle direct connection fields based on modem selection
+document.getElementById('config-modem-select')?.addEventListener('change', function() {
+    const directFields = document.getElementById('direct-connection-fields');
+    if (this.value === '') {
+        directFields.classList.remove('hidden');
+    } else {
+        directFields.classList.add('hidden');
+    }
+});
+
+// Handle save response
+function handleConfigSave(event) {
+    if (event.detail.successful) {
+        // Show success message
+        const toast = document.createElement('div');
+        toast.className = 'fixed bottom-4 right-4 bg-green-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+        toast.textContent = 'Configuration saved successfully!';
+        document.body.appendChild(toast);
+
+        setTimeout(() => {
+            toast.remove();
+            closeConfigModal();
+            // Refresh the unit list
+            htmx.trigger('#slm-list', 'load');
+        }, 2000);
+    } else {
+        // Show error message
+        const toast = document.createElement('div');
+        toast.className = 'fixed bottom-4 right-4 bg-red-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+        toast.textContent = 'Failed to save configuration';
+        document.body.appendChild(toast);
+
+        setTimeout(() => {
+            toast.remove();
+        }, 3000);
+    }
+}
+
+// Test connection to SLM
+async function testConnection(unitId) {
+    const toast = document.createElement('div');
+    toast.className = 'fixed bottom-4 right-4 bg-blue-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+    toast.textContent = 'Testing connection...';
+    document.body.appendChild(toast);
+
+    try {
+        const response = await fetch(`/api/slmm/${unitId}/status`);
+        const data = await response.json();
+
+        toast.remove();
+
+        const resultToast = document.createElement('div');
+        if (response.ok && data.status === 'online') {
+            resultToast.className = 'fixed bottom-4 right-4 bg-green-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+            resultToast.textContent = `✓ Connection successful! ${data.model || 'SLM'} responding`;
+        } else {
+            resultToast.className = 'fixed bottom-4 right-4 bg-yellow-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+            resultToast.textContent = `Connection failed or device offline`;
+        }
+        document.body.appendChild(resultToast);
+
+        setTimeout(() => {
+            resultToast.remove();
+        }, 3000);
+    } catch (error) {
+        toast.remove();
+        const errorToast = document.createElement('div');
+        errorToast.className = 'fixed bottom-4 right-4 bg-red-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
+        errorToast.textContent = '✗ Connection test failed';
+        document.body.appendChild(errorToast);
+
+        setTimeout(() => {
+            errorToast.remove();
+        }, 3000);
+    }
+}
+
+// Load modems on page load
+loadModemsForConfig();
+</script>

templates/partials/slm_live_view.html

@@ -0,0 +1,260 @@
+<!-- Live View Panel for {{ unit.id }} -->
+<div class="h-full flex flex-col">
+    <!-- Header -->
+    <div class="flex items-center justify-between mb-6">
+        <div>
+            <h2 class="text-2xl font-bold text-gray-900 dark:text-white">{{ unit.id }}</h2>
+            <p class="text-sm text-gray-600 dark:text-gray-400">
+                {% if unit.slm_model %}{{ unit.slm_model }}{% endif %}
+                {% if unit.slm_serial_number %} • S/N: {{ unit.slm_serial_number }}{% endif %}
+            </p>
+            {% if modem %}
+            <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">
+                via Modem: {{ modem.id }}{% if modem_ip %} ({{ modem_ip }}){% endif %}
+            </p>
+            {% elif modem_ip %}
+            <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">
+                Direct: {{ modem_ip }}
+            </p>
+            {% else %}
+            <p class="text-xs text-red-500 dark:text-red-400 mt-1">
+                ⚠️ No modem assigned or IP configured
+            </p>
+            {% endif %}
+        </div>
+
+        <!-- Measurement Status Badge -->
+        <div>
+            {% if is_measuring %}
+                <span class="px-4 py-2 bg-green-100 dark:bg-green-900/30 text-green-800 dark:text-green-400 rounded-lg font-medium flex items-center">
+                    <span class="w-2 h-2 bg-green-500 rounded-full mr-2 animate-pulse"></span>
+                    Measuring
+                </span>
+            {% else %}
+                <span class="px-4 py-2 bg-gray-200 dark:bg-gray-700 text-gray-700 dark:text-gray-300 rounded-lg font-medium">
+                    Stopped
+                </span>
+            {% endif %}
+        </div>
+    </div>
+
+    <!-- Control Buttons -->
+    <div class="flex gap-2 mb-6">
+        <button onclick="controlUnit('{{ unit.id }}', 'start')"
+                class="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded-lg flex items-center">
+            <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"></path>
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+            </svg>
+            Start
+        </button>
+
+        <button onclick="controlUnit('{{ unit.id }}', 'pause')"
+                class="px-4 py-2 bg-yellow-600 hover:bg-yellow-700 text-white rounded-lg flex items-center">
+            <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 9v6m4-6v6m7-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+            </svg>
+            Pause
+        </button>
+
+        <button onclick="controlUnit('{{ unit.id }}', 'stop')"
+                class="px-4 py-2 bg-red-600 hover:bg-red-700 text-white rounded-lg flex items-center">
+            <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z"></path>
+            </svg>
+            Stop
+        </button>
+
+        <button onclick="controlUnit('{{ unit.id }}', 'reset')"
+                class="px-4 py-2 bg-gray-600 hover:bg-gray-700 text-white rounded-lg flex items-center">
+            <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path>
+            </svg>
+            Reset
+        </button>
+
+        <button onclick="initLiveDataStream('{{ unit.id }}')"
+                class="px-4 py-2 bg-seismo-orange hover:bg-orange-600 text-white rounded-lg flex items-center ml-auto">
+            <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
+            </svg>
+            Start Live Stream
+        </button>
+    </div>
+
+    <!-- Current Metrics -->
+    <div class="grid grid-cols-4 gap-4 mb-6">
+        <div class="bg-blue-50 dark:bg-blue-900/20 rounded-lg p-4">
+            <p class="text-xs text-gray-600 dark:text-gray-400 mb-1">Lp (Current)</p>
+            <p id="live-lp" class="text-2xl font-bold text-blue-600 dark:text-blue-400">
+                {% if current_status and current_status.lp %}{{ current_status.lp }}{% else %}--{% endif %}
+            </p>
+            <p class="text-xs text-gray-500 dark:text-gray-400">dB</p>
+        </div>
+
+        <div class="bg-green-50 dark:bg-green-900/20 rounded-lg p-4">
+            <p class="text-xs text-gray-600 dark:text-gray-400 mb-1">Leq (Average)</p>
+            <p id="live-leq" class="text-2xl font-bold text-green-600 dark:text-green-400">
+                {% if current_status and current_status.leq %}{{ current_status.leq }}{% else %}--{% endif %}
+            </p>
+            <p class="text-xs text-gray-500 dark:text-gray-400">dB</p>
+        </div>
+
+        <div class="bg-red-50 dark:bg-red-900/20 rounded-lg p-4">
+            <p class="text-xs text-gray-600 dark:text-gray-400 mb-1">Lmax (Peak)</p>
+            <p id="live-lmax" class="text-2xl font-bold text-red-600 dark:text-red-400">
+                {% if current_status and current_status.lmax %}{{ current_status.lmax }}{% else %}--{% endif %}
+            </p>
+            <p class="text-xs text-gray-500 dark:text-gray-400">dB</p>
+        </div>
+
+        <div class="bg-purple-50 dark:bg-purple-900/20 rounded-lg p-4">
+            <p class="text-xs text-gray-600 dark:text-gray-400 mb-1">Lmin</p>
+            <p id="live-lmin" class="text-2xl font-bold text-purple-600 dark:text-purple-400">
+                {% if current_status and current_status.lmin %}{{ current_status.lmin }}{% else %}--{% endif %}
+            </p>
+            <p class="text-xs text-gray-500 dark:text-gray-400">dB</p>
+        </div>
+    </div>
+
+    <!-- Live Chart -->
+    <div class="flex-1 bg-gray-50 dark:bg-gray-900/50 rounded-lg p-4">
+        <canvas id="liveChart"></canvas>
+    </div>
+
+    <!-- Device Info -->
+    <div class="mt-4 grid grid-cols-2 gap-4 text-sm">
+        <div>
+            <span class="text-gray-600 dark:text-gray-400">Battery:</span>
+            <span class="font-medium text-gray-900 dark:text-white ml-2">
+                {% if current_status and current_status.battery_level %}{{ current_status.battery_level }}%{% else %}--{% endif %}
+            </span>
+        </div>
+        <div>
+            <span class="text-gray-600 dark:text-gray-400">Power:</span>
+            <span class="font-medium text-gray-900 dark:text-white ml-2">
+                {% if current_status and current_status.power_source %}{{ current_status.power_source }}{% else %}--{% endif %}
+            </span>
+        </div>
+        <div>
+            <span class="text-gray-600 dark:text-gray-400">Weighting:</span>
+            <span class="font-medium text-gray-900 dark:text-white ml-2">
+                {% if unit.slm_frequency_weighting %}{{ unit.slm_frequency_weighting }}{% else %}--{% endif %} /
+                {% if unit.slm_time_weighting %}{{ unit.slm_time_weighting }}{% else %}--{% endif %}
+            </span>
+        </div>
+        <div>
+            <span class="text-gray-600 dark:text-gray-400">SD Remaining:</span>
+            <span class="font-medium text-gray-900 dark:text-white ml-2">
+                {% if current_status and current_status.sd_remaining_mb %}{{ current_status.sd_remaining_mb }} MB{% else %}--{% endif %}
+            </span>
+        </div>
+    </div>
+</div>
+
+<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+<script>
+// Initialize Chart.js for live data visualization
+const ctx = document.getElementById('liveChart').getContext('2d');
+
+// Dark mode detection
+const isDarkMode = document.documentElement.classList.contains('dark');
+const gridColor = isDarkMode ? 'rgba(255, 255, 255, 0.1)' : 'rgba(0, 0, 0, 0.1)';
+const textColor = isDarkMode ? 'rgba(255, 255, 255, 0.7)' : 'rgba(0, 0, 0, 0.7)';
+
+window.liveChart = new Chart(ctx, {
+    type: 'line',
+    data: {
+        labels: [],
+        datasets: [
+            {
+                label: 'Lp (Current Level)',
+                data: [],
+                borderColor: 'rgb(59, 130, 246)',
+                backgroundColor: 'rgba(59, 130, 246, 0.1)',
+                tension: 0.3,
+                borderWidth: 2,
+                pointRadius: 0
+            },
+            {
+                label: 'Leq (Average)',
+                data: [],
+                borderColor: 'rgb(34, 197, 94)',
+                backgroundColor: 'rgba(34, 197, 94, 0.1)',
+                tension: 0.3,
+                borderWidth: 2,
+                pointRadius: 0
+            }
+        ]
+    },
+    options: {
+        responsive: true,
+        maintainAspectRatio: false,
+        animation: false,
+        interaction: {
+            intersect: false,
+            mode: 'index'
+        },
+        scales: {
+            x: {
+                display: true,
+                grid: {
+                    color: gridColor
+                },
+                ticks: {
+                    color: textColor,
+                    maxTicksLimit: 10
+                }
+            },
+            y: {
+                display: true,
+                title: {
+                    display: true,
+                    text: 'Sound Level (dB)',
+                    color: textColor
+                },
+                grid: {
+                    color: gridColor
+                },
+                ticks: {
+                    color: textColor
+                },
+                min: 30,
+                max: 130
+            }
+        },
+        plugins: {
+            legend: {
+                labels: {
+                    color: textColor
+                }
+            }
+        }
+    }
+});
+
+// Control function
+async function controlUnit(unitId, action) {
+    try {
+        const response = await fetch(`/api/slm-dashboard/control/${unitId}/${action}`, {
+            method: 'POST'
+        });
+        const result = await response.json();
+
+        if (result.status === 'ok') {
+            // Reload the live view to update status
+            setTimeout(() => {
+                htmx.ajax('GET', `/api/slm-dashboard/live-view/${unitId}`, {
+                    target: '#live-view-panel',
+                    swap: 'innerHTML'
+                });
+            }, 500);
+        } else {
+            alert(`Error: ${result.detail || 'Unknown error'}`);
+        }
+    } catch (error) {
+        alert(`Failed to control unit: ${error.message}`);
+    }
+}
+</script>

templates/partials/slm_live_view_error.html

@@ -0,0 +1,8 @@
+<!-- Error State for Live View -->
+<div class="flex flex-col items-center justify-center h-[600px] text-red-500 dark:text-red-400">
+    <svg class="w-24 h-24 mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+    </svg>
+    <p class="text-lg font-medium">Error Loading Unit</p>
+    <p class="text-sm mt-2 text-gray-600 dark:text-gray-400">{{ error }}</p>
+</div>

templates/partials/slm_stats.html

@@ -0,0 +1,61 @@
+<!-- Summary stat cards -->
+<!-- Total Units Card -->
+<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
+    <div class="flex items-center justify-between">
+        <div>
+            <p class="text-sm text-gray-600 dark:text-gray-400 font-medium">Total Units</p>
+            <p class="text-3xl font-bold text-gray-900 dark:text-white mt-1">{{ total_count }}</p>
+        </div>
+        <div class="bg-blue-100 dark:bg-blue-900/30 p-3 rounded-lg">
+            <svg class="w-8 h-8 text-blue-600 dark:text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
+            </svg>
+        </div>
+    </div>
+</div>
+
+<!-- Deployed Units Card -->
+<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
+    <div class="flex items-center justify-between">
+        <div>
+            <p class="text-sm text-gray-600 dark:text-gray-400 font-medium">Deployed</p>
+            <p class="text-3xl font-bold text-green-600 dark:text-green-400 mt-1">{{ deployed_count }}</p>
+        </div>
+        <div class="bg-green-100 dark:bg-green-900/30 p-3 rounded-lg">
+            <svg class="w-8 h-8 text-green-600 dark:text-green-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+            </svg>
+        </div>
+    </div>
+</div>
+
+<!-- Active Now Card -->
+<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
+    <div class="flex items-center justify-between">
+        <div>
+            <p class="text-sm text-gray-600 dark:text-gray-400 font-medium">Active Now</p>
+            <p class="text-3xl font-bold text-seismo-orange mt-1">{{ active_count }}</p>
+        </div>
+        <div class="bg-orange-100 dark:bg-orange-900/30 p-3 rounded-lg">
+            <svg class="w-8 h-8 text-seismo-orange" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
+            </svg>
+        </div>
+    </div>
+    <p class="text-xs text-gray-500 dark:text-gray-400 mt-2">Checked in last hour</p>
+</div>
+
+<!-- Benched Units Card -->
+<div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
+    <div class="flex items-center justify-between">
+        <div>
+            <p class="text-sm text-gray-600 dark:text-gray-400 font-medium">Benched</p>
+            <p class="text-3xl font-bold text-gray-500 dark:text-gray-400 mt-1">{{ benched_count }}</p>
+        </div>
+        <div class="bg-gray-200 dark:bg-gray-700 p-3 rounded-lg">
+            <svg class="w-8 h-8 text-gray-600 dark:text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"></path>
+            </svg>
+        </div>
+    </div>
+</div>

templates/partials/slm_unit_list.html

@@ -0,0 +1,73 @@
+<!-- SLM Unit List -->
+{% if units %}
+    {% for unit in units %}
+    <div class="slm-unit-item bg-gray-100 dark:bg-gray-700 rounded-lg p-4 transition-colors relative group">
+        <!-- Configure button (appears on hover) -->
+        <button onclick="event.stopPropagation(); openConfigModal('{{ unit.id }}');"
+                class="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity bg-white dark:bg-gray-800 text-gray-700 dark:text-gray-300 rounded-full p-1.5 hover:bg-gray-200 dark:hover:bg-gray-600 z-10"
+                title="Configure {{ unit.id }}">
+            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"></path>
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
+            </svg>
+        </button>
+
+        <div class="cursor-pointer" onclick="selectUnit('{{ unit.id }}')">
+            <div class="flex items-center justify-between mb-2">
+                <span class="font-semibold">{{ unit.id }}</span>
+                <!-- Status indicator: green=active, yellow=recent, red=old, gray=never -->
+                {% if unit.slm_last_check %}
+                    <span class="w-2 h-2 bg-green-500 rounded-full" title="Active"></span>
+                {% else %}
+                    <span class="w-2 h-2 bg-gray-400 rounded-full" title="No check-in"></span>
+                {% endif %}
+            </div>
+
+            <div class="text-sm space-y-1">
+                {% if unit.slm_model %}
+                <div class="flex items-center">
+                    <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z"></path>
+                    </svg>
+                    {{ unit.slm_model }}
+                </div>
+                {% endif %}
+
+                {% if unit.address %}
+                <div class="flex items-center">
+                    <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"></path>
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"></path>
+                    </svg>
+                    <span class="truncate">{{ unit.address }}</span>
+                </div>
+                {% endif %}
+
+                {% if unit.deployed_with_modem_id %}
+                <div class="flex items-center font-mono text-xs">
+                    <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.111 16.404a5.5 5.5 0 017.778 0M12 20h.01m-7.08-7.071c3.904-3.905 10.236-3.905 14.141 0M1.394 9.393c5.857-5.857 15.355-5.857 21.213 0"></path>
+                    </svg>
+                    {{ unit.deployed_with_modem_id }}
+                </div>
+                {% elif unit.slm_host %}
+                <div class="flex items-center font-mono text-xs">
+                    <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9"></path>
+                    </svg>
+                    {{ unit.slm_host }}{% if unit.slm_tcp_port %}:{{ unit.slm_tcp_port }}{% endif %}
+                </div>
+                {% endif %}
+            </div>
+        </div>
+    </div>
+    {% endfor %}
+{% else %}
+    <div class="text-center py-8 text-gray-500 dark:text-gray-400">
+        <svg class="w-12 h-12 mx-auto mb-3 opacity-50" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"></path>
+        </svg>
+        <p>No sound level meters found</p>
+        <p class="text-sm mt-1">Add units from the Fleet Roster</p>
+    </div>
+{% endif %}

templates/roster.html

@@ -205,6 +205,11 @@
                     <input type="number" name="slm_tcp_port" placeholder="2255"
                         class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
                 </div>
+                <div>
+                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">FTP Port</label>
+                    <input type="number" name="slm_ftp_port" placeholder="21"
+                        class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
+                </div>
                 <div>
                     <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Serial Number</label>
                     <input type="text" name="slm_serial_number" placeholder="SN123456"
@@ -438,18 +443,39 @@
             seismoFields.classList.remove('hidden');
             modemFields.classList.add('hidden');
             slmFields.classList.add('hidden');
+            // Enable seismograph fields, disable others
+            setFieldsDisabled(seismoFields, false);
+            setFieldsDisabled(modemFields, true);
+            setFieldsDisabled(slmFields, true);
             toggleModemPairing(); // Check if modem pairing should be shown
         } else if (deviceType === 'modem') {
             seismoFields.classList.add('hidden');
             modemFields.classList.remove('hidden');
             slmFields.classList.add('hidden');
+            // Enable modem fields, disable others
+            setFieldsDisabled(seismoFields, true);
+            setFieldsDisabled(modemFields, false);
+            setFieldsDisabled(slmFields, true);
         } else if (deviceType === 'sound_level_meter') {
             seismoFields.classList.add('hidden');
             modemFields.classList.add('hidden');
             slmFields.classList.remove('hidden');
+            // Enable SLM fields, disable others
+            setFieldsDisabled(seismoFields, true);
+            setFieldsDisabled(modemFields, true);
+            setFieldsDisabled(slmFields, false);
         }
     }
 
+    // Helper function to disable/enable all inputs in a container
+    function setFieldsDisabled(container, disabled) {
+        if (!container) return;
+        const inputs = container.querySelectorAll('input, select, textarea');
+        inputs.forEach(input => {
+            input.disabled = disabled;
+        });
+    }
+
     // Toggle modem pairing field visibility (only for deployed seismographs)
     function toggleModemPairing() {
         const deviceType = document.getElementById('deviceTypeSelect').value;
@@ -547,10 +573,16 @@
         if (deviceType === 'seismograph') {
             seismoFields.classList.remove('hidden');
             modemFields.classList.add('hidden');
+            // Enable seismograph fields, disable modem fields
+            setFieldsDisabled(seismoFields, false);
+            setFieldsDisabled(modemFields, true);
             toggleEditModemPairing();
         } else {
             seismoFields.classList.add('hidden');
             modemFields.classList.remove('hidden');
+            // Enable modem fields, disable seismograph fields
+            setFieldsDisabled(seismoFields, true);
+            setFieldsDisabled(modemFields, false);
         }
     }
 

templates/seismographs.html

@@ -0,0 +1,76 @@
+{% extends "base.html" %}
+
+{% block title %}Seismographs - Seismo Fleet Manager{% endblock %}
+
+{% block content %}
+<div class="mb-8">
+    <h1 class="text-3xl font-bold text-gray-900 dark:text-white">Seismographs</h1>
+    <p class="text-gray-600 dark:text-gray-400 mt-1">Manage and monitor seismograph units</p>
+</div>
+
+<!-- Auto-refresh stats every 30 seconds -->
+<div hx-get="/api/seismo-dashboard/stats"
+     hx-trigger="load, every 30s"
+     hx-swap="innerHTML"
+     class="mb-8">
+    <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
+        <div class="rounded-lg shadow bg-white dark:bg-slate-800 p-6">
+            <div class="flex items-center justify-between">
+                <div>
+                    <p class="text-gray-600 dark:text-gray-400 text-sm">Loading...</p>
+                    <p class="text-3xl font-bold text-gray-900 dark:text-white mt-2">--</p>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Seismograph List -->
+<div class="rounded-xl shadow-lg bg-white dark:bg-slate-800 p-6">
+    <div class="mb-4 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
+        <h2 class="text-xl font-semibold text-gray-900 dark:text-white">All Seismographs</h2>
+
+        <!-- Search Box -->
+        <div class="relative">
+            <input
+                type="text"
+                id="seismo-search"
+                placeholder="Search seismographs..."
+                class="w-full sm:w-64 px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+                hx-get="/api/seismo-dashboard/units"
+                hx-trigger="keyup changed delay:300ms"
+                hx-target="#seismo-units-list"
+                hx-include="[name='search']"
+                name="search"
+            />
+            <svg class="absolute right-3 top-2.5 w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
+            </svg>
+        </div>
+    </div>
+
+    <!-- Units List (loaded via HTMX) -->
+    <div id="seismo-units-list"
+         hx-get="/api/seismo-dashboard/units"
+         hx-trigger="load"
+         hx-swap="innerHTML">
+        <p class="text-gray-500 dark:text-gray-400">Loading seismographs...</p>
+    </div>
+</div>
+
+<script>
+// Clear search input on escape key
+document.addEventListener('DOMContentLoaded', function() {
+    const searchInput = document.getElementById('seismo-search');
+    if (searchInput) {
+        searchInput.addEventListener('keydown', function(e) {
+            if (e.key === 'Escape') {
+                this.value = '';
+                htmx.trigger(this, 'keyup');
+            }
+        });
+    }
+});
+</script>
+
+{% endblock %}

templates/sound_level_meters.html

@@ -0,0 +1,228 @@
+{% extends "base.html" %}
+
+{% block title %}Sound Level Meters - Seismo Fleet Manager{% endblock %}
+
+{% block content %}
+<div class="mb-8">
+    <h1 class="text-3xl font-bold text-gray-900 dark:text-white">Sound Level Meters</h1>
+    <p class="text-gray-600 dark:text-gray-400 mt-1">Monitor and manage sound level measurement devices</p>
+</div>
+
+<!-- Summary Stats -->
+<div class="grid grid-cols-1 md:grid-cols-4 gap-6 mb-8"
+     hx-get="/api/slm-dashboard/stats"
+     hx-trigger="load, every 10s"
+     hx-swap="innerHTML">
+    <!-- Stats will be loaded here -->
+    <div class="animate-pulse bg-gray-200 dark:bg-gray-700 h-24 rounded-xl"></div>
+    <div class="animate-pulse bg-gray-200 dark:bg-gray-700 h-24 rounded-xl"></div>
+    <div class="animate-pulse bg-gray-200 dark:bg-gray-700 h-24 rounded-xl"></div>
+    <div class="animate-pulse bg-gray-200 dark:bg-gray-700 h-24 rounded-xl"></div>
+</div>
+
+<!-- Main Content Grid -->
+<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
+    <!-- SLM List -->
+    <div class="lg:col-span-1">
+        <div class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
+            <h2 class="text-xl font-semibold text-gray-900 dark:text-white mb-4">Active Units</h2>
+
+            <!-- Search/Filter -->
+            <div class="mb-4">
+                <input type="text"
+                       placeholder="Search units..."
+                       class="w-full px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white"
+                       hx-get="/api/slm-dashboard/units"
+                       hx-trigger="keyup changed delay:300ms"
+                       hx-target="#slm-list"
+                       hx-include="this"
+                       name="search">
+            </div>
+
+            <!-- SLM List -->
+            <div id="slm-list"
+                 class="space-y-2 max-h-[600px] overflow-y-auto"
+                 hx-get="/api/slm-dashboard/units"
+                 hx-trigger="load, every 10s"
+                 hx-swap="innerHTML">
+                <!-- Loading skeleton -->
+                <div class="animate-pulse space-y-2">
+                    <div class="bg-gray-200 dark:bg-gray-700 h-20 rounded-lg"></div>
+                    <div class="bg-gray-200 dark:bg-gray-700 h-20 rounded-lg"></div>
+                    <div class="bg-gray-200 dark:bg-gray-700 h-20 rounded-lg"></div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- Live View Panel -->
+    <div class="lg:col-span-2">
+        <div id="live-view-panel" class="bg-white dark:bg-slate-800 rounded-xl shadow-lg p-6">
+            <!-- Initial state - no unit selected -->
+            <div class="flex flex-col items-center justify-center h-[600px] text-gray-400 dark:text-gray-500">
+                <svg class="w-24 h-24 mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z"></path>
+                </svg>
+                <p class="text-lg font-medium">No unit selected</p>
+                <p class="text-sm mt-2">Select a sound level meter from the list to view live data</p>
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- Configuration Modal -->
+<div id="config-modal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
+    <div class="bg-white dark:bg-slate-800 rounded-xl p-6 max-w-2xl w-full mx-4 max-h-[90vh] overflow-y-auto">
+        <div class="flex items-center justify-between mb-6">
+            <h3 class="text-2xl font-bold text-gray-900 dark:text-white">Configure SLM</h3>
+            <button onclick="closeConfigModal()" class="text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200">
+                <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
+                </svg>
+            </button>
+        </div>
+
+        <div id="config-modal-content">
+            <!-- Content loaded via HTMX -->
+            <div class="animate-pulse space-y-4">
+                <div class="h-4 bg-gray-200 dark:bg-gray-700 rounded w-3/4"></div>
+                <div class="h-4 bg-gray-200 dark:bg-gray-700 rounded"></div>
+                <div class="h-4 bg-gray-200 dark:bg-gray-700 rounded w-5/6"></div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script>
+// Function to select a unit and load live view
+function selectUnit(unitId) {
+    // Remove active state from all items
+    document.querySelectorAll('.slm-unit-item').forEach(item => {
+        item.classList.remove('bg-seismo-orange', 'text-white');
+        item.classList.add('bg-gray-100', 'dark:bg-gray-700');
+    });
+
+    // Add active state to clicked item
+    event.currentTarget.classList.remove('bg-gray-100', 'dark:bg-gray-700');
+    event.currentTarget.classList.add('bg-seismo-orange', 'text-white');
+
+    // Load live view for this unit
+    htmx.ajax('GET', `/api/slm-dashboard/live-view/${unitId}`, {
+        target: '#live-view-panel',
+        swap: 'innerHTML'
+    });
+}
+
+// Configuration modal functions
+function openConfigModal(unitId) {
+    const modal = document.getElementById('config-modal');
+    modal.classList.remove('hidden');
+    
+    // Load configuration form via HTMX
+    htmx.ajax('GET', `/api/slm-dashboard/config/${unitId}`, {
+        target: '#config-modal-content',
+        swap: 'innerHTML'
+    });
+}
+
+function closeConfigModal() {
+    document.getElementById('config-modal').classList.add('hidden');
+}
+
+// Close modal on escape key
+document.addEventListener('keydown', function(e) {
+    if (e.key === 'Escape') {
+        closeConfigModal();
+    }
+});
+
+// Close modal when clicking outside
+document.getElementById('config-modal')?.addEventListener('click', function(e) {
+    if (e.target === this) {
+        closeConfigModal();
+    }
+});
+
+// Initialize WebSocket for selected unit
+let currentWebSocket = null;
+
+function initLiveDataStream(unitId) {
+    // Close existing connection if any
+    if (currentWebSocket) {
+        currentWebSocket.close();
+    }
+
+    // WebSocket URL for SLMM backend via proxy
+    const wsProtocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
+    const wsUrl = `${wsProtocol}//${window.location.host}/api/slmm/${unitId}/live`;
+
+    currentWebSocket = new WebSocket(wsUrl);
+
+    currentWebSocket.onmessage = function(event) {
+        const data = JSON.parse(event.data);
+        updateLiveChart(data);
+        updateLiveMetrics(data);
+    };
+
+    currentWebSocket.onerror = function(error) {
+        console.error('WebSocket error:', error);
+    };
+
+    currentWebSocket.onclose = function() {
+        console.log('WebSocket closed');
+    };
+}
+
+// Update live chart with new data point
+let chartData = {
+    timestamps: [],
+    lp: [],
+    leq: []
+};
+
+function updateLiveChart(data) {
+    const now = new Date();
+    chartData.timestamps.push(now.toLocaleTimeString());
+    chartData.lp.push(parseFloat(data.lp || 0));
+    chartData.leq.push(parseFloat(data.leq || 0));
+
+    // Keep only last 60 data points (1 minute at 1 sample/sec)
+    if (chartData.timestamps.length > 60) {
+        chartData.timestamps.shift();
+        chartData.lp.shift();
+        chartData.leq.shift();
+    }
+
+    // Update chart (using Chart.js if available)
+    if (window.liveChart) {
+        window.liveChart.data.labels = chartData.timestamps;
+        window.liveChart.data.datasets[0].data = chartData.lp;
+        window.liveChart.data.datasets[1].data = chartData.leq;
+        window.liveChart.update('none'); // Update without animation for smooth real-time
+    }
+}
+
+function updateLiveMetrics(data) {
+    // Update metric displays
+    if (document.getElementById('live-lp')) {
+        document.getElementById('live-lp').textContent = data.lp || '--';
+    }
+    if (document.getElementById('live-leq')) {
+        document.getElementById('live-leq').textContent = data.leq || '--';
+    }
+    if (document.getElementById('live-lmax')) {
+        document.getElementById('live-lmax').textContent = data.lmax || '--';
+    }
+    if (document.getElementById('live-lmin')) {
+        document.getElementById('live-lmin').textContent = data.lmin || '--';
+    }
+}
+
+// Cleanup on page unload
+window.addEventListener('beforeunload', function() {
+    if (currentWebSocket) {
+        currentWebSocket.close();
+    }
+});
+</script>
+{% endblock %}

templates/unit_detail.html

@@ -240,6 +240,7 @@
                         class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
                         <option value="seismograph">Seismograph</option>
                         <option value="modem">Modem</option>
+                        <option value="sound_level_meter">Sound Level Meter</option>
                     </select>
                 </div>
 
@@ -316,6 +317,63 @@
                 </div>
             </div>
 
+            <!-- Sound Level Meter Fields -->
+            <div id="slmFields" class="hidden space-y-4 border-t border-gray-200 dark:border-gray-700 pt-4">
+                <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Sound Level Meter Information</h3>
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+                    <div>
+                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Model</label>
+                        <input type="text" name="slm_model" id="slmModel" placeholder="NL-43, NL-53, etc."
+                            class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
+                    </div>
+                    <div>
+                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Serial Number</label>
+                        <input type="text" name="slm_serial_number" id="slmSerialNumber" placeholder="123456"
+                            class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
+                    </div>
+                    <div>
+                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Frequency Weighting</label>
+                        <select name="slm_frequency_weighting" id="slmFrequencyWeighting"
+                            class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
+                            <option value="">Not set</option>
+                            <option value="A">A-weighting</option>
+                            <option value="C">C-weighting</option>
+                            <option value="Z">Z-weighting (Flat)</option>
+                        </select>
+                    </div>
+                    <div>
+                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Time Weighting</label>
+                        <select name="slm_time_weighting" id="slmTimeWeighting"
+                            class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
+                            <option value="">Not set</option>
+                            <option value="F">Fast (125ms)</option>
+                            <option value="S">Slow (1s)</option>
+                            <option value="I">Impulse (35ms)</option>
+                        </select>
+                    </div>
+                    <div>
+                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Measurement Range</label>
+                        <input type="text" name="slm_measurement_range" id="slmMeasurementRange" placeholder="30-130 dB"
+                            class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
+                    </div>
+                    <div>
+                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">TCP Port (on modem)</label>
+                        <input type="number" name="slm_tcp_port" id="slmTcpPort" placeholder="2255"
+                            class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
+                        <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">Default: 2255</p>
+                    </div>
+                    <div class="md:col-span-2">
+                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Deployed With Modem</label>
+                        <select name="deployed_with_modem_id" id="slmDeployedWithModemId"
+                            class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
+                            <option value="">No modem assigned</option>
+                            <!-- Options will be populated by JavaScript -->
+                        </select>
+                        <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">Select the modem that provides network connectivity for this SLM</p>
+                    </div>
+                </div>
+            </div>
+
             <!-- Checkboxes -->
             <div class="flex items-center gap-6 border-t border-gray-200 dark:border-gray-700 pt-4">
                 <label class="flex items-center gap-2 cursor-pointer">
@@ -373,6 +431,9 @@ async function loadUnitData() {
             currentSnapshot = await snapshotResponse.json();
         }
 
+        // Load modems list for dropdown
+        await loadModemsList();
+
         // Populate views
         populateViewMode();
         populateEditForm();
@@ -391,6 +452,38 @@ async function loadUnitData() {
     }
 }
 
+// Load list of modems for dropdown
+async function loadModemsList() {
+    try {
+        const response = await fetch('/api/roster/modems');
+        if (response.ok) {
+            const modems = await response.json();
+
+            // Populate both seismograph and SLM modem dropdowns
+            const seismoDropdown = document.getElementById('deployedWithModemId');
+            const slmDropdown = document.getElementById('slmDeployedWithModemId');
+
+            // Clear existing options (except the first "No modem" option)
+            [seismoDropdown, slmDropdown].forEach(dropdown => {
+                if (!dropdown) return;
+                while (dropdown.options.length > 1) {
+                    dropdown.remove(1);
+                }
+
+                // Add modem options
+                modems.forEach(modem => {
+                    const option = document.createElement('option');
+                    option.value = modem.id;
+                    option.textContent = `${modem.id}${modem.ip_address ? ' (' + modem.ip_address + ')' : ''}${modem.hardware_model ? ' - ' + modem.hardware_model : ''}`;
+                    dropdown.appendChild(option);
+                });
+            });
+        }
+    } catch (error) {
+        console.error('Failed to load modems list:', error);
+    }
+}
+
 // Populate view mode (read-only display)
 function populateViewMode() {
     // Update page title and store unit ID for copy function
@@ -491,6 +584,15 @@ function populateEditForm() {
     document.getElementById('phoneNumber').value = currentUnit.phone_number || '';
     document.getElementById('hardwareModel').value = currentUnit.hardware_model || '';
 
+    // Sound Level Meter fields
+    document.getElementById('slmTcpPort').value = currentUnit.slm_tcp_port || '';
+    document.getElementById('slmModel').value = currentUnit.slm_model || '';
+    document.getElementById('slmSerialNumber').value = currentUnit.slm_serial_number || '';
+    document.getElementById('slmFrequencyWeighting').value = currentUnit.slm_frequency_weighting || '';
+    document.getElementById('slmTimeWeighting').value = currentUnit.slm_time_weighting || '';
+    document.getElementById('slmMeasurementRange').value = currentUnit.slm_measurement_range || '';
+    document.getElementById('slmDeployedWithModemId').value = currentUnit.deployed_with_modem_id || '';
+
     // Show/hide fields based on device type
     toggleDetailFields();
 }
@@ -500,13 +602,20 @@ function toggleDetailFields() {
     const deviceType = document.getElementById('deviceType').value;
     const seismoFields = document.getElementById('seismographFields');
     const modemFields = document.getElementById('modemFields');
+    const slmFields = document.getElementById('slmFields');
 
+    // Hide all device-specific fields first
+    seismoFields.classList.add('hidden');
+    modemFields.classList.add('hidden');
+    slmFields.classList.add('hidden');
+
+    // Show the relevant fields
     if (deviceType === 'seismograph') {
         seismoFields.classList.remove('hidden');
-        modemFields.classList.add('hidden');
+    } else if (deviceType === 'modem') {
-    } else {
-        seismoFields.classList.add('hidden');
         modemFields.classList.remove('hidden');
+    } else if (deviceType === 'sound_level_meter') {
+        slmFields.classList.remove('hidden');
     }
 }