Spaces:

OrbitMC
/

yt

Build error

App Files Files Community

OrbitMC commited on 6 days ago

Commit

0260e41

verified ·

1 Parent(s): a34d80f

Update Dockerfile

Browse files

Files changed (1) hide show

Dockerfile +172 -21

Dockerfile CHANGED Viewed

@@ -1,29 +1,180 @@
-# Use a slim Python image for efficiency
-FROM python:3.11-slim
-# Set the working directory
 WORKDIR /app
-# Install system dependencies if needed (none strictly required for aiohttp, but good practice)
-RUN apt-get update && apt-get install -y \
-    build-essential \
-    && rm -rf /var/lib/apt/lists/*
-# Copy requirements and install
-COPY requirements.txt .
-RUN pip install --no-cache-dir -r requirements.txt
-# Copy the rest of the application
-COPY . .
-# Hugging Face Spaces run on port 7860 by default
-ENV SERVER_PORT=7860
-# You should set these in the Hugging Face Space Settings (Secrets),
-# but we set defaults here to prevent the app from crashing.
-ENV ADMIN_PATH=/admin-panel
-# Expose the port
-EXPOSE 7860
-# Run the application
-CMD ["python", "main.py"]

+FROM node:20-alpine
 WORKDIR /app
+# Install WebSocket dependency
+RUN npm install ws
+# Write the entire server and client into a single file inside the container
+COPY <<EOF server.js
+const http = require('http');
+const crypto = require('crypto');
+const WebSocket = require('ws');
+const PORT = 7860;
+const players = {};
+// --- HTTP SERVER (Cookie Handling & HTML Delivery) ---
+const server = http.createServer((req, res) => {
+    const cookieHeader = req.headers.cookie || '';
+    let playerId = cookieHeader.split('; ').find(row => row.startsWith('playerId='))?.split('=')[1];
+    let cookieSetHeader = [];
+    if (!playerId) {
+        playerId = crypto.randomUUID();
+        cookieSetHeader.push(\`playerId=\${playerId}; Max-Age=31536000; Path=/; SameSite=Strict\`);
+    }
+    if (!players[playerId]) {
+        players[playerId] = {
+            id: playerId,
+            x: Math.random() * 300 + 50,
+            y: Math.random() * 300 + 50,
+            color: \`#\${Math.floor(crypto.randomInt(16777215)).toString(16).padStart(6, '0')}\`
+        };
+    }
+    res.writeHead(200, { 'Content-Type': 'text/html', 'Set-Cookie': cookieSetHeader });
+    res.end(\`
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+    <title>HF Multiplayer Game</title>
+    <style>
+        * { box-sizing: border-box; margin: 0; padding: 0; user-select: none; }
+        body, html { width: 100%; height: 100%; overflow: hidden; background: #111; font-family: sans-serif; }
+        canvas { display: block; width: 100vw; height: 100vh; background: #1a1a1a; }
+        #ui { position: absolute; top: 10px; left: 10px; color: #fff; pointer-events: none; font-size: 14px; background: rgba(0,0,0,0.5); padding: 8px; border-radius: 4px; }
+    </style>
+</head>
+<body>
+    <div id="ui">Status: Connecting...</div>
+    <canvas id="gameCanvas"></canvas>
+    <script>
+        const canvas = document.getElementById('gameCanvas');
+        const ctx = canvas.getContext('2d');
+        const ui = document.getElementById('ui');
+        let myId = "\${playerId}";
+        let players = {};
+        let ws;
+        function resize() { canvas.width = window.innerWidth; canvas.height = window.innerHeight; }
+        window.addEventListener('resize', resize); resize();
+        const wsProtocol = window.location.protocol === 'https:' ? 'wss://' : 'ws://';
+        ws = new WebSocket(wsProtocol + window.location.host);
+        ws.onopen = () => ui.innerText = "Connected! Drag screen to move.";
+        ws.onclose = () => ui.innerText = "Disconnected! Reconnecting...";
+        ws.onmessage = (event) => {
+            const msg = JSON.parse(event.data);
+            if (msg.type === 'INIT') {
+                players = msg.players;
+                for (let id in players) {
+                    players[id].targetX = players[id].x;
+                    players[id].targetY = players[id].y;
+                }
+            } else if (msg.type === 'UPDATE') {
+                if (!players[msg.id]) players[msg.id] = msg.data;
+                players[msg.id].targetX = msg.data.x;
+                players[msg.id].targetY = msg.data.y;
+                if (msg.data.color) players[msg.id].color = msg.data.color;
+            } else if (msg.type === 'LEAVE') {
+                if (players[msg.id]) delete players[msg.id];
+            }
+        };
+        let lastSendTime = 0;
+        function sendPosition(x, y) {
+            const now = performance.now();
+            if (now - lastSendTime > 40 && ws.readyState === WebSocket.OPEN) {
+                ws.send(JSON.stringify({ type: 'MOVE', x, y }));
+                lastSendTime = now;
+            }
+        }
+        canvas.addEventListener('touchmove', (e) => {
+            e.preventDefault();
+            if (!players[myId]) return;
+            const touch = e.touches[0];
+            players[myId].x = touch.clientX - 20;
+            players[myId].y = touch.clientY - 20;
+            sendPosition(players[myId].x, players[myId].y);
+        }, { passive: false });
+        canvas.addEventListener('mousemove', (e) => {
+            if (!players[myId]) return;
+            players[myId].x = e.clientX - 20;
+            players[myId].y = e.clientY - 20;
+            sendPosition(players[myId].x, players[myId].y);
+        });
+        function draw() {
+            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            for (let id in players) {
+                const p = players[id];
+                if (id !== myId) {
+                    // LERP: Smooth out 400ms lag spikes by sliding 12% of the way each frame
+                    p.x += (p.targetX - p.x) * 0.12;
+                    p.y += (p.targetY - p.y) * 0.12;
+                }
+                ctx.fillStyle = p.color || '#ffffff';
+                ctx.fillRect(p.x, p.y, 40, 40);
+                ctx.fillStyle = '#fff';
+                ctx.font = '12px sans-serif';
+                ctx.fillText(id === myId ? "You" : "Player", p.x, p.y - 6);
+            }
+            requestAnimationFrame(draw);
+        }
+        draw();
+    </script>
+</body>
+</html>
+\`);
+});
+// --- WEBSOCKET SERVER (Movement Broadcasting) ---
+const wss = new WebSocket.Server({ noServer: true });
+server.on('upgrade', (req, socket, head) => {
+    wss.handleUpgrade(req, socket, head, (ws) => { wss.emit('connection', ws, req); });
+});
+wss.on('connection', (ws, req) => {
+    const cookieHeader = req.headers.cookie || '';
+    const playerId = cookieHeader.split('; ').find(row => row.startsWith('playerId='))?.split('=')[1];
+    if (!playerId || !players[playerId]) { ws.close(); return; }
+    ws.playerId = playerId;
+    ws.send(JSON.stringify({ type: 'INIT', selfId: playerId, players }));
+    broadcast({ type: 'UPDATE', id: playerId, data: players[playerId] });
+    ws.on('message', (message) => {
+        try {
+            const msg = JSON.parse(message);
+            if (msg.type === 'MOVE' && players[ws.playerId]) {
+                players[ws.playerId].x = msg.x;
+                players[ws.playerId].y = msg.y;
+                broadcast({ type: 'UPDATE', id: ws.playerId, data: { x: msg.x, y: msg.y } }, ws.playerId);
+            }
+        } catch (e) {}
+    });
+    ws.on('close', () => { broadcast({ type: 'LEAVE', id: ws.playerId }); });
+});
+function broadcast(data, excludeId = null) {
+    const packet = JSON.stringify(data);
+    wss.clients.forEach(client => {
+        if (client.readyState === WebSocket.OPEN && client.playerId !== excludeId) {
+            client.send(packet);
+        }
+    });
+}
+server.listen(PORT);
+EOF
+EXPOSE 7860
+CMD ["node", "server.js"]