🎯✨ Advanced Number Game - Quantum Scientific Gaming Platform

"La verdadera inteligencia no está en adivinar al azar, sino en construir estrategias con datos reales" 🧠

Una plataforma de juego científico que combina 5 algoritmos de generación aleatoria, análisis de patrones con ML, control por voz, PWA offline, GSAP animations y soporte para 11 idiomas incluyendo RTL completo. Construida con Angular 17, TypeScript 5 y GSAP — diseño Neon Cyber AI, eficiencia energética y código abierto.

🌐 Vista Previa

🔮 ┌─────────────────────────────────────────────────────────────────┐ 🔮
⚛️  │  🎯 ADVANCED NUMBER GAME v3 — SCIENTIFIC GAMING PLATFORM 🧠   │  ⚛️
🌟 │                                                                 │ 🌟
⚡ │  🎮 5 Algoritmos    🌍 11 Idiomas    🎙️ Control Voz    🌱 Verde │ ⚡
🎯 │  🔒 Crypto Secure   ⚛️ Quantum-Inspired   🔀 Mersenne Twister  │ 🎯
🔮 │  📊 Analytics ML    🏆 Achievements  👑 Ranking Global  PWA    │ 🔮
💎 │                                                                 │ 💎
🌈 └─────────────────────────────────────────────────────────────────┘ 🌈

✨ Características Principales

🧮 5 Algoritmos Científicos

🎲 Simple Random — Math.random() estándar · Complejidad O(1) · Para juego casual
📐 Linear Congruential (LCG) — Determinístico reproducible con semilla · Período 2³²
🌀 Mersenne Twister (MT19937) — Alta calidad estadística · Período 2¹⁹⁹³⁷⁻¹
🔒 Crypto-Secure — Entropía a nivel hardware/OS · Para máxima imprevisibilidad
⚛️ Quantum-Inspired — Simulación de superposición cuántica · Para investigación

💡 Todos los algoritmos corren 100% en el navegador — TypeScript puro, sin backend, sin servidor.

🌍 Sistema Multiidioma — 11 Lenguas

🎯 Selector de Idiomas Inteligente

🎨 Selector Visual en Header — Dropdown con banderas y nombres nativos
⚡ Cambio Instantáneo — Switching en tiempo real sin recargar la página
💾 Persistencia Automática — Preferencia guardada en localStorage
🔄 Detección del Navegador — Idioma inicial según la configuración del sistema
↔️ Soporte RTL/LTR — Cambio completo de dirección para árabe y hebreo

🗣️ Idiomas Soportados

🇪🇸 Español — Idioma principal nativo
🇬🇧 English — Soporte internacional completo
🇫🇷 Français — Mercado europeo francófono
🇧🇷 Português — Mercado latinoamericano y brasileño
🇷🇺 Русский — Comunidad tech rusa
🇹🇷 Türkçe — Mercado turco emergente
🇸🇦 العربية — Soporte RTL completo ← derecha a izquierda
🇮🇱 עברית — Soporte RTL completo ← derecha a izquierda
🇰🇷 한국어 — Comunidad tech coreana
🇯🇵 日本語 — Mercado japonés
🇨🇳 中文 — Mercado asiático

🎮 Experiencia de Juego Avanzada

🎯 6 Niveles de Dificultad — Principiante (1-10) hasta Pesadilla (1-1000)
⏱️ Límites de Tiempo — Contador regresivo adaptativo por dificultad
🧠 Dificultad Adaptativa — La IA ajusta el reto según tu rendimiento
🔍 Detección de Patrones — Analiza tus estrategias de adivinanza
🤖 Asistente IA — Sugerencias basadas en tu historial de juego
🎙️ Control por Voz — Web Speech API nativa — di el número en voz alta

📊 Analytics & Machine Learning

📈 Gráficos Chart.js — Historial de rendimiento y distribución en tiempo real
🧬 Análisis de Patrones — Detecta progresión aritmética, búsqueda binaria, etc.
📉 Tendencias de Mejora — Comparación primera vs segunda mitad de partidas
🎯 Recomendaciones — Sugerencias de dificultad y algoritmo basadas en datos
💾 Exportación de Datos — Descarga tu historial en JSON

🏆 Sistema de Logros y Gamificación

🥇 Primera Victoria — Gana tu primer juego (Common · 10pts)
🎯 Perfeccionista — Gana en el primer intento (Legendary · 100pts)
⚡ Demonio de Velocidad — Gana en menos de 10 segundos (Rare · 50pts)
💪 Persistente — Completa 50 partidas (Uncommon · 25pts)
🧮 Explorador — Usa todos los algoritmos disponibles (Epic · 150pts)
⚛️ Pionero Cuántico — Gana con el algoritmo Quantum-Inspired (Legendary · 200pts)

✨ Diseño y Animaciones

🎨 Paleta Neon Cyber AI — #00f5ff cyan · #7c3aed violeta · #f472b6 rosa
🚀 GSAP Animations — Reemplaza AOS — transiciones fluidas de 60fps
🌐 Grid Background Animado — Cuadrícula que se desplaza sutilmente
💫 Glow Effects — Sombras neón reactivas al hover
🎭 Glassmorphism — backdrop-filter: blur(20px) en header y cards
📱 Responsive — Optimizado móvil, tablet y desktop
♿ Accesible — WCAG AA, foco visible, soporte prefers-reduced-motion

🌱 Sostenibilidad — Green Computing

♻️ Bundle < 1.5MB — Verificado automáticamente en cada build
📵 Offline-First — Service Worker, funciona sin internet → menos datos → menos CO₂
⚡ Performance budget — Lighthouse score objetivo > 90
🌿 Sin dependencias pesadas — Solo lo necesario, sin librerías gigantes

🛠️ Stack Tecnológico

🎯 Frontend — 100% cliente, sin backend

⚡ Angular 17            // Framework — Standalone Components, Signals
🔷 TypeScript 5.4        // Tipado estricto, decoradores, generics
🎨 GSAP 3.12            // Animaciones profesionales — sin AOS
📊 Chart.js 4.4         // Visualizaciones interactivas de datos
🌐 Custom i18n Service  // Sistema de 11 idiomas — sin librerías externas
🎙️ Web Speech API       // Control por voz nativo del navegador
💾 Service Worker        // PWA — cache offline automático

🔬 Algoritmos Implementados

🎲 Simple Random         // Math.random() — O(1) — Distribución uniforme
📐 LCG (Knuth)          // a=1664525, c=1013904223, m=2³² — Determinístico
🌀 Mersenne Twister      // MT19937 completo — Período 2¹⁹⁹³⁷⁻¹
🔒 Crypto-Secure         // crypto.getRandomValues() — Entropía hardware
⚛️ Quantum-Inspired     // 8 qubits simulados — Superposición + medición

🤖 Automatización CI/CD

🔍 validate-i18n.js      // Verifica que los 11 idiomas tengan todas las keys
📦 generate-version.js   // Crea version.json para auto-update en cada build
📋 generate-changelog.js // Genera CHANGELOG desde git log automáticamente
📏 check-bundle-size.js  // Falla el build si bundle > 1.5MB
📊 i18n-report.js        // Reporte de cobertura de traducciones
🚀 ci-cd.yml             // Lint → i18n → Tests → Build → Deploy
📦 release.yml           // Bump semver → Changelog → GitHub Release
🌍 i18n-sync.yml         // Valida traducciones al modificar archivos i18n

🚀 Demo y Despliegue

🌐 Demo en Vivo

🔗 https://lizzy0981.github.io/advanced-number-game/

⚡ Instalación Rápida

# 1️⃣ Clonar el repositorio
git clone https://github.com/Lizzy0981/advanced-number-game.git
cd advanced-number-game

# 2️⃣ Instalar dependencias
npm install

# 3️⃣ Servidor de desarrollo
npm start
# → http://localhost:4200

# 4️⃣ Validar los 11 idiomas
npm run validate-i18n
# → ✅ All 11 languages validated successfully

# 5️⃣ Build de producción
npm run build:github
# → Genera /docs para GitHub Pages + version.json

📁 Estructura de Archivos

📂 advanced-number-game/
│
├── 📄 README.md                          # 📖 Documentación completa
├── 📄 LICENSE                            # ⚖️ Licencia MIT 2026
├── 📄 package.json                       # 📦 Dependencias y scripts npm
├── 📄 angular.json                       # ⚙️ Configuración Angular CLI
├── 📄 tsconfig.json                      # 🔷 TypeScript base
├── 📄 tsconfig.app.json                  # 🔷 TypeScript para la app
├── 📄 tsconfig.spec.json                 # 🔷 TypeScript para tests Jest
├── 📄 ngsw-config.json                   # 📱 PWA — Service Worker config
├── 📄 .gitignore                         # 🚫 node_modules, dist, .angular
│
├── 📂 .github/
│   └── 📂 workflows/
│       ├── 📄 ci-cd.yml                  # 🚀 Lint → i18n → Test → Build → Deploy
│       ├── 📄 release.yml                # 📦 Bump de versión y GitHub Release
│       └── 📄 i18n-sync.yml              # 🌍 Validación automática de traducciones
│
├── 📂 scripts/                           # 🔧 Automatización — Node.js puro
│   ├── 📄 validate-i18n.js               # ✅ Verifica 11 idiomas vs referencia (es)
│   ├── 📄 generate-version.js            # 📋 Crea docs/version.json en cada build
│   ├── 📄 generate-changelog.js          # 📝 Changelog automático desde git log
│   ├── 📄 check-bundle-size.js           # 📏 Bloquea CI si bundle > 1.5MB
│   └── 📄 i18n-report.js                 # 📊 Reporte JSON de cobertura de idiomas
│
├── 📂 src/
│   ├── 📄 index.html                     # 🏠 HTML base — Google Fonts (11 idiomas)
│   ├── 📄 main.ts                        # ⚡ Bootstrap Angular 17 standalone
│   ├── 📄 styles.scss                    # 🎨 Reset global + fuente por idioma
│   ├── 📄 favicon.svg                    # 🎯 Icono SVG con gradiente cyan→violet
│   ├── 📄 manifest.webmanifest           # 📱 Configuración PWA instalable
│   ├── 📄 test-setup.ts                  # 🧪 Setup de Jest + Testing Library
│   │
│   ├── 📂 assets/
│   │   └── 📂 icons/                     # 📱 Iconos PWA (agregar icon-192.png y icon-512.png)
│   │
│   ├── 📂 environments/
│   │   ├── 📄 environment.ts             # 🔧 Desarrollo — apiUrl localhost
│   │   └── 📄 environment.prod.ts        # 🚀 Producción — apiUrl Railway (futuro)
│   │
│   └── 📂 app/
│       ├── 📄 app.component.ts           # 🎮 Lógica principal — 522 líneas
│       ├── 📄 app.component.html         # 🖥️ Template Angular — 582 líneas
│       ├── 📄 app.component.scss         # 🎨 Design system completo — 923 líneas
│       ├── 📄 app.config.ts              # ⚙️ Providers Angular standalone
│       │
│       ├── 📂 i18n/                      # 🌍 Internacionalización runtime
│       │   ├── 📄 i18n.service.ts        # 🔧 Servicio con Angular Signals
│       │   └── 📂 translations/
│       │       ├── 📄 index.ts           # 📦 Barrel — exporta los 11 idiomas
│       │       ├── 📄 es.ts              # 🇪🇸 Español    — referencia principal
│       │       ├── 📄 en.ts              # 🇬🇧 Inglés
│       │       ├── 📄 fr.ts              # 🇫🇷 Francés
│       │       ├── 📄 pt.ts              # 🇧🇷 Portugués
│       │       ├── 📄 ru.ts              # 🇷🇺 Ruso
│       │       ├── 📄 tr.ts              # 🇹🇷 Turco
│       │       ├── 📄 ar.ts              # 🇸🇦 Árabe    ← RTL
│       │       ├── 📄 he.ts              # 🇮🇱 Hebreo   ← RTL
│       │       ├── 📄 ko.ts              # 🇰🇷 Coreano
│       │       ├── 📄 ja.ts              # 🇯🇵 Japonés
│       │       └── 📄 zh.ts              # 🇨🇳 Chino
│       │
│       ├── 📂 core/
│       │   ├── 📂 services/              # 🔧 Servicios globales (futuras features)
│       │   └── 📂 guards/                # 🛡️ Route guards (futuras features)
│       │
│       ├── 📂 shared/
│       │   └── 📂 components/            # 🧩 Componentes reutilizables (futuras features)
│       │
│       └── 📂 features/                  # 📦 Feature modules (futuras features)
│           ├── 📂 game/
│           ├── 📂 analytics/
│           ├── 📂 achievements/
│           ├── 📂 leaderboard/
│           └── 📂 education/
│
└── 📂 docs/                              # 🚀 Build producción → GitHub Pages
    ├── 📄 index.html                     # 🏠 App compilada y optimizada
    ├── 📄 version.json                   # 📋 Versión + metadata para auto-update
    └── 📄 ...                            # 🏗️ Assets compilados por Angular CLI

🎮 Guía de Uso

1️⃣ Inicio Rápido

🚀 Carga la aplicación → Paleta Neon Cyber AI se inicializa con GSAP
🌍 Selecciona tu idioma → Selector en el header con banderas
🎯 Elige dificultad → 6 niveles desde Principiante hasta Pesadilla
⚛️ Elige algoritmo → 5 opciones científicas con descripción
▶️ Presiona "Nuevo Juego" → Empieza la partida

2️⃣ Cambiar Idioma

🌐 Ubicación → Header, esquina superior derecha
🖱️ Acción → Click en el botón con bandera actual
📋 Opciones → Menú con 11 idiomas y nombres nativos
✅ Selección → Click en tu idioma preferido
⚡ Resultado → Cambio instantáneo sin recargar
↔️ RTL → Árabe y Hebreo cambian la dirección de toda la UI
💾 Persistencia → Tu selección se guarda automáticamente

3️⃣ Control por Voz

🎙️ Activa la opción "Control por Voz" en Opciones avanzadas
🔴 Presiona el botón de micrófono durante el juego
🗣️ Di el número en voz alta en tu idioma
✅ El número se captura y se envía automáticamente
⚠️ Requiere Chrome/Edge — Firefox no soporta Web Speech API

4️⃣ Agregar un Idioma Nuevo

// 1. Crear src/app/i18n/translations/XX.ts con la misma estructura que es.ts
// 2. Agregar el import en translations/index.ts
// 3. Agregar la metadata en i18n.service.ts (flag, dir, locale)
// 4. Ejecutar: npm run validate-i18n → debe mostrar ✅

🔧 Configuración para GitHub Pages

⚙️ Pasos de Despliegue

# 1️⃣ Asegúrate de que el build funciona
npm run build:github

# 2️⃣ Commit y push
git add .
git commit -m "feat: deploy advanced number game v3"
git push origin main

# 3️⃣ Activar GitHub Pages
# Repository → Settings → Pages → Source: GitHub Actions

# 4️⃣ Verificar pipeline
# Repository → Actions → CI/CD — Build, Test & Deploy
# ✅ Lint → ✅ i18n → ✅ Tests → ✅ Build → ✅ Deploy

# 5️⃣ App live en:
# https://lizzy0981.github.io/advanced-number-game/

📋 Checklist de Deployment

✅ angular.json con outputPath: "docs" y baseHref: "/advanced-number-game/"
✅ ngsw-config.json configurado para PWA offline
✅ docs/version.json generado por generate-version.js
✅ Los 11 idiomas validados por validate-i18n.js
✅ Bundle < 1.5MB verificado por check-bundle-size.js
✅ GitHub Pages activado con Source: GitHub Actions

📊 Métricas de Performance

⚡ Objetivos Lighthouse

🎯 Performance:     > 90     // Bundle optimizado + lazy loading
♿ Accessibility:   > 95     // WCAG AA — foco visible — ARIA labels
🔍 SEO:            > 90     // Meta tags + estructura semántica
💡 Best Practices: > 95     // HTTPS — sin errores consola
📱 PWA:            > 90     // Service Worker — offline — installable
🌍 i18n Coverage:  100%     // Todos los idiomas con todas las keys

📈 Métricas de Carga

⚡ Bundle total:    < 1.5MB  // Verificado en cada build automáticamente
🔄 Language switch: < 50ms  // Sin recarga — solo Angular Signal update
🎨 GSAP animations: 60fps   // Hardware-accelerated CSS transforms
📊 Chart render:   < 200ms  // Chart.js con datos históricos locales
🎙️ Voice detect:   < 500ms  // Web Speech API nativa del navegador

🔒 Seguridad y Privacidad

🛡️ Características

🔐 Procesamiento Local — Los datos del juego nunca salen del navegador
🚫 Sin Tracking — Cero analíticas externas, cero cookies de terceros
💾 Solo localStorage — Historial de partidas e idioma guardados localmente
🔒 HTTPS Only — GitHub Pages garantiza comunicación encriptada
🌱 Sostenible — Sin peticiones externas innecesarias en cada partida

🔮 Roadmap

✅ v1.0.0 — Completado

🌍 11 idiomas con validación automática CI/CD
⚛️ 5 algoritmos científicos — 100% cliente, sin backend
🎙️ Control por voz Web Speech API
🚀 GSAP — reemplaza AOS
🤖 CI/CD completo con GitHub Actions
📱 PWA offline-first
↔️ RTL completo para árabe y hebreo

🔄 v1.1.0 — Próximo

🌍 Ranking global real con backend en Railway (Node.js / Spring Boot)
🧬 Algoritmos genéticos — evolución de estrategias
🧠 TensorFlow.js — predicción de siguiente número
📊 D3.js — visualizaciones de distribución de algoritmos
🏆 Torneos programados — eventos semanales

🎯 v2.0.0 — Futuro

🤖 Chatbot con Claude API — asistente de estrategia
🎓 Modo educativo — teoría de algoritmos con visualizaciones
🏢 Versión enterprise — feature flags, roles, analytics
🗣️ Texto a voz — el juego responde en tu idioma

🤝 Contribuciones

🛠️ Setup de Desarrollo

git clone https://github.com/Lizzy0981/advanced-number-game.git
cd advanced-number-game
npm install
npm start                 # localhost:4200
npm run validate-i18n     # Verificar traducciones
npm run test              # Ejecutar tests

📋 Guidelines

🎯 Issues — Reporta bugs o solicita features
🔧 Pull Requests — Mejoras bienvenidas con tests
🌍 Traducciones — Agrega nuevos idiomas con todas las keys de es.ts
🧪 Testing — Mantén cobertura > 75%
📝 Commits — Usa Conventional Commits: feat:, fix:, chore:

📄 Licencia

MIT License — Copyright (c) 2026 Elizabeth Díaz Familia
Ver archivo LICENSE para términos completos.

👩‍💻 Desarrollado por

🌟 Elizabeth Díaz Familia (Lizzy Familia) — Sustainable AI Scientist · AI Data Scientist · Sustainable Intelligence & BI

🔗 Conecta Conmigo

🌐 Portfolio: lizzy0981.github.io
💼 LinkedIn: linkedin.com/in/eli-familia/
🐱 GitHub: github.com/Lizzy0981
🐦 Twitter: twitter.com/Lizzyfamilia
📧 Email: lizzyfamilia@gmail.com

💎 "Trabajando en silencio — dejando que el trabajo hable"

— Elizabeth Díaz Familia

🌱 Made with 💜, ☕, and a lot of 🎯 Scientific Precision for the global developer community 🌟

🌌 ┌─────────────────────────────────────────────────────────────────┐ 🌌
⚛️  │                  🎯 SCIENTIFICALLY POWERED 🎯                   │  ⚛️
🌟 │                   🧠 AI PATTERN DETECTION 🧠                    │ 🌟
⚡ │                 🌍 11 LANGUAGES SUPPORTED 🌍                    │ ⚡
🎯 │               ♻️  SUSTAINABLE · GREEN AI  ♻️                    │ 🎯
🔮 │           🎙️  VOICE CONTROL · OFFLINE-FIRST 🎙️                 │ 🔮
💎 │        🚀 ANGULAR 17 · GSAP · TYPESCRIPT 5 🚀                  │ 💎
🌈 │     💜 BUILT WITH LOVE BY ELIZABETH DÍAZ FAMILIA 💜            │ 🌈
✨ └─────────────────────────────────────────────────────────────────┘ ✨

Name		Name	Last commit message	Last commit date
.github/workflows		.github/workflows
docs		docs
scripts		scripts
src		src
.angulardoc.json		.angulardoc.json
.gitignore		.gitignore
LICENSE		LICENSE
README.md		README.md
angular.json		angular.json
ngsw-config.json		ngsw-config.json
package-lock.json		package-lock.json
package.json		package.json
tsconfig.app.json		tsconfig.app.json
tsconfig.json		tsconfig.json
tsconfig.spec.json		tsconfig.spec.json

Latest commit

History

Folders and files

Repository files navigation