ZIM DOCS

http://zimjs.com/docs.html
http://zimjs.com/updates.html
http://zimjs.com/tips.html
http://zimjs.com/bits.html

A. ABOUT ZIM
ZIM is an JavaScript Canvas Framework powered by CreateJS and adds many components, conveniences and controls for making general Interactive Media.

The ZIM site at http://zimjs.com features the following sections:

LEARN tutorials on how to start and code in ZIM
CODE ZIM Frame template and code context
DOCS the objects and commands all defined
NEWS latest features and articles
ABOUT features, applications, archives, reviews, etc.
EXAMPLES sample projects created in ZIM
GOLD BARS with online editor, sharing, tips and badges

B. ABOUT THE DOCS
The docs are divided into modules:
FRAME, DISPLAY, METHODS, CONTROLS, CODE, WRAP, META, LIBRARIES
Let's have a brief look at each...

---------------------------------
1. FRAME - the framework class that makes and scales the canvas and stage
var frame = new Frame("fit"); // defaults to full screen no scaling
frame.on("ready", function() {
    var stage = frame.stage;
    frame.loadAssets(["pic.png", "sound.mp3"]); // optional asset loading
    frame.on("complete", function() {
        var pic = frame.asset("pic.png").center(stage);
        frame.asset("sound.mp3").play();
        stage.update();
    }); // end asset loading complete
}); // end ready
also handles zim colors like frame.blue, tabs, keydown and keyup, etc.
colors are now available on the zim namespace - blue, red, yellow...

---------------------------------
3. DISPLAY - classes for objects viewed on the stage like shapes and components
var circle = new Circle(100, "red"); // also Rectangle, Triangle and Blob
var button = new Button(200, 100, "GO!");
etc. and dozens more like Label, Slider, Dial, Tabs, ColorPicker...

---------------------------------
4. METHODS - methods for the display objects above
circle.center(stage); // adds to and centers button on stage
circle.drag(); // allows the circle to be dragged and dropped
circle.animate(obj:{alpha:0}, 5000); // fades out circle over 5 seconds
etc. and dozens more - also see PRINCIPLES sections below...

---------------------------------
5. CONTROLS - classes that affect Display objects
new MotionController(stage, circle); // circle moves to mouse press
new Pages(stage, {page:home}, {page:help}); // handle pages and swiping
new Layout(stage,[{object:header},{object:content},{object:footer}]);
responsive design with many more options (like css flex table)
etc. including Parallax, Scroller, Guide, Grid, Emitter, SoundWave...

---------------------------------
5. CODE - non-Canvas code convienence functions
var array = ["red", "yellow", "green", "blue"];
var color = shuffle(array)[0]; // shuffles array and picks first color
var color = array[rand(array.length-1)]; // gets random element
etc. many more including browser functions and asynchronus calls

---------------------------------
6. WRAP - a dozen three-letter global functions starting with z
zog("hello world"); // short for console.log();
zid("tagID"); // short for document.getElementById();
etc. including selectors similar to $() in jQuery

---------------------------------
7. META - a few classes and functions operating on zim
DISTILL = true;
distill(); // writes to console all the commands used to reduce code
zimify(createjsObj); // adds zim Methods to native createjs display objects
wonder.count("wow"); // once set up records different types of stats

---------------------------------
8. LIBRARIES - other ZIM helper modules found here:
http://zimjs.com/code.html#libraries
Including: SOCKET, GAME, PHYSICS, THREE, PIZZAZZ 1, 2 and 3 modules
The docs for these are found at the top of the code for each module

C. THE DOCS