From 044095e2671966a9f17d63376925911ce54bf757 Mon Sep 17 00:00:00 2001 From: alexander Date: Mon, 15 Dec 2025 22:14:53 +0700 Subject: [PATCH] memperbarui UI --- html.php | 397 +++++++++++++++++++++++++++++++++++++++++++++++++---- ody git.js | 213 ++++++++++++++-------------- 2 files changed, 477 insertions(+), 133 deletions(-) diff --git a/html.php b/html.php index 1c27870..6bf95db 100644 --- a/html.php +++ b/html.php @@ -1,68 +1,411 @@ 0) { + $row = mysqli_fetch_assoc($res); + $_SESSION['balance'] = (int)$row['balance']; +} ?> - Blackjack [21] - OCA GameHub + Blackjack Pro - OCA GameHub + + + + + - + -
+ +
+
-

Blackjack [21]

-
-
-
Signed in as:
- Top Up - Logout +
+

Blackjack [21]

+ -
-
Bank:
-
Taruhan: 0
+
+ +
+
+
+ Bank + +
+
+ Taruhan Saat Ini + 0 +
-
- - - + +
+ + +
-
-
Dealer
+ +
+
Dealer's Hand
-
-
Pemain
+ +
+
Your Hand
+
-
- - - + +
+
+
+ + +
-
- OCA GameHub - Blackjack_[21] - Semoga menang bosq + OCA GameHub © 2025 - Semoga menang bosq!
- + diff --git a/ody git.js b/ody git.js index e67af77..8ca7e7f 100644 --- a/ody git.js +++ b/ody git.js @@ -1,12 +1,12 @@ // SET MESSAGE (WIN/LOSE) -function setMessage(text, status){ +function setMessage(text, status) { messageEl.textContent = text; messageEl.className = status; // 'win', 'lose', atau '' (tie) } // Simple Blackjack implementation -const SUITS = ['♠','♥','♦','♣']; -const RANKS = ['A','2','3','4','5','6','7','8','9','10','J','Q','K']; +const SUITS = ['♠', '♥', '♦', '♣']; +const RANKS = ['A', '2', '3', '4', '5', '6', '7', '8', '9', '10', 'J', 'Q', 'K']; // DOM const dealerHandEl = document.getElementById('dealer-hand'); @@ -27,64 +27,65 @@ let deck = []; let dealer = []; let player = []; let dealerHidden = true; -let balance = 1000; +// Initialize balance from the HTML (PHP output) +let balance = parseInt(document.getElementById('balance').innerText.replace(/[^\d]/g, '')) || 0; let currentBet = 0; let inRound = false; -function makeDeck(){ +function makeDeck() { deck = []; - for(const s of SUITS){ - for(const r of RANKS){ - deck.push({suit:s,rank:r}); + for (const s of SUITS) { + for (const r of RANKS) { + deck.push({ suit: s, rank: r }); } } } -function shuffle(){ - for(let i=deck.length-1;i>0;i--){ - const j = Math.floor(Math.random()*(i+1)); - [deck[i],deck[j]] = [deck[j],deck[i]]; +function shuffle() { + for (let i = deck.length - 1; i > 0; i--) { + const j = Math.floor(Math.random() * (i + 1)); + [deck[i], deck[j]] = [deck[j], deck[i]]; } } -function cardValue(card){ +function cardValue(card) { const r = card.rank; - if(r==='A') return [1,11]; - if(['J','Q','K'].includes(r)) return [10]; - return [parseInt(r,10)]; + if (r === 'A') return [1, 11]; + if (['J', 'Q', 'K'].includes(r)) return [10]; + return [parseInt(r, 10)]; } -function handValues(hand){ +function handValues(hand) { let totals = [0]; - for(const c of hand){ + for (const c of hand) { const vals = cardValue(c); const newTotals = []; - for(const t of totals){ - for(const v of vals){ newTotals.push(t+v); } + for (const t of totals) { + for (const v of vals) { newTotals.push(t + v); } } totals = Array.from(new Set(newTotals)); } - const valid = totals.filter(t=>t<=21); - if(valid.length) return Math.max(...valid); + const valid = totals.filter(t => t <= 21); + if (valid.length) return Math.max(...valid); return Math.min(...totals); } -function renderHand(el,hand,hideFirst=false){ - el.innerHTML=''; - hand.forEach((c,i)=>{ +function renderHand(el, hand, hideFirst = false) { + el.innerHTML = ''; + hand.forEach((c, i) => { const div = document.createElement('div'); - div.className='card'+(c.suit==='♥'||c.suit==='♦'?' red':''); + div.className = 'card' + (c.suit === '♥' || c.suit === '♦' ? ' red' : ''); - if(hideFirst && i===0){ - div.className='card back'; - div.textContent='HIDEN'; + if (hideFirst && i === 0) { + div.className = 'card back'; + div.textContent = 'HIDEN'; } else { - const top = document.createElement('div'); + const top = document.createElement('div'); top.textContent = c.rank + ' ' + c.suit; - const bot = document.createElement('div'); - bot.style.alignSelf='flex-end'; + const bot = document.createElement('div'); + bot.style.alignSelf = 'flex-end'; bot.textContent = c.rank + ' ' + c.suit; - div.appendChild(top); + div.appendChild(top); div.appendChild(bot); } @@ -92,25 +93,25 @@ function renderHand(el,hand,hideFirst=false){ }); } -function updateUI(){ - renderHand(dealerHandEl,dealer,dealerHidden); - renderHand(playerHandEl,player,false); - dealerValueEl.textContent = dealerHidden ? '??' : 'Nilai: '+handValues(dealer); - playerValueEl.textContent = 'Nilai: '+handValues(player); - balanceEl.textContent = balance; - currentBetEl.textContent = currentBet; +function updateUI() { + renderHand(dealerHandEl, dealer, dealerHidden); + renderHand(playerHandEl, player, false); + dealerValueEl.textContent = dealerHidden ? '??' : 'Nilai: ' + handValues(dealer); + playerValueEl.textContent = 'Nilai: ' + handValues(player); + balanceEl.textContent = balance.toLocaleString('id-ID'); // Format with dots + currentBetEl.textContent = currentBet.toLocaleString('id-ID'); } -function startRound(){ - if(inRound) return; +function startRound() { + if (inRound) return; const bet = Number(betInput.value) || 0; - if(bet <=0 || bet > balance){ alert(' BANK TIDAK CUKUP! '); return; } + if (bet <= 0 || bet > balance) { alert(' BANK TIDAK CUKUP! '); return; } - currentBet = bet; - balance -= bet; - inRound=true; - dealerHidden=true; + currentBet = bet; + balance -= bet; + inRound = true; + dealerHidden = true; setMessage('', ''); // RESET MESSAGE @@ -121,12 +122,12 @@ function startRound(){ updateUI(); // NATURAL BLACKJACK - if(handValues(player)===21){ - dealerHidden=false; + if (handValues(player) === 21) { + dealerHidden = false; updateUI(); const dealerVal = handValues(dealer); - if(dealerVal===21){ + if (dealerVal === 21) { balance += currentBet; setMessage('Tie (seri).', ''); } else { @@ -135,44 +136,44 @@ function startRound(){ setMessage('Blackjack! You Win!', 'win'); } - inRound=false; - currentBet=0; + inRound = false; + currentBet = 0; updateUI(); } } -function playerHit(){ - if(!inRound) return; +function playerHit() { + if (!inRound) return; player.push(deck.pop()); updateUI(); - if(handValues(player) > 21){ - dealerHidden=false; + if (handValues(player) > 21) { + dealerHidden = false; setMessage('Bust! You Lose!', 'lose'); - inRound=false; - currentBet=0; + inRound = false; + currentBet = 0; updateUI(); } } -function playerStand(){ - if(!inRound) return; +function playerStand() { + if (!inRound) return; - dealerHidden=false; + dealerHidden = false; - while(handValues(dealer)<17){ + while (handValues(dealer) < 17) { dealer.push(deck.pop()); } const pv = handValues(player); const dv = handValues(dealer); - if(dv>21 || pv>dv){ - balance += currentBet*2; + if (dv > 21 || pv > dv) { + balance += currentBet * 2; setMessage('You Win!', 'win'); - } else if(pv===dv){ + } else if (pv === dv) { balance += currentBet; setMessage('Tie (seri).', ''); @@ -180,26 +181,26 @@ function playerStand(){ setMessage('You Lose!', 'lose'); } - inRound=false; - currentBet=0; + inRound = false; + currentBet = 0; updateUI(); } -function playerDouble(){ - if(!inRound) return; - if(balance < currentBet){ alert('Bank tidak cukup untuk double.'); return; } +function playerDouble() { + if (!inRound) return; + if (balance < currentBet) { alert('Bank tidak cukup untuk double.'); return; } - balance -= currentBet; + balance -= currentBet; currentBet *= 2; player.push(deck.pop()); updateUI(); - if(handValues(player)>21){ - dealerHidden=false; + if (handValues(player) > 21) { + dealerHidden = false; setMessage('Bust! You Lose!', 'lose'); - inRound=false; - currentBet=0; + inRound = false; + currentBet = 0; updateUI(); return; } @@ -213,25 +214,25 @@ hitBtn.addEventListener('click', playerHit); standBtn.addEventListener('click', playerStand); doubleBtn.addEventListener('click', playerDouble); -newRoundBtn.addEventListener('click', ()=>{ - if(inRound && !confirm('Masih dalam ronde. Reset?')) return; - balance = 1000; - currentBet=0; - inRound=false; - dealer=[]; - player=[]; - deck=[]; - dealerHidden=true; - setMessage('Bank di-reset.', ''); +newRoundBtn.addEventListener('click', () => { + if (inRound && !confirm('Masih dalam ronde. Reset?')) return; + // Do NOT reset balance to 1000. Balance persists. + currentBet = 0; + inRound = false; + dealer = []; + player = []; + deck = []; + dealerHidden = true; + setMessage('Meja di-reset.', ''); updateUI(); }); // KEYBOARD -window.addEventListener('keydown', e=>{ - if(e.key==='h') playerHit(); - if(e.key==='s') playerStand(); - if(e.key==='d') playerDouble(); - if(e.key==='Enter') startRound(); +window.addEventListener('keydown', e => { + if (e.key === 'h') playerHit(); + if (e.key === 's') playerStand(); + if (e.key === 'd') playerDouble(); + if (e.key === 'Enter') startRound(); }); updateUI(); @@ -265,35 +266,35 @@ function hideTopUpModal() { // Fungsi untuk memproses top up function processTopUp() { const amount = Number(topUpInput.value) || 0; - + if (amount <= 0) { alert('Masukkan jumlah top up yang valid!'); return; } - + if (amount > 1000000) { alert('Maksimal top up adalah 1.000.000!'); return; } - + // Simulasi proses top up (dalam implementasi nyata, ini akan terhubung ke payment gateway) balance += amount; topUpAmount += amount; - + // Tambahkan ke riwayat top up topUpHistory.push({ amount: amount, date: new Date().toLocaleString('id-ID'), balanceAfter: balance }); - + // Update UI updateUI(); updateTopUpHistory(); - + // Tampilkan pesan sukses setMessage(`Top up berhasil! +${amount.toLocaleString('id-ID')}`, 'win'); - + // Sembunyikan modal hideTopUpModal(); } @@ -301,17 +302,17 @@ function processTopUp() { // Fungsi untuk memperbarui riwayat top up function updateTopUpHistory() { if (!topUpHistoryEl) return; - + topUpHistoryEl.innerHTML = ''; - + if (topUpHistory.length === 0) { topUpHistoryEl.innerHTML = '

Belum ada riwayat top up

'; return; } - + // Tampilkan maksimal 5 riwayat terbaru const recentHistory = topUpHistory.slice(-5).reverse(); - + recentHistory.forEach(record => { const historyItem = document.createElement('div'); historyItem.className = 'history-item'; @@ -361,22 +362,22 @@ window.addEventListener('keydown', e => { // Modifikasi fungsi updateUI untuk menampilkan informasi top up const originalUpdateUI = updateUI; -updateUI = function() { - originalUpdateUI();` []` +updateUI = function () { + originalUpdateUI(); ` []` updateTopUpBalance(); }; // Modifikasi fungsi newRound untuk reset saldo yang tidak mempengaruhi riwayat top up const originalNewRound = newRoundBtn.onclick; -newRoundBtn.onclick = function() { +newRoundBtn.onclick = function () { if (inRound && !confirm('Masih dalam ronde. Reset?')) return; - + // Reset saldo tapi pertahankan riwayat top up const currentTopUpAmount = topUpAmount; balance = 1000 + currentTopUpAmount; currentBet = 0; inRound = false; - dealer = []; + dealer = []; player = []; deck = []; dealerHidden = true;