Navigasi Workspace (Pan & Zoom Dinamis)
- Panning (Geser Kanvas): Klik dan tahan klik kiri mouse pada area kosong kanvas (atau garis grid latar belakang), lalu geser pointer mouse/trackpad Anda untuk berpindah tempat di area workspace tak terbatas secara leluasa.
- Zooming (Skala Kanvas): Gunakan scroll roda mouse Anda (mouse wheel) di atas area kanvas, pinch-to-zoom pada trackpad, atau geser slider zoom di status bar bagian bawah untuk mengatur skala canvas (30% hingga 200%). Fokus perbesaran/perkecilan akan secara cerdas mengikuti posisi koordinat kursor mouse Anda (zoom-to-pointer) dengan delta proporsional yang halus.
Seleksi Multi-Perangkat & Pemindahan Grup
Fitur seleksi ganda memungkinkan pemindahan banyak perangkat secara bersamaan:
- Shift+Klik: Tahan Shift lalu klik perangkat untuk menambah atau menghapusnya dari seleksi secara toggle (tanpa mengganggu seleksi perangkat lainnya).
- Shift+Drag (Kotak Seleksi Marquee): Tahan Shift lalu klik dan seret di area kosong kanvas untuk menampilkan kotak seleksi transparan bergaris putus-putus. Semua perangkat yang tertutup/overlap dengan kotak ini akan otomatis terseleksi.
- Pindah Grup: Seret salah satu perangkat yang terseleksi untuk memindahkan seluruh grup bersamaan, menjaga posisi relatif dan alignment antar perangkat tetap presisi.
- Hapus Grup: Tekan Delete/Backspace saat beberapa perangkat terseleksi. Dialog konfirmasi kustom akan muncul menyebutkan jumlah perangkat yang akan dihapus.
- Deseleksi: Klik pada area kosong kanvas tanpa Shift untuk membatalkan seluruh seleksi.
Menu Aksi Melayang (Selected Actions Overlay)
Untuk menjaga kerapian area kerja dan mencegah teks nama perangkat terpotong, tombol aksi (Info, Pengaturan, Hapus) disembunyikan secara default. Cukup klik sekali pada kartu perangkat untuk menyeleksinya, dan panel tombol aksi yang lebih besar (ukuran ideal tombol 24px dengan ikon SVG 14px) akan muncul meluncur ke atas dari bagian bawah tubuh perangkat (body) dengan efek animasi pegas (spring scale-up bounce) yang dinamis.
Casing Realistis & LED Status Aktif (Live Hardware Indicators)
Setiap perangkat dirancang menyerupai bentuk fisik perangkat aslinya:
- OLT: Casing metal gelap rackmount 1U lengkap dengan bracket (telinga rack) dan sekrup pemasangan di kedua sisi. Dilengkapi LED ACT yang berkedip hijau dinamis ketika ada port output yang tersambung.
- SFP Module: Casing transceiver silver metalik presisi dengan deretan contact pin emas/tembaga dan tuas pengunci (latch lever) berwarna. Dirancang konsisten menggunakan warna silver/putih metalik baik di mode gelap maupun terang.
- ONT: Router rumahan putih/gelap dengan ventilasi udara atas dan antena ganda yang otomatis bergerak sedikit saat didekati kursor. Dilengkapi 4 LED aktif: PWR (hijau stabil), PON (hijau saat sinyal bagus, kuning saat marginal), LOS (kedip merah cepat saat putus/loss), dan LAN (kedip hijau saat mengirimkan data).
- Splitter & ODP: Desain casing kaset splitter dalam ruangan dan enclosure box ODP luar ruangan lengkap dengan visual silinder kunci pengunci.
- Fiber Spool & Connector Adapter: Spul gulungan kabel dengan flange oranye, serta adapter konektor dengan pewarnaan standar industri.
Port Fisik SC Adapter & Core Glow
Port koneksi digambarkan berbentuk kotak adapter persegi menyerupai socket SC fiber asli. Inti bagian dalam port (core) akan memancarkan cahaya hijau/teal terang jika kabel berhasil terhubung (port active). Adapter menggunakan standar warna standar industri: biru tebal di sisi kiri untuk port input SC/UPC (flange datar) dan hijau tebal di sisi kanan untuk port output SC/APC (flange miring) pada perangkat konektor.
Validasi Koneksi Port & Kapasitas Perangkat
Sistem menerapkan aturan validasi kapasitas koneksi yang realistis berdasarkan tipe perangkat:
- Splitter & ODP: Jumlah koneksi keluar dibatasi sesuai rasio splitter yang dipilih (mis. 1:2 = maks. 2, 1:8 = maks. 8 koneksi keluar).
- OLT: Bebas memasang banyak SFP Module — tidak ada batasan koneksi keluar (exception unik).
- Perangkat Lainnya (SFP, Fiber Cable, Connector, ONT): Dibatasi maksimal 1 koneksi keluar per perangkat.
- Proteksi Rasio: Merubah rasio Splitter/ODP ke kapasitas lebih kecil ditolak jika jumlah koneksi aktif melebihi batas baru; dropdown otomatis di-revert.
Pelanggaran validasi ditampilkan melalui notifikasi
toast Glassmorphism yang meluncur dari pojok kanan atas layar.
Fitur Hapus Perangkat & Koneksi (Dinamis & Aman)
- Hapus Perangkat (Equipment): Klik sekali pada kartu perangkat untuk menampilkan panel tombol aksi melayang di bagian bawah tubuh perangkat, lalu klik tombol tempat sampah merah (Hapus), menekan tombol "Hapus Perangkat" di panel properties, atau tekan tombol Delete/Backspace di keyboard saat perangkat terseleksi. Dialog konfirmasi kustom Glassmorphism akan muncul terlebih dahulu.
- Hapus Koneksi (Kabel): Klik ganda (double-click) langsung pada garis koneksi untuk memutuskannya secara instan, atau klik sekali pada garis koneksi (hingga berwarna biru menyala) lalu tekan tombol Delete/Backspace di keyboard. Koneksi visual dan relasi daya logis akan langsung terputus, memicu kalkulasi ulang status redaman pada perangkat hilir tanpa perlu me-refresh halaman.
Reset Workspace Komprehensif
Gunakan tombol Reset di header menu atas untuk langsung menghapus seluruh perangkat dan jalur koneksi di kanvas. Fitur ini juga secara otomatis mengembalikan posisi koordinat geser (pan) ke koordinat awal (0, 0), mengembalikan tingkat perbesaran (zoom) ke skala normal 100%, dan menghapus data autosave dari localStorage setelah dikonfirmasi via dialog popup konfirmasi kustom.
Lembar Rincian Kalkulasi Redaman (Loss Sheet Modal)
Fitur tombol (i) Informasi di samping tombol properti Gear membuka lembar rincian kalkulasi matematika redaman. Ini merinci seluruh penyumbang redaman (seperti redaman kabel per kilometer, redaman splitter berdasarkan rasio pembagian daya, connector loss, dan splicing loss) secara komprehensif untuk mendidik dan membimbing pengguna.
Kalkulasi Redaman Real-Time & Threshold ONT
Setiap kali Anda menambah perangkat, menyambung kabel, atau merubah konfigurasi parameter, sistem langsung melakukan kalkulasi
propagation loss dari OLT ke ONT. ONT akan mengevaluasi daya terima optik (Rx Power) terhadap ambang batas sensitivitasnya:
- Status Layak (Good): Berwarna hijau, Rx Power >= -24.00 dBm. Sinyal optik sangat prima dan stabil.
- Status Peringatan (Warning): Berwarna kuning, Rx Power berada di antara -24.01 dBm hingga -27.00 dBm. Koneksi terhubung namun rentan fluktuasi.
- Status Kritis (Critical/Loss): Berwarna merah, Rx Power < -27.00 dBm. Sinyal terlalu lemah atau di bawah sensitivitas ONT sehingga layanan internet terputus.
Tema Light & Dark Mode Terintegrasi
Ubah tema simulator secara instan menggunakan tombol matahari/bulan di pojok kanan atas. CSS Custom Variables secara mulus mengubah seluruh visual sistem termasuk bayangan grid kanvas, warna kartu perangkat, dan animasi dot konektor laser agar nyaman di mata dalam berbagai kondisi pencahayaan. Casing metalik perangkat beradaptasi dinamis mengikuti mode gelap/terang, kecuali modul SFP yang dirancang konsisten tetap silver/putih metalik. Kartu perangkat di sidebar menu juga otomatis mengikuti warna background/border tema yang aktif.
Professional Landscape PDF Report
Tombol Export PDF (tombol utama berwarna teal di header) mengonversi kanvas topologi simulasi Anda menjadi cetakan laporan PDF A4 Landscape satu halaman. Laporan ini tertata secara profesional, menyajikan diagram jaringan (termasuk garis koneksi SVG) beresolusi tinggi di bagian atas, legenda warna sinyal di tengah, serta tabel terperinci perhitungan link budget (Equipment Loss & Power Budget) di bagian bawah yang siap dipresentasikan.
Status Bar Interaktif & Ikon SVG
Status bar di bagian bawah menampilkan ringkasan topologi (jumlah perangkat, koneksi, Tx Power, hasil link budget per ONT) menggunakan ikon SVG vektor tajam yang konsisten di semua platform. Status bar mendukung scroll horizontal menggunakan roda mouse (vertikal di-translate otomatis menjadi horizontal), sehingga seluruh informasi ONT dapat diakses meski terpotong oleh slider zoom di sisi kanan.
Autosave & Autoload (localStorage)
Seluruh state simulasi (posisi perangkat, koneksi, parameter konfigurasi, koordinat pan, dan tingkat zoom) otomatis tersimpan ke localStorage browser setiap kali Anda memindahkan perangkat, menambah/menghapus koneksi, mengubah properti, atau melakukan pan/zoom. Saat halaman dibuka kembali, topologi terakhir akan otomatis dimuat ulang secara penuh.