<main id="main" class="main">
   <div class="pagetitle">
      <h1>Data Game</h1>
      <nav>
         <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="index.php">Home</a></li>
            <li class="breadcrumb-item">Data Game</li>
         </ol>
      </nav>
   </div>
   <!-- End Page Title -->
   <!-- Modal Tambah Data -->
   <!-- Modal Import XLS -->
   <!-- Tambahkan tombol untuk memanggil modal -->
   <div class="modal fade" id="tambah_data" tabindex="-1" aria-labelledby="tambahDataLabel" aria-hidden="true">
      <div class="modal-dialog">
         <div class="modal-content">
            <div class="modal-header">
               <h5 class="modal-title" id="tambahDataLabel">Tambah Game Baru</h5>
               <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form action="tambah_game.php" method="post" enctype="multipart/form-data">
               <div class="modal-body">
                  <div class="mb-3">
                     <label for="provider" class="form-label">Provider</label>
                     <select class="form-control" id="provider" name="provider" required>
                        <option value="">-- Pilih Provider --</option>
                        <?php
                        include "koneksi.php"; // Sesuaikan path koneksi
                        
                        $qry_provider = mysqli_query($koneksi, "SELECT * FROM list_provider ORDER BY nama_provider ASC");
                        while ($provider = mysqli_fetch_array($qry_provider)) {
                           echo '<option value="' . htmlspecialchars($provider['id']) . '">' . htmlspecialchars($provider['nama_provider']) . '</option>';
                        }
                        ?>
                     </select>
                  </div>
                  <div class="mb-3">
                     <label for="gambar" class="form-label">Gambar</label>
                     <input type="file" class="form-control" id="gambar" name="gambar" accept="image/*" required>
                  </div>
                  <div class="mb-3">
                     <label for="keterangan" class="form-label">Keterangan</label>
                     <textarea class="form-control" id="keterangan" name="keterangan" rows="3" required></textarea>
                  </div>
               </div>
               <div class="modal-footer">
                  <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                  <button type="submit" class="btn btn-primary">Simpan</button>
               </div>
            </form>
         </div>
      </div>
   </div>
   <section class="section dashboard">
      <div class="card recent-sales overflow-auto">
         <div class="filter">
            <!-- Modal Dialog Bulk Upload -->
            <a href="#" class="icon" data-bs-toggle="modal" data-bs-target="#bulk_upload" style="margin-right:50px;">
               <i class="bi bi-upload"></i> Bulk Upload
            </a>
         </div>
         <div class="modal fade" id="bulk_upload" tabindex="-1" aria-labelledby="bulkUploadLabel" aria-hidden="true">
            <div class="modal-dialog">
               <div class="modal-content">
                  <div class="modal-header">
                     <h5 class="modal-title" id="bulkUploadLabel">Bulk Upload Game</h5>
                     <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                  </div>
                  <form action="bulk_upload.php" method="post" enctype="multipart/form-data">
                     <div class="modal-body">
                        <div class="mb-3">
                           <label for="provider" class="form-label">Provider</label>
                           <select class="form-control" id="provider" name="provider" required>
                              <option value="">-- Pilih Provider --</option>
                              <?php
                              include "koneksi.php";
                              $qry_provider = mysqli_query($koneksi, "SELECT * FROM list_provider ORDER BY nama_provider ASC");
                              while ($provider = mysqli_fetch_array($qry_provider)) {
                                 echo '<option value="' . htmlspecialchars($provider['id']) . '">' . htmlspecialchars($provider['nama_provider']) . '</option>';
                              }
                              ?>
                           </select>
                        </div>
                        <div class="mb-3">
                           <label for="gambar" class="form-label">Gambar</label>
                           <input type="file" class="form-control" id="gambar" name="gambar[]" accept="image/*" multiple
                              required>
                        </div>
                     </div>
                     <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                        <button type="submit" class="btn btn-primary">Upload</button>
                     </div>
                  </form>
               </div>
            </div>
         </div>
         <div class="filter">
            <!-- Modal Dialog Scrollable -->
            <a href="#" class="icon" data-bs-toggle="modal" data-bs-target="#tambah_data">
               <i class="bi bi-plus-lg"></i>
            </a>
         </div>
         <div class="card-body">
            <h5 class="card-title">Data Game</h5>
            <!-- Notifikasi -->
            <?php if (isset($_GET['notif'])): ?>
               <div class="alert alert-success" role="alert">
                  <?php echo htmlspecialchars($_GET['notif']); ?>
               </div>
            <?php endif; ?>
            <table class="table table-borderless datatable">
               <thead>
                  <tr>
                     <th scope="col">#</th>
                     <th scope="col">Provider</th>
                     <th scope="col">Gambar</th>
                     <th scope="col">Keterangan</th>
                     <th scope="col">Aksi</th>
                  </tr>
               </thead>
               <tbody>
                  <?php
                  $no = 1;
                  $qry_games = mysqli_query($koneksi, "SELECT * FROM list_game ORDER BY id DESC");
                  while ($game = mysqli_fetch_array($qry_games)):
                     ?>
                     <tr>
                        <th><?php echo $no++; ?></th>
                        <td><?php echo htmlspecialchars($game['provider']); ?></td>
                        <td>
                           <img src="../img/<?php echo htmlspecialchars($game['gambar']); ?>" alt="Gambar"
                              style="max-width: 100px;">
                        </td>
                        <td><?php echo htmlspecialchars($game['keterangan']); ?></td>
                        <td>
                           <!-- Modal Edit Game -->
                           <div class="modal fade" id="editGameModal" tabindex="-1" aria-labelledby="editGameLabel"
                              aria-hidden="true">
                              <div class="modal-dialog">
                                 <div class="modal-content">
                                    <div class="modal-header">
                                       <h5 class="modal-title" id="editGameLabel">Edit Game</h5>
                                       <button type="button" class="btn-close" data-bs-dismiss="modal"
                                          aria-label="Close"></button>
                                    </div>
                                    <form action="update_game.php" method="post" enctype="multipart/form-data">
                                       <div class="modal-body">
                                          <input type="hidden" id="edit_id" name="id">
                                          <!-- Pilihan Provider -->
                                          <div class="mb-3">
                                             <label for="edit_provider" class="form-label">Provider</label>
                                             <select class="form-control" id="edit_provider" name="provider" required>
                                                <option value="">-- Pilih Provider --</option>
                                                <?php
                                                include "koneksi.php";
                                                $qry_provider = mysqli_query($koneksi, "SELECT * FROM list_provider ORDER BY nama_provider ASC");
                                                while ($provider = mysqli_fetch_array($qry_provider)) {
                                                   echo '<option value="' . htmlspecialchars($provider['id']) . '">' . htmlspecialchars($provider['nama_provider']) . '</option>';
                                                }
                                                ?>
                                             </select>
                                          </div>
                                          <!-- Tampilkan Gambar Lama -->
                                          <div class="mb-3">
                                             <label class="form-label">Gambar Saat Ini</label><br>
                                             <img id="edit_gambar_preview" src="" alt="Gambar Game" width="150">
                                          </div>
                                          <!-- Upload Gambar Baru -->
                                          <div class="mb-3">
                                             <label for="edit_gambar" class="form-label">Upload Gambar Baru
                                                (Opsional)</label>
                                             <input type="file" class="form-control" id="edit_gambar" name="gambar"
                                                accept="image/*">
                                          </div>
                                          <!-- Keterangan -->
                                          <div class="mb-3">
                                             <label for="edit_keterangan" class="form-label">Keterangan</label>
                                             <textarea class="form-control" id="edit_keterangan" name="keterangan"
                                                required></textarea>
                                          </div>
                                          <button type="submit" class="btn btn-primary">Update</button>
                                          <button type="button" class="btn btn-secondary"
                                             data-bs-dismiss="modal">Batal</button>
                                       </div>
                                    </form>
                                 </div>
                              </div>
                           </div>
                           <a href="#" class="btn btn-sm btn-primary edit-btn" data-id="<?php echo $game['id']; ?>"
                              data-provider="<?php echo $game['provider']; ?>" data-gambar="<?php echo $game['gambar']; ?>"
                              data-keterangan="<?php echo htmlspecialchars($game['keterangan']); ?>" data-bs-toggle="modal"
                              data-bs-target="#editGameModal">
                              <i class="bi bi-pencil-square"></i>
                           </a>
                           <!-- Tombol Hapus -->
                           <button type="button" class="btn btn-sm btn-danger" data-bs-toggle="modal"
                              data-bs-target="#modalHapus_<?php echo $game['id']; ?>">
                              <i class="bi bi-trash"></i>
                           </button>
                           <!-- Modal Konfirmasi Hapus -->
                           <div class="modal fade" id="modalHapus_<?php echo $game['id']; ?>" tabindex="-1"
                              aria-labelledby="hapusLabel_<?php echo $game['id']; ?>" aria-hidden="true">
                              <div class="modal-dialog">
                                 <div class="modal-content">
                                    <div class="modal-header">
                                       <h5 class="modal-title" id="hapusLabel_<?php echo $game['id']; ?>">Konfirmasi Hapus
                                       </h5>
                                       <button type="button" class="btn-close" data-bs-dismiss="modal"
                                          aria-label="Close"></button>
                                    </div>
                                    <div class="modal-body">
                                       Apakah Anda yakin ingin menghapus game
                                       <strong><?php echo htmlspecialchars($game['provider']); ?></strong>?
                                    </div>
                                    <div class="modal-footer">
                                       <button type="button" class="btn btn-secondary"
                                          data-bs-dismiss="modal">Batal</button>
                                       <form action="delete_game.php" method="post"
                                          onsubmit="return confirm('Apakah Anda yakin ingin menghapus game ini?')">
                                          <input type="hidden" name="id" value="<?php echo $game['id']; ?>">
                                          <button type="submit" class="btn btn-sm btn-danger">
                                             <i class="bi bi-trash"></i> Hapus
                                          </button>
                                       </form>
                                    </div>
                                 </div>
                              </div>
                           </div>
                        </td>
                     </tr>
                  <?php endwhile; ?>
               </tbody>
            </table>
         </div>
      </div>
   </section>
</main>
<script>
   document.addEventListener("DOMContentLoaded", function () {
      const editButtons = document.querySelectorAll(".edit-btn");
      editButtons.forEach(button => {
         button.addEventListener("click", function () {
            const id = this.getAttribute("data-id");
            const provider = this.getAttribute("data-provider");
            const gambar = this.getAttribute("data-gambar");
            const keterangan = this.getAttribute("data-keterangan");

            document.getElementById("edit_id").value = id;
            document.getElementById("edit_provider").value = provider;
            document.getElementById("edit_gambar_preview").src = gambar;
            document.getElementById("edit_keterangan").value = keterangan;
         });
      });
   });
</script>