Sky Duel: Neon Horizon EX 🚀
Sky Duel adalah game dogfight multiplayer berbasis browser yang ringan, dibangun menggunakan HTML5 Canvas murni dan Firebase Firestore. Tanpa aset gambar eksternal, tanpa framework game yang berat.
🎮 Fitur
Real-time Multiplayer: Bertarung melawan teman dalam satu arena.
Vector Neon Graphics: Tampilan retro-futuristik yang tajam menggunakan Canvas API.
Audio Synthesis: Semua suara (mesin, tembakan, ledakan) dihasilkan secara procedural menggunakan Web Audio API (tidak ada file mp3/wav).
Minimap & Radar: Melacak posisi musuh di peta seluas 4000x4000 pixel.
Mobile Support: Kontrol sentuh untuk dimainkan di HP.
🛠️ Teknologi
Frontend: HTML5, CSS3, Vanilla JavaScript (ES6 Modules).
Backend: Firebase Firestore (NoSQL Database) untuk sinkronisasi posisi.
Audio: Web Audio API (Oscillators & Gain Nodes).
🚀 Cara Menjalankan (Deployment)
Karena game ini hanya menggunakan satu file index.html, Anda bisa menghostingnya di mana saja (GitHub Pages, Vercel, Netlify, atau Firebase Hosting).
Persiapan Firebase (Wajib)
Buka Firebase Console.
Buat project baru.
Masuk ke menu Build > Firestore Database dan buat database (pilih mode Test Mode untuk awal).
Masuk ke menu Project Settings dan salin konfigurasi web app (firebaseConfig).
PENTING: Buka file index.html, cari baris const firebaseConfig = JSON.parse(__firebase_config); dan GANTI dengan konfigurasi yang Anda salin. Contoh:
const firebaseConfig = { apiKey: "AIzaSy...", authDomain: "...", projectId: "...", // ... };
Instalasi Lokal
Clone repo ini:
git clone https://github.com/username-anda/sky-duel-neon.git
Buka index.html di browser modern (Chrome/Edge/Firefox).
Catatan: Karena kebijakan CORS modul ES6, Anda disarankan menggunakan local server (seperti Live Server di VS Code) dan bukan membuka file secara langsung (file://).
Game ini menggunakan teknik polling ke Firestore setiap 250ms.
Kuota (PENTING): Hosting di Netlify/Vercel/GitHub Pages TIDAK menghilangkan biaya Firebase. Netlify hanya menyimpan file HTML; komunikasi data tetap terjadi antara browser pemain dan server Google (Firebase). Jika dimainkan oleh banyak orang (10+) secara terus menerus, kuota Free Tier Firebase (50k writes/day) akan tetap terkuras.
Latensi: Latensi bergantung pada lokasi pemain dan server Google Cloud, bukan server Netlify. Karena ini bukan koneksi WebSocket (UDP/TCP), akan ada sedikit delay posisi musuh.
❓ Troubleshooting (Kenapa Game Tidak Jalan?)
Jika layar hitam atau tombol tidak berfungsi, cek hal berikut:
Layar Blank / Hitam:
Buka Console Browser (F12 atau Klik Kanan > Inspect > Console).
Jika ada error __firebase_config is not defined, artinya Anda belum mengganti kode konfigurasi Firebase di index.html (Lihat langkah "Persiapan Firebase" di atas).
Stuck di "Connecting...":
Cek tab Firestore Rules di Firebase Console. Pastikan mode diset ke "Test Mode" atau rules mengizinkan read/write publik sementara: allow read, write: if true;.
CORS Error (Access blocked):
Jangan buka file dengan klik ganda (file://). Gunakan VS Code Live Server atau upload ke hosting.
🤝 Kontribusi
Silakan fork repositori ini! Ide pengembangan selanjutnya:
Sistem Login permanen untuk menyimpan skor.
Power-up (Shield, Double Damage).
Migrasi ke Realtime Database atau WebSocket untuk performa lebih baik.
📄 Lisensi
MIT License - Bebas digunakan dan dimodifikasi