easier local development

.rvmrc

@@ -0,0 +1 @@
+rvm 1.9.3@canvas_library --create

Gemfile

@@ -0,0 +1,5 @@
+source :rubygems
+
+group :development do
+  gem 'guard-coffeescript'
+end

Gemfile.lock

@@ -0,0 +1,22 @@
+GEM
+  remote: http://rubygems.org/
+  specs:
+    coffee-script (2.2.0)
+      coffee-script-source
+      execjs
+    coffee-script-source (1.1.3)
+    execjs (1.2.12)
+      multi_json (~> 1.0)
+    guard (0.8.8)
+      thor (~> 0.14.6)
+    guard-coffeescript (0.5.2)
+      coffee-script (>= 2.2.0)
+      guard (>= 0.8.3)
+    multi_json (1.0.4)
+    thor (0.14.6)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  guard-coffeescript

Guardfile

@@ -0,0 +1,4 @@
+#!/usr/bin/ruby
+#
+guard 'coffeescript', :input => 'demos'
+guard 'coffeescript', :input => 'src', :output => 'lib'

README.rdoc

@@ -15,18 +15,18 @@ HTML:
 Coffeescript:
   run = ->
     # this is the screen
-    stage = new Stage('test_canvas')
+    stage = new CanvasLibrary.Stage('test_canvas')
 
     # create a rectangle
-    someShape = new Shape()
+    someShape = new CanvasLibrary.Shape()
     someShape.x = 0
     someShape.y = 0
 
     someShape.fillStyle 'rgba(0, 0, 0, 1)'
     someShape.fillRect 0, 0, 50, 50
 
     # create another rectangle
-    otherShape = new Shape()
+    otherShape = new CanvasLibrary.Shape()
     otherShape.alpha = .5
     otherShape.fillStyle 'rgba(255, 0, 0, 1)'
     otherShape.fillRect 0, 0, 25, 25
@@ -39,7 +39,7 @@ Coffeescript:
     stage.addChild otherShape
 
     # setup renderer and connect it to the stage and run at 25 fps
-    renderer = new Renderer(stage, 25)
+    renderer = new CanvasLibrary.Renderer(stage, 25)
     renderer.run()
 
     # tween some stuff
@@ -55,17 +55,17 @@ A DisplayContainer is an object that can hold other graphical objects. These gra
 The +x+ and +y+ position of graphical objects are relative and are translated to canvas +x+ and +y+ positions during the rendering process. This rendering process can be triggered by calling the +draw+ function on any displaycontainer.
 
 Nesting objects:
-  obj = new Shape()
+  obj = new CanvasLibrary.Shape()
   obj.x = 10
   obj.y = 10
 
-  otherObj = new Shape()
+  otherObj = new CanvasLibrary.Shape()
   otherObj.x = 0
   otherObj.y = 0
 
   obj.addChild otherObj
 
-  yetAnotherObj = new Shape()
+  yetAnotherObj = new CanvasLibrary.Shape()
   yetAnotherObj.x = 0
   yetAnotherObj.y = 0
 
@@ -80,9 +80,9 @@ Note: The stage is the main screen. This object also acts as an DisplayContainer
 The drawing API is almost the same as the Canvas drawing API. If you want to draw paths to the canvas, use the +Shape+ class.
 
 Drawing rectangles:
-  stage = new Stage("the_screen");
+  stage = new CanvasLibrary.Stage("the_screen");
 
-  rect = new Shape()
+  rect = new CanvasLibrary.Shape()
   rect.x = 0
   rect.y = 0
   rect.fillStyle "rgb(255, 0, 0, 1)"
@@ -97,14 +97,14 @@ Drawing rectangles:
 == Loading and drawing bitmaps
 
 Bitmaps can easily be loaded with the +canavaslib.StackedLoader+ class. The +StackedLoader+ manages all your assets so you can preload images or audio assets before rendering all your stuff.
-  screen = new Stage("the_screen")
+  screen = new CanvasLibrary.Stage("the_screen")
 
-  StackedLoader.add "image_id", "image", "logo.png"
-  StackedLoader.add "another_image", "image", "foo.png"
-  StackedLoader.add "and_another_one", "image", "bar.png"
+  CanvasLibrary.StackedLoader.add "image_id", "image", "logo.png"
+  CanvasLibrary.StackedLoader.add "another_image", "image", "foo.png"
+  CanvasLibrary.StackedLoader.add "and_another_one", "image", "bar.png"
 
-  StackedLoader.load =>
-    bitmap = StackedLoader.get "image_id"
+  CanvasLibrary.StackedLoader.load =>
+    bitmap = CanvasLibrary.StackedLoader.get "image_id"
 
     screen.addChild bitmap
     screen.render
@@ -116,7 +116,7 @@ The +load+ function adds an asset to the loadstack. The +start+ function trigger
 You can use the +Tween+ class to tween objects between two points.
 
   ...
-  renderer = new Renderer(stage);
+  renderer = new CanvasLibrary.Renderer(stage);
   renderer.run 25
 
   ...
@@ -143,7 +143,7 @@ Example of tween and mouse interaction:
 
 == Pixel fun
 
-  pixels = new PixelSprite()
+  pixels = new CanvasLibrary.PixelSprite()
   pixels.drawPixel 0, 0, 'rgba(128, 128, 128, 1)'
   pixels.drawPixel 1, 0, 'rgba(128, 128, 128, 1)'
   pixels.drawPixel 2, 0, 'rgba(128, 128, 128, 1)'
@@ -157,12 +157,19 @@ Example of tween and mouse interaction:
 
 Or even better, load a retro sprite file!
 
-  StackedLoader.add 'logo', 'sprite', 'logo.spr'
+  CanvasLibrary.StackedLoader.add 'logo', 'sprite', 'logo.spr'
 
-  StackedLoader.load =>
-    logo = StackedLoader.get 'logo'
+  CanvasLibrary.StackedLoader.load =>
+    logo = CanvasLibrary.StackedLoader.get 'logo'
     screen.addChild logo
 
+== Development
+
+Want to extend the library? If you are using rvm that should be a breeze!
+
+  bundle install
+  guard
+
 = License and credits
 Use it and have fun with it! Comments, cakes and hugs are welcome! Just stick to the license!
 

demos/demo.coffee

@@ -1,11 +1,11 @@
 run = ->
   # this is the screen
-  stage = new Stage('test_canvas')
+  stage = new CanvasLibrary.Stage('test_canvas')
 
   logo = null
 
   # create a rectangle
-  someShape = new Shape()
+  someShape = new CanvasLibrary.Shape()
   someShape.id = "someShape"
   someShape.x = 0
   someShape.y = 0
@@ -14,7 +14,7 @@ run = ->
   someShape.fillRect 0, 0, 50, 50
 
   # create another rectangle
-  otherShape = new Shape()
+  otherShape = new CanvasLibrary.Shape()
   otherShape.id = "otherShape"
   otherShape.alpha = .5
   otherShape.fillStyle 'rgba(255, 0, 0, 1)'
@@ -32,7 +32,7 @@ run = ->
     Tween.to otherShape, 500, { scaleX: 1, scaleY: 1 }
 
   # make this shape follow the mouse
-  mouseShape = new Shape()
+  mouseShape = new CanvasLibrary.Shape()
   mouseShape.id = "mouseShape"
   mouseShape.beginPath()
   mouseShape.fillStyle 'rgba(255, 0, 0, 1)'
@@ -48,7 +48,7 @@ run = ->
     mouseShape.y = stage.mouseY
 
   # some text
-  text = new TextField()
+  text = new CanvasLibrary.TextField()
   text.id = "text"
   text.mouseEnabled = true
   text.useHandCursor = true
@@ -67,16 +67,16 @@ run = ->
       Tween.kill logo
       Tween.to logo, 500, { x: stage.mouseX, y: stage.mouseY }
 
-  moreShapes = new Sprite()
+  moreShapes = new CanvasLibrary.Sprite()
   moreShapes.x = 0
   moreShapes.y = 0
 
-  moreShape1 = new Shape()
+  moreShape1 = new CanvasLibrary.Shape()
   moreShape1.id = "moreShape1"
   moreShape1.fillStyle 'rgba(0, 255, 0, 1)'
   moreShape1.fillRect 0, 0, 50, 50
 
-  moreShape2 = new Shape()
+  moreShape2 = new CanvasLibrary.Shape()
   moreShape2.x = 10
   moreShape2.y = 10
   moreShape2.fillStyle 'rgba(0, 255, 255, 1)'
@@ -95,7 +95,6 @@ run = ->
 
   # load an external bitmap
   StackedLoader.add 'logo', 'bitmap', 'logo.png'
-  #StackedLoader.add 'sprite', 'sprite', 'logo.spr'
 
   StackedLoader.load ->
     logo = StackedLoader.get('logo')
@@ -104,11 +103,8 @@ run = ->
     logo.alpha = 0
     Tween.to logo, 10000, { alpha: 1 }
 
-    #sprite = StackerLoader.get('sprite')
-    #stage.addChild sprite
-
   # setup renderer and connect it to the stage and run at 25 fps
-  renderer = new Renderer(stage, 25)
+  renderer = new CanvasLibrary.Renderer(stage, 25)
   renderer.run()
 
   # tween some stuff

demos/demo.js

@@ -1,17 +1,18 @@
 (function() {
   var run;
-  var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; };
+
   run = function() {
     var logo, moreShape1, moreShape2, moreShapes, mouseShape, otherShape, renderer, someShape, stage, text;
-    stage = new Stage('test_canvas');
+    var _this = this;
+    stage = new CanvasLibrary.Stage('test_canvas');
     logo = null;
-    someShape = new Shape();
+    someShape = new CanvasLibrary.Shape();
     someShape.id = "someShape";
     someShape.x = 0;
     someShape.y = 0;
     someShape.fillStyle('rgba(0, 0, 0, 1)');
     someShape.fillRect(0, 0, 50, 50);
-    otherShape = new Shape();
+    otherShape = new CanvasLibrary.Shape();
     otherShape.id = "otherShape";
     otherShape.alpha = .5;
     otherShape.fillStyle('rgba(255, 0, 0, 1)');
@@ -21,19 +22,19 @@
     otherShape.scaleX = 1;
     otherShape.scaleY = 1;
     otherShape.mouseEnabled = true;
-    otherShape.onMouseOver = __bind(function() {
+    otherShape.onMouseOver = function() {
       return Tween.to(otherShape, 500, {
         scaleX: 2,
         scaleY: 2
       });
-    }, this);
-    otherShape.onMouseOut = __bind(function() {
+    };
+    otherShape.onMouseOut = function() {
       return Tween.to(otherShape, 500, {
         scaleX: 1,
         scaleY: 1
       });
-    }, this);
-    mouseShape = new Shape();
+    };
+    mouseShape = new CanvasLibrary.Shape();
     mouseShape.id = "mouseShape";
     mouseShape.beginPath();
     mouseShape.fillStyle('rgba(255, 0, 0, 1)');
@@ -42,40 +43,40 @@
     mouseShape.fill();
     mouseShape.x = 300;
     mouseShape.y = 300;
-    stage.onMouseMove = __bind(function() {
+    stage.onMouseMove = function() {
       mouseShape.x = stage.mouseX;
       return mouseShape.y = stage.mouseY;
-    }, this);
-    text = new TextField();
+    };
+    text = new CanvasLibrary.TextField();
     text.id = "text";
     text.mouseEnabled = true;
     text.useHandCursor = true;
     text.text = "canvas_library demo";
     text.x = 10;
     text.y = 450;
-    text.onMouseOver = __bind(function() {
+    text.onMouseOver = function() {
       return text.fillStyle = 'rgba(255, 0, 0, 1)';
-    }, this);
-    text.onMouseOut = __bind(function() {
+    };
+    text.onMouseOut = function() {
       return text.fillStyle = 'rgba(0, 0, 0, 1)';
-    }, this);
-    stage.onMouseUp = __bind(function() {
+    };
+    stage.onMouseUp = function() {
       if (logo) {
         Tween.kill(logo);
         return Tween.to(logo, 500, {
           x: stage.mouseX,
           y: stage.mouseY
         });
       }
-    }, this);
-    moreShapes = new Sprite();
+    };
+    moreShapes = new CanvasLibrary.Sprite();
     moreShapes.x = 0;
     moreShapes.y = 0;
-    moreShape1 = new Shape();
+    moreShape1 = new CanvasLibrary.Shape();
     moreShape1.id = "moreShape1";
     moreShape1.fillStyle('rgba(0, 255, 0, 1)');
     moreShape1.fillRect(0, 0, 50, 50);
-    moreShape2 = new Shape();
+    moreShape2 = new CanvasLibrary.Shape();
     moreShape2.x = 10;
     moreShape2.y = 10;
     moreShape2.fillStyle('rgba(0, 255, 255, 1)');
@@ -101,7 +102,7 @@
         alpha: 1
       });
     });
-    renderer = new Renderer(stage, 25);
+    renderer = new CanvasLibrary.Renderer(stage, 25);
     renderer.run();
     Tween.to(someShape, 5000, {
       x: 100,
@@ -116,5 +117,7 @@
       scaleY: 1
     });
   };
+
   window.onload = run;
+
 }).call(this);

lib/ansii_palette.js

@@ -0,0 +1,2 @@
+
+