Orange JS – Introducción

Otra librería JS para videojuegos… otra mas, y van…

A ver, la idea acá no es reinventar la rueda, ni plantar cara a los entornos para creación de videojuegos ya establecidos, ni nada que se le parezca.

Hoy día si uno quiere comenzar a PROGRAMAR videojuegos  puedes hacerlo a la antigua, leer un poco de documentación de , aprender a dibujar en él, y ver que te sale.

A través del desarrollo de esta pequeña, extra pequeña, librería estoy buscando construir una estructura mínima que permita el desarrollo de videojuegos 2D sencillos (tipo pacman, space invaders, etc) , que nos permita aprender conceptos básicos como loop, OOP, eventos, colisiones, layers, sprites, etc.

Aquí la idea no es aprender a usar un software como Unity o Godot, sino a programar y entender los conceptos de una librería que nos permita desarrollar nuestros propios, que cualquiera puede leer el código y entender que hace.
Para construir un código más claro estoy usando webpack 4, para compilar ES6 a javascript.

Una descripción general

En este estado de desarrollo la librería son solo 5 archivos JS:

Orange: Es nuestro archivo principal, la class Orange, la cual inicializa la librería, establece los FPS, maneja los eventos, inicia el loop, y un par de cositas más, no mucho.

ImageManager: preloader y administrador de los assets que usaremos.

Layer: clase que nos permite agregar capas de imágenes (como las capas de photoshop) estas imágenes pueden ser un background, y los sprites que se agregaran luego en cada layer. También permite definir una imagen como delimitadora de posiciones (útil para definir, por ej, plataformas, laberintos, etc.

ImageMap: basicamente, un spritesheet, con métodos que nos permiten acceder a cada uno de los sprites que contiene.

Sprite: clase que recibe eventos, pinta la imagen correspondiente en el layer, controla el tamaño, posición, si puede o no dibujarse en una posición determinada, unas constantes y no mucho más

Un hola mundo en Orange

Un ejemplo funcional

En el proximo capitulo vamos a explicar como instalar la libreria, como compilar, y el funcionamiento de nuestro “hola mundo”. Hasta la proxima!

Leave a Reply