Upload 52 files

api.js

@@ -299,6 +299,80 @@ app.post('/carrom/shoot', auth, async (req, res) => {
     }
 });
 
+// ── Card Web Game API ──
+app.get('/wcards/state', auth, async (req, res) => {
+    try {
+        const { gameId } = req.query;
+        const sessions = require('./games/sessions');
+        const game = sessions.get(gameId);
+        if (!game || !game.getState) return res.json({ ok: false, error: 'Game not found' });
+        res.json({ ok: true, state: game.getState(req.tgUser.id.toString()) });
+    } catch (err) { console.error('[API] wcards/state:', err); res.status(500).json({ ok: false, error: 'Error' }); }
+});
+
+app.post('/wcards/start', auth, async (req, res) => {
+    try {
+        const { gameId } = req.body;
+        const sessions = require('./games/sessions');
+        const game = sessions.get(gameId);
+        if (!game) return res.json({ ok: false, error: 'Game not found' });
+        if (game.hostId !== req.tgUser.id.toString()) return res.json({ ok: false, error: 'Only host' });
+        if (!game.start()) return res.json({ ok: false, error: 'Need 2+ players' });
+        if (game._timer) { clearTimeout(game._timer); game._timer = null; }
+        if (game._autoStart) { clearTimeout(game._autoStart); game._autoStart = null; }
+        // Charge
+        for (const p of game.players) {
+            let u = await User.findOne({ userId: p.userId }) || await User.create({ userId: p.userId });
+            u.wallet -= game.bet; await u.save();
+        }
+        res.json({ ok: true, state: game.getState(req.tgUser.id.toString()) });
+    } catch (err) { console.error('[API] wcards/start:', err); res.status(500).json({ ok: false, error: 'Error' }); }
+});
+
+app.post('/wcards/play', auth, async (req, res) => {
+    try {
+        const { gameId, cardIndex } = req.body;
+        const sessions = require('./games/sessions');
+        const leveling = require('./utils/leveling');
+        const game = sessions.get(gameId);
+        if (!game) return res.json({ ok: false, error: 'Game not found' });
+        const userId = req.tgUser.id.toString();
+        const result = game.playCard(userId, cardIndex);
+        if (result.error) return res.json({ ok: false, error: result.error });
+
+        // If game ended, pay out
+        if (game.status === 'ended') {
+            const winners = game.getWinners();
+            const pot = game.bet * game.players.length;
+            const share = Math.floor(pot / winners.length);
+            for (const w of winners) {
+                let u = await User.findOne({ userId: w.userId }) || await User.create({ userId: w.userId });
+                u.wallet += share;
+                await leveling.addXP(w.userId, 150);
+                await u.save();
+            }
+            const wNames = winners.map(w => w.name).join(' & ');
+            if (global._tgClient && game.chatId) {
+                try { await global._tgClient.sendMessage(game.chatId, { message: `🃏 <b>CARD GAME — OVER!</b>\n\n🏆 ${wNames} wins <b>$${pot}</b>!` }); } catch (e) {}
+            }
+            setTimeout(() => sessions.delete(gameId), 5000);
+        }
+
+        res.json({ ok: true, state: game.getState(userId) });
+    } catch (err) { console.error('[API] wcards/play:', err); res.status(500).json({ ok: false, error: 'Error' }); }
+});
+
+app.post('/wcards/next', auth, async (req, res) => {
+    try {
+        const { gameId } = req.body;
+        const sessions = require('./games/sessions');
+        const game = sessions.get(gameId);
+        if (!game) return res.json({ ok: false, error: 'Game not found' });
+        game.nextRound();
+        res.json({ ok: true, state: game.getState(req.tgUser.id.toString()) });
+    } catch (err) { res.status(500).json({ ok: false, error: 'Error' }); }
+});
+
 // ── Compat: GET /daily/status ──
 app.get('/daily/status', auth, async (req, res) => {
     const userId = req.tgUser.id.toString();

bot.js

@@ -28,6 +28,7 @@ const strategy = require('./handlers/strategyGames');
 const shopHandler = require('./handlers/shop');
 const admin = require('./handlers/admin');
 const carrom = require('./handlers/carrom');
+const webCards = require('./handlers/webCards');
 
 const apiId = parseInt(process.env.API_ID || 0);
 const apiHash = process.env.API_HASH || "";
@@ -126,6 +127,16 @@ const MP_FALLBACK = "⚠️ This command only works in groups! Add me to a group
             const startParam = parts[1] || '';
 
             // Handle startapp deep links (carrom, daily, mission, etc.)
+            if (startParam.startsWith('wcards_')) {
+                const webUrl = getWebAppUrl() + '/cards.html?tgWebAppStartParam=' + startParam;
+                await client.sendMessage(event.chatId, {
+                    message: "🃏 <b>Card Game</b>\n\nClick below to open!",
+                    buttons: new Api.ReplyInlineMarkup({ rows: [new Api.KeyboardButtonRow({ buttons: [
+                        new Api.KeyboardButtonWebView({ text: "🃏 Open Cards", url: webUrl })
+                    ]})] })
+                });
+                return;
+            }
             if (startParam.startsWith('carrom_')) {
                 // Send mini app button to open carrom game
                 const webUrl = getWebAppUrl() + '/carrom?tgWebAppStartParam=' + startParam;
@@ -171,7 +182,8 @@ const MP_FALLBACK = "⚠️ This command only works in groups! Add me to a group
                 "🎲 /dice &lt;bet&gt; — Dice duel\n" +
                 "🎯 /carrom &lt;bet&gt; — Carrom Pool\n" +
                 "🔓 /hack &lt;bet&gt; &lt;len&gt; — PIN hack\n" +
-                "🃏 /cards &lt;bet&gt; — Card flip game\n\n" +
+                "🃏 /cards &lt;bet&gt; — Card flip (text)\n" +
+                "🃏 /wcards &lt;bet&gt; — Card game (Mini App)\n\n" +
                 "<b>🎰 Solo Casino</b>\n" +
                 "/bj &lt;bet&gt; — Blackjack\n" +
                 "/slots — Slots | /mines — Mines\n" +
@@ -236,6 +248,7 @@ const MP_FALLBACK = "⚠️ This command only works in groups! Add me to a group
         if (cmdStart("/xox", text)) { if (requireGroup(event) && await isAlive(event)) await boardGames.startXOX(client, event); }
         if (cmdStart("/c4", text)) { if (requireGroup(event) && await isAlive(event)) await boardGames.startC4(client, event); }
         if (cmdStart("/dice", text)) { if (requireGroup(event) && await isAlive(event)) await games.startDice(client, event); }
+        if (cmdStart("/wcards", text)) { if (requireGroup(event) && await isAlive(event)) await webCards.startWebCards(client, event); }
         if (cmdStart("/carrom", text)) { if (requireGroup(event) && await isAlive(event)) await carrom.startCarrom(client, event); }
         if (cmdStart("/cards", text)) { if (requireGroup(event) && await isAlive(event)) await cardGame.initCardGame(client, event); }
         if (cmdStart("/hack", text)) { if (requireGroup(event) && await isAlive(event)) await multiHack.initHack(client, event); }
@@ -260,6 +273,10 @@ const MP_FALLBACK = "⚠️ This command only works in groups! Add me to a group
             let handled = false;
             const cbData = update.data.toString();
 
+            if (cbData.startsWith("wcjn|")) {
+                try { await webCards.handleWebCardsCallback(client, update); } catch (e) { console.error('[CB] wcards:', e.message); }
+                handled = true;
+            }
             if (cbData.startsWith("crmjn|") || cbData.startsWith("crmst|")) {
                 try { await carrom.handleCarromCallback(client, update); } catch (e) { console.error('[CB] carrom:', e.message); }
                 handled = true;

games/WebCardGame.js

@@ -0,0 +1,184 @@
+/**
+ * Web Card Game — Server-side state for Mini App
+ * Classic card flip: each player has 4 cards, play 1 per round, highest wins
+ * 4 rounds total, most round wins = game winner
+ */
+class WebCardGame {
+    constructor(bet) {
+        this.bet = bet;
+        this.players = []; // [{userId, name}]
+        this.status = 'lobby'; // lobby, playing, reveal, ended
+        this.hands = {};   // {userId: [{label, val, suit, played}]}
+        this.round = 0;
+        this.roundPlays = {}; // {userId: {label, val, suit}}
+        this.roundResults = []; // [{winner, plays}]
+        this.scores = {};  // {userId: roundsWon}
+        this.hostId = null;
+        this.chatId = null;
+        this._timer = null;
+        this._autoStart = null;
+        this._revealTimer = null;
+    }
+
+    addPlayer(userId, name) {
+        if (this.players.length >= 6 || this.players.some(p => p.userId === userId)) return false;
+        this.players.push({ userId, name });
+        this.scores[userId] = 0;
+        if (!this.hostId) this.hostId = userId;
+        return true;
+    }
+
+    start() {
+        if (this.players.length < 2) return false;
+        this.status = 'playing';
+        this.round = 1;
+        this.dealCards();
+        return true;
+    }
+
+    dealCards() {
+        const suits = ['♠', '♥', '♦', '♣'];
+        const labels = ['2','3','4','5','6','7','8','9','10','J','Q','K','A'];
+        const valMap = {'2':2,'3':3,'4':4,'5':5,'6':6,'7':7,'8':8,'9':9,'10':10,'J':11,'Q':12,'K':13,'A':14};
+
+        // Build a deck
+        const deck = [];
+        for (const s of suits)
+            for (const l of labels)
+                deck.push({ label: l, val: valMap[l], suit: s, played: false });
+
+        // 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]];
+        }
+
+        // Deal 4 cards to each player
+        this.hands = {};
+        let idx = 0;
+        for (const p of this.players) {
+            this.hands[p.userId] = [];
+            for (let i = 0; i < 4; i++) {
+                this.hands[p.userId].push(deck[idx++]);
+            }
+        }
+        this.roundPlays = {};
+    }
+
+    playCard(userId, cardIndex) {
+        if (this.status !== 'playing') return { error: 'Game not active' };
+        if (this.roundPlays[userId]) return { error: 'Already played this round' };
+        const hand = this.hands[userId];
+        if (!hand) return { error: 'Not in game' };
+        if (cardIndex < 0 || cardIndex >= hand.length) return { error: 'Invalid card' };
+        if (hand[cardIndex].played) return { error: 'Card already used' };
+
+        hand[cardIndex].played = true;
+        this.roundPlays[userId] = {
+            label: hand[cardIndex].label,
+            val: hand[cardIndex].val,
+            suit: hand[cardIndex].suit,
+            cardIndex
+        };
+
+        // Check if all players have played
+        if (Object.keys(this.roundPlays).length >= this.players.length) {
+            this.resolveRound();
+        }
+
+        return { ok: true };
+    }
+
+    resolveRound() {
+        this.status = 'reveal';
+
+        // Find highest card
+        let maxVal = -1, winners = [];
+        for (const [uid, play] of Object.entries(this.roundPlays)) {
+            if (play.val > maxVal) { maxVal = play.val; winners = [uid]; }
+            else if (play.val === maxVal) { winners.push(uid); }
+        }
+
+        for (const w of winners) this.scores[w] = (this.scores[w] || 0) + 1;
+
+        this.roundResults.push({
+            round: this.round,
+            plays: { ...this.roundPlays },
+            winners
+        });
+
+        // Auto-advance after reveal delay (handled by client polling)
+        this.round++;
+        if (this.round > 4) {
+            this.status = 'ended';
+        }
+    }
+
+    nextRound() {
+        if (this.status === 'reveal') {
+            this.status = 'playing';
+            this.roundPlays = {};
+        }
+    }
+
+    getWinners() {
+        let maxScore = -1, winners = [];
+        for (const p of this.players) {
+            const s = this.scores[p.userId] || 0;
+            if (s > maxScore) { maxScore = s; winners = [p]; }
+            else if (s === maxScore) { winners.push(p); }
+        }
+        return winners;
+    }
+
+    getState(forUserId) {
+        const myHand = this.hands[forUserId]?.map((c, i) => ({
+            label: c.label, suit: c.suit, val: c.val, played: c.played, index: i
+        })) || [];
+
+        // Other players' played cards: show face-down until reveal
+        const tablePlays = {};
+        for (const [uid, play] of Object.entries(this.roundPlays)) {
+            if (this.status === 'reveal' || this.status === 'ended') {
+                tablePlays[uid] = { label: play.label, suit: play.suit, val: play.val, faceUp: true };
+            } else {
+                tablePlays[uid] = { faceUp: false }; // face down
+            }
+        }
+
+        const lastResult = this.roundResults.length > 0 ? this.roundResults[this.roundResults.length - 1] : null;
+        let lastResultFormatted = null;
+        if (lastResult) {
+            lastResultFormatted = {
+                round: lastResult.round,
+                plays: {},
+                winnerNames: lastResult.winners.map(uid => this.players.find(p => p.userId === uid)?.name || '?')
+            };
+            for (const [uid, play] of Object.entries(lastResult.plays)) {
+                const pName = this.players.find(p => p.userId === uid)?.name || '?';
+                lastResultFormatted.plays[pName] = { label: play.label, suit: play.suit };
+            }
+        }
+
+        return {
+            status: this.status,
+            players: this.players.map(p => ({
+                name: p.name,
+                isMe: p.userId === forUserId,
+                score: this.scores[p.userId] || 0,
+                hasPlayed: !!this.roundPlays[p.userId]
+            })),
+            round: this.round,
+            totalRounds: 4,
+            myHand,
+            iPlayed: !!this.roundPlays[forUserId],
+            tablePlays,
+            lastResult: lastResultFormatted,
+            isHost: this.hostId === forUserId,
+            winner: this.status === 'ended' ? this.getWinners().map(p => p.name) : null,
+            playerCount: this.players.length,
+        };
+    }
+}
+
+module.exports = WebCardGame;

handlers/webCards.js

@@ -0,0 +1,96 @@
+const { Api } = require("telegram");
+const crypto = require('crypto');
+const User = require('../models/User');
+const WebCardGame = require('../games/WebCardGame');
+const sessions = require('../games/sessions');
+const { getName } = require('../utils/getName');
+const { getBotUsername } = require('../utils/miniAppButton');
+
+function playUrl(gameId) {
+    return `https://t.me/${getBotUsername()}?startapp=wcards_${gameId.replace(/:/g, '_0_')}`;
+}
+
+const startWebCards = async (client, event) => {
+    const bet = Math.max(50, parseInt(event.message.message.split(" ")[1]) || 100);
+    const userId = event.message.senderId.toString();
+    let user = await User.findOne({ userId }) || await User.create({ userId });
+    if (user.wallet < bet) return event.message.respond({ message: "Insufficient funds!" });
+
+    const gameId = `wc:${event.chatId}:${crypto.randomBytes(4).toString('hex')}`;
+    const name = await getName(client, userId);
+    const game = new WebCardGame(bet);
+    game.addPlayer(userId, name);
+    game.chatId = event.chatId.toString();
+    sessions.set(gameId, game);
+
+    await client.sendMessage(event.chatId, {
+        message: `🃏 <b>CARD GAME</b>\nBet: $${bet} each\n\n👤 ${name} (host)\n⏳ Waiting for players (2-6)...\n\n<i>Open the Mini App to see your cards!</i>`,
+        buttons: new Api.ReplyInlineMarkup({ rows: [
+            new Api.KeyboardButtonRow({ buttons: [
+                new Api.KeyboardButtonCallback({ text: `⚔️ Join ($${bet})`, data: Buffer.from(`wcjn|${gameId}`) })
+            ] }),
+            new Api.KeyboardButtonRow({ buttons: [
+                new Api.KeyboardButtonUrl({ text: "🃏 Open Game", url: playUrl(gameId) })
+            ] })
+        ] })
+    });
+
+    game._timer = setTimeout(async () => {
+        const g = sessions.get(gameId);
+        if (!g || g.status !== 'lobby') return;
+        if (g.players.length >= 2) { g.start(); /* auto-start */ }
+        else { sessions.delete(gameId); try { await client.sendMessage(event.chatId, { message: `🃏 Lobby expired.` }); } catch (e) {} }
+    }, 120000);
+};
+
+const handleWebCardsCallback = async (client, update) => {
+    const data = update.data.toString();
+    const userId = update.userId.toString();
+
+    if (data.startsWith("wcjn|")) {
+        const gameId = data.split("|")[1];
+        const game = sessions.get(gameId);
+        if (!game || game.status !== 'lobby') { await alert(client, update, "Expired!"); return; }
+        if (game.players.some(p => p.userId === userId)) { await alert(client, update, "Already in!"); return; }
+        if (game.players.length >= 6) { await alert(client, update, "Full!"); return; }
+        let user = await User.findOne({ userId }) || await User.create({ userId });
+        if (user.wallet < game.bet) { await alert(client, update, "Insufficient funds!"); return; }
+        game.addPlayer(userId, await getName(client, userId));
+
+        if (game.players.length >= 2 && !game._autoStart) {
+            game._autoStart = setTimeout(async () => {
+                const g = sessions.get(gameId);
+                if (g && g.status === 'lobby' && g.players.length >= 2) g.start();
+            }, 60000);
+        }
+
+        const pl = game.players.map((p, i) => `👤 ${p.name}${i === 0 ? ' (host)' : ''}`).join('\n');
+        try {
+            await client.editMessage(update.peer, {
+                message: update.msgId,
+                text: `🃏 <b>CARD GAME</b>\nBet: $${game.bet} each\n\n${pl}\n\n✅ ${game.players.length} players — Host can start!`,
+                parseMode: 'html',
+                buttons: new Api.ReplyInlineMarkup({ rows: [
+                    new Api.KeyboardButtonRow({ buttons: [
+                        new Api.KeyboardButtonCallback({ text: `⚔️ Join ($${game.bet})`, data: Buffer.from(`wcjn|${gameId}`) })
+                    ] }),
+                    new Api.KeyboardButtonRow({ buttons: [
+                        new Api.KeyboardButtonUrl({ text: "🃏 Open Game", url: playUrl(gameId) })
+                    ] })
+                ] })
+            });
+        } catch (e) {}
+        await alert(client, update, "Joined!");
+        return;
+    }
+    await ack(client, update);
+};
+
+async function alert(client, update, text) {
+    try { await client.invoke(new Api.messages.SetBotCallbackAnswer({ queryId: update.queryId, message: text, alert: true, cacheTime: 1 })); } catch (e) {}
+}
+async function ack(client, update) {
+    try { await client.invoke(new Api.messages.SetBotCallbackAnswer({ queryId: update.queryId, cacheTime: 1 })); } catch (e) {}
+}
+
+module.exports = { startWebCards, handleWebCardsCallback };

webapp/cards.html

@@ -0,0 +1,225 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+<title>Card Game</title>
+<script src="https://telegram.org/js/telegram-web-app.js"></script>
+<style>
+*{margin:0;padding:0;box-sizing:border-box;}
+body{background:#0a1628;color:#fff;font-family:-apple-system,sans-serif;min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden;}
+#blocked{display:none;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;text-align:center;padding:40px;} #blocked a{color:#3b82f6;}
+#app{display:none;flex:1;flex-direction:column;}
+#hdr{padding:10px;text-align:center;font-size:13px;}
+#hdr b{color:#f59e0b;}
+/* Players bar */
+#players{display:flex;justify-content:center;gap:8px;padding:4px 10px;flex-wrap:wrap;}
+.pbadge{padding:3px 10px;border-radius:8px;font-size:11px;font-weight:600;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);}
+.pbadge.turn{border-color:#f59e0b;background:rgba(245,158,11,.1);}
+.pbadge.played{border-color:#22c55e;background:rgba(34,197,94,.1);}
+/* Table — center area */
+#table{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px;min-height:200px;position:relative;}
+#round-info{font-size:14px;font-weight:700;margin-bottom:12px;}
+#table-cards{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;min-height:100px;align-items:center;}
+.tcard{width:65px;height:95px;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700;position:relative;transition:transform .3s,box-shadow .3s;}
+.tcard.facedown{background:linear-gradient(135deg,#1e40af,#1e3a8a);border:2px solid #3b82f6;box-shadow:0 4px 12px rgba(59,130,246,.2);}
+.tcard.facedown::after{content:'🂠';font-size:32px;}
+.tcard.faceup{background:#fff;color:#1a1a1a;border:2px solid #ddd;box-shadow:0 4px 15px rgba(0,0,0,.3);animation:flipIn .4s ease;}
+.tcard.faceup .tsuit{font-size:24px;}
+.tcard.faceup .tlabel{font-size:18px;font-weight:800;}
+.tcard.faceup.red{color:#dc2626;}
+.tcard.faceup.winner{border-color:#f59e0b;box-shadow:0 0 20px rgba(245,158,11,.4);}
+.tcard-name{font-size:9px;color:#888;text-align:center;margin-top:2px;max-width:65px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
+@keyframes flipIn{0%{transform:rotateY(90deg) scale(.8);}100%{transform:rotateY(0) scale(1);}}
+/* Result banner */
+#result{display:none;text-align:center;padding:10px;font-size:14px;}
+#result b{color:#f59e0b;}
+/* My hand — bottom */
+#hand-area{padding:10px 8px 20px;background:linear-gradient(to top,rgba(0,0,0,.3),transparent);}
+#hand-label{text-align:center;font-size:11px;color:#666;margin-bottom:6px;}
+#hand{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;}
+.hcard{width:72px;height:105px;border-radius:10px;background:#fff;color:#1a1a1a;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s,box-shadow .2s,opacity .2s;border:2px solid #e5e7eb;position:relative;user-select:none;-webkit-user-select:none;}
+.hcard:active{transform:translateY(-8px) scale(1.05);}
+.hcard.red{color:#dc2626;}
+.hcard .hsuit{font-size:28px;}
+.hcard .hlabel{font-size:20px;font-weight:800;}
+.hcard.used{opacity:.25;cursor:default;transform:none !important;}
+.hcard.selected{transform:translateY(-12px);border-color:#f59e0b;box-shadow:0 8px 25px rgba(245,158,11,.3);}
+/* Buttons */
+#actions{display:flex;justify-content:center;gap:8px;padding:6px;}
+.abtn{padding:10px 24px;border:none;border-radius:10px;font-size:13px;font-weight:700;cursor:pointer;color:#fff;transition:.2s;}
+.abtn.green{background:#22c55e;} .abtn.blue{background:#3b82f6;}
+.abtn:disabled{opacity:.3;cursor:not-allowed;}
+/* Lobby */
+#lobby{display:none;flex:1;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;}
+#lobby h2{margin:10px 0 6px;}
+.lplayers{margin:16px 0;font-size:14px;line-height:1.8;}
+.lstbtn{padding:12px 36px;border:none;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;color:#fff;background:linear-gradient(135deg,#22c55e,#16a34a);margin:6px;}
+.lstbtn:disabled{opacity:.3;cursor:not-allowed;}
+</style>
+</head>
+<body>
+<div id="blocked"><div style="font-size:48px;margin-bottom:16px;">🔒</div><h2>Access Blocked</h2><p>Open from <a href="https://t.me/Alexagamebot">@Alexagamebot</a> via <b>/wcards</b></p></div>
+<div id="app" style="display:none;">
+<div id="hdr">🃏 <b>Card Game</b></div>
+<div id="players"></div>
+<div id="lobby"><div style="font-size:42px;">🃏</div><h2>Card Game</h2><div id="linfo"></div><div class="lplayers" id="lplayers"></div><button class="lstbtn" id="lstbtn" onclick="hostStart()" disabled>🚀 Start</button><div style="font-size:11px;color:#555;margin-top:8px;" id="lwait"></div></div>
+<div id="table"><div id="round-info"></div><div id="table-cards"></div></div>
+<div id="result"></div>
+<div id="actions"></div>
+<div id="hand-area"><div id="hand-label">Your Cards</div><div id="hand"></div></div>
+</div>
+<script>
+const tg=window.Telegram?.WebApp;if(tg){tg.expand();tg.ready();}
+if(!tg?.initData||!tg.initDataUnsafe?.user?.id){document.getElementById('blocked').style.display='flex';throw 0;}
+document.getElementById('app').style.display='flex';
+const API=location.origin;
+const sp=new URLSearchParams(location.search).get('tgWebAppStartParam')||tg.initDataUnsafe?.start_param||'';
+const GID=sp.replace('wcards_','').replace(/_0_/g,':');
+async function rpc(m,p,b){try{const o={method:m,headers:{'X-Init-Data':tg.initData,'Content-Type':'application/json'}};if(b)o.body=JSON.stringify(b);const r=await fetch(API+p,o);return JSON.parse(await r.text());}catch{return{ok:false,error:'Network error'};}}
+
+let S=null,selectedCard=null,pollId=null;
+
+function isRed(suit){return suit==='♥'||suit==='♦';}
+
+function renderLobby(){
+    document.getElementById('lobby').style.display='flex';
+    document.getElementById('table').style.display='none';
+    document.getElementById('hand-area').style.display='none';
+    document.getElementById('actions').innerHTML='';
+    document.getElementById('result').style.display='none';
+    let pl='';S.players.forEach((p,i)=>pl+=`<div>${p.isMe?'⭐':'👤'} ${p.name}${i===0?' (Host)':''} — ${p.score} pts</div>`);
+    document.getElementById('lplayers').innerHTML=pl;
+    document.getElementById('linfo').textContent=`$${S.players.length>0?S.players[0].score:0} bet • ${S.playerCount} players`;
+    const btn=document.getElementById('lstbtn');
+    if(S.isHost){btn.style.display='';btn.disabled=S.playerCount<2;btn.textContent=S.playerCount<2?'Need 2+ players':'🚀 Start Game';}
+    else{btn.style.display='';btn.disabled=true;btn.textContent='Waiting for host...';}
+    document.getElementById('lwait').textContent=S.isHost?'You are host':'Host will start the game';
+}
+
+function renderGame(){
+    document.getElementById('lobby').style.display='none';
+    document.getElementById('table').style.display='flex';
+    document.getElementById('hand-area').style.display='block';
+
+    // Players bar
+    let pb='';
+    S.players.forEach(p=>{
+        let cls='pbadge';
+        if(p.hasPlayed)cls+=' played';
+        pb+=`<span class="${cls}">${p.isMe?'⭐':''} ${p.name}: ${p.score}</span>`;
+    });
+    document.getElementById('players').innerHTML=pb;
+
+    // Round info
+    if(S.status==='playing')document.getElementById('round-info').textContent=`Round ${Math.min(S.round,S.totalRounds)} / ${S.totalRounds}`;
+    else if(S.status==='reveal')document.getElementById('round-info').textContent=`Round ${S.round-1} — Reveal!`;
+    else document.getElementById('round-info').textContent='';
+
+    // Table cards
+    let tc='';
+    S.players.forEach(p=>{
+        const play=S.tablePlays[Object.keys(S.tablePlays).find(k=>S.players.find(pp=>pp.name===p.name))]||null;
+        // Find play by checking if this player played
+        const uid=Object.keys(S.tablePlays).find(k=>{
+            // We don't have uids in tablePlays from client perspective, match by order
+            return false;
+        });
+    });
+    // Simpler: just show all table plays
+    if(Object.keys(S.tablePlays).length>0){
+        for(const [uid,play] of Object.entries(S.tablePlays)){
+            if(play.faceUp){
+                const r=isRed(play.suit)?'red':'';
+                const isWin=S.lastResult?.winnerNames?.some(n=>true)||false; // simplified
+                tc+=`<div><div class="tcard faceup ${r}"><span class="tsuit">${play.suit}</span><span class="tlabel">${play.label}</span></div></div>`;
+            } else {
+                tc+=`<div><div class="tcard facedown"></div></div>`;
+            }
+        }
+    } else {
+        tc='<div style="color:#444;font-size:13px;">Play a card from your hand</div>';
+    }
+    document.getElementById('table-cards').innerHTML=tc;
+
+    // Result
+    const res=document.getElementById('result');
+    if(S.status==='reveal'&&S.lastResult){
+        res.style.display='block';
+        const plays=Object.entries(S.lastResult.plays).map(([n,c])=>`${n}: ${c.suit}${c.label}`).join(' | ');
+        res.innerHTML=`<b>Round ${S.lastResult.round}:</b> ${plays}<br>🏆 <b>${S.lastResult.winnerNames.join(', ')}</b> wins!`;
+    } else if(S.status==='ended'&&S.winner){
+        res.style.display='block';
+        res.innerHTML=`🏆 <b>GAME OVER!</b><br>${S.winner.join(' & ')} wins!`;
+    } else { res.style.display='none'; }
+
+    // Actions
+    let acts='';
+    if(S.status==='playing'&&!S.iPlayed&&selectedCard!==null){
+        acts=`<button class="abtn green" onclick="playCard()">▶️ Play Card</button>`;
+    }
+    if(S.status==='reveal'){
+        acts=`<button class="abtn blue" onclick="nextRound()">Next Round →</button>`;
+    }
+    document.getElementById('actions').innerHTML=acts;
+
+    // Hand
+    let h='';
+    if(S.myHand){
+        S.myHand.forEach((c,i)=>{
+            const r=isRed(c.suit)?'red':'';
+            const used=c.played?'used':'';
+            const sel=selectedCard===i?'selected':'';
+            h+=`<div class="hcard ${r} ${used} ${sel}" onclick="selectCard(${i},${c.played})" data-i="${i}"><span class="hsuit">${c.suit}</span><span class="hlabel">${c.label}</span></div>`;
+        });
+    }
+    document.getElementById('hand').innerHTML=h;
+    document.getElementById('hand-label').textContent=S.iPlayed?'✅ Card played — waiting for others':'Tap a card to select, then Play';
+}
+
+function selectCard(i,used){
+    if(used||S.iPlayed||S.status!=='playing')return;
+    selectedCard=selectedCard===i?null:i;
+    renderGame();
+    if(tg.HapticFeedback)tg.HapticFeedback.selectionChanged();
+}
+
+async function playCard(){
+    if(selectedCard===null)return;
+    const r=await rpc('POST','/wcards/play',{gameId:GID,cardIndex:selectedCard});
+    if(r.ok){S=r.state;selectedCard=null;renderGame();if(tg.HapticFeedback)tg.HapticFeedback.notificationOccurred('success');}
+    else{alert(r.error);}
+}
+
+async function nextRound(){
+    const r=await rpc('POST','/wcards/next',{gameId:GID});
+    if(r.ok){S=r.state;selectedCard=null;renderGame();}
+}
+
+async function hostStart(){
+    document.getElementById('lstbtn').disabled=true;
+    const r=await rpc('POST','/wcards/start',{gameId:GID});
+    if(r.ok){S=r.state;render();}
+    else{document.getElementById('lwait').textContent=r.error;document.getElementById('lstbtn').disabled=false;}
+}
+
+function render(){
+    if(!S)return;
+    if(S.status==='lobby')renderLobby();
+    else renderGame();
+}
+
+async function poll(){
+    const r=await rpc('GET',`/wcards/state?gameId=${encodeURIComponent(GID)}`);
+    if(r.ok){S=r.state;render();if(S.status==='ended'){clearInterval(pollId);pollId=null;}}
+    else document.getElementById('hdr').innerHTML='🃏 '+r.error;
+}
+
+async function init(){
+    if(!GID||GID===sp){document.getElementById('hdr').innerHTML='🃏 No game. Use /wcards in group.';return;}
+    await poll();pollId=setInterval(poll,1000);
+}
+init();
+</script>
+</body>
+</html>

webapp/index.html

@@ -14,6 +14,9 @@
     // Fallback: check TG WebApp start_param
     if (!sp) try { sp = window.Telegram.WebApp.initDataUnsafe.start_param || ''; } catch(e){}
     // Route to game pages
+    if (sp.startsWith('wcards_')) {
+        window.location.replace('cards.html?tgWebAppStartParam=' + sp);
+    }
     if (sp.startsWith('carrom_')) {
         window.location.replace('carrom.html?tgWebAppStartParam=' + sp);
     }