Spaces:

involvex
/

gamingai

Running

App Files Files Community

involvex commited on May 23, 2025

Commit

b196e51

verified ·

1 Parent(s): 75756f6

Add 3 files

Browse files

Files changed (3) hide show

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

README.md CHANGED Viewed

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

 ---
+title: gamingai
+emoji: 🐳
+colorFrom: red
+colorTo: red
 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,335 @@
-<!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>New World Location Guide</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>
+        /* Custom CSS for smooth transitions and overlay effects */
+        .overlay-container {
+            transition: all 0.3s ease;
+            transform: translateY(0);
+            opacity: 1;
+        }
+        .overlay-container.hidden {
+            transform: translateY(20px);
+            opacity: 0;
+            pointer-events: none;
+        }
+        .map-marker {
+            position: absolute;
+            width: 16px;
+            height: 16px;
+            background-color: #F59E0B;
+            border-radius: 50%;
+            border: 2px solid white;
+            transform: translate(-50%, -50%);
+            cursor: pointer;
+            transition: all 0.2s ease;
+        }
+        .map-marker:hover {
+            transform: translate(-50%, -50%) scale(1.3);
+            z-index: 10;
+        }
+        .map-marker.active {
+            background-color: #EF4444;
+            box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.3);
+        }
+        .map-container {
+            position: relative;
+            background-image: url('https://via.placeholder.com/800x600/1F2937/FFFFFF?text=New+World+Map');
+            background-size: cover;
+            background-position: center;
+        }
+        .scrollable-content {
+            scrollbar-width: thin;
+            scrollbar-color: #4B5563 #1F2937;
+        }
+        .scrollable-content::-webkit-scrollbar {
+            width: 6px;
+        }
+        .scrollable-content::-webkit-scrollbar-track {
+            background: #1F2937;
+        }
+        .scrollable-content::-webkit-scrollbar-thumb {
+            background-color: #4B5563;
+            border-radius: 3px;
+        }
+        .hotkey-badge {
+            font-family: monospace;
+        }
+    </style>
+</head>
+<body class="bg-gray-900 text-gray-100 font-sans">
+    <!-- Main Overlay Container -->
+    <div id="overlay" class="overlay-container fixed bottom-4 right-4 w-96 bg-gray-800 rounded-lg shadow-xl overflow-hidden border border-gray-700">
+        <!-- Header with title and close button -->
+        <div class="flex items-center justify-between px-4 py-3 bg-gray-900 border-b border-gray-700">
+            <div class="flex items-center space-x-2">
+                <i class="fas fa-map-marked-alt text-amber-500"></i>
+                <h2 class="font-bold text-lg">New World Locations</h2>
+            </div>
+            <div class="flex items-center space-x-3">
+                <span class="text-xs bg-gray-700 px-2 py-1 rounded hotkey-badge">ALT+Z</span>
+                <button id="close-btn" class="text-gray-400 hover:text-white">
+                    <i class="fas fa-times"></i>
+                </button>
+            </div>
+        </div>
+        <!-- Search and Filter Bar -->
+        <div class="px-4 py-3 bg-gray-800 border-b border-gray-700">
+            <div class="relative">
+                <input type="text" placeholder="Search locations..." class="w-full bg-gray-700 text-white px-4 py-2 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 pl-10">
+                <i class="fas fa-search absolute left-3 top-3 text-gray-400"></i>
+            </div>
+            <div class="flex space-x-2 mt-2">
+                <button class="px-3 py-1 text-xs bg-gray-700 hover:bg-gray-600 rounded-full">All</button>
+                <button class="px-3 py-1 text-xs bg-gray-700 hover:bg-gray-600 rounded-full">Resources</button>
+                <button class="px-3 py-1 text-xs bg-gray-700 hover:bg-gray-600 rounded-full">Dungeons</button>
+                <button class="px-3 py-1 text-xs bg-gray-700 hover:bg-gray-600 rounded-full">Settlements</button>
+            </div>
+        </div>
+        <!-- Main Content Area -->
+        <div class="flex" style="height: 500px;">
+            <!-- Map View -->
+            <div class="map-container w-1/2 h-full">
+                <!-- Map markers will be added here dynamically -->
+                <div class="map-marker" style="top: 30%; left: 25%;" data-location="everfall"></div>
+                <div class="map-marker" style="top: 45%; left: 60%;" data-location="windsward"></div>
+                <div class="map-marker" style="top: 70%; left: 40%;" data-location="brightwood"></div>
+                <div class="map-marker" style="top: 20%; left: 75%;" data-location="monarchs"></div>
+            </div>
+            <!-- Location Details -->
+            <div class="w-1/2 flex flex-col border-l border-gray-700">
+                <div class="p-4 border-b border-gray-700">
+                    <h3 class="font-bold text-amber-400" id="location-name">Select a Location</h3>
+                    <p class="text-sm text-gray-300 mt-1" id="location-description">Click on a map marker to view details</p>
+                </div>
+                <div class="flex-1 overflow-y-auto scrollable-content p-4">
+                    <div id="location-details" class="space-y-4">
+                        <!-- Content will be populated when a location is selected -->
+                        <div class="text-center py-10 text-gray-500">
+                            <i class="fas fa-map-marker-alt text-3xl mb-2"></i>
+                            <p>Select a location from the map</p>
+                        </div>
+                    </div>
+                </div>
+                <!-- Quick Actions -->
+                <div class="p-3 bg-gray-900 border-t border-gray-700 flex justify-between">
+                    <button class="px-3 py-1 bg-gray-700 hover:bg-gray-600 rounded text-sm flex items-center">
+                        <i class="fas fa-route mr-2"></i> Path
+                    </button>
+                    <button class="px-3 py-1 bg-gray-700 hover:bg-gray-600 rounded text-sm flex items-center">
+                        <i class="fas fa-bookmark mr-2"></i> Bookmark
+                    </button>
+                    <button class="px-3 py-1 bg-amber-600 hover:bg-amber-700 rounded text-sm flex items-center">
+                        <i class="fas fa-share-alt mr-2"></i> Share
+                    </button>
+                </div>
+            </div>
+        </div>
+        <!-- Footer with version info -->
+        <div class="px-4 py-2 text-xs text-gray-500 bg-gray-900 border-t border-gray-700 flex justify-between">
+            <span>v1.0.0</span>
+            <span>Overwolf Addon</span>
+        </div>
+    </div>
+    <!-- Settings Modal (hidden by default) -->
+    <div id="settings-modal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
+        <div class="bg-gray-800 rounded-lg w-96 p-6 border border-gray-700">
+            <div class="flex justify-between items-center mb-4">
+                <h3 class="text-lg font-bold">Settings</h3>
+                <button id="close-settings" class="text-gray-400 hover:text-white">
+                    <i class="fas fa-times"></i>
+                </button>
+            </div>
+            <div class="space-y-4">
+                <div>
+                    <label class="block text-sm font-medium mb-1">Toggle Hotkey</label>
+                    <div class="flex items-center">
+                        <input type="text" value="ALT+Z" class="bg-gray-700 text-white px-3 py-2 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 w-full hotkey-badge" readonly>
+                        <button class="ml-2 px-3 py-2 bg-gray-700 hover:bg-gray-600 rounded-lg">
+                            <i class="fas fa-keyboard"></i>
+                        </button>
+                    </div>
+                </div>
+                <div>
+                    <label class="block text-sm font-medium mb-1">Opacity</label>
+                    <input type="range" min="50" max="100" value="100" class="w-full h-2 bg-gray-700 rounded-lg appearance-none cursor-pointer">
+                </div>
+                <div class="flex items-center justify-between">
+                    <span class="text-sm">Show in-game</span>
+                    <label class="relative inline-flex items-center cursor-pointer">
+                        <input type="checkbox" value="" class="sr-only peer" checked>
+                        <div class="w-11 h-6 bg-gray-700 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-amber-500"></div>
+                    </label>
+                </div>
+            </div>
+            <div class="mt-6 flex justify-end space-x-3">
+                <button id="cancel-settings" class="px-4 py-2 bg-gray-700 hover:bg-gray-600 rounded-lg">
+                    Cancel
+                </button>
+                <button id="save-settings" class="px-4 py-2 bg-amber-600 hover:bg-amber-700 rounded-lg">
+                    Save Changes
+                </button>
+            </div>
+        </div>
+    </div>
+    <script>
+        // Sample location data
+        const locationData = {
+            "everfall": {
+                name: "Everfall",
+                description: "A central territory with valuable resources and dangerous enemies.",
+                type: "Settlement",
+                level: "25-35",
+                resources: ["Iron", "Silver", "Linen", "Timber"],
+                enemies: ["Lost", "Corrupted", "Angry Earth"],
+                notes: "Contains the Amrine Temple expedition entrance."
+            },
+            "windsward": {
+                name: "Windsward",
+                description: "A lush coastal region with abundant resources and moderate danger.",
+                type: "Settlement",
+                level: "1-25",
+                resources: ["Hemp", "Wood", "Stone", "Oil"],
+                enemies: ["Pirates", "Wolves", "Boars"],
+                notes: "Great starting area for new players."
+            },
+            "brightwood": {
+                name: "Brightwood",
+                description: "A haunted forest with valuable mid-game resources.",
+                type: "Region",
+                level: "30-40",
+                resources: ["Starmetal", "Wyrdwood", "Fiber", "Oil"],
+                enemies: ["Lost", "Ghosts", "Corrupted"],
+                notes: "Contains the Dynasty Shipyard expedition."
+            },
+            "monarchs": {
+                name: "Monarch's Bluffs",
+                description: "Cliffside territory with ocean views and early-game resources.",
+                type: "Settlement",
+                level: "1-25",
+                resources: ["Iron", "Stone", "Hemp", "Timber"],
+                enemies: ["Pirates", "Corrupted", "Boars"],
+                notes: "Good fishing spots along the coast."
+            }
+        };
+        // DOM elements
+        const overlay = document.getElementById('overlay');
+        const closeBtn = document.getElementById('close-btn');
+        const mapMarkers = document.querySelectorAll('.map-marker');
+        const locationName = document.getElementById('location-name');
+        const locationDescription = document.getElementById('location-description');
+        const locationDetails = document.getElementById('location-details');
+        const settingsModal = document.getElementById('settings-modal');
+        const closeSettings = document.getElementById('close-settings');
+        const cancelSettings = document.getElementById('cancel-settings');
+        const saveSettings = document.getElementById('save-settings');
+        // Toggle overlay visibility
+        function toggleOverlay() {
+            overlay.classList.toggle('hidden');
+        }
+        // Handle map marker clicks
+        mapMarkers.forEach(marker => {
+            marker.addEventListener('click', () => {
+                // Remove active class from all markers
+                mapMarkers.forEach(m => m.classList.remove('active'));
+                // Add active class to clicked marker
+                marker.classList.add('active');
+                // Get location data
+                const locationId = marker.dataset.location;
+                const location = locationData[locationId];
+                // Update location info
+                locationName.textContent = location.name;
+                locationDescription.textContent = location.description;
+                // Create details HTML
+                let detailsHTML = `
+                    <div class="space-y-3">
+                        <div>
+                            <h4 class="font-medium text-amber-400">Type</h4>
+                            <p>${location.type}</p>
+                        </div>
+                        <div>
+                            <h4 class="font-medium text-amber-400">Level Range</h4>
+                            <p>${location.level}</p>
+                        </div>
+                        <div>
+                            <h4 class="font-medium text-amber-400">Resources</h4>
+                            <div class="flex flex-wrap gap-1 mt-1">
+                                ${location.resources.map(res => `<span class="px-2 py-1 bg-gray-700 rounded text-xs">${res}</span>`).join('')}
+                            </div>
+                        </div>
+                        <div>
+                            <h4 class="font-medium text-amber-400">Enemies</h4>
+                            <div class="flex flex-wrap gap-1 mt-1">
+                                ${location.enemies.map(enemy => `<span class="px-2 py-1 bg-gray-700 rounded text-xs">${enemy}</span>`).join('')}
+                            </div>
+                        </div>
+                        <div>
+                            <h4 class="font-medium text-amber-400">Notes</h4>
+                            <p class="text-sm">${location.notes}</p>
+                        </div>
+                    </div>
+                `;
+                locationDetails.innerHTML = detailsHTML;
+            });
+        });
+        // Event listeners
+        closeBtn.addEventListener('click', toggleOverlay);
+        // For demo purposes, we'll use ALT+Z as the hotkey
+        document.addEventListener('keydown', (e) => {
+            if (e.altKey && e.key.toLowerCase() === 'z') {
+                toggleOverlay();
+            }
+        });
+        // Settings modal controls
+        closeBtn.addEventListener('dblclick', () => {
+            settingsModal.classList.remove('hidden');
+        });
+        closeSettings.addEventListener('click', () => {
+            settingsModal.classList.add('hidden');
+        });
+        cancelSettings.addEventListener('click', () => {
+            settingsModal.classList.add('hidden');
+        });
+        saveSettings.addEventListener('click', () => {
+            settingsModal.classList.add('hidden');
+            // In a real app, you would save settings here
+        });
+        // Initialize with Windsward selected
+        setTimeout(() => {
+            document.querySelector('.map-marker[data-location="windsward"]').click();
+        }, 100);
+    </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=involvex/gamingai" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>

prompts.txt ADDED Viewed

File without changes