Vas.js - Documentation

Setting Up the Vas Engine

After linking the vas.js script to your page, you will now be able to use the engine. You can either download from the source (when available) or link it from here:

Then, we need to give a div element an id to append the Vas engine to. This id can be anything, although you will need to edit it later, as the engine tries to append the canvas to a div with the id set to "canvas".

Next, we can setup our engine by creating a variable set to the Vas class. The engine's gameArea is the built in canvas. Before starting it we can even change the size or style of the canvas.

//Setup for vas gaming engine
let vas = new Vas();
    vas.gameArea.width = 512;
    vas.gameArea.height = 512
    vas.gameArea.style = "border: 1px solid #333; box-shadow: 0 0 16px 2px rgba(0,0,0,1);"
    vas.gameArea.start();

Our engine's canvas can be accessed using:

//Accessing the canvas and context
//  Our canvas element is given with: vas.gameArea.canvas
//  Our canvas' context can be accessed with: vas.gameArea.ctx

//We can draw a rectangle with:
vas.gameArea.ctx.fillStyle = 'red'
vas.gameArea.ctx.fillRect(0, 0, 100, 100);