Added chaining feature which will allow for the chaining of any metho…

…ds that would otherwise return `void`. This can be switched on by passing `true` as the `chain` flag in options (`false` by default). #18

examples/drawing.html

@@ -33,6 +33,10 @@ <h3>Start drawing!</h3>
             container: document.getElementById( 'container' ),
             autoclear: false,
 
+            // Return the sketch from any methods that would otherwise return `void`.
+            // This allows the chaining of methods (`a().b().c()`) for faster typing.
+            chain: true,
+
             setup: function() {
                 console.log( 'setup' );
             },
@@ -41,8 +45,7 @@ <h3>Start drawing!</h3>
                 radius = 2 + abs( sin( this.millis * 0.003 ) * 50 );
             },
 
-            // Event handlers
-
+            // You can easily query sketch as to whether a certain key is pressed
             keydown: function() {
                 if ( this.keys.C ) this.clear();
             },
@@ -62,10 +65,11 @@ <h3>Start drawing!</h3>
                     this.fillStyle = this.strokeStyle = COLOURS[ i % COLOURS.length ];
                     this.lineWidth = radius;
 
-                    this.beginPath();
-                    this.moveTo( touch.ox, touch.oy );
-                    this.lineTo( touch.x, touch.y );
-                    this.stroke();
+                    // Draw using chained methods
+                    this.beginPath()
+                        .moveTo( touch.ox, touch.oy )
+                        .lineTo( touch.x, touch.y )
+                        .stroke();
                 }
             }
         });

js/sketch.js

@@ -36,6 +36,7 @@ var Sketch = (function() {
         interval: 1,
         globals: true,
         retina: false,
+        chain: false,
         type: CANVAS
     };
 
@@ -101,26 +102,27 @@ var Sketch = (function() {
 
         return function() {
 
-            method.apply( context, arguments );
+            var result = method.apply( context, arguments );
+            return result === void 0 ? context : result;
         };
     }
 
-    function clone( target ) {
+    function clone( target, chain ) {
 
-        var object = {};
+        var result = chain ? target : {};
 
         for ( var key in target ) {
 
             if ( isFunction( target[ key ] ) )
 
-                object[ key ] = proxy( target[ key ], target );
+                result[ key ] = proxy( target[ key ], target );
 
-            else
+            else if ( !chain )
 
-                object[ key ] = target[ key ];
+                result[ key ] = target[ key ];
         }
 
-        return object;
+        return result;
     }
 
     /*
@@ -388,7 +390,7 @@ var Sketch = (function() {
             stop();
         }
 
-        extend( context, {
+        instances.push( extend( context, {
 
             touches: touches,
             mouse: mouse,
@@ -405,11 +407,16 @@ var Sketch = (function() {
             clear: clear,
             start: start,
             stop: stop
-        });
 
-        instances.push( context );
+        }));
 
-        return ( context.autostart && start(), bind( true ), resize(), update(), context );
+        return (
+            context.autostart && start(),
+            bind( true ),
+            resize(),
+            update(),
+            context
+        );
     }
 
     /*
@@ -506,6 +513,10 @@ var Sketch = (function() {
 
             options = extend( options || {}, defaults );
 
+            if ( options.chain )
+
+                clone( context, true );
+
             options.element = context.canvas || context;
             options.element.className += ' sketch';
 

tests/spec/sketch.js

@@ -219,6 +219,26 @@ describe( 'create', function() {
         expect( typeof context.start ).toBe( 'function' );
     });
 
+    // chaining
+
+    it( 'chaining', function() {
+
+        sketch = Sketch.create({
+            type: Sketch.CANVAS,
+            chain: true
+        });
+
+        expect( sketch.beginPath() ).toBe( sketch );
+        expect( sketch.moveTo(0,0) ).toBe( sketch );
+        expect( sketch.lineTo(0,0) ).toBe( sketch );
+        expect( sketch.closePath() ).toBe( sketch );
+        expect( sketch.stroke() ).toBe( sketch );
+        expect( sketch.fill() ).toBe( sketch );
+        expect( sketch.fillRect(0,0,1,1) ).toBe( sketch );
+        expect( sketch.isPointInPath(0,0) ).toBe( false );
+        expect( sketch.getImageData(0,0,1,1) ).toEqual( jasmine.any( ImageData ) );
+    });
+
 });
 
 describe( 'setup and teardown', function() {