Files
ESH-Media/REQUIREMENTS.md
eshmeshek ecb5e7e49f init: media-center v2
Rewrite of ESH-Media v1 with separated main/renderer/shared architecture
(vite-plugin-electron, React 18, react-router-dom). Includes NeDB storage,
electron-store config, proxy manager with FoxyProxy/uBlock extensions,
custom server-checked updater, NSIS installer.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-11 23:49:43 +03:00

16 KiB
Raw Blame History

Media Center v2 - Детальное Описание и Требования

Общее Описание

Electron-приложение представляет собой специализированный медиацентр для просмотра фильмов и сериалов. Это кастомный браузер, оптимизированный для работы с различными онлайн-кинотеатрами и видеохостингами.

Основные Функции

1. Главная Страница (Home)

  • Назначение: Отображение карточек с предзаготовленными сайтами для просмотра фильмов
  • Функционал:
    • Отображение карточек сайтов (название, логотип, краткое описание)
    • Клик по карточке открывает сайт в новой вкладке
    • Возможность добавления новых сайтов через конфигурацию
    • Индикация доступности сайта (онлайн/офлайн)

2. Закладки (Bookmarks)

  • Назначение: Сохранение избранных фильмов и сериалов
  • Функционал:
    • Карточки с сохраненными фильмами/сериалами
    • Информация: название, постер, сайт-источник, прямая ссылка
    • Возможность удаления закладок
    • Клик открывает сохраненную страницу
    • Группировка по сайтам (опционально)

3. Активные Вкладки (Active Tabs)

  • Назначение: Управление открытыми вкладками
  • Функционал:
    • Список всех открытых вкладок
    • Превью страницы (скриншот или favicon + title)
    • Переключение между вкладками
    • Закрытие вкладок
    • Возможность добавить текущую страницу в закладки

4. Глобальный Поиск

  • Назначение: Поиск фильмов на всех доступных сайтах одновременно
  • Расположение: Верхняя часть интерфейса (всегда доступен)
  • Функционал:
    • Поисковая строка с автодополнением
    • Параллельный поиск на всех сайтах из конфигурации
    • Агрегация результатов с разных сайтов
    • Отображение результатов с указанием источника
    • Фильтрация результатов по сайтам
    • Индикация прогресса поиска

5. Система Конфигураций Сайтов

  • Назначение: Управление настройками парсинга для каждого сайта

  • Структура конфигурации:

    {
      "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 Ответ:

{
  "version": "1.2.0",
  "lastUpdated": "2025-10-14T12:00:00Z",
  "sites": [...]
}

2. Проверка Версии

Endpoint: GET /api/version/check Параметры: ?currentVersion=1.0.0 Ответ:

{
  "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 Тело:

{
  "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: Базовая структура

  • Настройка Electron проекта
  • Основная архитектура (main + renderer)
  • Базовый UI с навигацией

Фаза 2: Основной функционал

  • Система конфигураций
  • Страница Home с карточками сайтов
  • BrowserView интеграция
  • Система закладок

Фаза 3: Продвинутый функционал

  • Глобальный поиск
  • Парсинг для разных типов ответов
  • Управление активными вкладками

Фаза 4: Прокси и расширения

  • Интеграция InvisibleManXRay
  • Установка AdBlock
  • Настройка FoxyProxy

Фаза 5: Обновления и полировка

  • Система версионирования
  • Автообновление
  • Финальная оптимизация
  • Тестирование

Дополнительные Возможности (Future Features)

  1. История просмотров: Отслеживание просмотренного контента
  2. Рекомендации: На основе истории и закладок
  3. Синхронизация: Между устройствами (через облако)
  4. Плеер интеграция: Встроенный видеоплеер
  5. Субтитры: Автоматическая загрузка субтитров
  6. Торрент интеграция: Загрузка через торренты
  7. Уведомления: О новых сериях любимых сериалов