QBJr. — Manual de Demos y Plantillas

Índice completo de demos y plantillas

PLAYERIDEdemo.qbjr

Pelota interactiva. Input + dibujo + colores. La primera demo a cargar.

PLAYERIDEcubo3d.qbjr

Cubo 3D con proyección ortográfica. v1 con arrays, v2 inline.

PLAYERIDEintro_consola.qbjr

Animación de arranque en 7 fases estilo PS1/Saturn.

PLAYERhorror.qbjr

Motor de terror pseudo-3D data-driven con .qdat. 8 versiones mayores.

STANDALONEhorror_engine.qbjr

Port de HORROR.BAS. Motor hardcodeado, sin .qdat externos.

IDEMandelbrot

Fractales con paleta HSL dinámica. Demo exclusiva del IDE.

IDECalculadora

Operaciones básicas con TEXTO() e IMPRIMIR. La más corta.

IDE × 6Plantillas

En blanco, Dibujo, Interactivo, Bucle, Subprogramas, Animación.

FAP v2Frame inicial

Sintaxis FAP legacy (# comentarios, MODO, LIMPIAR_COLOR).

FAP v3Frame inicial

Sintaxis QBJr. estándar con HSL y TEXTO_MD.

Demo: Pelota Interactiva

La primera demo que debería ver alguien aprendiendo QBJr. Una pelota que se mueve con flechas o WASD, detecta los bordes de la pantalla, y muestra un HUD básico. Menos de 50 líneas con comentarios.

▶ PLAYER / IDEDisponible en ambos entornos. Resolución 256×240 en el IDE, 256×224 en versiones antiguas del Player. La lógica es idéntica.

CONCEPTO	CÓMO SE USA
DECLARAR + tipos	Variables ENTERO, FLOTANTE y BOOLEANO con declaración explícita.
REPETIR / HASTA	Game loop principal. Se repite hasta TECLA_ESCAPE.
SI / FIN SI	Detección de bordes y limitación de coordenadas.
TECLADO()	Lectura de flechas en tiempo real.
CIRCULO RELLENO	Dibujo con doble trazo (relleno + borde).
IMPRIMIR	Mensajes de debug: "Demo iniciada" y "Demo finalizada".

Variables para modificar

vel = 3     ' velocidad (1-10)
x   = 128   ' posición inicial x
y   = 120   ' posición inicial y

Demo: Cubo 3D

Renderiza un cubo 3D con proyección ortográfica usando únicamente SEN y COS. El cubo rota continuamente. Las flechas modifican las velocidades angulares. La barra espaciadora frena la rotación.

Versión v1 — Con arrays (IDE v1.0.0, Player original)

▶ VERSIÓN ORIGINALTres arrays de 8 elementos (vx8[], vy8[], vz8[]) almacenan los 8 vértices. Tres ejes de rotación (ax, ay, az). La versión más pedagógicamente completa (~120 líneas).

DECLARAR vx8[8] COMO FLOTANTE  ' coordenadas X de los 8 vértices
DECLARAR vy8[8] COMO FLOTANTE
DECLARAR vz8[8] COMO FLOTANTE
DECLARAR px[8]  COMO FLOTANTE  ' proyección 2D

Versión v2 — Inline sin arrays (IDE v1.0.2+, versión actual)

⚠ CORRECCIÓN v1.0.2La versión original aparecía completamente negra. Causa: conflicto entre variables de dos letras (az, vz) y el mecanismo de varKey() en versiones tempranas del parser. Solución: reescribir expandiendo los 8 vértices como variables individuales (p0x, p0y, … p7x, p7y).

CONCEPTO	DESCRIPCIÓN
SEN / COS	Matrices de rotación 3D aplicadas a cada vértice.
Proyección ortográfica	px = cx + tx * escala. Sin perspectiva, extremadamente simple.
IMPRIMIR cada 60 frames	Debug: muestra el frame actual y los ángulos.
BARRA_ESPACIADORA	Frena la rotación poniendo velocidades a 0.

Demo: Intro Consola

Animación de arranque en 7 fases secuenciales inspirada en los boot screens de PlayStation y Sega Saturn. Sin interacción durante la animación.

FASE	TÉCNICA
1 — Starfield	PARA 1-30, 12 PUNTO por frame con RND(). Los puntos se acumulan sin limpiar.
2 — Vortex	PARA 1-24, 12 LINEA desde centro a posiciones COS/SEN exteriores que convergen.
3 — Espiral	PARA 1-50, CIRCULO de 1px siguiendo espiral polar.
4 — Logo R	CIRCULO concéntricos (glow) + RECTANGULO para la letra R geométrica.
5 — Texto letra a letra	Array letras[7]. PARA i DE 1 A 7, TEXTO posición i, ESPERAR 70ms.
6 — Subtítulo	TEXTO fijo + 40 PUNTO de partículas con RND.
7 — Flash	PARA 1-6: RECTANGULO blanco/negro alterno (i MOD 2). Fade a negro.

▶ NOTAEsta demo no cambió entre versiones. Al no usar arrays ni subprogramas paramétricos, eludió los problemas que afectaron al Cubo 3D.

Demo: horror.qbjr — Motor de terror pseudo-3D

La demo más compleja del Player. Motor de terror data-driven con render pseudo-3D estilo Phantasy Star 1. Jugable, con 11 salas, narrativa completa, inventario y diario.

📌 DATA-DRIVENhorror.qbjr no contiene texto narrativo ni datos del mundo. Todo vive en archivos .qdat externos. Para hacer tu propio juego con el motor, solo tenés que editar los .qdat.

Historial de versiones

VERSIÓN	NOMBRE	DESCRIPCIÓN
v0.5.1	Port inicial	Port de HORROR.BAS. 3 salas hardcodeadas, sin archivos externos.
v0.5.2	Reescritura	12 nodos, criatura con IA, linterna como arma. 971 líneas.
v0.5.3	Renderer PS1	Wireframe estilo Phantasy Star 1. Tres capas, niebla por batería.
v0.9.0	Data-driven	Primera versión con .qdat externos. 11 salas, paleta HSL, 24 subprogramas.
v0.9.4	Trapecios PS1	Render completamente reescrito: trapecios rellenos + wireframe. Painter's algorithm.
v0.9.8	256×240	Migración NES. 10 funciones de texto. Sistema evPersist.
v0.9.31	Actual	Inventarios navegables. PILA (antes LINT). Correcciones menores.

Layout de pantalla (256×240) — versión actual

┌─── TOPBAR 256×16 ────────────────────────────────────┐ │ Nombre de sala Brújula N/E/S/O │ ├── ÁREA DE JUEGO 144×160 ──┬── MINIMAPA 92×84 ─────────┤ │ Render trapecios PS1 │ Grilla 4×7 │ │ 6 niveles perspectiva ├── STATUS 92×70 ──────────┤ │ Vignette esquinas │ PILA [████░] 80% │ │ Indicador de puerta │ ITEMS (6 slots) │ │ │ NOTAS (12) │ ├─── ÁREA DE MENSAJES 256×58 (y=182..239) ──────────────┤ │ Markdown extendido · overlay de mensaje │ └──────────────────────────────────────────────────────┘

Controles

ACCIÓN	TECLADO
Avanzar / Retroceder	↑ / W ↓ / S
Doblar izquierda / derecha	← / A → / D
Aceptar / continuar	Enter / Z
Mochila	Tab / I
Cuaderno	Ctrl izq. / C
Salir	Escape

Estructura de archivos

horror.qbjr             ← motor del juego (data-driven)
horror_data/
  ├── MAPA.qdat          ← salas, conexiones, hue HSL
  ├── INTRO.qdat         ← bienvenida (3 páginas)
  ├── NOTAS.qdat         ← 12 notas con markdown
  ├── SALA_VESTIBULO.qdat
  ├── ... (11 salas)
  └── SALA_SALIDA.qdat

Crear tu propio juego con el motor

El motor es completamente genérico. Para hacer tu propio juego no hace falta tocar horror.qbjr, solo editar los .qdat:

ARCHIVO	CONTENIDO
MAPA.qdat	Salas, conexiones N/S/E/O, requisitos de objetos, hue HSL.
NOTAS.qdat	Todas las notas del diario con markdown extendido.
INTRO.qdat	Pantalla de bienvenida multipágina.
SALA_X.qdat	Eventos por distancia Z: M (mensaje), O (objeto), N (nota), P (puerta), S (sonido), C (criatura).

📌 ARCHIVOSULAUsar archivoSala como nombre de variable para el archivo de la sala actual, no archivo. La variable archivo colisiona con la clave "archivo" del .qdat (bug D-10 de la Evolución).

horror_engine.qbjr — El motor antes de los .qdat

Primera implementación del motor de horror directamente en QBJr., antes de que existiera el sistema de archivos .qdat. Es el port inicial de HORROR.BAS (QBasic/QB64).

⚠ IMPORTANTEEste es el port inicial (v0.5.1), no la versión data-driven actual. Todo el mundo del juego está hardcodeado mediante arrays globales y SEGUN/CASO. Para el motor actual, ver horror.qbjr.

Diferencias con horror.qbjr (data-driven)

ASPECTO	MOTOR HARDCODEADO	DATA-DRIVEN
Datos del mundo	Arrays y SEGUN/CASO en el .qbjr	Archivos .qdat externos
Modificar el mundo	Editar el .qbjr	Solo editar los .qdat
Dependencias	Ninguna — un solo archivo	Requiere servidor para fetch()
Adecuado para	Juegos pequeños, demos offline	Juegos grandes, colaboración

Demo IDE: Fractales de Mandelbrot

◈ EXCLUSIVA DEL IDENo disponible en el Player por el tiempo de renderizado. Calcula el conjunto de Mandelbrot para cada píxel con paleta HSL dinámica.

⚠ CORRECCIÓN v1.0.2La versión original no se renderizaba. Causa: la condición MIENTRAS (zr*zr+zi*zi < 4) Y (n < maxN) con paréntesis externos era interpretada como llamadas a función. Solución: eliminar los paréntesis y pre-calcular la norma en una variable auxiliar.

' Versión corregida — norma pre-calculada
norm = zr * zr + zi * zi
MIENTRAS norm < 4 AND n < maxN
  tmp = zr * zr - zi * zi + cr
  zi  = 2 * zr * zi + ci
  zr  = tmp
  n   = n + 1
  norm = zr * zr + zi * zi
FIN MIENTRAS

Cada pixel se colorea con COLOR HSL(n * 12, 90, 55) según la velocidad de divergencia. Los puntos del conjunto permanecen en negro.

Demo IDE: Calculadora

◈ EXCLUSIVA DEL IDELa demo más corta (~25 líneas). Sin bucle de juego ni animación. Demuestra conversión de tipos y doble salida: canvas + consola.

a = 15  b = 4
COLOR cian  TEXTO 60 20 "CALCULADORA"
COLOR verde
TEXTO 40 70  TEXTO(a) + " + " + TEXTO(b) + " = " + TEXTO(a + b)
TEXTO 40 100 TEXTO(a) + " * " + TEXTO(b) + " = " + TEXTO(a * b)
IMPRIMIR "a=" + TEXTO(a) + "  suma=" + TEXTO(a + b)

Plantillas de archivo nuevo del IDE

El diálogo "Nuevo archivo" del IDE ofrece 6 plantillas. Son puntos de partida, no demostraciones — el usuario las editará.

📄 En blanco

PANTALLA + LIMPIAR + IMPRIMIR "Hola, mundo!". El programa más pequeño posible.

🎨 Dibujo

Círculo + rectángulo + texto estáticos. Para explorar comandos de dibujo.

🎮 Interactivo

Círculo con flechas. El game loop mínimo: LIMPIAR / actualizar / dibujar / ESPERAR.

🔁 Bucle

16 barras de colores con PARA + HSL. Espectro cromático completo.

🧩 Subprogramas

Tres estrellas con DEFINIR/HACER y variables globales como parámetros.

✨ Animación

Órbita con COS/SEN. El color gira con el ángulo: HSL(angulo, 100, 60).

Código de la plantilla Interactivo

DECLARAR x COMO ENTERO  DECLARAR y COMO ENTERO
x = 128  y = 120
REPETIR
  LIMPIAR
  SI TECLADO(FLECHA_ARRIBA)    ENTONCES y = y - 3 FIN SI
  SI TECLADO(FLECHA_ABAJO)     ENTONCES y = y + 3 FIN SI
  SI TECLADO(FLECHA_IZQUIERDA) ENTONCES x = x - 3 FIN SI
  SI TECLADO(FLECHA_DERECHA)   ENTONCES x = x + 3 FIN SI
  COLOR cian
  CIRCULO x y 12 RELLENO
  ESPERAR 16
HASTA TECLADO(TECLA_ESCAPE)
FINALIZAR

Frames de ejemplo del Reverse FAP

El FAP incluye un frame de ejemplo inicial en cada versión. Desde FAP v3, la sintaxis es QBJr. estándar completa.

ELEMENTO	FAP v2 (legacy)	FAP v3 (estándar)
Comentarios	`# texto`	`' texto`
Color de fondo	`LIMPIAR_COLOR negro`	`COLOR FONDO negro / LIMPIAR`
Dibujar relleno	`MODO relleno / CIRCULO …`	`CIRCULO x y r RELLENO`
Tipografía	`FUENTE 14 monospace`	Press Start 2P (fija)
HSL	No disponible	`COLOR HSL(h, s, l)`
Texto enriquecido	No disponible	`TEXTO_MD`

Ruta de aprendizaje con las demos

NIVEL 1 — Primera vez programando

PASO	ACTIVIDAD
Plantilla: En blanco	Cambiar el mensaje de IMPRIMIR. Presionar F5 y ver el resultado.
Plantilla: Dibujo	Cambiar colores, posiciones, tamaños de las figuras.
Plantilla: Bucle	Modificar el rango del PARA y el multiplicador del hue.
Demo: Calculadora	Cambiar a y b. Agregar la operación de potencia.

NIVEL 2 — Conceptos intermedios

PASO	ACTIVIDAD
Plantilla: Interactivo	Agregar límites de pantalla. Cambiar la velocidad.
Demo: Pelota	Agregar una segunda pelota. Implementar rebote real.
Plantilla: Subprogramas	Agregar más llamadas. Cambiar el subprograma para usar rotación.
Demo: Cubo 3D (v2)	Modificar los colores de las caras. Cambiar el zoom.

NIVEL 3 — Programación avanzada

PASO	ACTIVIDAD
Demo: Cubo 3D (v1)	Estudiar la versión con arrays. Agregar el eje Z de rotación.
Demo: Mandelbrot	Modificar el centro y el zoom. Cambiar maxN para más detalle.
Demo: intro_consola	Agregar una fase 8 propia. Cambiar el logo por uno personalizado.

NIVEL 4 — Proyectos propios

PASO	ACTIVIDAD
horror_engine.qbjr	Estudiar la arquitectura del motor hardcodeado. Agregar una sala.
horror.qbjr (data-driven)	Crear un mundo propio editando los archivos .qdat.
Proyecto libre	Combinar Plantilla Interactivo + conceptos del Cubo 3D para un juego propio.