# Reels Master

Chrome расширение для улучшенного просмотра Instagram Reels с управлением громкостью и загрузкой видео.

## Возможности

- 🔊 **Управление громкостью** - Вертикальный слайдер для точной настройки громкости видео
- 📥 **Загрузка роликов** - Скачивайте рилсы одним кликом
- 🎯 **Удобное расположение** - Кнопки расположены рядом с лайками и комментариями

## Установка

### Разработка

1. Установите зависимости:
```bash
pnpm install
```

2. Соберите расширение:
```bash
pnpm run build
```

3. Загрузите расширение в Chrome:
   - Откройте `chrome://extensions/`
   - Включите "Режим разработчика" (Developer mode)
   - Нажмите "Загрузить распакованное расширение" (Load unpacked)
   - Выберите папку `dist`

### Режим разработки с автоперезагрузкой

```bash
pnpm run dev
```

## Использование

1. Откройте Instagram и перейдите к любому рилсу
2. Справа от видео, рядом с кнопками лайка и комментариев, появятся новые элементы управления:
   - **Кнопка громкости** - Нажмите для включения/выключения звука
   - **Слайдер громкости** - Перетащите для регулировки уровня громкости (0-100%)
   - **Кнопка загрузки** - Нажмите для скачивания текущего рилса

## Технологии

- TypeScript
- Vite
- Chrome Extension Manifest V3
- WebExtensions Polyfill

## Структура проекта

```
reels-master/
├── src/
│   ├── manifest.json          # Манифест расширения
│   ├── content/
│   │   ├── content.ts         # Основной скрипт для Instagram
│   │   └── content.css        # Стили для элементов управления
│   ├── background/
│   │   └── service-worker.ts  # Фоновый service worker
│   ├── popup/
│   │   ├── popup.html
│   │   ├── popup.tsx
│   │   └── popup.css
│   └── options/
│       ├── options.html
│       └── options.tsx
├── public/
│   └── icons/                 # Иконки расширения
├── package.json
├── tsconfig.json
└── vite.config.ts
```

## Лицензия

ISC