sint.js - HTML5 Game Framework

Sint webgl-core based on PixiJs-core, is a fast, free, and fun open source HTML5 game framework that offers WebGL and Canvas rendering across desktop and mobile web browsers. Games can be compiled to iOS, Android and native apps by using 3rd party tools.

Learn

• SintJS API docs.
• example.

Usage

Include

<script src="dist/sint.min.js"></script>

Or

npm install sint.js

import * as SINT from 'sint.js'

Create Your First Sint Example

const config = {
    canvas: document.querySelector('#webglStage'), // HTMLElement
    initWidth: 750,
    initHeight: 1334,
    showFPS: true,
    backgroundColor: 0x2a3145,
};
const assets = {
    bg: './assets/bg.jpg',
    pic1: './assets/pic1.png',
    sound0: './assets/sound/bg.mp3',
    sound1: './assets/sound/s1.mp3',
}
const game = new SINT.Game(config);

game.preload({
    assets: assets,
    loading: loading,
    loaded: create,
})

function loading(_pr) {
    console.log('loading ' + _pr);
}

function create() {
    // bg image
    var bg = new SINT.SpriteClip('bg');
    game.add(bg);
    
    // btn
    var btn = new SINT.SpriteClip('pic1',288, 292);
    btn.anchor.set(0.5);
    game.add(btn);

    // audio
    var s0 = SINT.Audios.add('sound0');
    s0.loop=true;
    SINT.Audios.add('sound1');

    // events
    btn.interactive = true;
    btn
        .on('pointerdown', onPointStart)
        .on('pointerup', onPointUp)
        .on('pointerupoutside', onPointUp)
        .on('pointermove', onPointMove);

    function onPointStart(event) {
        // the first audio must be use by interactive Event
        s0.play();
    }
    function onPointMove(event) {
        //console.log(event.data.global)
    }
    function onPointUp(event) {
        SINT.Audios.get('sound1').play();
    }
}



// destroy and remove view
game.removeThis();

License

MIT