# 📋 Análisis Completo: Migración Radoc Bikes al Sistema CD-System

## 🎯 Objetivo
Extraer todas las customizaciones, datos y configuraciones del proyecto Radoc Bikes (arquitectura antigua) y adaptarlas al nuevo sistema modular de CD-System con el demo `demo-product-landing`.

---

## 📊 Estado Actual: Radoc Bikes

### Arquitectura Actual (Antigua)
- **Demo usado:** `demo-product-landing` (CSS) + `demo-law-firm-2` (JS) - **Mezcla de demos**
- **Estructura:** Vistas en `resources/views/front/` (no modular)
- **Configuración:** `config/cd-system.php` sin configuración de demo específica
- **Partials:** Header y Footer en `resources/views/layout/front/partials/`

---

## ✅ Lo que YA existe en Radoc Bikes

### 1. Archivos Base del Demo
- ✅ `public/template/css/demos/demo-product-landing.css` - **EXISTE**
- ✅ `public/template/css/skins/skin-product-landing.css` - **EXISTE**
- ⚠️ `public/template/js/demos/demo-law-firm-2.js` - **MEZCLADO** (debería ser `demo-product-landing.js`)

### 2. Assets Customizados
- ✅ `public/cd-project/img/demos/product-landing/` - **EXISTE con imágenes customizadas**
  - `homepage/` - Videos y banners
  - `backgrounds/` - Fondos
  - `product-*.jpg/png` - Imágenes de productos
  - `logo.png` - Logo del demo
- ✅ `public/cd-project/img/products/` - Imágenes de productos (radoc-naranja, radoc-negra, radoc-violeta)
- ✅ `public/cd-project/img/logos/` - Logos del proyecto
- ✅ `public/cd-project/img/favicon/` - Favicons

### 3. CSS/JS Customizados
- ✅ `public/css/custom.css` - Estilos customizados
- ✅ `public/css/carousel-fix.css` - Fixes para carousel
- ✅ `public/css/gsap-section-scale.css` - Efectos GSAP
- ✅ `public/js/carousel-fix.js` - Fixes para carousel
- ✅ `public/js/gsap-section-scale.js` - Efectos GSAP

### 4. Configuración del Proyecto
- ✅ `config/site.php` - Configuración completa del sitio
- ✅ `config/projectTexts.json` - Textos del proyecto (100+ textos)
- ✅ `config/cd-system.php` - Configuración del sistema (sin demo específico)

### 5. Vistas Frontend (Estructura Antigua)
- ✅ `resources/views/front/welcome.blade.php` - Página principal
- ✅ `resources/views/front/about.blade.php` - Página "Nosotros"
- ✅ `resources/views/front/contact.blade.php` - Página de contacto
- ✅ `resources/views/front/homepage.blade.php` - Homepage alternativa
- ✅ `resources/views/front/one-factory.blade.php` - Página producto Factory
- ✅ `resources/views/front/one-select.blade.php` - Página producto Select
- ✅ `resources/views/front/one-ultra.blade.php` - Página producto Ultra
- ✅ `resources/views/front/blog/` - Vistas de blog

### 6. Partials (Layout)
- ✅ `resources/views/layout/front/partials/_header.blade.php` - Header customizado
- ✅ `resources/views/layout/front/partials/_footer.blade.php` - Footer customizado
- ✅ `resources/views/layout/front/partials/_styles.blade.php` - Estilos
- ✅ `resources/views/layout/front/partials/_scripts.blade.php` - Scripts

### 7. Datos del Proyecto (Seeders)
- ✅ `database/seeders/project-data/products.json` - Productos
- ✅ `database/seeders/project-data/services.json` - Servicios (si aplica)
- ✅ `database/seeders/project-data/blog.json` - Posts de blog
- ✅ `database/seeders/project-data/gallery.json` - Galería
- ✅ `database/seeders/project-data/team.json` - Equipo

---

## ❌ Lo que FALTA en el Nuevo Sistema CD-System

### 1. Configuración del Demo
- ❌ Layout mapping en `app/helpers.php` → `get_demo_layout_mapping()`
- ❌ Configuración de demo en `config/cd-system.php` (ya está, pero verificar)

### 2. Vistas Blade del Demo (Nueva Estructura)
- ❌ `resources/views/layout/front/headers/demo-product-landing.blade.php`
- ❌ `resources/views/layout/front/footers/demo-product-landing.blade.php`
- ❌ `resources/views/modules/cd-base/frontend/demos/demo-product-landing/welcome.blade.php`
- ❌ `resources/views/modules/cd-base/frontend/demos/demo-product-landing/about.blade.php`
- ❌ `resources/views/modules/cd-base/frontend/demos/demo-product-landing/contact.blade.php`

### 3. JavaScript Correcto
- ❌ Verificar/corregir: usar `demo-product-landing.js` en lugar de `demo-law-firm-2.js`

---

## 🔄 Plan de Migración

### FASE 1: Análisis y Preparación (1 hora)

#### 1.1: Revisar Configuración Actual
- [ ] Revisar `config/site.php` completo
- [ ] Revisar `config/projectTexts.json` completo
- [ ] Revisar `config/cd-system.php` y verificar configuración de demo
- [ ] Documentar todas las rutas customizadas

#### 1.2: Inventariar Assets
- [ ] Listar todas las imágenes en `public/cd-project/img/demos/product-landing/`
- [ ] Verificar que todas las imágenes referenciadas existan
- [ ] Documentar imágenes que necesitan copiarse a cd-system

#### 1.3: Inventariar Customizaciones CSS/JS
- [ ] Revisar `public/css/custom.css` - Extraer estilos específicos del demo
- [ ] Revisar `public/css/carousel-fix.css` - Ver si es genérico o específico
- [ ] Revisar `public/css/gsap-section-scale.css` - Ver si es genérico o específico
- [ ] Revisar `public/js/carousel-fix.js` - Ver si es genérico o específico
- [ ] Revisar `public/js/gsap-section-scale.js` - Ver si es genérico o específico

---

### FASE 2: Extracción de Vistas (3-4 horas)

#### 2.1: Header
**Origen:** `radocbikes/resources/views/layout/front/partials/_header.blade.php`
**Destino:** `cd-system/resources/views/layout/front/headers/demo-product-landing.blade.php`

**Adaptaciones necesarias:**
- [ ] Mantener estructura y clases CSS
- [ ] Adaptar navegación a sistema dinámico: `get_dynamic_navigation('header')`
- [ ] Mantener rutas customizadas (one-factory, one-select, one-ultra)
- [ ] Verificar que logo y assets usen `asset()` correctamente
- [ ] Adaptar clases de header según demo

**Rutas customizadas a mantener:**
- `route('welcome')` → `route('front.homepage')`
- `route('one-factory')` → Mantener (páginas de productos)
- `route('one-select')` → Mantener (páginas de productos)
- `route('one-ultra')` → Mantener (páginas de productos)
- `url('/about')` → `route('front.about')`
- `url('/blog')` → `route('blog.index')` o `route('frontend.blog.index')`
- `url('/contact')` → `route('front.contact')`

#### 2.2: Footer
**Origen:** `radocbikes/resources/views/layout/front/partials/_footer.blade.php`
**Destino:** `cd-system/resources/views/layout/front/footers/demo-product-landing.blade.php`

**Adaptaciones necesarias:**
- [ ] Mantener estructura y clases CSS
- [ ] Adaptar navegación a sistema dinámico: `get_dynamic_navigation('footer')`
- [ ] Mantener sección de "Modelos" (One Factory, One Select, One Ultra)
- [ ] Adaptar redes sociales: `config('site.social_media')`
- [ ] Adaptar contacto: `config('site.contact.*')`
- [ ] Verificar manejo seguro de Collections

#### 2.3: Welcome (Página Principal)
**Origen:** `radocbikes/resources/views/front/welcome.blade.php`
**Destino:** `cd-system/resources/views/modules/cd-base/frontend/demos/demo-product-landing/welcome.blade.php`

**Adaptaciones necesarias:**
- [ ] Mantener hero section con video background
- [ ] Mantener sección de productos (carousel de modelos)
- [ ] Mantener sección de testimonios
- [ ] Adaptar rutas de productos
- [ ] Integrar módulos dinámicamente: `@if(is_module_active('products'))`
- [ ] Usar variables globales: `$featuredProducts`, `$recentPosts`, etc.
- [ ] Mantener efectos GSAP y animaciones

**Secciones clave a mantener:**
1. Hero Section con video background
2. Sección "Conoce Nuestra Serie ONE" (carousel de productos)
3. Sección Parallax
4. Sección "Los Expertos Opinan" (testimonios)

#### 2.4: About (Nosotros)
**Origen:** `radocbikes/resources/views/front/about.blade.php`
**Destino:** `cd-system/resources/views/modules/cd-base/frontend/demos/demo-product-landing/about.blade.php`

**Adaptaciones necesarias:**
- [ ] Mantener hero section
- [ ] Mantener sección "Historia"
- [ ] Mantener sección "Misión"
- [ ] Mantener sección "Filosofía"
- [ ] Adaptar breadcrumbs: `route('front.homepage')`, `route('front.about')`
- [ ] Integrar módulos si aplica

#### 2.5: Contact (Contacto)
**Origen:** `radocbikes/resources/views/front/contact.blade.php`
**Destino:** `cd-system/resources/views/modules/cd-base/frontend/demos/demo-product-landing/contact.blade.php`

**Adaptaciones necesarias:**
- [ ] Mantener hero section
- [ ] Mantener formulario de contacto: `route('front.contact.store')`
- [ ] Mantener sección de contacto directo (WhatsApp, Teléfono, Email)
- [ ] Adaptar información de contacto: `config('site.contact.*')`
- [ ] Mantener Google Maps si aplica

---

### FASE 3: Extracción de Assets (1 hora)

#### 3.1: Imágenes del Demo
**Origen:** `radocbikes/public/cd-project/img/demos/product-landing/`
**Destino:** `cd-system/public/cd-project/img/demos/product-landing/`

**Archivos a copiar:**
- [ ] `homepage/` - Videos y banners
- [ ] `backgrounds/` - Fondos
- [ ] `product-*.jpg/png` - Imágenes de productos
- [ ] `logo.png` - Logo del demo
- [ ] `noise.jpg` - Textura
- [ ] `client-*.jpg` - Clientes/testimonios

#### 3.2: Imágenes de Productos
**Origen:** `radocbikes/public/cd-project/img/products/`
**Destino:** `cd-system/public/cd-project/img/products/` (o mantener en proyecto específico)

**Archivos:**
- [ ] `radoc-naranja.jpg/png`
- [ ] `radoc-negra.jpg/png`
- [ ] `radoc-violeta.jpg/png`

#### 3.3: Logos y Favicons
**Origen:** `radocbikes/public/cd-project/img/logos/` y `radocbikes/public/cd-project/img/favicon/`
**Destino:** Mantener en proyecto específico (no copiar a cd-system)

---

### FASE 4: Extracción de CSS/JS Customizados (1-2 horas)

#### 4.1: CSS Customizado
**Revisar y decidir:**
- [ ] `public/css/custom.css` - ¿Es específico del demo o genérico?
  - Si es específico: crear `demo-product-landing-custom.css`
  - Si es genérico: mantener en proyecto
- [ ] `public/css/carousel-fix.css` - ¿Es específico del demo o genérico?
- [ ] `public/css/gsap-section-scale.css` - ¿Es específico del demo o genérico?

#### 4.2: JavaScript Customizado
**Revisar y decidir:**
- [ ] `public/js/carousel-fix.js` - ¿Es específico del demo o genérico?
- [ ] `public/js/gsap-section-scale.js` - ¿Es específico del demo o genérico?
- [ ] Verificar que se use `demo-product-landing.js` en lugar de `demo-law-firm-2.js`

---

### FASE 5: Configuración en CD-System (30 min)

#### 5.1: Layout Mapping
**Archivo:** `cd-system/app/helpers.php`

**Agregar en `get_demo_layout_mapping()`:**
```php
'demo-product-landing' => [
    'header' => 'demo-product-landing',
    'footer' => 'demo-product-landing',
    'sidebar' => 'default',
    'description' => 'Template para landing pages de productos',
    'features' => ['product-showcase', 'features', 'pricing', 'testimonials', 'cta', 'video-background'],
    'extensions' => [
        'js' => true,  // Tiene JS base de Porto (demo-product-landing.js)
        'css' => false, // Verificar si necesita CSS custom
    ],
],
```

#### 5.2: Verificar Skin Mapping
**Archivo:** `cd-system/app/helpers.php`

**Verificar que existe:**
```php
'demo-product-landing' => 'skin-product-landing',
```

---

### FASE 6: Datos del Proyecto (1 hora)

#### 6.1: Productos
**Origen:** `radocbikes/database/seeders/project-data/products.json`
**Destino:** Mantener en proyecto específico o adaptar a seeders de cd-system

**Datos clave:**
- Categorías: Bicicletas Eléctricas de Montaña, Enduro, Downhill
- Productos: RADOC ONE Select, Ultra, Factory
- Tags: Motor Mid-Drive, Batería LG, Marco de Carbono, etc.

#### 6.2: Textos del Proyecto
**Origen:** `radocbikes/config/projectTexts.json`
**Destino:** Adaptar a `cd-system/config/projectTexts.json` o mantener en proyecto

**Textos clave:**
- 100+ textos personalizados
- SEO metadata
- Redes sociales
- Contacto
- Footer navigation

#### 6.3: Configuración del Sitio
**Origen:** `radocbikes/config/site.php`
**Destino:** Mantener en proyecto específico (no copiar a cd-system)

**Configuraciones clave:**
- Nombre: "Radoc Bikes | Bicicletas de Montaña Premium"
- Fuentes: Myriad Pro y Satoshi (locales)
- Redes sociales: Instagram, WhatsApp, LinkedIn
- Contacto: Email, teléfono, dirección

---

## 📋 Checklist de Migración Completo

### Pre-Migración:
- [ ] Análisis completo de estructura actual
- [ ] Inventario de assets
- [ ] Inventario de customizaciones CSS/JS
- [ ] Documentación de rutas customizadas

### Migración de Vistas:
- [ ] Header extraído y adaptado
- [ ] Footer extraído y adaptado
- [ ] Welcome extraído y adaptado
- [ ] About extraído y adaptado
- [ ] Contact extraído y adaptado

### Migración de Assets:
- [ ] Imágenes del demo copiadas
- [ ] Imágenes de productos identificadas
- [ ] Logos y favicons identificados (mantener en proyecto)

### Migración de CSS/JS:
- [ ] CSS customizado revisado y clasificado
- [ ] JS customizado revisado y clasificado
- [ ] JavaScript del demo corregido (demo-product-landing.js)

### Configuración:
- [ ] Layout mapping agregado en helpers.php
- [ ] Skin mapping verificado
- [ ] Configuración de demo verificada

### Datos:
- [ ] Productos documentados
- [ ] Textos del proyecto documentados
- [ ] Configuración del sitio documentada

### Validación:
- [ ] Todas las vistas funcionan correctamente
- [ ] Assets cargan correctamente
- [ ] Rutas funcionan correctamente
- [ ] Responsive verificado
- [ ] JavaScript funciona correctamente

---

## 🎯 Rutas Customizadas de Radoc Bikes

### Rutas de Productos (Específicas del Proyecto)
- `route('one-factory')` → Página del modelo Factory
- `route('one-select')` → Página del modelo Select
- `route('one-ultra')` → Página del modelo Ultra

**Nota:** Estas rutas son específicas del proyecto y deben mantenerse en el proyecto, no en cd-system.

### Rutas Estándar (Adaptar)
- `route('welcome')` → `route('front.homepage')`
- `url('/about')` → `route('front.about')`
- `url('/blog')` → `route('blog.index')` o `route('frontend.blog.index')`
- `url('/contact')` → `route('front.contact')`

---

## ⚠️ Puntos Críticos

### 1. Mezcla de Demos
**Problema:** Radoc Bikes usa `demo-product-landing.css` pero `demo-law-firm-2.js`
**Solución:** Verificar y usar `demo-product-landing.js` correctamente

### 2. Rutas Customizadas
**Problema:** Rutas específicas del proyecto (one-factory, one-select, one-ultra)
**Solución:** Mantener en proyecto específico, no migrar a cd-system

### 3. Assets Específicos del Proyecto
**Problema:** Logos, favicons, imágenes de productos son específicos
**Solución:** Mantener en proyecto, solo migrar assets genéricos del demo

### 4. CSS/JS Customizado
**Problema:** Diferenciar entre customizaciones del demo vs. del proyecto
**Solución:** Revisar cada archivo y clasificar

---

## 📚 Archivos de Referencia

### En Radoc Bikes:
- `resources/views/layout/front/partials/_header.blade.php`
- `resources/views/layout/front/partials/_footer.blade.php`
- `resources/views/front/welcome.blade.php`
- `resources/views/front/about.blade.php`
- `resources/views/front/contact.blade.php`
- `config/site.php`
- `config/projectTexts.json`
- `public/cd-project/img/demos/product-landing/`

### En CD-System (Ejemplos):
- `resources/views/layout/front/headers/demo-architecture-2.blade.php`
- `resources/views/layout/front/footers/demo-architecture-2.blade.php`
- `resources/views/modules/cd-base/frontend/demos/demo-architecture-2/welcome.blade.php`

---

## ✅ Resultado Esperado

Después de la migración completa:

1. ✅ Demo `demo-product-landing` completamente funcional en cd-system
2. ✅ Header y Footer adaptados al nuevo sistema
3. ✅ Vistas Welcome, About, Contact adaptadas
4. ✅ Assets del demo copiados
5. ✅ CSS/JS customizado clasificado y adaptado
6. ✅ Configuración completa en helpers.php
7. ✅ Proyecto Radoc Bikes puede usar el demo desde cd-system
8. ✅ Customizaciones específicas del proyecto mantenidas en el proyecto

---

**Última actualización:** {{ date('Y-m-d') }}  
**Versión:** 1.0  
**Estado:** 📋 Análisis Completo - Listo para Migración