feat:

fix: add score and design background

src/css/game.css

@@ -47,10 +47,11 @@
 }
 
 .container-first {
-    /* background-image: url(/src/assets/Design/CAVEBOSSFIGHT.png); */
+    background-image: url(/assets/Design/newBGBOSSFIGHT.gif);
     background-repeat: no-repeat;
     background-size: cover;
     image-rendering: pixelated;
+    background-position: center;
 }
 
 .container-first .content .boss {
@@ -110,7 +111,7 @@
     color: #ffdf12;
     font-size: 30px;
     background-color: #f7e62e34;
-    margin: 5px;    
+    margin: 5px;
     border-radius: 10px;
     cursor: pointer;
 }

src/css/style.css

@@ -139,6 +139,35 @@
     justify-content: space-around;
     align-items: center;
     height: 100dvh;
+    /* Hapus properti background dari sini dan pindahkan ke ::before */
+
+    /* Tambahkan posisi relatif agar pseudo-element bisa diposisikan absolut di dalamnya */
+    position: relative; 
+    /* Pastikan konten di dalam container ada di atas latar */
+    z-index: 1; 
+}
+
+/* Pseudo-element untuk menampung gambar latar transparan */
+.container-board::before {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    
+    /* Pindahkan properti background Anda ke sini */
+    background-image: url(/assets/Design/CampFire8WESFIX!-export.png);
+    background-repeat: no-repeat;
+    background-size: cover;
+    background-position: center;
+    image-rendering: pixelated;
+
+    /* >>> INI KUNCINYA: Atur opasitasnya di sini <<< */
+    opacity:1; /* Contoh nilai 40% transparan */
+    
+    /* Pindahkan latar ini ke lapisan paling bawah */
+    z-index: -1; 
 }
 
 .container-board .chara {
@@ -160,13 +189,14 @@
     width: 300px;
     image-rendering: pixelated;
     margin: 20px;
+    margin-top: 160px;
 }
 
 .container-board .menu {
     margin: 0 auto;
-    border-radius: 10px;
+    border-radius: 6px;
     width: 400px;
-    border: 1px solid;
+    border: 5px solid;
     height: 40px;
     align-content: center;
 }
@@ -178,13 +208,15 @@
     /*menghilangkan gap antar border*/
     font-family: "Segoe UI", Tahoma, sans-serif;
     color: white;
+    font-weight: 200;
+    font-size: 20px;
     border-radius: 10px;
     overflow: hidden;
 }
 
 .container-board .board table th,
 td {
-    border: 5px solid #ffffffb8;
+    border: 5px solid #ffffff;
     padding: 14px 18px;
     white-space: nowrap;
     text-align: center;
@@ -198,6 +230,9 @@ td {
 }
 
 
+.container-board .board table tbody tr {
+    background: #0b0e00bd;
+}
 .container-board .board table tbody tr:hover {
     background: #c1fc0032;
 }
@@ -209,9 +244,6 @@ td {
     flex-direction: column;
     justify-content: center;
     align-items: center;
-    /* background-image: url(/src/assets/Design/wayland.png);
-    background-repeat: no-repeat;
-    background-size: cover; */
 }
 
 .container-onboard h1 {

src/js/firstperson.js

@@ -66,7 +66,7 @@ function selectAnswer(e){
     const isCorrect = selectedBtn.dataset.correct === "true";
     if(isCorrect){
         selectedBtn.classList.add("correct");
-        score++;
+        score += 10;
     } else {
         selectedBtn.classList.add("Incorrect");
     }
@@ -83,8 +83,6 @@ function showScore(){
     resetState();
     const show = questionElement.innerHTML = `you scored ${score} out of ${questions.length}!`;
     postScore(score);
-    alert(show);
-    window.location.href = "../leaderboard.php"
 }
 
 function handleNextBtn(){
@@ -108,10 +106,21 @@ function postScore(score){
     fetch('/score.php', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ score })
+        body: JSON.stringify({ score:   score })
     })
-    .then(r => r.text())
+    .then(r => r.json())
-    .then(t => console.log("Server response:", t))
+    .then(data => {
-    .catch(err => console.error("Fetch error:", err));
+        console.log("Server response:", data);
+        
+        if(data.success || data.message === "Score accumulated") {
+            window.location.href = "../leaderboard.php"; 
+        } else {
+             window.location.href = "../leaderboard.php"; 
+        }
+    })
+    .catch(err => {
+        console.error("Fetch error:", err);
+        alert("Terjadi kesalahan koneksi.");
+    });
 }
 startQuiz()

src/js/soal.js

@@ -1 +0,0 @@
-dadad

src/leaderboard.php

@@ -5,7 +5,7 @@ require_once "config/db.php";
 $sql= "SELECT username, score
 FROM users
 ORDER BY score DESC
-LIMIT 10";
+LIMIT 8";
 $nama = $_SESSION['username'];
 $score = 0;
 

src/score.php

@@ -19,15 +19,20 @@ if (!$user_id) {
     exit;
 }
 
-$stmt = $db->prepare("INSERT INTO scores (id, score) VALUES (?, ?)");
+$sql = "UPDATE users SET score = score + ? where id =? ";
-$stmt->bind_param("ii", $user_id, $score);
+$stmt = $db ->prepare($sql);
 
-if ($stmt->execute()) {
+if ($stmt){
-    echo json_encode(["success" => true]);
+    $stmt->bind_param("ii",$score,$user_id);
-} else {
+    if($stmt->execute()){
-    echo json_encode(["error" => "insert failed"]);
+        echo json_encode(["success" => true, "message" => "Score accumulated"]);
+    }else{
+        echo json_encode(["error" => "update failed: " . $stmt->error]);
+    }
+    $stmt->close();
+}else{
+    echo json_encode(["error" => "stetment prep failed"]);
 }
 
-$stmt->close();
 $db->close();
 ?>