Add 3 files

README.md

@@ -1,10 +1,12 @@
 ---
-title: Sovitich Projects
-emoji: 🏆
-colorFrom: pink
-colorTo: gray
+title: sovitich-projects
+emoji: 🐳
+colorFrom: gray
+colorTo: green
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html

@@ -1,19 +1,211 @@
-<!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>News Teleprompter</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>
+        .teleprompter-container {
+            perspective: 1000px;
+            transform-style: preserve-3d;
+        }
+        .teleprompter-text {
+            transform: rotateX(20deg);
+            transform-origin: top center;
+        }
+        .gradient-mask {
+            mask-image: linear-gradient(to bottom, 
+                rgba(0,0,0,0) 0%, 
+                rgba(0,0,0,1) 10%,
+                rgba(0,0,0,1) 90%,
+                rgba(0,0,0,0) 100%);
+            -webkit-mask-image: linear-gradient(to bottom, 
+                rgba(0,0,0,0) 0%, 
+                rgba(0,0,0,1) 10%,
+                rgba(0,0,0,1) 90%,
+                rgba(0,0,0,0) 100%);
+        }
+        .speed-control::-webkit-slider-thumb {
+            -webkit-appearance: none;
+            width: 20px;
+            height: 20px;
+            border-radius: 50%;
+            background: #3b82f6;
+            cursor: pointer;
+        }
+        .word-line {
+            display: flex;
+            justify-content: center;
+            margin-bottom: 1.5rem;
+        }
+        .word {
+            margin: 0 0.5rem;
+        }
+    </style>
+</head>
+<body class="bg-gray-900 text-white min-h-screen flex flex-col">
+    <header class="bg-black py-4 px-6 shadow-lg">
+        <div class="container mx-auto flex justify-between items-center">
+            <h1 class="text-2xl font-bold text-blue-400">
+                <i class="fas fa-newspaper mr-2"></i> News Teleprompter
+            </h1>
+            <div class="flex items-center space-x-4">
+                <button id="playPauseBtn" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg flex items-center">
+                    <i class="fas fa-play mr-2"></i> Play
+                </button>
+                <div class="flex items-center">
+                    <i class="fas fa-tachometer-alt mr-2 text-blue-400"></i>
+                    <input type="range" id="speedControl" min="1" max="20" value="5" class="speed-control w-32">
+                    <span id="speedValue" class="ml-2 text-blue-400">5x</span>
+                </div>
+            </div>
+        </div>
+    </header>
+
+    <main class="flex-grow flex items-center justify-center p-6">
+        <div class="teleprompter-container w-full max-w-4xl h-96 bg-black border-2 border-blue-800 rounded-lg overflow-hidden shadow-xl">
+            <div id="teleprompterText" class="teleprompter-text h-full overflow-y-hidden text-3xl leading-relaxed p-8 gradient-mask">
+                <!-- News content will be inserted here by JavaScript -->
+            </div>
+        </div>
+    </main>
+
+    <footer class="bg-black py-4 px-6">
+        <div class="container mx-auto text-center text-gray-400">
+            <p>Use the controls to adjust the scrolling speed. Click play/pause to start or stop the teleprompter.</p>
+        </div>
+    </footer>
+
+    <script>
+        document.addEventListener('DOMContentLoaded', function() {
+            // Sample news content
+            const newsParagraphs = [
+                "BREAKING NEWS: The city council has approved the new infrastructure plan that will modernize public transportation across the metropolitan area. The $2.3 billion project is expected to create thousands of jobs and reduce commute times by an average of 25%.",
+                "INTERNATIONAL: Diplomatic tensions rise as trade negotiations between major economic powers reach a stalemate. Analysts warn that prolonged disputes could impact global markets and supply chains. Representatives from both sides are scheduled to meet again next week.",
+                "TECHNOLOGY: A breakthrough in quantum computing has been announced by researchers at the National Laboratory. The new processor demonstrates error correction capabilities that could make practical quantum computers a reality within the decade.",
+                "WEATHER: A severe weather system is moving across the region, bringing heavy rains and potential flooding to low-lying areas. Residents are advised to prepare emergency kits and monitor local alerts. The storm is expected to pass by Thursday evening.",
+                "SPORTS: In a stunning upset, the underdog team defeated the defending champions in overtime last night. The victory marks their first championship in franchise history. Fans celebrated throughout the city as the team returned home this morning.",
+                "HEALTH: New guidelines from the World Health Organization recommend updated vaccination schedules for children and adults. The changes reflect recent research on immunity duration and emerging disease patterns.",
+                "ENTERTAINMENT: The highly anticipated film adaptation of the bestselling novel series premieres this weekend. Early reviews praise the director's vision and the lead actor's performance, predicting strong box office numbers.",
+                "BUSINESS: Major retailers report stronger than expected holiday sales despite economic concerns. Analysts attribute the growth to strategic discounts and consumers prioritizing essential purchases.",
+                "SCIENCE: Astronomers have discovered a potentially habitable exoplanet orbiting a nearby star. The Earth-sized planet lies within the habitable zone where liquid water could exist on its surface.",
+                "POLITICS: The legislature is debating comprehensive education reform that would increase funding for public schools and revise curriculum standards. The bill has bipartisan support but faces opposition from some advocacy groups."
+            ];
+
+            // Format text into 5-word lines
+            function formatTextToLines(text) {
+                const words = text.split(/\s+/);
+                const lines = [];
+                
+                for (let i = 0; i < words.length; i += 5) {
+                    const lineWords = words.slice(i, i + 5);
+                    lines.push(lineWords);
+                }
+                
+                return lines;
+            }
+
+            // Get DOM elements
+            const teleprompterText = document.getElementById('teleprompterText');
+            const playPauseBtn = document.getElementById('playPauseBtn');
+            const speedControl = document.getElementById('speedControl');
+            const speedValue = document.getElementById('speedValue');
+
+            // Insert formatted news content
+            let formattedContent = '';
+            newsParagraphs.forEach(paragraph => {
+                const lines = formatTextToLines(paragraph);
+                lines.forEach(lineWords => {
+                    formattedContent += '<div class="word-line">';
+                    lineWords.forEach(word => {
+                        // Highlight category words in blue
+                        if (word.endsWith(':') && word === lineWords[0]) {
+                            formattedContent += `<span class="word text-blue-400 font-bold">${word}</span>`;
+                        } else {
+                            formattedContent += `<span class="word">${word}</span>`;
+                        }
+                    });
+                    formattedContent += '</div>';
+                });
+                // Add extra space between paragraphs
+                formattedContent += '<div class="h-12"></div>';
+            });
+            
+            teleprompterText.innerHTML = formattedContent;
+
+            // Teleprompter state
+            let isPlaying = false;
+            let scrollInterval;
+            let scrollPosition = 0;
+            let scrollSpeed = 5; // Default speed
+
+            // Update speed display
+            speedControl.addEventListener('input', function() {
+                scrollSpeed = parseInt(this.value);
+                speedValue.textContent = `${scrollSpeed}x`;
+                
+                if (isPlaying) {
+                    clearInterval(scrollInterval);
+                    startScrolling();
+                }
+            });
+
+            // Play/Pause functionality
+            playPauseBtn.addEventListener('click', function() {
+                isPlaying = !isPlaying;
+                
+                if (isPlaying) {
+                    playPauseBtn.innerHTML = '<i class="fas fa-pause mr-2"></i> Pause';
+                    startScrolling();
+                } else {
+                    playPauseBtn.innerHTML = '<i class="fas fa-play mr-2"></i> Play';
+                    clearInterval(scrollInterval);
+                }
+            });
+
+            // Start scrolling function
+            function startScrolling() {
+                scrollInterval = setInterval(function() {
+                    scrollPosition += 0.5 * (scrollSpeed / 5);
+                    teleprompterText.scrollTop = scrollPosition;
+                    
+                    // Reset to top when reaching bottom
+                    if (scrollPosition >= teleprompterText.scrollHeight - teleprompterText.clientHeight) {
+                        scrollPosition = 0;
+                        teleprompterText.scrollTop = 0;
+                    }
+                }, 16); // ~60fps
+            }
+
+            // Keyboard controls
+            document.addEventListener('keydown', function(e) {
+                // Spacebar to play/pause
+                if (e.code === 'Space') {
+                    e.preventDefault();
+                    playPauseBtn.click();
+                }
+                
+                // Arrow up to increase speed
+                if (e.code === 'ArrowUp') {
+                    e.preventDefault();
+                    if (scrollSpeed < 20) {
+                        speedControl.value = scrollSpeed + 1;
+                        speedControl.dispatchEvent(new Event('input'));
+                    }
+                }
+                
+                // Arrow down to decrease speed
+                if (e.code === 'ArrowDown') {
+                    e.preventDefault();
+                    if (scrollSpeed > 1) {
+                        speedControl.value = scrollSpeed - 1;
+                        speedControl.dispatchEvent(new Event('input'));
+                    }
+                }
+            });
+        });
+    </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=sovitich28/sovitich-projects" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>