Spaces:

Pnkj01
/

pig

Running

App Files Files Community

Pnkj01 commited on Apr 21, 2025

Commit

cbc430d

verified ·

1 Parent(s): 6664f49

Add 3 files

Browse files

Files changed (3) hide show

README.md +7 -5
index.html +677 -19
prompts.txt +1 -0

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Pig
-emoji: 🏃
-colorFrom: blue
-colorTo: red
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: pig
+emoji: 🐳
+colorFrom: yellow
+colorTo: purple
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html CHANGED Viewed

@@ -1,19 +1,677 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Free Fire Headshot Trainer</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        @keyframes targetPulse {
+            0% { transform: scale(1); opacity: 0.8; }
+            50% { transform: scale(1.1); opacity: 1; }
+            100% { transform: scale(1); opacity: 0.8; }
+        }
+        .target {
+            animation: targetPulse 2s infinite;
+            transition: all 0.3s ease;
+        }
+        .hit-effect {
+            position: absolute;
+            width: 100px;
+            height: 100px;
+            background: radial-gradient(circle, rgba(255,255,255,0.8) 0%, rgba(255,0,0,0) 70%);
+            border-radius: 50%;
+            pointer-events: none;
+            transform: translate(-50%, -50%);
+            opacity: 0;
+        }
+        .headshot {
+            background: radial-gradient(circle, rgba(255,215,0,0.7) 0%, rgba(255,215,0,0) 70%);
+        }
+        .body-shot {
+            background: radial-gradient(circle, rgba(255,0,0,0.7) 0%, rgba(255,0,0,0) 70%);
+        }
+        #game-area {
+            touch-action: manipulation;
+        }
+        .damage-indicator {
+            position: absolute;
+            color: white;
+            font-weight: bold;
+            text-shadow: 1px 1px 2px black;
+            pointer-events: none;
+            transform: translate(-50%, -50%);
+            animation: floatUp 1s forwards;
+        }
+        @keyframes floatUp {
+            0% { transform: translate(-50%, -50%); opacity: 1; }
+            100% { transform: translate(-50%, -150%); opacity: 0; }
+        }
+        .crosshair {
+            position: fixed;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            width: 30px;
+            height: 30px;
+            pointer-events: none;
+            z-index: 1000;
+        }
+    </style>
+</head>
+<body class="bg-gray-900 text-white overflow-hidden">
+    <div class="crosshair">
+        <div class="relative w-full h-full">
+            <div class="absolute top-0 left-1/2 w-0.5 h-3 bg-red-500 transform -translate-x-1/2"></div>
+            <div class="absolute bottom-0 left-1/2 w-0.5 h-3 bg-red-500 transform -translate-x-1/2"></div>
+            <div class="absolute left-0 top-1/2 w-3 h-0.5 bg-red-500 transform -translate-y-1/2"></div>
+            <div class="absolute right-0 top-1/2 w-3 h-0.5 bg-red-500 transform -translate-y-1/2"></div>
+            <div class="absolute top-1/2 left-1/2 w-1.5 h-1.5 bg-red-500 rounded-full transform -translate-x-1/2 -translate-y-1/2"></div>
+        </div>
+    </div>
+    <div class="container mx-auto px-4 py-6">
+        <div class="flex justify-between items-center mb-4">
+            <h1 class="text-2xl font-bold text-yellow-400">
+                <i class="fas fa-crosshairs mr-2"></i> Free Fire Headshot Trainer
+            </h1>
+            <div class="flex items-center space-x-4">
+                <div class="bg-gray-800 px-3 py-1 rounded-lg">
+                    <span class="text-yellow-400 font-bold" id="score">0</span>
+                    <span class="text-gray-400">/</span>
+                    <span class="text-gray-300" id="shots">0</span>
+                </div>
+                <div class="bg-gray-800 px-3 py-1 rounded-lg">
+                    <span class="text-green-400 font-bold" id="accuracy">0%</span>
+                </div>
+            </div>
+        </div>
+        <div class="flex mb-4 space-x-2">
+            <button id="start-btn" class="bg-green-600 hover:bg-green-700 px-4 py-2 rounded-lg font-bold">
+                <i class="fas fa-play mr-2"></i> Start
+            </button>
+            <button id="reset-btn" class="bg-blue-600 hover:bg-blue-700 px-4 py-2 rounded-lg font-bold">
+                <i class="fas fa-redo mr-2"></i> Reset
+            </button>
+            <button id="settings-btn" class="bg-gray-600 hover:bg-gray-700 px-4 py-2 rounded-lg font-bold">
+                <i class="fas fa-cog mr-2"></i> Settings
+            </button>
+        </div>
+        <div class="bg-gray-800 p-4 rounded-lg mb-4">
+            <h2 class="text-lg font-bold mb-2 text-yellow-400">
+                <i class="fas fa-info-circle mr-2"></i> Headshot Tips
+            </h2>
+            <ul class="list-disc pl-5 text-sm space-y-1">
+                <li>Aim slightly above the head to account for recoil</li>
+                <li>Use single shots or short bursts for better accuracy</li>
+                <li>Practice controlling weapon recoil patterns</li>
+                <li>Headshots deal 2.5x more damage than body shots</li>
+                <li>Move your crosshair in straight lines between targets</li>
+            </ul>
+        </div>
+        <div id="game-area" class="relative bg-gray-800 border-2 border-gray-700 rounded-lg overflow-hidden" style="height: 60vh;">
+            <div id="targets-container" class="relative w-full h-full"></div>
+            <div id="results" class="absolute inset-0 bg-black bg-opacity-80 flex flex-col items-center justify-center hidden">
+                <h2 class="text-3xl font-bold mb-4 text-yellow-400">Training Results</h2>
+                <div class="grid grid-cols-2 gap-4 mb-6">
+                    <div class="bg-gray-700 p-4 rounded-lg">
+                        <p class="text-gray-400">Total Shots</p>
+                        <p class="text-2xl font-bold" id="final-shots">0</p>
+                    </div>
+                    <div class="bg-gray-700 p-4 rounded-lg">
+                        <p class="text-gray-400">Headshots</p>
+                        <p class="text-2xl font-bold text-yellow-400" id="final-headshots">0</p>
+                    </div>
+                    <div class="bg-gray-700 p-4 rounded-lg">
+                        <p class="text-gray-400">Accuracy</p>
+                        <p class="text-2xl font-bold text-green-400" id="final-accuracy">0%</p>
+                    </div>
+                    <div class="bg-gray-700 p-4 rounded-lg">
+                        <p class="text-gray-400">Score</p>
+                        <p class="text-2xl font-bold" id="final-score">0</p>
+                    </div>
+                </div>
+                <button id="close-results" class="bg-blue-600 hover:bg-blue-700 px-6 py-3 rounded-lg font-bold text-lg">
+                    <i class="fas fa-redo mr-2"></i> Try Again
+                </button>
+            </div>
+        </div>
+        <div class="mt-4 bg-gray-800 p-4 rounded-lg">
+            <h2 class="text-lg font-bold mb-2 text-yellow-400">
+                <i class="fas fa-trophy mr-2"></i> Progress
+            </h2>
+            <div class="flex items-center space-x-2 mb-2">
+                <div class="w-full bg-gray-700 rounded-full h-4">
+                    <div id="progress-bar" class="bg-yellow-500 h-4 rounded-full" style="width: 0%"></div>
+                </div>
+                <span id="progress-text" class="text-sm font-bold">0%</span>
+            </div>
+            <p class="text-sm text-gray-400">Complete training sessions to improve your headshot ratio in Free Fire.</p>
+        </div>
+    </div>
+    <!-- Settings Modal -->
+    <div id="settings-modal" class="fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center hidden z-50">
+        <div class="bg-gray-800 rounded-lg p-6 w-full max-w-md">
+            <h2 class="text-2xl font-bold mb-4 text-yellow-400">
+                <i class="fas fa-cog mr-2"></i> Training Settings
+            </h2>
+            <div class="space-y-4">
+                <div>
+                    <label class="block text-gray-300 mb-2">Target Count</label>
+                    <input type="range" id="target-count" min="5" max="30" value="15" class="w-full">
+                    <div class="flex justify-between text-sm text-gray-400">
+                        <span>5</span>
+                        <span id="target-count-value">15</span>
+                        <span>30</span>
+                    </div>
+                </div>
+                <div>
+                    <label class="block text-gray-300 mb-2">Target Speed</label>
+                    <input type="range" id="target-speed" min="1" max="5" value="3" class="w-full">
+                    <div class="flex justify-between text-sm text-gray-400">
+                        <span>Slow</span>
+                        <span id="target-speed-value">Medium</span>
+                        <span>Fast</span>
+                    </div>
+                </div>
+                <div>
+                    <label class="block text-gray-300 mb-2">Target Size</label>
+                    <input type="range" id="target-size" min="1" max="3" value="2" class="w-full">
+                    <div class="flex justify-between text-sm text-gray-400">
+                        <span>Small</span>
+                        <span id="target-size-value">Medium</span>
+                        <span>Large</span>
+                    </div>
+                </div>
+                <div class="flex items-center">
+                    <input type="checkbox" id="headshot-only" class="mr-2">
+                    <label for="headshot-only" class="text-gray-300">Headshots Only Mode</label>
+                </div>
+                <div class="flex items-center">
+                    <input type="checkbox" id="moving-targets" class="mr-2" checked>
+                    <label for="moving-targets" class="text-gray-300">Moving Targets</label>
+                </div>
+            </div>
+            <div class="mt-6 flex justify-end space-x-3">
+                <button id="cancel-settings" class="bg-gray-600 hover:bg-gray-700 px-4 py-2 rounded-lg">
+                    Cancel
+                </button>
+                <button id="save-settings" class="bg-green-600 hover:bg-green-700 px-4 py-2 rounded-lg font-bold">
+                    Save Settings
+                </button>
+            </div>
+        </div>
+    </div>
+    <script>
+        // Game state
+        const state = {
+            score: 0,
+            shots: 0,
+            headshots: 0,
+            gameActive: false,
+            targets: [],
+            settings: {
+                targetCount: 15,
+                targetSpeed: 3,
+                targetSize: 2,
+                headshotOnly: false,
+                movingTargets: true
+            }
+        };
+        // DOM elements
+        const gameArea = document.getElementById('game-area');
+        const targetsContainer = document.getElementById('targets-container');
+        const startBtn = document.getElementById('start-btn');
+        const resetBtn = document.getElementById('reset-btn');
+        const settingsBtn = document.getElementById('settings-btn');
+        const scoreDisplay = document.getElementById('score');
+        const shotsDisplay = document.getElementById('shots');
+        const accuracyDisplay = document.getElementById('accuracy');
+        const progressBar = document.getElementById('progress-bar');
+        const progressText = document.getElementById('progress-text');
+        const resultsScreen = document.getElementById('results');
+        const finalShots = document.getElementById('final-shots');
+        const finalHeadshots = document.getElementById('final-headshots');
+        const finalAccuracy = document.getElementById('final-accuracy');
+        const finalScore = document.getElementById('final-score');
+        const closeResults = document.getElementById('close-results');
+        const settingsModal = document.getElementById('settings-modal');
+        const targetCountInput = document.getElementById('target-count');
+        const targetSpeedInput = document.getElementById('target-speed');
+        const targetSizeInput = document.getElementById('target-size');
+        const headshotOnlyInput = document.getElementById('headshot-only');
+        const movingTargetsInput = document.getElementById('moving-targets');
+        const targetCountValue = document.getElementById('target-count-value');
+        const targetSpeedValue = document.getElementById('target-speed-value');
+        const targetSizeValue = document.getElementById('target-size-value');
+        const saveSettingsBtn = document.getElementById('save-settings');
+        const cancelSettingsBtn = document.getElementById('cancel-settings');
+        // Initialize
+        function init() {
+            startBtn.addEventListener('click', startGame);
+            resetBtn.addEventListener('click', resetGame);
+            settingsBtn.addEventListener('click', showSettings);
+            closeResults.addEventListener('click', resetGame);
+            gameArea.addEventListener('click', handleShot);
+            // Settings controls
+            targetCountInput.addEventListener('input', updateSettingsDisplay);
+            targetSpeedInput.addEventListener('input', updateSettingsDisplay);
+            targetSizeInput.addEventListener('input', updateSettingsDisplay);
+            saveSettingsBtn.addEventListener('click', saveSettings);
+            cancelSettingsBtn.addEventListener('click', hideSettings);
+            updateSettingsDisplay();
+        }
+        // Update settings display
+        function updateSettingsDisplay() {
+            targetCountValue.textContent = targetCountInput.value;
+            const speedValue = parseInt(targetSpeedInput.value);
+            targetSpeedValue.textContent =
+                speedValue === 1 ? 'Slow' :
+                speedValue === 2 ? 'Medium Slow' :
+                speedValue === 3 ? 'Medium' :
+                speedValue === 4 ? 'Fast' : 'Very Fast';
+            const sizeValue = parseInt(targetSizeInput.value);
+            targetSizeValue.textContent =
+                sizeValue === 1 ? 'Small' :
+                sizeValue === 2 ? 'Medium' : 'Large';
+        }
+        // Show settings modal
+        function showSettings() {
+            targetCountInput.value = state.settings.targetCount;
+            targetSpeedInput.value = state.settings.targetSpeed;
+            targetSizeInput.value = state.settings.targetSize;
+            headshotOnlyInput.checked = state.settings.headshotOnly;
+            movingTargetsInput.checked = state.settings.movingTargets;
+            updateSettingsDisplay();
+            settingsModal.classList.remove('hidden');
+        }
+        // Hide settings modal
+        function hideSettings() {
+            settingsModal.classList.add('hidden');
+        }
+        // Save settings
+        function saveSettings() {
+            state.settings = {
+                targetCount: parseInt(targetCountInput.value),
+                targetSpeed: parseInt(targetSpeedInput.value),
+                targetSize: parseInt(targetSizeInput.value),
+                headshotOnly: headshotOnlyInput.checked,
+                movingTargets: movingTargetsInput.checked
+            };
+            hideSettings();
+        }
+        // Start game
+        function startGame() {
+            if (state.gameActive) return;
+            state.gameActive = true;
+            state.score = 0;
+            state.shots = 0;
+            state.headshots = 0;
+            updateUI();
+            createTargets();
+            startBtn.innerHTML = '<i class="fas fa-pause mr-2"></i> Pause';
+            startBtn.classList.remove('bg-green-600', 'hover:bg-green-700');
+            startBtn.classList.add('bg-yellow-600', 'hover:bg-yellow-700');
+            startBtn.removeEventListener('click', startGame);
+            startBtn.addEventListener('click', pauseGame);
+        }
+        // Pause game
+        function pauseGame() {
+            state.gameActive = false;
+            clearAllTargets();
+            startBtn.innerHTML = '<i class="fas fa-play mr-2"></i> Resume';
+            startBtn.classList.remove('bg-yellow-600', 'hover:bg-yellow-700');
+            startBtn.classList.add('bg-green-600', 'hover:bg-green-700');
+            startBtn.removeEventListener('click', pauseGame);
+            startBtn.addEventListener('click', startGame);
+        }
+        // Reset game
+        function resetGame() {
+            state.gameActive = false;
+            state.score = 0;
+            state.shots = 0;
+            state.headshots = 0;
+            clearAllTargets();
+            resultsScreen.classList.add('hidden');
+            updateUI();
+            startBtn.innerHTML = '<i class="fas fa-play mr-2"></i> Start';
+            startBtn.classList.remove('bg-yellow-600', 'hover:bg-yellow-700');
+            startBtn.classList.add('bg-green-600', 'hover:bg-green-700');
+            startBtn.removeEventListener('click', pauseGame);
+            startBtn.addEventListener('click', startGame);
+        }
+        // Create targets
+        function createTargets() {
+            if (!state.gameActive) return;
+            targetsContainer.innerHTML = '';
+            state.targets = [];
+            const targetCount = state.settings.targetCount;
+            const gameAreaRect = gameArea.getBoundingClientRect();
+            for (let i = 0; i < targetCount; i++) {
+                createTarget(gameAreaRect);
+            }
+        }
+        // Create a single target
+        function createTarget(gameAreaRect) {
+            const target = document.createElement('div');
+            target.className = 'target absolute cursor-pointer rounded-full bg-red-600 flex items-center justify-center';
+            // Set size based on settings
+            const size = state.settings.targetSize;
+            const targetSize = size === 1 ? 40 : size === 2 ? 60 : 80;
+            const headSize = size === 1 ? 12 : size === 2 ? 16 : 20;
+            target.style.width = `${targetSize}px`;
+            target.style.height = `${targetSize}px`;
+            // Create head (for headshot area)
+            const head = document.createElement('div');
+            head.className = 'absolute bg-blue-700 rounded-full';
+            head.style.width = `${headSize}px`;
+            head.style.height = `${headSize}px`;
+            head.style.top = '15%';
+            head.style.left = '50%';
+            head.style.transform = 'translateX(-50%)';
+            target.appendChild(head);
+            // Random position within game area (with padding)
+            const padding = 30;
+            const maxX = gameAreaRect.width - targetSize - padding;
+            const maxY = gameAreaRect.height - targetSize - padding;
+            let x = padding + Math.random() * maxX;
+            let y = padding + Math.random() * maxY;
+            target.style.left = `${x}px`;
+            target.style.top = `${y}px`;
+            // Add movement if enabled
+            if (state.settings.movingTargets) {
+                const speed = state.settings.targetSpeed * 0.5;
+                let xDirection = Math.random() > 0.5 ? 1 : -1;
+                let yDirection = Math.random() > 0.5 ? 1 : -1;
+                const moveTarget = () => {
+                    if (!state.gameActive) return;
+                    x += xDirection * speed;
+                    y += yDirection * speed;
+                    // Bounce off edges
+                    if (x <= padding || x >= maxX) {
+                        xDirection *= -1;
+                        x = Math.max(padding, Math.min(x, maxX));
+                    }
+                    if (y <= padding || y >= maxY) {
+                        yDirection *= -1;
+                        y = Math.max(padding, Math.min(y, maxY));
+                    }
+                    target.style.left = `${x}px`;
+                    target.style.top = `${y}px`;
+                    requestAnimationFrame(moveTarget);
+                };
+                moveTarget();
+            }
+            // Add click handler
+            target.addEventListener('click', (e) => {
+                if (!state.gameActive) return;
+                e.stopPropagation();
+                handleTargetClick(target, e);
+            });
+            targetsContainer.appendChild(target);
+            state.targets.push(target);
+        }
+        // Handle target click
+        function handleTargetClick(target, e) {
+            if (!state.gameActive) return;
+            const rect = target.getBoundingClientRect();
+            const head = target.querySelector('div');
+            const headRect = head.getBoundingClientRect();
+            // Calculate click position relative to target
+            const clickX = e.clientX - rect.left;
+            const clickY = e.clientY - rect.top;
+            // Check if headshot (click within head area)
+            const isHeadshot =
+                clickX >= headRect.left - rect.left &&
+                clickX <= headRect.right - rect.left &&
+                clickY >= headRect.top - rect.top &&
+                clickY <= headRect.bottom - rect.top;
+            if (state.settings.headshotOnly && !isHeadshot) {
+                showMissFeedback(e.clientX, e.clientY);
+                return;
+            }
+            // Remove target
+            target.remove();
+            state.targets = state.targets.filter(t => t !== target);
+            // Update stats
+            state.shots++;
+            if (isHeadshot) {
+                state.headshots++;
+                state.score += 100;
+            } else {
+                state.score += 40;
+            }
+            // Show hit effect
+            showHitFeedback(e.clientX, e.clientY, isHeadshot);
+            // Create new target if game is still active
+            if (state.gameActive) {
+                const gameAreaRect = gameArea.getBoundingClientRect();
+                createTarget(gameAreaRect);
+            }
+            // Check if training session is complete
+            if (state.shots >= state.settings.targetCount) {
+                endGame();
+            }
+            updateUI();
+        }
+        // Handle missed shot (clicked outside target)
+        function handleShot(e) {
+            if (!state.gameActive || e.target === targetsContainer) {
+                if (state.gameActive) {
+                    state.shots++;
+                    showMissFeedback(e.clientX, e.clientY);
+                    updateUI();
+                    // Check if training session is complete
+                    if (state.shots >= state.settings.targetCount) {
+                        endGame();
+                    }
+                }
+                return;
+            }
+        }
+        // Show hit feedback
+        function showHitFeedback(x, y, isHeadshot) {
+            const effect = document.createElement('div');
+            effect.className = `hit-effect ${isHeadshot ? 'headshot' : 'body-shot'}`;
+            effect.style.left = `${x}px`;
+            effect.style.top = `${y}px`;
+            // Damage indicator
+            const damage = document.createElement('div');
+            damage.className = 'damage-indicator';
+            damage.textContent = isHeadshot ? 'HEADSHOT! +100' : 'HIT! +40';
+            damage.style.left = `${x}px`;
+            damage.style.top = `${y}px`;
+            damage.style.color = isHeadshot ? 'gold' : 'red';
+            damage.style.fontSize = isHeadshot ? '18px' : '16px';
+            document.body.appendChild(effect);
+            document.body.appendChild(damage);
+            // Animate
+            effect.style.opacity = '1';
+            effect.style.transform = 'scale(1)';
+            setTimeout(() => {
+                effect.style.opacity = '0';
+                effect.style.transform = 'scale(1.5)';
+                setTimeout(() => {
+                    effect.remove();
+                    damage.remove();
+                }, 300);
+            }, 300);
+        }
+        // Show miss feedback
+        function showMissFeedback(x, y) {
+            const effect = document.createElement('div');
+            effect.className = 'hit-effect';
+            effect.style.left = `${x}px`;
+            effect.style.top = `${y}px`;
+            effect.style.background = 'radial-gradient(circle, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0) 70%)';
+            // Miss text
+            const missText = document.createElement('div');
+            missText.className = 'damage-indicator';
+            missText.textContent = 'MISS!';
+            missText.style.left = `${x}px`;
+            missText.style.top = `${y}px`;
+            missText.style.color = 'white';
+            document.body.appendChild(effect);
+            document.body.appendChild(missText);
+            // Animate
+            effect.style.opacity = '1';
+            effect.style.transform = 'scale(1)';
+            setTimeout(() => {
+                effect.style.opacity = '0';
+                effect.style.transform = 'scale(1.5)';
+                setTimeout(() => {
+                    effect.remove();
+                    missText.remove();
+                }, 300);
+            }, 300);
+        }
+        // Clear all targets
+        function clearAllTargets() {
+            targetsContainer.innerHTML = '';
+            state.targets = [];
+        }
+        // End game
+        function endGame() {
+            state.gameActive = false;
+            clearAllTargets();
+            // Show results
+            finalShots.textContent = state.shots;
+            finalHeadshots.textContent = state.headshots;
+            finalScore.textContent = state.score;
+            const accuracy = state.shots > 0 ? Math.round((state.headshots / state.shots) * 100) : 0;
+            finalAccuracy.textContent = `${accuracy}%`;
+            resultsScreen.classList.remove('hidden');
+            // Update progress
+            updateProgress(accuracy);
+        }
+        // Update progress
+        function updateProgress(accuracy) {
+            // Simple progress calculation based on accuracy
+            const progress = Math.min(100, Math.floor(accuracy * 1.2));
+            progressBar.style.width = `${progress}%`;
+            progressText.textContent = `${progress}%`;
+            // Change color based on progress
+            if (progress < 30) {
+                progressBar.className = 'bg-red-500 h-4 rounded-full';
+            } else if (progress < 70) {
+                progressBar.className = 'bg-yellow-500 h-4 rounded-full';
+            } else {
+                progressBar.className = 'bg-green-500 h-4 rounded-full';
+            }
+        }
+        // Update UI
+        function updateUI() {
+            scoreDisplay.textContent = state.score;
+            shotsDisplay.textContent = state.shots;
+            const accuracy = state.shots > 0 ? Math.round((state.headshots / state.shots) * 100) : 0;
+            accuracyDisplay.textContent = `${accuracy}%`;
+            // Update progress during game
+            if (state.gameActive) {
+                const progress = Math.floor((state.shots / state.settings.targetCount) * 100);
+                progressBar.style.width = `${progress}%`;
+                progressText.textContent = `${progress}%`;
+            }
+        }
+        // Initialize the game
+        init();
+    </script>
+<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Pnkj01/pig" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>

prompts.txt ADDED Viewed

	@@ -0,0 +1 @@


1	+ Make a headshot file which help gamer to hit only headshot in free fire for educational purposes but full functional and working later I will destroy after testing make for Android