131 lines
6.1 KiB
Markdown
131 lines
6.1 KiB
Markdown
# Rencana Implementasi: Revisi Aplikasi JTA
|
||
|
||
Dokumen ini memuat rencana kerja untuk 5 revisi utama pada aplikasi monitoring kumbung jamur JTA, berdasarkan masukan dosen pembimbing.
|
||
|
||
---
|
||
|
||
## Ringkasan Revisi
|
||
|
||
| # | Revisi | Pendekatan Singkat |
|
||
|---|---|---|
|
||
| 1 | Interior 3D lumbung + posisi sensor | Isometrik 2.5D via `CustomPainter` (bukan engine 3D) |
|
||
| 2 | Heatmap suhu & kelembapan | Radial gradient overlay di atas peta isometrik |
|
||
| 3 | Dashboard referensi budidaya | Panel edukasi statis di halaman peta/monitoring |
|
||
| 4 | Pengukuran debit air | Field baru di `SensorModel` + kartu dashboard |
|
||
| 5 | Rentang batas suhu (min-max) | `RangeSlider` menggantikan slider tunggal |
|
||
|
||
---
|
||
|
||
## 1. Interior 3D Lumbung & Posisi Sensor
|
||
|
||
**Pendekatan:** Isometrik 2.5D dengan `CustomPainter` + transformasi matriks — menghindari library 3D berat (Unity/OpenGL) yang sebelumnya membuat APK membengkak.
|
||
|
||
**Visual:** Denah box transparan, rak baglog sebagai balok 3D, koridor, dan pin sensor melayang dengan animasi pulsing glow menunjukkan posisi di dalam rak.
|
||
|
||
**Arsitektur painter — dipisah 3 layer agar performa terjaga:**
|
||
|
||
| Layer | Isi | Repaint saat |
|
||
|---|---|---|
|
||
| Struktur statis | Grid lantai, dinding, balok rak | Kamera/zoom berubah (bungkus `RepaintBoundary`) |
|
||
| Heatmap overlay | Radial gradient per sensor | Data sensor update / toggle suhu-kelembapan |
|
||
| Pin sensor + animasi | Pin melayang, pulsing glow, tag pembacaan | Tiap frame animasi (`AnimationController`) |
|
||
|
||
Layer paling murah (pin) yang repaint terus-menerus, bukan seluruh scene rak — ini krusial supaya animasi pulsing tidak memicu redraw grid/rak 60x/detik.
|
||
|
||
**Perlu diputuskan sebelum coding UI:** posisi sensor (X, Y, Z, radius) disimpan di backend (persist antar device) atau local config saja?
|
||
|
||
---
|
||
|
||
## 2. Heatmap Suhu & Kelembapan
|
||
|
||
**Pendekatan:** Lapisan radial gradient semi-transparan di sekitar posisi sensor pada peta isometrik.
|
||
|
||
**Skala warna:**
|
||
- Suhu: Biru (dingin) → Hijau (optimal) → Merah/Oranye (panas)
|
||
- Kelembapan: Kuning/Oranye (kering) → Hijau (cukup) → Biru tua/Sian (basah)
|
||
|
||
Toggle UI untuk berpindah mode.
|
||
|
||
**Perhatian teknis:** jika area coverage antar sensor overlap, perlu logika blending (ambil nilai maksimum atau rata-rata terbobot di titik pertemuan) agar transisi warna halus — bukan sekadar menumpuk gradient satu-satu.
|
||
|
||
---
|
||
|
||
## 3. Dashboard Referensi Budidaya Jamur
|
||
|
||
**Pendekatan:** Panel edukasi di bawah peta kumbung / halaman monitoring utama.
|
||
|
||
**Isi:**
|
||
- Rentang ideal: suhu 22°C–28°C, kelembapan 80%–90%
|
||
- Waktu penyiraman terbaik: pagi 06:00–08:00, sore 16:00–18:00
|
||
|
||
**Catatan:** nilai-nilai ini sebaiknya dibuat dapat dikonfigurasi (backend/local settings), bukan hardcode di UI — supaya mudah diubah jika jenis jamur atau rekomendasi berubah nanti.
|
||
|
||
---
|
||
|
||
## 4. Pengukuran Debit Air
|
||
|
||
**Pendekatan:** Menambahkan `waterFlow` (L/menit) dan `waterVolume` (Liter) ke `SensorModel` dan `ApiIotService`, terintegrasi dengan flow meter ESP32.
|
||
|
||
**UI:** Kartu status "Debit Air" bergradien biru di dashboard utama.
|
||
|
||
**Prasyarat:** pastikan flow meter sudah terpasang dan datanya terbaca di firmware ESP32 — tanpa ini, verifikasi hanya bisa dengan data mock, belum data sensor asli.
|
||
|
||
---
|
||
|
||
## 5. Rentang Batas Suhu (Min-Max)
|
||
|
||
**Pendekatan:** Slider tunggal (`suhuLimit`) → `RangeSlider` dengan batas minimum & maksimum (contoh: 22°C–28°C). Status/otomatisasi penyiraman berubah warna (kuning/merah) jika suhu keluar rentang.
|
||
|
||
**Dependensi penting — bukan cuma perubahan UI:**
|
||
- Endpoint API/backend harus disesuaikan untuk menerima & menyimpan dua nilai (`suhuMin`, `suhuMax`), bukan satu.
|
||
- Perlu strategi migrasi untuk data lama yang masih pakai `suhuLimit` tunggal (misal fallback: `suhuMinLimit = suhuLimit - offset`).
|
||
- Validasi `RangeSlider`: batas bawah tidak boleh melebihi batas atas, termasuk saat data dari API ternyata invalid/null.
|
||
|
||
---
|
||
|
||
## Proposed Changes
|
||
|
||
### Data Model & Network Layer
|
||
|
||
| File | Perubahan |
|
||
|---|---|
|
||
| `[MODIFY]` `sensor_model.dart` | + `waterFlow` (double, L/min), `waterVolume` (double, L) |
|
||
| `[MODIFY]` `control_state.dart` | + `suhuMinLimit`, `suhuMaxLimit` (menggantikan `suhuLimit`) |
|
||
| `[MODIFY]` `control_notifier.dart` | `saveThreshold` menerima `suhuMin` & `suhuMax`; sinkronisasi parsing respon API |
|
||
|
||
### UI Components
|
||
|
||
| File | Perubahan |
|
||
|---|---|
|
||
| `[NEW]` `kumbung_map_page.dart` | Peta isometrik, toggle heatmap, panel referensi, pengaturan koordinat sensor |
|
||
| `[NEW]` `isometric_kumbung_painter.dart` | 3 `CustomPainter` terpisah: struktur statis, heatmap, pin sensor (lihat §1) |
|
||
| `[NEW]` `isometric_transform.dart` | Utility konversi koordinat world (X,Y,Z) → screen 2D — dipakai oleh ketiga painter di atas |
|
||
| `[MODIFY]` `sensor_limit_card.dart` | Slider suhu tunggal → `RangeSlider` |
|
||
| `[MODIFY]` `home_page.dart` | + Kartu "Debit Air", info waktu penyiraman otomatis |
|
||
| `[MODIFY]` `main_page.dart` | Aktifkan tab `Peta` (`KumbungMapPage`) di `BottomNavigationBar` |
|
||
|
||
---
|
||
|
||
## Urutan Eksekusi yang Disarankan
|
||
|
||
1. **Model & state** (`sensor_model.dart`, `control_state.dart`, `control_notifier.dart`) — koordinasikan dulu kontrak data dengan backend, terutama untuk poin 4 & 5.
|
||
2. **`isometric_transform.dart`** — fondasi matematika, harus benar sebelum painter apa pun dibangun di atasnya.
|
||
3. **3 layer painter** (§1) → gabung di `kumbung_map_page.dart`.
|
||
4. **UI pendukung**: `sensor_limit_card.dart`, `home_page.dart`, `main_page.dart`.
|
||
|
||
Membangun UI di atas kontrak data yang masih berubah-ubah berisiko menyebabkan rework.
|
||
|
||
---
|
||
|
||
## Verification Plan
|
||
|
||
### Automated Tests
|
||
- `flutter analyze` — memastikan tidak ada warning/error.
|
||
- Build APK lokal — memastikan kompilasi berhasil.
|
||
- **Tambahan disarankan:** unit test untuk `isometric_transform.dart` (bug transformasi koordinat sulit dilacak dari tampilan visual saja), widget test untuk validasi `RangeSlider` (batas min < max).
|
||
|
||
### Manual Verification
|
||
- **Peta 3D:** ubah koordinat sensor via pengaturan, toggle heatmap on/off, pastikan pin berpindah sesuai posisi baru.
|
||
- **Rentang suhu:** geser `RangeSlider` min & maks, simpan, verifikasi indikator status berubah dinamis di dashboard.
|
||
- **Debit air:** simulasikan nilai via data mock/sensor, verifikasi angka & indikator visual pada kartu dashboard.
|