# Media Center v2 - Детальное Описание и Требования ## Общее Описание Electron-приложение представляет собой специализированный медиацентр для просмотра фильмов и сериалов. Это кастомный браузер, оптимизированный для работы с различными онлайн-кинотеатрами и видеохостингами. ## Основные Функции ### 1. Главная Страница (Home) - **Назначение**: Отображение карточек с предзаготовленными сайтами для просмотра фильмов - **Функционал**: - Отображение карточек сайтов (название, логотип, краткое описание) - Клик по карточке открывает сайт в новой вкладке - Возможность добавления новых сайтов через конфигурацию - Индикация доступности сайта (онлайн/офлайн) ### 2. Закладки (Bookmarks) - **Назначение**: Сохранение избранных фильмов и сериалов - **Функционал**: - Карточки с сохраненными фильмами/сериалами - Информация: название, постер, сайт-источник, прямая ссылка - Возможность удаления закладок - Клик открывает сохраненную страницу - Группировка по сайтам (опционально) ### 3. Активные Вкладки (Active Tabs) - **Назначение**: Управление открытыми вкладками - **Функционал**: - Список всех открытых вкладок - Превью страницы (скриншот или favicon + title) - Переключение между вкладками - Закрытие вкладок - Возможность добавить текущую страницу в закладки ### 4. Глобальный Поиск - **Назначение**: Поиск фильмов на всех доступных сайтах одновременно - **Расположение**: Верхняя часть интерфейса (всегда доступен) - **Функционал**: - Поисковая строка с автодополнением - Параллельный поиск на всех сайтах из конфигурации - Агрегация результатов с разных сайтов - Отображение результатов с указанием источника - Фильтрация результатов по сайтам - Индикация прогресса поиска ### 5. Система Конфигураций Сайтов - **Назначение**: Управление настройками парсинга для каждого сайта - **Структура конфигурации**: ```json { "version": "1.0.0", "sites": [ { "id": "site_unique_id", "name": "Название сайта", "url": "https://example.com", "logo": "url_или_base64", "enabled": true, "useProxy": true, "search": { "endpoint": "/search", "method": "GET", "params": { "query": "{searchQuery}" }, "headers": {}, "responseType": "json", "parsing": { "type": "json", "resultsPath": "data.results", "mapping": { "title": "title", "url": "link", "image": "poster", "year": "year" } } } } ] } ``` - **Поддерживаемые типы парсинга**: - JSON (стандартный API ответ) - HTML (парсинг DOM через селекторы) - XML (парсинг XML структуры) ### 6. Настройки (Settings) - **Конфигурация сайтов**: - Просмотр текущей конфигурации - URL сервера конфигураций (редактируемый) - Кнопка "Обновить конфигурацию" - загрузка с сервера - Последняя дата обновления - **Прокси настройки**: - Статус прокси (запущен/остановлен) - Включение/отключение автозапуска прокси - Настройки InvisibleManXRay CLI - **Общие настройки**: - Тема оформления (светлая/темная) - Язык интерфейса - Папка для загрузок - Очистка кэша ### 7. Система Версионирования и Обновлений - **Проверка версий**: - Автоматическая проверка при запуске - Ручная проверка через меню - Сравнение текущей версии с серверной - **Процесс обновления**: - Уведомление о доступности новой версии - Отображение changelog (что нового) - Кнопка "Обновить сейчас" / "Напомнить позже" - Скачивание нового установщика - Запуск установки с закрытием текущего приложения ### 8. Прокси Интеграция - **InvisibleManXRay CLI**: - Автозапуск при старте приложения - Проверка статуса прокси - Логирование работы прокси - Возможность перезапуска - **FoxyProxy Integration**: - Автоматическое переключение прокси для сайтов - Правила на основе конфигурации (useProxy: true/false) - Прямое подключение для сайтов без прокси ### 9. Расширения Браузера - **AdBlock**: - Блокировка рекламы на всех сайтах - Настройка белого списка (если нужно) - **FoxyProxy**: - Управление прокси правилами - Автоматическое переключение на основе URL ## Технический Стек ### Frontend - **Electron**: Основной фреймворк - **React**: UI библиотека - **TypeScript**: Язык разработки - **Electron BrowserView/WebView**: Для встраивания веб-страниц - **CSS/SCSS**: Стилизация - **Axios**: HTTP запросы - **Cheerio**: HTML парсинг (для поиска) ### Backend (Main Process) - **Node.js**: Серверная логика - **SQLite/NeDB**: Локальная БД для закладок и настроек - **Child Process**: Управление InvisibleManXRay CLI - **Electron Store**: Хранение настроек ### Расширения - **uBlock Origin / AdBlock Plus**: Блокировка рекламы - **FoxyProxy**: Управление прокси ## Архитектура Приложения ``` media-center/ ├── src/ │ ├── main/ # Main process │ │ ├── index.ts # Точка входа │ │ ├── proxy.ts # Управление прокси │ │ ├── config.ts # Управление конфигурацией │ │ ├── updater.ts # Система обновлений │ │ └── database.ts # Работа с БД │ │ │ ├── renderer/ # Renderer process │ │ ├── App.tsx # Главный компонент │ │ ├── pages/ │ │ │ ├── Home.tsx │ │ │ ├── Bookmarks.tsx │ │ │ ├── ActiveTabs.tsx │ │ │ └── Settings.tsx │ │ ├── components/ │ │ │ ├── SearchBar.tsx │ │ │ ├── SiteCard.tsx │ │ │ ├── BookmarkCard.tsx │ │ │ ├── TabCard.tsx │ │ │ └── BrowserView.tsx │ │ └── services/ │ │ ├── search.ts # Сервис поиска │ │ ├── config.ts # Работа с конфигурацией │ │ └── api.ts # API клиент │ │ │ ├── shared/ # Общий код │ │ ├── types.ts # TypeScript типы │ │ └── constants.ts # Константы │ │ │ └── extensions/ # Браузерные расширения │ ├── adblock/ │ └── foxyproxy/ │ ├── config/ # Конфигурационные файлы │ └── sites.json # Дефолтная конфигурация сайтов │ ├── package.json ├── electron-builder.json # Настройки сборки └── tsconfig.json ``` ## Требования к Серверной Части (Backend API) ### 1. Конфигурация Сайтов **Endpoint**: `GET /api/config/sites` **Ответ**: ```json { "version": "1.2.0", "lastUpdated": "2025-10-14T12:00:00Z", "sites": [...] } ``` ### 2. Проверка Версии **Endpoint**: `GET /api/version/check` **Параметры**: `?currentVersion=1.0.0` **Ответ**: ```json { "latestVersion": "1.1.0", "updateAvailable": true, "downloadUrl": "https://server.com/downloads/media-center-1.1.0.exe", "changelog": "- Добавлен новый сайт\n- Исправлены ошибки поиска", "releaseDate": "2025-10-14", "mandatory": false } ``` ### 3. Скачивание Обновления **Endpoint**: `GET /api/downloads/{version}/{platform}` **Ответ**: Бинарный файл установщика ### 4. Статистика (опционально) **Endpoint**: `POST /api/stats/usage` **Тело**: ```json { "appVersion": "1.0.0", "event": "search", "site": "kinogo", "timestamp": "2025-10-14T12:00:00Z" } ``` ## Основные Сценарии Использования ### Сценарий 1: Поиск фильма 1. Пользователь вводит название в глобальный поиск 2. Приложение отправляет запросы на все сайты параллельно 3. Результаты агрегируются и отображаются 4. Пользователь выбирает результат и открывается страница фильма 5. Возможность добавить в закладки ### Сценарий 2: Работа с закладками 1. Пользователь открывает страницу фильма 2. Нажимает "Добавить в закладки" 3. Закладка сохраняется с метаданными 4. Закладка отображается на странице "Закладки" 5. Быстрый доступ к сохраненному фильму ### Сценарий 3: Обновление конфигурации 1. Пользователь открывает "Настройки" 2. Нажимает "Обновить конфигурацию" 3. Приложение загружает новую конфигурацию с сервера 4. Применяет изменения (новые сайты, обновленные правила парсинга) 5. Уведомляет пользователя об успехе ### Сценарий 4: Обновление приложения 1. При запуске приложение проверяет версию 2. Если доступно обновление - показывает уведомление 3. Пользователь может обновить сейчас или позже 4. При согласии скачивается новый установщик 5. Приложение закрывается и запускается установка ## UI/UX Требования ### Дизайн - **Стиль**: Современный, минималистичный - **Цветовая схема**: Темная тема по умолчанию (с возможностью переключения) - **Шрифты**: Читабельные, sans-serif (например, Inter, Roboto) - **Иконки**: Использовать библиотеку (например, Lucide, Heroicons) ### Навигация - **Главное меню**: Боковая панель или верхнее меню с вкладками - **Поиск**: Всегда доступен в верхней части - **Быстрые действия**: Контекстное меню на карточках ### Адаптивность - Поддержка разных разрешений экрана - Минимальное разрешение: 1280x720 - Оптимально: 1920x1080 ## Безопасность 1. **Санитизация URL**: Проверка и очистка всех внешних URL 2. **Content Security Policy**: Строгая CSP для renderer process 3. **Node Integration**: Отключена в BrowserView 4. **Context Isolation**: Включена 5. **Безопасное хранение**: Конфиденциальные данные в зашифрованном виде ## Производительность 1. **Ленивая загрузка**: Вкладки загружаются только при активации 2. **Кэширование**: Результаты поиска и конфигурации кэшируются 3. **Оптимизация памяти**: Автоматическое закрытие неиспользуемых вкладок 4. **Параллельные запросы**: Поиск выполняется параллельно ## Этапы Разработки ### Фаза 1: Базовая структура - [x] Настройка Electron проекта - [ ] Основная архитектура (main + renderer) - [ ] Базовый UI с навигацией ### Фаза 2: Основной функционал - [ ] Система конфигураций - [ ] Страница Home с карточками сайтов - [ ] BrowserView интеграция - [ ] Система закладок ### Фаза 3: Продвинутый функционал - [ ] Глобальный поиск - [ ] Парсинг для разных типов ответов - [ ] Управление активными вкладками ### Фаза 4: Прокси и расширения - [ ] Интеграция InvisibleManXRay - [ ] Установка AdBlock - [ ] Настройка FoxyProxy ### Фаза 5: Обновления и полировка - [ ] Система версионирования - [ ] Автообновление - [ ] Финальная оптимизация - [ ] Тестирование ## Дополнительные Возможности (Future Features) 1. **История просмотров**: Отслеживание просмотренного контента 2. **Рекомендации**: На основе истории и закладок 3. **Синхронизация**: Между устройствами (через облако) 4. **Плеер интеграция**: Встроенный видеоплеер 5. **Субтитры**: Автоматическая загрузка субтитров 6. **Торрент интеграция**: Загрузка через торренты 7. **Уведомления**: О новых сериях любимых сериалов