# 📚 La Biblioteca

**Visor de documentos EPUB accesibles desde IPFS**

Una aplicación web moderna para explorar y leer libros en formato EPUB almacenados en la red descentralizada IPFS. Desarrollada con React, ofrece una experiencia de lectura fluida con múltiples opciones de personalización y accesibilidad.

![React](https://img.shields.io/badge/React-19.0.0-61dafb?style=flat&logo=react)
![License](https://img.shields.io/badge/license-MIT-green)
![IPFS](https://img.shields.io/badge/IPFS-enabled-65c2cb?style=flat&logo=ipfs)

## ✨ Características

### 📖 Lectura
- **Visor EPUB integrado** con modo de scroll continuo
- **Tabla de contenidos** navegable
- **Control de tipografía** - ajusta el tamaño de fuente (50% - 200%)
- **Temas de lectura** - Claro, Sepia y Oscuro
- **Indicador de progreso** - muestra tu avance en tiempo real
- **Navegación intuitiva** - botones de anterior/siguiente página

### 🔍 Exploración
- **Buscador en tiempo real** - filtra por título instantáneamente
- **Paginación configurable** - 10, 50 o 100 libros por página
- **Catálogo completo** - acceso a toda la biblioteca IPFS
- **Selector de Gateway** - 9 gateways IPFS optimizados por velocidad

### 🌐 Compartir y Descargar
- **Enlaces directos** - comparte libros específicos con un solo clic
- **Descarga EPUB** - guarda libros localmente con su nombre original
- **URLs amigables** - enlaces permanentes a través de IPFS
- **Múltiples gateways** - resiliencia y velocidad

### ♿ Accesibilidad
- **WCAG 2.1 AA** - cumplimiento de estándares de accesibilidad
- **Navegación por teclado** - control completo sin ratón
- **Lectores de pantalla** - soporte ARIA completo
- **Skip links** - navegación rápida al contenido principal
- **Alto contraste** - mejores colores para legibilidad
- **Elementos semánticos** - HTML5 semántico correcto

## 🚀 Inicio Rápido

### Prerequisitos

- Node.js 16 o superior
- npm o yarn

### Instalación

```bash
# Clonar el repositorio
git clone https://git.manalejandro.com/ale/labiblioteca.git
cd labiblioteca

# Instalar dependencias
npm install

# Iniciar servidor de desarrollo
npm start
```

La aplicación se abrirá automáticamente en [http://localhost:3000](http://localhost:3000)

### Compilación para Producción

```bash
# Generar build optimizado
npm run build

# La carpeta 'build' contendrá los archivos listos para desplegar
```

## 📋 Uso

### Explorar el Catálogo

1. Al abrir la aplicación, verás el catálogo completo de libros
2. Usa el **buscador** para filtrar por título
3. Ajusta la **paginación** según tus preferencias
4. Cambia el **gateway IPFS** si experimentas lentitud

### Leer un Libro

1. Haz clic en cualquier libro del catálogo
2. El visor se abrirá con el libro cargado
3. Usa los controles de la cabecera para:
   - 📥 **Descargar** el EPUB
   - 🔗 **Compartir** el enlace directo
   - 📑 **Ver la tabla de contenidos**
   - ⚙️ **Ajustar configuración** (tema, tamaño de fuente)
4. Navega con los botones de anterior/siguiente o scroll

### Compartir un Libro

1. Abre el libro que quieres compartir
2. Haz clic en el botón de compartir (🔗)
3. El enlace se copiará automáticamente al portapapeles
4. Compártelo - cualquiera con el enlace podrá leer el libro

## 🏗️ Arquitectura del Proyecto

```
labiblioteca/
├── public/
│   ├── index.html          # HTML principal con parches de accesibilidad
│   └── manifest.json       # Configuración PWA
├── src/
│   ├── components/
│   │   ├── BookList.js     # Lista y búsqueda de libros
│   │   ├── EpubViewer.js   # Visor de EPUB
│   │   ├── ErrorBoundary.js # Captura de errores React
│   │   └── GatewaySelector.js # Selector de gateway IPFS
│   ├── styles/
│   │   ├── BookList.css
│   │   ├── EpubViewer.css
│   │   └── GatewaySelector.css
│   ├── utils/
│   │   └── ipfsParser.js   # Parser del catálogo IPFS
│   ├── App.js              # Componente principal
│   ├── App.css             # Estilos globales
│   ├── index.js            # Punto de entrada
│   └── setupErrorHandler.js # Manejo global de errores
├── package.json
└── README.md
```

## 🛠️ Tecnologías Utilizadas

- **React 19.0.0** - Framework de UI
- **epubjs** - Renderizado de archivos EPUB
- **react-icons** - Iconos de interfaz
- **IPFS** - Almacenamiento descentralizado
- **Create React App** - Configuración y build

## 🌍 Gateways IPFS

La aplicación soporta múltiples gateways IPFS para garantizar disponibilidad y velocidad:

1. EU Orbitor (Europa)
2. IPFS Orbitor (Global)
3. IPFS.io (Oficial)
4. Cloudflare IPFS (CDN)
5. Dweb.link (Oficial)
6. Pinata (Pinning service)
7. 4everland (Web3)
8. Gateway.pinata.cloud
9. NFT.storage

## 🔧 Configuración Avanzada

### Cambiar el Catálogo IPFS

Edita `src/utils/ipfsParser.js` y modifica la constante `IPFS_CATALOG_HASH`:

```javascript
const IPFS_CATALOG_HASH = 'QmTuHashDelCatalogo';
```

### Agregar Nuevos Gateways

En `src/utils/ipfsParser.js`, agrega nuevos gateways al array `IPFS_GATEWAYS`:

```javascript
export const IPFS_GATEWAYS = [
  // ... gateways existentes
  { name: 'Mi Gateway', url: 'https://mi-gateway.com' }
];
```

## 🐛 Solución de Problemas

### Los libros no cargan

- Prueba cambiando el gateway IPFS
- Verifica tu conexión a internet
- Algunos gateways pueden estar temporalmente caídos

### Errores en el visor EPUB

- Los errores de ResizeObserver son normales y están silenciados
- Si el libro no se renderiza, intenta recargarlo
- Algunos EPUBs pueden tener formato incompatible

### El catálogo está vacío

- Verifica que el hash del catálogo IPFS sea correcto
- Prueba con diferentes gateways
- Revisa la consola del navegador para errores de red

## 🤝 Contribuciones

Las contribuciones son bienvenidas. Por favor:

1. Fork el proyecto
2. Crea una rama para tu feature (`git checkout -b feature/AmazingFeature`)
3. Commit tus cambios (`git commit -m 'Add some AmazingFeature'`)
4. Push a la rama (`git push origin feature/AmazingFeature`)
5. Abre un Pull Request

## 📄 Licencia

Este proyecto está bajo la Licencia MIT. Ver el archivo `LICENSE` para más detalles.

## 👤 Autor

**Ale** - [git.manalejandro.com](https://git.manalejandro.com/ale)

## 🔗 Enlaces

- **Repositorio**: [https://git.manalejandro.com/ale/labiblioteca](https://git.manalejandro.com/ale/labiblioteca)
- **IPFS**: [https://ipfs.io](https://ipfs.io)
- **React**: [https://react.dev](https://react.dev)
- **Epub.js**: [https://github.com/futurepress/epub.js](https://github.com/futurepress/epub.js)

## 🙏 Agradecimientos

- A la comunidad de IPFS por la infraestructura descentralizada
- A los desarrolladores de Epub.js por el excelente visor
- A todos los contribuidores de bibliotecas de código abierto utilizadas

---

**⭐ Si este proyecto te resulta útil, considera darle una estrella en el repositorio**