npm

Bring the best of OSS JavaScript development to your projects with npm Orgs - private packages & team management tools.Learn more »

@robotlegsjs/createjs

1.0.0 • Public • Published

RobotlegsJS CreateJS Extension

GitHub license Gitter chat Build Status codebeat badge Test Coverage npm version Greenkeeper badge styled with prettier

Integrate RobotlegsJS framework with CreateJS.

Installation

You can get the latest release and the type definitions using NPM:

npm install @robotlegsjs/createjs --save

Or using Yarn:

yarn add @robotlegsjs/createjs

The EaselJS dependency is added as peerDependencies, allowing the final user to choose the desired version of the easeljs library on each project.

The @robotlegsjs/createjs package is compatible with versions between the >=1.0.2 <2 version range of easeljs library.

As example, when you would like to use the version 1.0.2 of easeljs library, you can run:

npm install easeljs@1.0.2 reflect-metadata --save

or

yarn add easeljs@1.0.2 reflect-metadata

Then follow the installation instructions of RobotlegsJS library to complete the setup of your project.

Dependencies

Peer Dependencies

Usage

import { Context, MVCSBundle } from "@robotlegsjs/core";
 
import { ContextView, CreateJSBundle } from "@robotlegsjs/createjs";
 
import { MyConfig } from "./config/MyConfig";
 
import { RobotlegsView } from "./view/RobotlegsView";
 
export class Game {
 
    private _canvas: HTMLCanvasElement;
    private _stage: createjs.Stage;
 
    private _context: Context;
 
    constructor () {
        this.init();
    }
 
    private init(): void {
        this._canvas = <HTMLCanvasElement>(document.getElementById("canvas"));
        this._stage = new createjs.Stage(this._canvas);
 
        this._context = new Context();
        this._context.install(MVCSBundle, CreateJSBundle).
            configure(new ContextView(this._stage)).
            configure(MyConfig).
            initialize();
 
        // enable touch interactions if supported on the current device:
        createjs.Touch.enable(this._stage);
 
        // enabled mouse over / out events
        this._stage.enableMouseOver(10);
        this._stage.mouseMoveOutside = true; // keep tracking the mouse even when it leaves the canvas
 
        let robotlegs: RobotlegsView = new RobotlegsView();
 
        robotlegs.x = this._canvas.width / 2;
        robotlegs.y = this._canvas.height / 2;
 
        this._stage.addChild(robotlegs);
 
        window.addEventListener("resize", this.handleResize.bind(this));
        createjs.Ticker.addEventListener("tick", this.tick.bind(this));
    }
 
    private handleResize(): void {
        this._stage.update();
    }
 
    private tick(event: Object): void {
        this._stage.update(event);
    }
}

See full example here

Running the example

Run the following commands to run the example:

npm install
npm start

or:

yarn install
yarn start

License

MIT

install

npm i @robotlegsjs/createjs

Downloadsweekly downloads

2

version

1.0.0

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
  • avatar
  • avatar
Report a vulnerability