drawcall / AgileJS

AgileJS - The Css3 Creation Engine 🍖🌭🍔
http://drawcall.github.io/AgileJS/
MIT License
498 stars 62 forks source link
animation css-animations css-framework css-games css3 css3-animations css3-engine game-framework html5-css3

AgileJS - The Css3 Creation Engine

license Release Version PRs Welcome npm

Agile banner

Using javascript generated pure CSS3

AgileJS is a simple, fast and easy to use engine which uses javascript generated pure CSS3. Check out examples at http://drawcall.github.io/AgileJS/

Features

Usage

Download the minified library and include it in your html document.

<script src="https://github.com/drawcall/AgileJS/raw/master/js/agile.min.js"></script>

Or install using npm

anix

npm install agilejs --save
... 

import Agile from 'agilejs';

Create and move a circle:

//init AgileJS
Agile.mode = '3d';
const container = new Agile.Container('container');
container.select = false;
container.perspective = 1000;

//create a displayobject
const circle = new Agile.Circle(80, '#ff0000');
circle.x = 100;
circle.y = 120;
container.addChild(circle);

//add a keyframes
const keyframes = new Agile.Keyframes(100, {
    scaleX : .5,
    scaleY : .5
});

circle.addFrame(1, keyframes, {
    yoyo : true,
    loop : -1
}); 

Building AgileJS

Node is a dependency, use terminal to install it with with:

git clone git://github.com/drawcall/AgileJS.git
...
npm install
npm run build

and run examples

npm start
//vist http://localhost:3001/examples/

es6 lint

npm run lint

License

LicenseFinder is released under the MIT License. http://www.opensource.org/licenses/mit-license