Update index.html

index.html

@@ -6,7 +6,7 @@
     <style>
         /* Глобальные стили */
         body {
-            background: linear-gradient(#1b2838, #0e1a27);
+            background: linear-gradient(135deg, #1b2838, #0e1a27);
             color: #c6d4df;
             font-family: 'Arial', sans-serif;
             margin: 0;
@@ -499,94 +499,64 @@
         window.addEventListener('load', init)
     </script>	
     <script>
-function installGame(gameId) {
-    const game = games.find(g => g.id === gameId);
-    if (!game) return;
-
-    const installButton = document.querySelector(`.install-button[data-game-id="${gameId}"]`);
-    const progressBar = document.querySelector(`.install-progress[data-game-id="${gameId}"] .install-progress-bar`);
-    const message = document.querySelector(`.install-message[data-game-id="${gameId}"]`);
-
-    if (installButton && progressBar && message) {
-        installButton.disabled = true;
-        installButton.textContent = 'Установка...';
-        progressBar.parentElement.style.display = 'block';
-        message.style.display = 'block';
-
-        let progress = 0;
-        const interval = setInterval(() => {
-            progress += 10;
-            progressBar.style.width = `${progress}%`;
-
-            if (progress >= 100) {
-                clearInterval(interval);
-                installButton.textContent = 'Установлено';
-                message.textContent = 'Игра успешно установлена!';
-
-                // Шутка после установки
-                setTimeout(() => {
-                    alert('Игра установлена! Теперь можно наслаждаться... чем-то интересным 😉');
-                    
-                    // Открываем видео прямо на сайте
-                    showVideo('https://www.youtube.com/embed/dQw4w9WgXcQ'); // Rickroll
-                }, 1000);
+        // Функция для "установки" игры
+        function installGame(gameId) {
+            const game = games.find(g => g.id === gameId);
+            if (!game) return;
+
+            const installButton = document.querySelector(`.install-button[data-game-id="${gameId}"]`);
+            const progressBar = document.querySelector(`.install-progress[data-game-id="${gameId}"] .install-progress-bar`);
+            const message = document.querySelector(`.install-message[data-game-id="${gameId}"]`);
+
+            if (installButton && progressBar && message) {
+                installButton.disabled = true;
+                installButton.textContent = 'Установка...';
+                progressBar.parentElement.style.display = 'block';
+                message.style.display = 'block';
+
+                let progress = 0;
+                const interval = setInterval(() => {
+                    progress += 10;
+                    progressBar.style.width = `${progress}%`;
+
+                    if (progress >= 100) {
+                        clearInterval(interval);
+                        installButton.textContent = 'Установлено';
+                        message.textContent = 'Игра успешно установлена!';
+
+                        // Шутка после установки
+                        setTimeout(() => {
+                            window.location.href = 'https://www.youtube.com/watch?v=dQw4w9WgXcQ';
+                            // Здесь можно добавить ссылку или что-то ещё
+                        }, 1000);
+                    }
+                }, 300);
             }
-        }, 300);
-    }
-}
-
-// Функция для показа видео
-function showVideo(videoUrl) {
-    // Создаём модальное окно
-    const modal = document.createElement('div');
-    modal.style.position = 'fixed';
-    modal.style.top = '0';
-    modal.style.left = '0';
-    modal.style.width = '100%';
-    modal.style.height = '100%';
-    modal.style.backgroundColor = 'rgba(0, 0, 0, 0.8)';
-    modal.style.display = 'flex';
-    modal.style.justifyContent = 'center';
-    modal.style.alignItems = 'center';
-    modal.style.zIndex = '1000';
-
-    // Создаём контейнер для видео
-    const videoContainer = document.createElement('div');
-    videoContainer.style.width = '80%';
-    videoContainer.style.maxWidth = '800px';
-    videoContainer.style.position = 'relative';
-
-    // Создаём iframe с видео
-    const iframe = document.createElement('iframe');
-    iframe.src = videoUrl;
-    iframe.width = '100%';
-    iframe.height = '450';
-    iframe.frameBorder = '0';
-    iframe.allow = 'accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture';
-    iframe.allowFullscreen = true;
-
-    // Кнопка закрытия
-    const closeButton = document.createElement('button');
-    closeButton.textContent = '×';
-    closeButton.style.position = 'absolute';
-    closeButton.style.top = '-30px';
-    closeButton.style.right = '-30px';
-    closeButton.style.backgroundColor = '#ff4444';
-    closeButton.style.color = '#fff';
-    closeButton.style.border = 'none';
-    closeButton.style.borderRadius = '50%';
-    closeButton.style.width = '40px';
-    closeButton.style.height = '40px';
-    closeButton.style.fontSize = '24px';
-    closeButton.style.cursor = 'pointer';
-    closeButton.style.boxShadow = '0 4px 15px rgba(0, 0, 0, 0.3)';
-    closeButton.onclick = () => document.body.removeChild(modal);
-
-    // Добавляем элементы в DOM
-    videoContainer.appendChild(iframe);
-    videoContainer.appendChild(closeButton);
-    modal.appendChild(videoContainer);
-    document.body.appendChild(modal);
+        }
+
+        // Отрисовка библиотеки с кнопкой установки
+        function renderLibrary() {
+            const library = document.getElementById('userGames');
+            if (library) {
+                library.innerHTML = account.library.length ?
+                    account.library.map(game => `
+                        <div class="game-card">
+                            <img src="${game.image}" class="game-image">
+                            <div style="padding: 15px">
+                                <h3>${game.title}</h3>
+                                <button class="steam-button install-button" data-game-id="${game.id}" onclick="installGame(${game.id})">
+                                    Установить
+                                </button>
+                                <div class="install-progress" data-game-id="${game.id}">
+                                    <div class="install-progress-bar"></div>
+                                </div>
+                                <div class="install-message" data-game-id="${game.id}">
+                                    Установка...
+                                </div>
+                            </div>
+                        </div>
+                    `).join('') :
+                    '<p>Ваша библиотека пуста. Купите игры в магазине!</p>';
             }
         }