# 🏛️ IPS Genius — Panduan Setup Firebase

Panduan ini membantu Anda menyiapkan Firebase agar game IPS Genius bisa berjalan secara realtime di kelas.
**Estimasi waktu: 10-15 menit**

---

## Langkah 1: Buat Akun & Project Firebase

1. Buka **[console.firebase.google.com](https://console.firebase.google.com)**
2. Login dengan akun Google Anda
3. Klik **"Add project"** / **"Tambahkan project"**
4. Masukkan nama project, contoh: `ips-genius-kelas8a`
5. Nonaktifkan Google Analytics (tidak perlu) → klik **"Create project"**
6. Tunggu hingga project dibuat → klik **"Continue"**

---

## Langkah 2: Aktifkan Realtime Database

1. Di sidebar kiri, klik **"Build"** → **"Realtime Database"**
2. Klik **"Create Database"**
3. Pilih lokasi: **Singapore (asia-southeast1)** (terdekat dari Indonesia)
4. Pilih mode: **"Start in test mode"** ← PENTING, agar bisa diakses tanpa login
5. Klik **"Enable"**
6. Anda akan melihat URL database seperti:
   `https://ips-genius-kelas8a-default-rtdb.asia-southeast1.firebasedatabase.app`
   **Catat URL ini!**

---

## Langkah 3: Aktifkan Anonymous Authentication

1. Di sidebar kiri, klik **"Build"** → **"Authentication"**
2. Klik **"Get started"**
3. Di tab **"Sign-in method"**, klik **"Anonymous"**
4. Toggle ke **"Enable"** → klik **"Save"**

---

## Langkah 4: Dapatkan Konfigurasi Firebase

1. Di sidebar kiri, klik ikon ⚙️ (gear) → **"Project settings"**
2. Scroll ke bawah ke bagian **"Your apps"**
3. Klik ikon **`</>`** (Web) untuk mendaftarkan web app
4. Masukkan nama app: `IPS Genius`
5. **Jangan** centang Firebase Hosting (belum perlu sekarang)
6. Klik **"Register app"**
7. Anda akan melihat kode seperti ini:

```javascript
const firebaseConfig = {
  apiKey: "AIzaSy...",
  authDomain: "ips-genius-xxx.firebaseapp.com",
  databaseURL: "https://ips-genius-xxx-default-rtdb.asia-southeast1.firebasedatabase.app",
  projectId: "ips-genius-xxx",
  storageBucket: "ips-genius-xxx.firebasestorage.app",
  messagingSenderId: "123456789",
  appId: "1:123456789:web:abcdef"
};
```

**Salin semua nilai ini!**

---

## Langkah 5: Masukkan Konfigurasi ke Game

1. Buka file: `shared/firebase-config.js`
2. Ganti semua nilai `YOUR_...` dengan nilai dari Firebase Anda:

```javascript
const firebaseConfig = {
  apiKey: "AIzaSy...",           // ← ganti
  authDomain: "ips-genius-xxx.firebaseapp.com",  // ← ganti
  databaseURL: "https://ips-genius-xxx-default-rtdb.asia-southeast1.firebasedatabase.app",  // ← ganti
  projectId: "ips-genius-xxx",   // ← ganti
  storageBucket: "ips-genius-xxx.firebasestorage.app",  // ← ganti
  messagingSenderId: "123456789", // ← ganti
  appId: "1:123456789:web:abcdef" // ← ganti
};
```

3. Simpan file

---

## Langkah 6: Jalankan Game Secara Lokal

Karena game ini menggunakan Firebase (HTTPS), Anda perlu menjalankannya via web server lokal, bukan membuka file langsung.

### Opsi A: Menggunakan VS Code + Live Server (Direkomendasikan)
1. Install VS Code: [code.visualstudio.com](https://code.visualstudio.com)
2. Install extension **"Live Server"** (oleh Ritwick Dey)
3. Buka folder `ips-genius` di VS Code
4. Klik kanan `index.html` → **"Open with Live Server"**
5. Browser akan membuka `http://127.0.0.1:5500/`

### Opsi B: Menggunakan Python (jika Python sudah terinstall)
```bash
cd path/to/ips-genius
python -m http.server 8080
```
Buka browser: `http://localhost:8080`

### Opsi C: Deploy ke Firebase Hosting (Agar bisa diakses via HP siswa)
```bash
npm install -g firebase-tools
firebase login
firebase init hosting
firebase deploy
```
Anda akan mendapat URL seperti: `https://ips-genius-xxx.web.app`

---

## Langkah 7: Bagikan ke Siswa

Jika menggunakan Live Server (hanya untuk laptop di jaringan WiFi yang sama):
- Ganti `127.0.0.1` dengan IP laptop Anda (cek via `ipconfig` di Command Prompt)
- Contoh: `http://192.168.1.5:5500/player/`
- Bagikan link ini via WhatsApp kelas

Jika menggunakan Firebase Hosting (direkomendasikan untuk akses dari HP):
- Bagikan URL: `https://ips-genius-xxx.web.app/player/`
- Siswa bisa membuka dari HP masing-masing menggunakan browser Chrome

---

## ⚠️ Penting: Aturan Keamanan Database

Untuk keperluan kelas, database sudah dalam "test mode" yang mengizinkan semua baca/tulis.
Ini aman untuk digunakan di kelas karena:
- Hanya yang tahu kode room yang bisa bergabung
- Data akan habis masa berlakunya setelah 30 hari (Firebase menghapus otomatis)

Jika ingin lebih aman, tambahkan aturan ini di Realtime Database → Rules:
```json
{
  "rules": {
    "rooms": {
      "$roomId": {
        ".read": true,
        ".write": true
      }
    }
  }
}
```

---

## 🚀 Cara Bermain (Urutan Penggunaan)

| Langkah | Siapa | Apa yang dilakukan |
|---|---|---|
| 1 | **Guru** | Buka `index.html` di laptop → pilih **"Masuk sebagai Guru"** |
| 2 | **Guru** | Isi nama kelas, modal awal, durasi → klik **"Buat Room"** |
| 3 | **Guru** | Catat/tampilkan **kode room 6 huruf** ke siswa |
| 4 | **Siswa** | Buka link di HP → pilih **"Masuk sebagai Siswa"** |
| 5 | **Siswa** | Masukkan kode room, pilih nama, avatar, dan profesi → klik **"Siap!"** |
| 6 | **Guru** | Tunggu semua siswa bergabung → klik **"Mulai Permainan"** |
| 7 | **Semua** | Game berjalan 45-60 menit! |
| 8 | **Guru** | Bisa trigger event dari panel **"Event Manager"** kapan saja |
| 9 | **Guru** | Akhiri game → lihat hasil di **"Hasil Akhir"** |

---

## 💡 Tips Penggunaan di Kelas

- **Koneksi WiFi**: Pastikan semua HP siswa terhubung ke WiFi yang sama dengan laptop guru, atau gunakan Firebase Hosting agar bisa via data seluler
- **Layar Guru**: Tampilkan dashboard guru di proyektor agar siswa bisa melihat event yang terjadi
- **Brieffing**: Jelaskan profesi masing-masing sebelum siswa memilih
- **Durasi**: 45 menit untuk kelas reguler, 60 menit untuk kelas tambahan
- **Diskusi Akhir**: Gunakan layar hasil akhir untuk diskusi: kenapa si A bisa kaya? Strategi apa yang berhasil?

---

## Bantuan & Troubleshooting

| Masalah | Solusi |
|---|---|
| Siswa tidak bisa join | Pastikan kode room benar (case-sensitive? tidak \u2014 sudah auto-uppercase) |
| Data tidak muncul realtime | Cek koneksi internet, refresh halaman |
| Firebase error di console | Pastikan konfigurasi di firebase-config.js sudah benar |
| Game lambat | Normal jika >30 siswa \u2014 Firebase free tier mampu sampai 100 koneksi |
| Lupa kode room | Cek kembali dashboard guru, kode selalu ditampilkan di sidebar |