Spaces:

docto41
/

globe-future

Running

App Files Files Community

docto41 commited on May 23

Commit

203e1a2

verified ·

1 Parent(s): 53c2cb2

Add 3 files

Browse files

Files changed (3) hide show

README.md +6 -4
index.html +228 -19
prompts.txt +4 -0

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Globe Future
-emoji: 🏆
-colorFrom: gray
 colorTo: pink
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: globe-future
+emoji: 🐳
+colorFrom: blue
 colorTo: pink
 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,228 @@
-<!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="fr">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Globe Futuriste de Particules</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
+    <style>
+        body {
+            margin: 0;
+            overflow: hidden;
+            background-color: #000;
+        }
+        canvas {
+            display: block;
+        }
+        #info {
+            position: absolute;
+            top: 20px;
+            width: 100%;
+            text-align: center;
+            color: white;
+            font-family: Arial, sans-serif;
+            pointer-events: none;
+            text-shadow: 0 0 5px #0ff;
+            font-size: 1.5rem;
+        }
+        .controls {
+            position: absolute;
+            bottom: 20px;
+            left: 50%;
+            transform: translateX(-50%);
+            display: flex;
+            gap: 10px;
+        }
+        button {
+            background: rgba(0, 255, 255, 0.2);
+            color: white;
+            border: 1px solid #0ff;
+            padding: 8px 16px;
+            border-radius: 20px;
+            cursor: pointer;
+            transition: all 0.3s;
+            backdrop-filter: blur(5px);
+        }
+        button:hover {
+            background: rgba(0, 255, 255, 0.4);
+            box-shadow: 0 0 10px #0ff;
+        }
+    </style>
+</head>
+<body>
+    <div id="info">GLOBE FUTURISTE DE PARTICULES</div>
+    <div class="controls">
+        <button id="speedUp">Accélérer</button>
+        <button id="slowDown">Ralentir</button>
+        <button id="changeColor">Changer Couleurs</button>
+    </div>
+    <script>
+        // Initialisation de la scène Three.js
+        const scene = new THREE.Scene();
+        const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
+        const renderer = new THREE.WebGLRenderer({ antialias: true });
+        renderer.setSize(window.innerWidth, window.innerHeight);
+        renderer.setPixelRatio(window.devicePixelRatio);
+        document.body.appendChild(renderer.domElement);
+        // Configuration de la caméra
+        camera.position.z = 30;
+        // Paramètres du globe
+        const globeRadius = 15;
+        const particleCount = 5000;
+        const starCount = 2000;
+        let rotationSpeed = 0.002;
+        let colorPalette = [
+            0x00ffff, 0xff00ff, 0xffff00, 0x00ff00, 0xff0000, 0x0000ff
+        ];
+        // Création des particules pour le globe
+        const particlesGeometry = new THREE.BufferGeometry();
+        const particlesMaterial = new THREE.PointsMaterial({
+            size: 0.1,
+            vertexColors: true,
+            transparent: true,
+            opacity: 0.8,
+            blending: THREE.AdditiveBlending
+        });
+        const particlesPositions = new Float32Array(particleCount * 3);
+        const particlesColors = new Float32Array(particleCount * 3);
+        // Remplir les positions et couleurs des particules
+        for (let i = 0; i < particleCount; i++) {
+            // Position sphérique aléatoire
+            const radius = globeRadius * (0.95 + Math.random() * 0.1);
+            const theta = Math.random() * Math.PI * 2;
+            const phi = Math.acos(2 * Math.random() - 1);
+            const x = radius * Math.sin(phi) * Math.cos(theta);
+            const y = radius * Math.sin(phi) * Math.sin(theta);
+            const z = radius * Math.cos(phi);
+            particlesPositions[i * 3] = x;
+            particlesPositions[i * 3 + 1] = y;
+            particlesPositions[i * 3 + 2] = z;
+            // Couleur aléatoire dans la palette
+            const color = new THREE.Color(colorPalette[Math.floor(Math.random() * colorPalette.length)]);
+            particlesColors[i * 3] = color.r;
+            particlesColors[i * 3 + 1] = color.g;
+            particlesColors[i * 3 + 2] = color.b;
+        }
+        particlesGeometry.setAttribute('position', new THREE.BufferAttribute(particlesPositions, 3));
+        particlesGeometry.setAttribute('color', new THREE.BufferAttribute(particlesColors, 3));
+        const particles = new THREE.Points(particlesGeometry, particlesMaterial);
+        scene.add(particles);
+        // Création des étoiles clignotantes
+        const starsGeometry = new THREE.BufferGeometry();
+        const starsMaterial = new THREE.PointsMaterial({
+            size: 0.2,
+            color: 0xffffff,
+            transparent: true,
+            opacity: 0,
+            blending: THREE.AdditiveBlending
+        });
+        const starsPositions = new Float32Array(starCount * 3);
+        const starsOpacities = new Float32Array(starCount);
+        const starsSpeeds = new Float32Array(starCount);
+        // Remplir les positions des étoiles
+        for (let i = 0; i < starCount; i++) {
+            // Position aléatoire dans l'espace
+            const distance = globeRadius * (1.5 + Math.random() * 3);
+            const theta = Math.random() * Math.PI * 2;
+            const phi = Math.acos(2 * Math.random() - 1);
+            starsPositions[i * 3] = distance * Math.sin(phi) * Math.cos(theta);
+            starsPositions[i * 3 + 1] = distance * Math.sin(phi) * Math.sin(theta);
+            starsPositions[i * 3 + 2] = distance * Math.cos(phi);
+            starsOpacities[i] = 0;
+            starsSpeeds[i] = 0.2 + Math.random() * 0.8;
+        }
+        starsGeometry.setAttribute('position', new THREE.BufferAttribute(starsPositions, 3));
+        starsGeometry.setAttribute('opacity', new THREE.BufferAttribute(starsOpacities, 1));
+        const stars = new THREE.Points(starsGeometry, starsMaterial);
+        scene.add(stars);
+        // Animation des étoiles
+        function animateStars() {
+            const opacities = starsGeometry.attributes.opacity.array;
+            for (let i = 0; i < starCount; i++) {
+                // Animation de clignotement aléatoire
+                opacities[i] = Math.sin(Date.now() * 0.001 * starsSpeeds[i]) * 0.5 + 0.5;
+            }
+            starsGeometry.attributes.opacity.needsUpdate = true;
+        }
+        // Effet de lumière centrale
+        const pointLight = new THREE.PointLight(0xffffff, 1, 50);
+        pointLight.position.set(0, 0, 0);
+        scene.add(pointLight);
+        const ambientLight = new THREE.AmbientLight(0x404040);
+        scene.add(ambientLight);
+        // Contrôles
+        document.getElementById('speedUp').addEventListener('click', () => {
+            rotationSpeed *= 1.5;
+        });
+        document.getElementById('slowDown').addEventListener('click', () => {
+            rotationSpeed /= 1.5;
+        });
+        document.getElementById('changeColor').addEventListener('click', () => {
+            // Générer une nouvelle palette de couleurs aléatoires
+            colorPalette = Array(6).fill().map(() => Math.random() * 0xffffff);
+            // Mettre à jour les couleurs des particules
+            const colors = particlesGeometry.attributes.color.array;
+            for (let i = 0; i < particleCount; i++) {
+                const color = new THREE.Color(colorPalette[Math.floor(Math.random() * colorPalette.length)]);
+                colors[i * 3] = color.r;
+                colors[i * 3 + 1] = color.g;
+                colors[i * 3 + 2] = color.b;
+            }
+            particlesGeometry.attributes.color.needsUpdate = true;
+        });
+        // Animation
+        function animate() {
+            requestAnimationFrame(animate);
+            // Rotation du globe
+            particles.rotation.x += rotationSpeed * 0.5;
+            particles.rotation.y += rotationSpeed;
+            // Animation des étoiles
+            animateStars();
+            renderer.render(scene, camera);
+        }
+        // Gestion du redimensionnement
+        window.addEventListener('resize', () => {
+            camera.aspect = window.innerWidth / window.innerHeight;
+            camera.updateProjectionMatrix();
+            renderer.setSize(window.innerWidth, window.innerHeight);
+        });
+        animate();
+    </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=docto41/globe-future" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>

prompts.txt ADDED Viewed

	@@ -0,0 +1,4 @@

+je veux tu me creer AURORA
+AURORA
+2 Player 3D BMX RPG RTS Action Adventure Airport Alien Animal Anime Army Art Artillery Asteroid Balance Balloon Baseball Basketball Bike Bird Blackjack Block Bloons Boat Bomb Bow Bowling Box Boxhead Brain Bridge Bunny Business Buttonhunt Car Card Casino Castle Catapult Cell Checkers Chess Christmas City Coloring Cooking Cricket Dating Defense Detective Devil Dice Difference Dinosaur Dirt Bike Doctor Domino Dragon Dress Up Duck Dungeon Dwarf Educational Elephant Emo Epic War Escape Farm Fashion Fire Fish Fishing Flight Food Puzzle Football Funny Geography Girl Gladiator God Golf Good Music Gravity Guitar Gun Hair Halloween Helicopter Hex Hidden Object Hockey Holiday Horror Horse Hunting Idle Island Kissing Magic Mahjong Makeup Management Match 3 Math Maze Memory Monkey Monster Monster Truck Motorcycle Mouse Multiplayer Multiplication Music Mystery Ninja Painting Parking Penguin Pet Physics Pinball Pipe Pirate Pixel Plane Platform Point And Click Poker Police Pong Pool Prison Protector Quick Quiz Racing Ragdoll Restaurant Retro Rhythm Robot Rocket Sandbox Santa School Science Shark Shooter Shootorial Side Scrolling Sim Skateboard Ski Snake Sniper Snow Soccer Solitaire Space Spider Sports Stealth Steampunk Stick Strategy Submachine Submarine Sudoku Sword Tag Tank Team Tennis Time Management Tower Defense Train Turn Based Tutorials Tycoon Typing Vampire Vector Virus War Western Wizard Wolf Word Worm Zombie Science Fiction Fighting Fantasy Turtle Hamster Hedgehog Mouse Only Keyboard Only CCG Stencyl Interactive Fiction One Button Philosophical Minimalism Arcade Atmospheric Top Down Historical Tactical Cute Isometric Rogue-Like Bullet Hell Upgrades Metroidvania Endurance Running HTML5 Minigames Launch Bubble Superhero Military Arena Combat 5 Minute Programming Relaxing Mining Controller Support GGJ14 Kongpanions Whimsy MMO Unity Armadillo Incremental PvP Student Developed Clicker KGJ1 KGJ2 Kongregate Abstract Co-op Psychological Female Protagonist Building Hack and Slash Challenging Scary Mythology Destruction Spy Survival Politics Visual Novel Occult Platformer Simulation Cyberpunk Viking Beat 'Em Up Text-Based Demo Premium Board Role Playing Trivia Beauty Casual Flash FPS .io Shooting Stickman Kongregate is an open platform for all web games and a pioneering game developer in the blockchain space. Resources Developers Players Support
+creer moi une globe geant  fait que des particule  de couleur qui tourne en rond avec des  etoile trasnparent  qui clignote  je veux en futuriste