Spaces:

A3qualityo
/

cosmic-energy

Running

App Files Files Community

A3qualityo commited on Jun 5, 2025

Commit

701313e

verified ·

1 Parent(s): b8afc35

Jo game tum bahut hi jyada achchhe se bana sakte ho vo banao - Initial Deployment

Browse files

Files changed (3) hide show

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

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Cosmic Energy
-emoji: 🏢
-colorFrom: indigo
-colorTo: green
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: cosmic-energy
+emoji: 🐳
+colorFrom: gray
+colorTo: yellow
 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,483 @@
-<!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>Cosmic Clicker Adventure</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <style>
+        @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
+        .game-font {
+            font-family: 'Press Start 2P', cursive;
+        }
+        .game-container {
+            perspective: 1000px;
+        }
+        .clickable-pet {
+            transform-style: preserve-3d;
+            transition: all 0.3s ease;
+        }
+        .clickable-pet:hover {
+            transform: rotateY(15deg) scale(1.05);
+        }
+        .clickable-pet:active {
+            transform: scale(0.95);
+        }
+        .particle {
+            position: absolute;
+            border-radius: 50%;
+            pointer-events: none;
+        }
+        .power-up {
+            animation: float 3s ease-in-out infinite;
+        }
+        .power-up:hover {
+            animation: bounce 0.5s ease infinite;
+        }
+        @keyframes float {
+            0% { transform: translateY(0px); }
+            50% { transform: translateY(-15px); }
+            100% { transform: translateY(0px); }
+        }
+        @keyframes bounce {
+            0%, 100% { transform: translateY(0) scale(1); }
+            50% { transform: translateY(-20px) scale(1.1); }
+        }
+        .progress-bar {
+            height: 20px;
+            border-radius: 10px;
+            transition: width 0.3s ease;
+        }
+        .tooltip {
+            visibility: hidden;
+            opacity: 0;
+            transition: opacity 0.3s;
+        }
+        .tooltip-trigger:hover + .tooltip {
+            visibility: visible;
+            opacity: 1;
+        }
+    </style>
+</head>
+<body class="bg-gray-900 text-white min-h-screen flex flex-col">
+    <div class="container mx-auto px-4 py-8 flex-grow">
+        <!-- Header -->
+        <header class="mb-8 text-center">
+            <h1 class="text-4xl md:text-6xl font-bold game-font text-transparent bg-clip-text bg-gradient-to-r from-purple-400 via-pink-500 to-yellow-400 mb-4">
+                COSMIC CLICKER
+            </h1>
+            <p class="game-font text-yellow-300 mb-4">Click to collect cosmic energy and upgrade your astral companion!</p>
+        </header>
+        <!-- Main Game Area -->
+        <div class="game-container flex flex-col md:flex-row items-center justify-between gap-8">
+            <!-- Stats Panel -->
+            <div class="w-full md:w-1/4 bg-gray-800 rounded-lg p-4 shadow-xl border-2 border-purple-700">
+                <div class="mb-6">
+                    <h2 class="game-font text-xl text-purple-300 mb-2">COSMIC ENERGY</h2>
+                    <div class="text-3xl game-font text-yellow-300 flex items-center">
+                        <span id="score">0</span>
+                        <span class="text-sm ml-2 text-gray-400">CE</span>
+                    </div>
+                </div>
+                <div class="mb-6">
+                    <h2 class="game-font text-xl text-purple-300 mb-2">ENERGY PER CLICK</h2>
+                    <div class="text-2xl game-font text-green-300">
+                        <span id="click-power">1</span> <span class="text-sm text-gray-400">CE/click</span>
+                    </div>
+                </div>
+                <div class="mb-6">
+                    <h2 class="game-font text-xl text-purple-300 mb-2">AUTO COLLECTORS</h2>
+                    <div class="text-2xl game-font text-blue-300">
+                        <span id="auto-clickers">0</span> <span class="text-sm text-gray-400">(</span><span id="auto-power">0</span><span class="text-sm text-gray-400"> CE/s)</span>
+                    </div>
+                </div>
+                <div class="relative tooltip-trigger mb-2">
+                    <div class="progress-bar bg-gradient-to-r from-purple-600 to-pink-500" id="experience-bar" style="width: 0%"></div>
+                    <span class="text-xs game-font mt-1 block">LEVEL <span id="level">1</span></span>
+                    <div class="tooltip absolute bottom-full left-0 mb-2 p-2 bg-gray-900 border border-purple-500 rounded-md text-xs">
+                        Next level in: <span id="next-level">100</span> CE
+                    </div>
+                </div>
+            </div>
+            <!-- Clickable Pet -->
+            <div class="relative w-full md:w-2/4 flex flex-col items-center">
+                <div id="pet-area" class="relative w-64 h-64 md:w-80 md:h-80 flex items-center justify-center cursor-pointer">
+                    <div id="clickable-pet" class="clickable-pet w-full h-full flex items-center justify-center">
+                        <div class="w-3/4 h-3/4 rounded-full bg-gradient-to-br from-purple-500 to-blue-600 shadow-xl flex items-center justify-center relative overflow-hidden">
+                            <div class="absolute w-full h-full bg-white opacity-20 rounded-full" style="filter: blur(20px);"></div>
+                            <div class="w-1/3 h-1/3 rounded-full bg-white opacity-30 animate-pulse"></div>
+                            <div class="absolute top-1/4 left-1/4 w-4 h-4 rounded-full bg-white"></div>
+                            <div class="absolute top-1/4 right-1/4 w-4 h-4 rounded-full bg-white"></div>
+                            <div class="absolute bottom-1/3 left-1/2 w-1/2 h-6 rounded-full bg-pink-400 opacity-70" style="transform: translateX(-50%);"></div>
+                        </div>
+                    </div>
+                </div>
+                <button id="special-attack" class="game-font mt-4 px-6 py-2 bg-gradient-to-r from-pink-600 to-purple-600 rounded-full text-white shadow-lg hover:shadow-xl transform hover:scale-105 transition-all disabled:opacity-50 disabled:cursor-not-allowed">
+                    ASTAL BURST (Ready!)
+                </button>
+            </div>
+            <!-- Upgrades Panel -->
+            <div class="w-full md:w-1/4 bg-gray-800 rounded-lg p-4 shadow-xl border-2 border-blue-700">
+                <h2 class="game-font text-xl text-blue-300 mb-4">UPGRADES</h2>
+                <div class="space-y-4">
+                    <button id="upgrade-click" class="w-full game-font text-left px-4 py-2 bg-gradient-to-r from-purple-700 to-purple-900 rounded-lg flex justify-between items-center hover:scale-[1.02] transition-transform">
+                        <span>Enhanced Clicks</span>
+                        <span class="text-yellow-300" id="click-cost">50 CE</span>
+                    </button>
+                    <button id="buy-auto-clicker" class="w-full game-font text-left px-4 py-2 bg-gradient-to-r from-blue-700 to-blue-900 rounded-lg flex justify-between items-center hover:scale-[1.02] transition-transform">
+                        <span>Cosmic Collector</span>
+                        <span class="text-yellow-300" id="auto-clicker-cost">100 CE</span>
+                    </button>
+                    <button id="upgrade-auto" class="w-full game-font text-left px-4 py-2 bg-gradient-to-r from-green-700 to-green-900 rounded-lg flex justify-between items-center hover:scale-[1.02] transition-transform">
+                        <span>Collector Efficiency</span>
+                        <span class="text-yellow-300" id="auto-upgrade-cost">200 CE</span>
+                    </button>
+                </div>
+                <h2 class="game-font text-xl text-pink-300 mt-6 mb-4">POWER-UPS</h2>
+                <div class="grid grid-cols-2 gap-2">
+                    <button class="power-up game-font text-xs px-2 py-1 bg-gradient-to-b from-yellow-500 to-yellow-700 rounded-lg flex flex-col items-center justify-center">
+                        <span>2x Clicks</span>
+                        <span>30s</span>
+                        <span>500 CE</span>
+                    </button>
+                    <button class="power-up game-font text-xs px-2 py-1 bg-gradient-to-b from-red-500 to-red-700 rounded-lg flex flex-col items-center justify-center">
+                        <span>3x Auto</span>
+                        <span>45s</span>
+                        <span>750 CE</span>
+                    </button>
+                    <button class="power-up game-font text-xs px-2 py-1 bg-gradient-to-b from-purple-500 to-purple-700 rounded-lg flex flex-col items-center justify-center">
+                        <span>CE Rain</span>
+                        <span>60s</span>
+                        <span>1000 CE</span>
+                    </button>
+                    <button class="power-up game-font text-xs px-2 py-1 bg-gradient-to-b from-blue-500 to-blue-700 rounded-lg flex flex-col items-center justify-center">
+                        <span>Time Warp</span>
+                        <span>90s</span>
+                        <span>1500 CE</span>
+                    </button>
+                </div>
+            </div>
+        </div>
+        <!-- Achievements -->
+        <div class="mt-12 bg-gray-800 rounded-lg p-4 border-2 border-yellow-700">
+            <h2 class="game-font text-xl text-yellow-300 mb-4">ACHIEVEMENTS</h2>
+            <div class="grid grid-cols-2 md:grid-cols-4 gap-4">
+                <div class="bg-gray-700 rounded p-2 border border-gray-600 flex items-center opacity-50">
+                    <div class="w-8 h-8 rounded-full bg-yellow-500 flex items-center justify-center mr-2">
+                        <span class="game-font text-xs">1</span>
+                    </div>
+                    <span class="game-font text-xs">First Click</span>
+                </div>
+                <div class="bg-gray-700 rounded p-2 border border-gray-600 flex items-center opacity-50">
+                    <div class="w-8 h-8 rounded-full bg-yellow-500 flex items-center justify-center mr-2">
+                        <span class="game-font text-xs">2</span>
+                    </div>
+                    <span class="game-font text-xs">100 Cosmic Energy</span>
+                </div>
+                <div class="bg-gray-700 rounded p-2 border border-gray-600 flex items-center opacity-50">
+                    <div class="w-8 h-8 rounded-full bg-yellow-500 flex items-center justify-center mr-2">
+                        <span class="game-font text-xs">3</span>
+                    </div>
+                    <span class="game-font text-xs">5 Collectors</span>
+                </div>
+                <div class="bg-gray-700 rounded p-2 border border-gray-600 flex items-center opacity-50">
+                    <div class="w-8 h-8 rounded-full bg-yellow-500 flex items-center justify-center mr-2">
+                        <span class="game-font text-xs">4</span>
+                    </div>
+                    <span class="game-font text-xs">Astral Master</span>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- Footer -->
+    <footer class="game-font text-xs text-center py-4 bg-gray-800 border-t border-purple-900">
+        Made with <span class="text-pink-500">♥</span> in the cosmos | Save your progress by refreshing the page
+    </footer>
+    <script>
+        // Game state
+        const game = {
+            score: 0,
+            clickPower: 1,
+            autoClickers: 0,
+            autoPower: 0,
+            autoClickerBaseCost: 100,
+            clickUpgradeCost: 50,
+            autoUpgradeCost: 200,
+            level: 1,
+            experience: 0,
+            nextLevel: 100,
+            specialAttackReady: true,
+            powerUps: {
+                clickMultiplier: 1,
+                autoMultiplier: 1,
+                duration: 0
+            }
+        };
+        // DOM elements
+        const elements = {
+            score: document.getElementById('score'),
+            clickPower: document.getElementById('click-power'),
+            autoClickers: document.getElementById('auto-clickers'),
+            autoPower: document.getElementById('auto-power'),
+            clickablePet: document.getElementById('clickable-pet'),
+            petArea: document.getElementById('pet-area'),
+            upgradeClick: document.getElementById('upgrade-click'),
+            clickCost: document.getElementById('click-cost'),
+            buyAutoClicker: document.getElementById('buy-auto-clicker'),
+            autoClickerCost: document.getElementById('auto-clicker-cost'),
+            upgradeAuto: document.getElementById('upgrade-auto'),
+            autoUpgradeCost: document.getElementById('auto-upgrade-cost'),
+            specialAttack: document.getElementById('special-attack'),
+            level: document.getElementById('level'),
+            experienceBar: document.getElementById('experience-bar'),
+            nextLevel: document.getElementById('next-level')
+        };
+        // Load game from localStorage
+        function loadGame() {
+            const savedGame = localStorage.getItem('cosmicClickerSave');
+            if (savedGame) {
+                const parsed = JSON.parse(savedGame);
+                Object.assign(game, parsed);
+                updateUI();
+            }
+        }
+        // Save game to localStorage
+        function saveGame() {
+            localStorage.setItem('cosmicClickerSave', JSON.stringify(game));
+        }
+        // Update all UI elements
+        function updateUI() {
+            elements.score.textContent = Math.floor(game.score);
+            elements.clickPower.textContent = game.clickPower * game.powerUps.clickMultiplier;
+            elements.autoClickers.textContent = game.autoClickers;
+            elements.autoPower.textContent = (game.autoPower * game.powerUps.autoMultiplier).toFixed(1);
+            elements.clickCost.textContent = `${Math.floor(game.clickUpgradeCost)} CE`;
+            elements.autoClickerCost.textContent = `${Math.floor(game.autoClickerBaseCost * Math.pow(1.15, game.autoClickers))} CE`;
+            elements.autoUpgradeCost.textContent = `${Math.floor(game.autoUpgradeCost)} CE`;
+            elements.level.textContent = game.level;
+            const expPercentage = (game.experience / game.nextLevel) * 100;
+            elements.experienceBar.style.width = `${expPercentage}%`;
+            elements.nextLevel.textContent = Math.ceil(game.nextLevel - game.experience);
+            // Disable buttons if player can't afford them
+            elements.upgradeClick.disabled = game.score < game.clickUpgradeCost;
+            elements.buyAutoClicker.disabled = game.score < (game.autoClickerBaseCost * Math.pow(1.15, game.autoClickers));
+            elements.upgradeAuto.disabled = game.score < game.autoUpgradeCost;
+        }
+        // Add cosmic energy
+        function addScore(amount) {
+            game.score += amount;
+            game.experience += amount;
+            // Check for level up
+            if (game.experience >= game.nextLevel) {
+                game.level++;
+                game.experience -= game.nextLevel;
+                game.nextLevel = Math.floor(game.nextLevel * 1.5);
+                // Level up effect
+                createParticles(elements.petArea, 30, 'text-yellow-300', '★');
+                elements.level.classList.add('animate-ping');
+                setTimeout(() => {
+                    elements.level.classList.remove('animate-ping');
+                }, 1000);
+            }
+            updateUI();
+            saveGame();
+        }
+        // Create visual particles
+        function createParticles(parent, count, color, content) {
+            for (let i = 0; i < count; i++) {
+                const particle = document.createElement('div');
+                particle.className = `particle ${color} game-font text-sm`;
+                particle.textContent = content;
+                // Random position
+                const rect = parent.getBoundingClientRect();
+                const x = Math.random() * rect.width;
+                const y = Math.random() * rect.height;
+                particle.style.left = `${x}px`;
+                particle.style.top = `${y}px`;
+                // Random animation
+                const angle = Math.random() * Math.PI * 2;
+                const distance = 50 + Math.random() * 50;
+                const duration = 1 + Math.random() * 2;
+                particle.style.opacity = '1';
+                particle.style.transform = `scale(${0.5 + Math.random()})`;
+                parent.appendChild(particle);
+                // Animate
+                setTimeout(() => {
+                    particle.style.transition = `all ${duration}s ease-out`;
+                    particle.style.transform = `translate(${Math.cos(angle) * distance}px, ${Math.sin(angle) * distance}px) scale(0.1)`;
+                    particle.style.opacity = '0';
+                }, 10);
+                // Remove after animation
+                setTimeout(() => {
+                    parent.removeChild(particle);
+                }, duration * 1000);
+            }
+        }
+        // Special attack
+        function specialAttack() {
+            if (!game.specialAttackReady) return;
+            game.specialAttackReady = false;
+            elements.specialAttack.disabled = true;
+            elements.specialAttack.textContent = 'Recharging...';
+            // Big click effect
+            const power = game.clickPower * 20 * game.powerUps.clickMultiplier;
+            addScore(power);
+            // Visual effect
+            elements.clickablePet.style.transform = 'scale(0.8)';
+            setTimeout(() => {
+                elements.clickablePet.style.transform = 'scale(1)';
+            }, 200);
+            createParticles(elements.petArea, 50, 'text-purple-300', '+');
+            // Recharge after 30 seconds
+            setTimeout(() => {
+                game.specialAttackReady = true;
+                elements.specialAttack.disabled = false;
+                elements.specialAttack.textContent = 'ASTAL BURST (Ready!)';
+            }, 30000);
+        }
+        // Auto clicker logic
+        function autoClickerTick() {
+            if (game.autoClickers > 0) {
+                const earned = game.autoPower * game.powerUps.autoMultiplier / 10;
+                addScore(earned);
+            }
+        }
+        // Initialize game
+        function init() {
+            loadGame();
+            // Set up click handler
+            elements.clickablePet.addEventListener('click', () => {
+                const power = game.clickPower * game.powerUps.clickMultiplier;
+                addScore(power);
+                // Visual feedback
+                elements.clickablePet.style.transform = 'scale(0.95)';
+                setTimeout(() => {
+                    elements.clickablePet.style.transform = 'scale(1)';
+                }, 200);
+                createParticles(elements.petArea, 5, 'text-white', '+');
+            });
+            // Set up upgrade buttons
+            elements.upgradeClick.addEventListener('click', () => {
+                if (game.score >= game.clickUpgradeCost) {
+                    game.score -= game.clickUpgradeCost;
+                    game.clickPower += 1;
+                    game.clickUpgradeCost = Math.floor(game.clickUpgradeCost * 1.5);
+                    // Visual effect
+                    createParticles(elements.upgradeClick, 10, 'text-purple-300', '↑');
+                    updateUI();
+                    saveGame();
+                }
+            });
+            elements.buyAutoClicker.addEventListener('click', () => {
+                const cost = game.autoClickerBaseCost * Math.pow(1.15, game.autoClickers);
+                if (game.score >= cost) {
+                    game.score -= cost;
+                    game.autoClickers += 1;
+                    game.autoPower += 0.5;
+                    // Visual effect
+                    createParticles(elements.buyAutoClicker, 10, 'text-blue-300', '↑');
+                    updateUI();
+                    saveGame();
+                }
+            });
+            elements.upgradeAuto.addEventListener('click', () => {
+                if (game.score >= game.autoUpgradeCost) {
+                    game.score -= game.autoUpgradeCost;
+                    game.autoPower += 0.2;
+                    game.autoUpgradeCost = Math.floor(game.autoUpgradeCost * 1.4);
+                    // Visual effect
+                    createParticles(elements.upgradeAuto, 10, 'text-green-300', '↑');
+                    updateUI();
+                    saveGame();
+                }
+            });
+            // Special attack
+            elements.specialAttack.addEventListener('click', specialAttack);
+            // Set up auto clicker interval
+            setInterval(autoClickerTick, 100);
+            // Periodic save
+            setInterval(saveGame, 10000);
+            // Initial UI update
+            updateUI();
+            // Unlock first achievement
+            setTimeout(() => {
+                document.querySelector('.game-container').classList.add('animate-pulse');
+                setTimeout(() => {
+                    document.querySelector('.game-container').classList.remove('animate-pulse');
+                }, 1000);
+            }, 1000);
+        }
+        // Start 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=A3qualityo/cosmic-energy" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>

prompts.txt ADDED Viewed

	@@ -0,0 +1 @@


1	+ Jo game tum bahut hi jyada achchhe se bana sakte ho vo banao