diff --git a/examples/drawing.html b/examples/drawing.html index 802e6f9..c6ccec4 100644 --- a/examples/drawing.html +++ b/examples/drawing.html @@ -33,6 +33,10 @@

Start drawing!

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 @@

Start drawing!

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 @@

Start drawing!

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(); } } }); diff --git a/js/sketch.js b/js/sketch.js index c4174d9..587fdd6 100755 --- a/js/sketch.js +++ b/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'; diff --git a/js/sketch.min.js b/js/sketch.min.js index 29b9b40..3cb77aa 100644 --- a/js/sketch.min.js +++ b/js/sketch.min.js @@ -1,2 +1,2 @@ /* Copyright (C) 2013 Justin Windle, http://soulwire.co.uk */ -var Sketch=function(){"use strict";function e(e){return"[object Array]"==Object.prototype.toString.call(e)}function t(e){return"function"==typeof e}function n(e){return"number"==typeof e}function o(e){return"string"==typeof e}function r(e){return C[e]||String.fromCharCode(e)}function i(e,t,n){for(var o in t)(n||!e.hasOwnProperty(o))&&(e[o]=t[o]);return e}function u(e,t){return function(){e.apply(t,arguments)}}function a(e){var n={};for(var o in e)n[o]=t(e[o])?u(e[o],e):e[o];return n}function c(e){function n(n){t(n)&&n.apply(e,[].splice.call(arguments,1))}function u(e){for(D=0;D