diff --git a/README/VIEWS_STRUCTURE.md b/README/VIEWS_STRUCTURE.md index 2a54392..e69de29 100644 --- a/README/VIEWS_STRUCTURE.md +++ b/README/VIEWS_STRUCTURE.md @@ -1,181 +0,0 @@ -# 📁 Estructura de Views - Amayo Bot - -## 🗂️ Organización de Archivos - -``` -src/server/views/ -├── layouts/ -│ └── layout.ejs # Layout principal (HTML wrapper) -├── pages/ -│ └── index.ejs # ✅ Contenido de la página (usado por servidor) -└── partials/ - ├── navbar.ejs # Barra de navegación - ├── toc.ejs # Tabla de contenidos - └── sections/ # Secciones de contenido - ├── primeros-pasos.ejs - ├── comandos-basicos.ejs - └── ... -``` - ---- - -## ✅ Archivo Correcto - -### `/src/server/views/pages/index.ejs` - -Este es el archivo **que se está usando**. El servidor lo busca aquí: - -```typescript -// En server.ts -const pageFile = path.join(viewsDir, "pages", `${template}.ejs`); -``` - -**Contenido:** -- Solo el contenido del `` -- Sin etiquetas ``, ``, etc. -- Sin llamadas a `layout()` -- Directamente renderizado dentro de `layout.ejs` - ---- - -## ❌ Archivo Eliminado - -### ~~`/src/server/views/index.ejs`~~ (ELIMINADO) - -Este archivo estaba duplicado y **NO se estaba usando**. Causaba confusión porque: -- Tenía el sistema antiguo de layout con `<% layout('layouts/layout') %>` -- No era consultado por el servidor -- Los cambios no se reflejaban en la web - ---- - -## 🔄 Flujo de Renderizado - -### 1. Usuario solicita `/` -``` -http://localhost:3000/ -``` - -### 2. Servidor renderiza -```typescript -await renderTemplate(req, res, "index", { - appName: "Amayo Bot", - version: "2.0.0", - djsVersion: "15.0.0-dev", - currentDateHuman: "octubre 2025" -}); -``` - -### 3. Proceso de renderizado -``` -1. Lee: views/pages/index.ejs - ↓ (renderiza con variables) -2. Resultado → pageBody - ↓ -3. Lee: views/layouts/layout.ejs - ↓ (inserta pageBody en <%= body %>) -4. HTML completo → navegador -``` - ---- - -## 📝 Cómo Editar - -### Para cambiar el contenido de la página: -✅ **Edita**: `/src/server/views/pages/index.ejs` - -### Para cambiar el layout (HTML, head, scripts): -✅ **Edita**: `/src/server/views/layouts/layout.ejs` - -### Para cambiar navbar o footer: -✅ **Edita**: -- `/src/server/views/partials/navbar.ejs` -- Footer está en `layout.ejs` (líneas 45-75) - -### Para agregar/editar secciones: -✅ **Edita**: `/src/server/views/partials/sections/*.ejs` - ---- - -## 🎨 CSS y Assets - -### Archivos CSS cargados (en layout.ejs): -```html - - - -``` - -### Ubicación física: -``` -src/server/public/assets/css/ -├── modern-pixel.css # ✅ Componentes modernos -├── modern-sections.css # ✅ Estilos de secciones -├── styles.css # Original -├── pixel-art.css # ❌ Ya no se usa -└── pixel-sections.css # ❌ Ya no se usa -``` - ---- - -## 🚀 Flujo de Trabajo - -### Para hacer cambios visuales: - -1. **Editar contenido:** - ```bash - vim src/server/views/pages/index.ejs - ``` - -2. **Editar estilos:** - ```bash - vim src/server/public/assets/css/modern-pixel.css - ``` - -3. **Reiniciar servidor:** - ```bash - npm run server - ``` - -4. **Limpiar caché del navegador:** - - `Ctrl + Shift + R` (hard reload) - - O modo incógnito: `Ctrl + Shift + N` - ---- - -## ⚠️ Notas Importantes - -### Parámetros de Versión -Los archivos CSS tienen `?v=2.0.0` para forzar recargas: -```html -href="/assets/css/modern-pixel.css?v=2.0.0" -``` - -### Sistema de Caché -El servidor usa **ETags** para caché. Si haces cambios y no se ven: -1. Reinicia el servidor (nuevo ETag) -2. Hard reload en navegador (`Ctrl + Shift + R`) - -### Await en Includes -Los partials usan `await include()`: -```ejs -<%- await include('../partials/navbar') %> -``` - -Esto es necesario para el renderizado asíncrono de EJS. - ---- - -## 📋 Checklist de Edición - -Antes de editar, verifica: -- [ ] ¿Estás editando `/pages/index.ejs`? (no el antiguo `/views/index.ejs`) -- [ ] ¿Los cambios CSS están en `modern-pixel.css`? (no en `pixel-art.css`) -- [ ] ¿El layout carga los CSS correctos? -- [ ] ¿Reiniciaste el servidor después de cambios? - ---- - -**Fecha**: Octubre 2025 -**Autor**: Amayo Dev Team -**Estado**: ✅ Estructura actualizada y optimizada diff --git a/src/server/public/assets/images/boton_entrar.svg b/src/server/public/assets/images/boton_entrar.svg index b460900..1fd44b0 100644 --- a/src/server/public/assets/images/boton_entrar.svg +++ b/src/server/public/assets/images/boton_entrar.svg @@ -1,8 +1,8 @@ - + - + \ No newline at end of file diff --git a/src/server/views/index.ejs b/src/server/views/index.ejs new file mode 100644 index 0000000..0fd2639 --- /dev/null +++ b/src/server/views/index.ejs @@ -0,0 +1,122 @@ +<% const pageTitle = `${appName} | Guía Completa`; %> +<% const head = null; %> +<% const scripts = null; %> +<% const title = pageTitle; %> +<% layout('layouts/layout', { title, head, scripts, appName, version, djsVersion, currentDateHuman }); %> + +
+
+
+ +
+ +
+ <%= appName %> • v<%= version %> +
+ +
+ + +
+

+ Guía Completa +

+

+ <%= appName %> +

+
+ + +
+ ✦ + + ✦ + + ✦ +
+ + +
+

+ Sistema completo de + economía, + minijuegos, + misiones y + IA + para Discord +

+
+ + +
+ + Comenzar ahora + + + +
+ +
+ + +
+
+ + Discord.js <%= djsVersion %> +
+
+ ✦ + Actualizado: <%= currentDateHuman %> +
+
+ 23 Secciones • Creación de Contenido +
+
+
+ + + +
+
+ +
+ <%- include('partials/toc') %> + +
+
+ <%- include('partials/sections/primeros-pasos') %> + <%- include('partials/sections/comandos-basicos') %> + <%- include('partials/sections/sistema-juego') %> + <%- include('partials/sections/minijuegos') %> + <%- include('partials/sections/inventario-equipo') %> + <%- include('partials/sections/economia') %> + <%- include('partials/sections/tienda') %> + <%- include('partials/sections/crafteo') %> + <%- include('partials/sections/logros') %> + <%- include('partials/sections/misiones') %> + <%- include('partials/sections/racha') %> + <%- include('partials/sections/consumibles') %> + <%- include('partials/sections/cofres') %> + <%- include('partials/sections/encantamientos') %> + <%- include('partials/sections/fundicion') %> + <%- include('partials/sections/ia') %> + <%- include('partials/sections/recordatorios') %> + <%- include('partials/sections/alianzas') %> + <%- include('partials/sections/admin') %> + <%- include('partials/sections/creacion-contenido') %> + <%- include('partials/sections/configuracion') %> + <%- include('partials/sections/estadisticas') %> + <%- include('partials/sections/tips') %> + <%- include('partials/sections/faq') %> +
+
+
+
+
diff --git a/src/server/views/pages/index.ejs b/src/server/views/pages/index.ejs index 83dba98..ab48511 100644 --- a/src/server/views/pages/index.ejs +++ b/src/server/views/pages/index.ejs @@ -43,8 +43,11 @@
- - Comenzar ahora + + Comenzar ahora + + +