git.typable

A place for commonly used code snippets.

Game(width, height, { fps })

By extending the Game class you have access to a newly created canvas with game loop, which calls the update and render methods.

import { Game } from 'https://git.typable.dev/std/js/game.js';
class DinoGame extends Game {
	constructor() {
		super(900, 600); // (width, height)
		this.point = { x: 100, y: 100 };
	}
	update() {
		this.point.x += 1;
	}
	render() {
		super.render(); // screen clear
		let { x, y } = this.point;
		this.g.fillRect(x, y, 50, 50);
	}
}

const game = new DinoGame();
document.body.append(game.canvas);

game.start();
scaleCanvas(canvas, width, height)

Scales a canvas to the device related pixel ratio.

import { scaleCanvas } from 'https://git.typable.dev/std/js/canvas.js';
const canvas = document.createElement('canvas');
scaleCanvas(canvas, 900, 600); // (width, height)
document.body.append(canvas);