feat: oninput handler copies building # to trailer number

- Manual asset form: manBuildingNumber → manAddress (address/trailer field) - Location form: locFormBldgNum → locFormTrailer
2026-05-20 17:55:00 -04:00
parent 8b92d37d01
commit 02b3ba665e
5 changed files with 296 additions and 11 deletions
@@ -0,0 +1,92 @@
+# Canteen Asset Tracker — Feature Batch Implementation Plan
+
+**Date:** 2026-05-20
+**Goal:** Six UX improvements for field technicians
+
+---
+
+## Feature 1: Scan existing asset → auto check-in
+**Current:** Scanning a known asset shows it with a manual "Check In" button
+**Target:** Scanning a known asset immediately checks in with GPS, no extra tap
+
+**Files:**
+- `static/index.html` — `handleBarcode()` function (line ~2638)
+
+**Change:** After `showScannedAsset(asset)`, call `autoCheckin(asset.id)` + `submitCheckin()`-equivalent logic. Skip showing the manual checkin card.
+
+---
+
+## Feature 2: Auto-generate address from GPS reverse geocode
+**Current:** Address fields are always empty; user must type them manually
+**Target:** When creating an asset (all 3 modes), reverse-geocode GPS to populate address fields
+
+**Files:**
+- `static/index.html` — `createScannedAsset()`, `createOcrAsset()`, `submitManualAsset()`
+- `server.py` — new endpoint `GET /api/geocode?lat=&lng=` using OpenStreetMap Nominatim
+
+**Approach:** Add a helper `reverseGeocode(lat, lng)` that calls Nominatim API, returns address parts. Call it in all three creation paths before submitting. Populate `address`, `building_name`, `building_number`, `floor` fields from the response.
+
+---
+
+## Feature 3: Larger camera viewport
+**Current:** Camera area uses `aspect-ratio: 16/12` — decent but could be taller
+**Target:** Bigger camera preview for easier barcode/OCR scanning
+
+**Files:**
+- `static/index.html` — `.camera-area` CSS (~line 437)
+
+**Change:** Increase aspect ratio to `4/3` or make it fill more vertical space. Reduce margins. Consider max-height removal.
+
+---
+
+## Feature 4: Building # → trailer number sync
+**Current:** `building_number` and `trailer_number` are separate fields
+**Target:** When building_number is entered, auto-populate trailer_number with same value
+
+**Files:**
+- `static/index.html` — manual form event listeners, auto-checkin logic
+
+**Change:** Add an `oninput` handler on the building number field that copies the value to trailer number. Also handle the OCR/barcode creation paths if they ever populate building number.
+
+---
+
+## Feature 5: Parking location from current GPS
+**Current:** `parking_location` is a free-text field
+**Target:** Add a "📍 Use Current Location" button next to parking location that fills in GPS coords
+
+**Files:**
+- `static/index.html` — manual form HTML + JS
+
+**Change:** Add a button next to `manParkingLocation` that sets its value to `${AppState.gpsLat}, ${AppState.gpsLng}` when tapped. Also add this to the scanned/OCR create flows if those forms have parking.
+
+---
+
+## Feature 6: Navigation tool
+**Current:** Map shows asset pins with a popup "Directions" link to Google Maps
+**Target:** A dedicated navigation tool in the app that shows route from current location to the selected asset
+
+**Files:**
+- `static/index.html` — new tab/panel or enhancement to map/asset detail
+
+**Approach:** Add a "🧭 Navigate" button in asset detail view and map popups. Opens a full-screen map with:
+- Current GPS position marker (blue dot)
+- Asset location marker
+- Route line between them (straight line using Leaflet polyline, since Leaflet routing needs external service)
+- Distance readout
+- "Open in Google Maps" fallback link
+
+**Simpler approach:** Enhance existing popup "Directions" link to include the user's current GPS as the origin (`&origin=lat,lng`). Also add a "Navigate" tab that shows current location → selected asset with distance.
+
+---
+
+## Execution Order
+All 6 features are independent (touch different parts of frontend) except F6 may touch map code that F3 doesn't touch. Safe to parallelize.
+
+- F1, F2, F3, F4, F5, F6 can all be done in parallel
+- F2 depends on backend endpoint first
+
+**Plan:**
+1. Write backend endpoint for F2 (reverse geocode)
+2. Implement all 6 frontend changes
+3. Test end-to-end
+4. Commit, push, update docs/wiki/issues