# Guía de instalación — RAIO Archive

Esta guía explica cómo instalar la aplicación en una PC nueva a partir del repositorio de GitHub
y los archivos de media transferidos por disco externo.

---

## Requisitos

| Herramienta | Versión mínima | Notas |
|-------------|---------------|-------|
| XAMPP | 8.2+ | Incluye Apache, MySQL y PHP |
| PHP | 8.3 | Viene con XAMPP |
| Composer | 2.x | [getcomposer.org](https://getcomposer.org) |
| Node.js | 20+ | [nodejs.org](https://nodejs.org) |
| Git | cualquiera | |
| ffprobe | cualquiera | Parte de [ffmpeg.org](https://ffmpeg.org) — solo necesario para calcular duraciones |

---

## Paso 1 — Clonar el repositorio

```bash
cd C:\xampp\htdocs
git clone https://github.com/TheNinkon/curso-ingles-raio.git curso-riao
cd curso-riao
```

---

## Paso 2 — Instalar dependencias

```bash
composer install
npm install
npm run build
```

---

## Paso 3 — Configurar el entorno

```bash
cp .env.example .env
php artisan key:generate
```

Edita `.env` y ajusta:

```env
APP_URL=http://127.0.0.1:8080

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=curso_raio_library
DB_USERNAME=root
DB_PASSWORD=
```

---

## Paso 4 — Crear la base de datos e importar el dump

1. Abre **phpMyAdmin** en `http://127.0.0.1/phpmyadmin` (o usa la consola MySQL).
2. Crea la base de datos:
   ```sql
   CREATE DATABASE curso_raio_library CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
   ```
3. Importa el dump desde el disco externo:
   ```bash
   "C:\xampp\mysql\bin\mysql.exe" -u root curso_raio_library < database.sql
   ```
   > El archivo `database.sql` viene en el disco externo junto a los ZIPs de media.

---

## Paso 5 — Colocar los archivos de media

Los archivos de media están en el disco externo en tres archivos:

### `course-media.zip` → `storage/app/course-media/`

Extrae el ZIP de forma que la estructura quede así:

```
storage/
└── app/
    └── course-media/
        └── curso-de-ingles-raio/
            ├── 01/
            │   └── video.mp4
            ├── 02/
            │   └── video.mp4
            ├── 03/
            │   ├── video.mp4
            │   ├── normal.mp3        ← audio velocidad normal
            │   ├── interactive.mp3   ← audio versión interactiva
            │   └── story.zip         ← texto + audio de la historia
            ├── 04/
            │   ├── video.mp4
            │   ├── normal.mp3
            │   ├── interactive.mp3
            │   └── story.zip
            └── ...  (95 lecciones en total, numeradas 01–95)
```

> **Importante:** la carpeta raíz dentro del ZIP se llama `curso-de-ingles-raio`.
> Debe quedar en `storage/app/course-media/curso-de-ingles-raio/`, no en un nivel más profundo.

Comando rápido con PowerShell:
```powershell
Expand-Archive -Path "D:\course-media.zip" -DestinationPath "C:\xampp\htdocs\curso-riao\storage\app\course-media"
```

### `subtitles.zip` → `public/subtitles/`

```
public/
└── subtitles/
    └── curso-de-ingles-raio/
        ├── 01-introducing-raio/
        │   ├── subtitle-en.vtt
        │   └── subtitle-es.vtt
        ├── 02-the-15-rules-of-raio/
        │   ├── subtitle-en.vtt
        │   └── subtitle-es.vtt
        └── ...
```

Comando:
```powershell
Expand-Archive -Path "D:\subtitles.zip" -DestinationPath "C:\xampp\htdocs\curso-riao\public"
```

---

## Paso 6 — Permisos y storage

```bash
php artisan storage:link
```

---

## Paso 7 — Levantar el servidor

Inicia Apache y MySQL desde el panel de XAMPP, luego:

```bash
cd C:\xampp\htdocs\curso-riao
php artisan serve --port=8080
```

Abre: **http://127.0.0.1:8080**

---

## Verificación

1. **`/courses`** — debe mostrar "Curso De Inglés RAIO" con su portada.
2. Entra a cualquier lección con video — debe reproducirse.
3. En lecciones desde la 3 en adelante — deben aparecer dos reproductores de audio (Normal version / Interactive version) y un botón "Descargar ZIP".
4. Los subtítulos EN/ES deben mostrarse en el reproductor de video.

---

## Solución de problemas

| Síntoma | Causa probable | Solución |
|---------|---------------|----------|
| Video da 404 | `video_path` en la BD apunta a ruta antigua | Ejecuta `php artisan course:reorganize --slug=curso-de-ingles-raio` |
| Solo aparece "Normal version" | Problema con deduplicación ya resuelto en el código | Asegúrate de tener el commit más reciente |
| Sin subtítulos | `public/subtitles/` vacío | Extrae `subtitles.zip` en `public/` |
| Error de clave de app | `.env` sin `APP_KEY` | Ejecuta `php artisan key:generate` |
| Assets sin compilar | `public/build/` vacío | Ejecuta `npm run build` |

---

## Estructura del proyecto relevante

```
curso-riao/
├── app/
│   ├── Console/Commands/
│   │   ├── ImportCourse.php          ← importa curso desde course_map.json
│   │   ├── ReorganizeCourse.php      ← reorganiza media en carpetas por lección
│   │   └── SetVideoDurations.php     ← calcula duraciones con ffprobe
│   ├── Http/Controllers/
│   │   ├── MediaController.php       ← streaming de video y audio con Range support
│   │   └── CourseController.php
│   └── Models/
│       ├── Course.php
│       └── Lesson.php
├── resources/
│   ├── js/app.js                     ← Plyr, progress tracking (localStorage)
│   ├── css/app.css                   ← estilos Tailwind + componentes custom
│   └── views/courses/
│       ├── index.blade.php           ← lista de cursos
│       └── show.blade.php            ← reproductor de lección
├── scripts/
│   ├── course_config.json            ← metadatos del curso (slug, título, instructor)
│   └── course_map.json               ← mapa de lecciones para importación
├── storage/app/course-media/         ← videos, MP3s y ZIPs (NO en git)
├── public/subtitles/                 ← archivos VTT de subtítulos (NO en git)
├── README.md
└── SETUP.md                          ← este archivo
```