2048

2048.css

@@ -998,14 +998,14 @@ h1 {
     }
 }
 
-/* Best Score Display - ORANGE gradient */
-.best-score-display {
+/* High Score Display - ORANGE gradient */
+.high-score-display {
     margin-top: 28px;
     padding-top: 28px;
     border-top: 2px solid rgba(255, 140, 0, 0.25);
 }
 
-.best-score-label {
+.high-score-label {
     font-size: 11px;
     text-transform: uppercase;
     color: rgba(255, 160, 50, 0.7);
@@ -1014,7 +1014,7 @@ h1 {
     font-weight: 700;
 }
 
-.best-score-value {
+.high-score-value {
     font-size: clamp(34px, 5vw, 42px);
     font-weight: 900;
     background: linear-gradient(135deg, #ff8c00 0%, #ffa500 50%, #ffb347 100%);

2048.html

@@ -208,7 +208,7 @@
           </div>
           <div class="score-box">
             <div class="score-label">HIGH SCORE</div>
-            <div class="score-value" id="best-score">0</div>
+            <div class="score-value" id="high-score">0</div>
           </div>
         </div>
       </div>
@@ -323,14 +323,14 @@
             New High Score
           </div>
 
-          <!-- Best Score Display - show if NOT new record -->
+          <!-- high Score Display - show if NOT new record -->
           <div
-            class="best-score-display"
-            id="best-score-display"
+            class="high-score-display"
+            id="high-score-display"
             style="display: none"
           >
-            <div class="best-score-label">High Score</div>
-            <div class="best-score-value" id="modal-best-score">0</div>
+            <div class="high-score-label">High Score</div>
+            <div class="high-score-value" id="modal-high-score">0</div>
           </div>
         </div>
 

2048.js

@@ -1,11 +1,18 @@
-
-
 /* ------------------------
    State & Variables
    ------------------------ */
 let board = [];
 let currentScore = 0;
-let bestScore = parseInt(localStorage.getItem('bestScore2048')) || 0;
+
+// 1. Ambil username dari sessionStorage (sesuai sistem login kamu)
+const currentUser = sessionStorage.getItem("loggedInUser") || "guest";
+
+// 2. Buat nama kunci unik, misal: "highScore2048_budi"
+const storageKey = 'highScore2048_' + currentUser;
+
+// 3. Ambil skor milik user tersebut saja
+
+let highScore = parseInt(localStorage.getItem(storageKey)) || 0;
 let lastMoveDir = null;
 let isMoving = false;
 let mergesInCurrentMove = 0;
@@ -71,7 +78,7 @@ function checkAndShowTutorial() {
    DOM Ready
    ------------------------ */
 document.addEventListener("DOMContentLoaded", () => {
-  updateBestScoreDisplay();
+  updateHighScoreDisplay();
   setupBoard();
   addNewTile();
   addNewTile();
@@ -223,17 +230,18 @@ function updateScoreDisplay() {
     scoreEl.textContent = currentScore;
   }
   
-  if (currentScore > bestScore) {
-    bestScore = currentScore;
-    localStorage.setItem('bestScore2048', bestScore);
-    updateBestScoreDisplay();
+  if (currentScore > highScore) {
+    highScore = currentScore;
+    // Gunakan storageKey yang sudah kita buat di atas (dinamis sesuai user)
+    localStorage.setItem(storageKey, highScore); 
+    updateHighScoreDisplay();
 }
   }
 
-function updateBestScoreDisplay() {
-  const bestScoreEl = document.getElementById('best-score');
-  if (bestScoreEl) {
-    bestScoreEl.textContent = bestScore;
+function updateHighScoreDisplay() {
+  const highScoreEl = document.getElementById('high-score');
+  if (highScoreEl) {
+    highScoreEl.textContent = highScore;
   }
 }
 
@@ -601,7 +609,7 @@ function showGameOver() {
       console.error("Fungsi saveScore tidak ditemukan! Pastikan Score_Request.js sudah diload.");
   }
 
-  const isNewHighScore = finalScore >= bestScore && finalScore > 0;
+  const isNewHighScore = finalScore >= highScore && finalScore > 0;
   
   const finalScoreEl = document.getElementById('final-score');
   if (finalScoreEl) {
@@ -609,16 +617,16 @@ function showGameOver() {
   }
   
   const newHighScoreBadge = document.getElementById('new-high-score-badge');
-  const bestScoreDisplay = document.getElementById('best-score-display');
+  const highScoreDisplay = document.getElementById('high-score-display');
   
   if (isNewHighScore) {
     if (newHighScoreBadge) newHighScoreBadge.style.display = 'inline-block';
-    if (bestScoreDisplay) bestScoreDisplay.style.display = 'none';
+    if (highScoreDisplay) highScoreDisplay.style.display = 'none';
   } else {
     if (newHighScoreBadge) newHighScoreBadge.style.display = 'none';
-    if (bestScoreDisplay) bestScoreDisplay.style.display = 'block';
-    const modalBestScore = document.getElementById('modal-best-score');
-    if (modalBestScore) modalBestScore.textContent = bestScore;
+    if (highScoreDisplay) highScoreDisplay.style.display = 'block';
+    const modalHighScore = document.getElementById('modal-high-score');
+    if (modalHighScore) modalHighScore.textContent = highScore;
   }
   
   const gameOverOverlay = document.getElementById('game-over-overlay');