Catyen - (Ca)nvas (Ty)pescript (En)gine

Catyen is a lightweight wrapper to make the handling of canvas related programming more easy.

Usage

npm install @catyen/catyen

<canvas id ="canvas-element"></canvas>

import Catyen from '@catyen/catyen';

const catyen = new Catyen("#canvas-element",window);

// With the initialization call all required event handlers are set.
catyen.initialize();

catyen.loop.requestFrame(()=>{
    catyen.draw.clear("black");
    catyen.draw.print(0,0,"Hello World","white");
});

Quick Start

The easiest way to start is by using this boilerplate.

Features

Game loop

Whenever the browser requests a frame, this loop is called. With each call, the screen is re-rendered.

import Catyen from '@catyen/catyen';

const catyen = new Catyen("#canvas-element",window);

catyen.loop.requestFrame(()=>{});

Drawing

Clear screen

 catyen.draw.clear("white");

Print text

 catyen.draw.print(0,0,"Hello World","white");

Fill rect

 catyen.draw.fillRect(10,10,10,10,"white");

Fill rect and rotate

 catyen.draw.fillRectAndRotate(10,10,10,10,"white",10);

Draw line

 catyen.draw.line(10,10,10,10,"white");

Load and display images

const myImage = new CatyenImage("./path/img.png");

catyen.loop.requestFrame(()=>{
    catyen.draw.blit(0,0,myImage);
});

Rotate image

const myImage = new CatyenImage("./path/img.png");

catyen.loop.requestFrame(()=>{
    catyen.draw.blitAndRotate(0,0,myImage,90);
});

Controls

Keyboard

const catyen = new Catyen("#canvas-element",window);

catyen.initialize();

catyen.loop.requestFrame(()=>{
    if(catyen.controls.isPressed(KeyboardKeys.UP))
    {
        console.log("up!");
    }
    
    if(catyen.controls.isPressed(KeyboardKeys.DOWN))
    {
        console.log("down!");
    }
});

Mouse

const catyen = new Catyen("#canvas-element",window);

catyen.initialize();

catyen.loop.requestFrame(()=>{
    if(catyen.controls.mouseState.mouseDown)
    {
        console.log("mouse down!",
        catyen.controls.mouseState.clientX,
        catyen.controls.mouseState.clientY);
    }
});

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

License

MIT

Dimnez / Catyen