Alpha nodejs support

src/Animation.js

@@ -1,10 +1,10 @@
-(function() {
+(function(root) {
     var BATCH_DRAW_STOP_TIME_DIFF = 500;
 
     var now =(function() {
-        if (window.performance && window.performance.now) {
+        if (root.performance && root.performance.now) {
             return function() {
-                return window.performance.now();
+                return root.performance.now();
             };
         }
         else {
@@ -15,20 +15,20 @@
     })();
 
     var RAF = (function() {
-        return window.requestAnimationFrame
-            || window.webkitRequestAnimationFrame
-            || window.mozRequestAnimationFrame
-            || window.oRequestAnimationFrame
-            || window.msRequestAnimationFrame
+        return root.requestAnimationFrame
+            || root.webkitRequestAnimationFrame
+            || root.mozRequestAnimationFrame
+            || root.oRequestAnimationFrame
+            || root.msRequestAnimationFrame
             || FRAF;
     })();
 
     function FRAF(callback) {
-        window.setTimeout(callback, 1000 / 60);
+        root.setTimeout(callback, 1000 / 60);
     }
 
     function requestAnimFrame() {
-        return RAF.apply(window, arguments);
+        return RAF.apply(root, arguments);
     }
     
     /**
@@ -294,4 +294,4 @@
             layer.batchDraw();
         });
     };
-})();
+})(this);

src/Canvas.js

@@ -1,6 +1,6 @@
 (function() {
     // calculate pixel ratio
-    var canvas = document.createElement('canvas'),
+    var canvas = Kinetic.Util.createCanvasElement(),
         context = canvas.getContext('2d'),
         // if using a mobile device, calculate the pixel ratio.  Otherwise, just use
         // 1.  For desktop browsers, if the user has zoom enabled, it affects the pixel ratio
@@ -44,7 +44,7 @@
             var pixelRatio = config.pixelRatio || Kinetic.pixelRatio || _pixelRatio;
 
             this.pixelRatio = pixelRatio;
-            this._canvas = document.createElement('canvas');
+            this._canvas = Kinetic.Util.createCanvasElement();
 
             // set inline styles
             this._canvas.style.padding = 0;

src/DragAndDrop.js

@@ -251,6 +251,10 @@
      * node.draggable(false);
      */
 
+
+    if (!Kinetic.Util.isBrowser()) {
+        return;
+    }
     var html = document.documentElement;
     html.addEventListener('mouseup', Kinetic.DD._endDragBefore, true);
     html.addEventListener('touchend', Kinetic.DD._endDragBefore, true);

src/Global.js

@@ -31,7 +31,7 @@
  */
 /*jshint -W079, -W020*/
 var Kinetic = {};
-(function() {
+(function(root) {
     Kinetic = {
         // public
         version: '@@version',
@@ -54,7 +54,8 @@ var Kinetic = {};
 
         // user agent  
         UA: (function() {
-            var ua = navigator.userAgent.toLowerCase(),
+            var userAgent = (root.navigator && root.navigator.userAgent) || '';
+            var ua = userAgent.toLowerCase(),
                 // jQuery UA regex
                 match = /(chrome)[ \/]([\w.]+)/.exec( ua ) ||
                 /(webkit)[ \/]([\w.]+)/.exec( ua ) ||
@@ -64,7 +65,7 @@ var Kinetic = {};
                 [],
 
                 // adding mobile flag as well
-                mobile = !!(navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i));
+                mobile = !!(userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i));
 
             return {
                 browser: match[ 1 ] || '',
@@ -262,7 +263,7 @@ var Kinetic = {};
             }
         }
     };
-})();
+})(this);
 
 // Uses Node, AMD or browser globals to create a module.
 
@@ -286,16 +287,15 @@ var Kinetic = {};
         // Node. Does not work with strict CommonJS, but
         // only CommonJS-like enviroments that support module.exports,
         // like Node.
-        module.exports = factory();
+        var Canvas = require('canvas');
+        var KineticJS = factory();
+        Kinetic._nodeCanvas = Canvas;
+        module.exports = KineticJS;
     }
     else if( typeof define === 'function' && define.amd) {
         // AMD. Register as an anonymous module.
         define(factory);
     }
-    else {
-        // Browser globals (root is window)
-        root.returnExports = factory();
-    }
 }(this, function() {
 
     // Just return a value to define the module export.

src/Layer.js

@@ -32,6 +32,9 @@
             this.hitCanvas = new Kinetic.HitCanvas();
             // call super constructor
             Kinetic.Container.call(this, config);
+            if (!Kinetic.Util.isBrowser()) {
+                this.canvas.setSize(this.attrs.width, this.attrs.height);
+            }
         },
         _validateAdd: function(child) {
             var type = child.getType();
@@ -39,6 +42,9 @@
                 Kinetic.Util.error('You may only add groups and shapes to a layer.');
             }
         },
+        createPNGStream : function() {
+            return this.canvas._canvas.createPNGStream();
+        },
         /**
          * get visible intersection shape. This is the preferred
          * method for determining if a point intersects a shape or not

src/Util.js

@@ -367,6 +367,20 @@
             }
             return names.length > 0;
         },
+        createCanvasElement: function() {
+            var canvas;
+            if (Kinetic.Util.isBrowser()) {
+                canvas = document.createElement('canvas');
+            } else {
+                // nodejs way
+                canvas = new Kinetic._nodeCanvas(200,200);
+            }
+            canvas.style = canvas.style || {};
+            return canvas;
+        },
+        isBrowser: function() {
+            return (typeof exports !==  'object');
+        },
         _isInDocument: function(el) {
             while(el = el.parentNode) {
                 if(el == document) {

src/filters/Kaleidoscope.js

@@ -147,7 +147,7 @@
     //Kinetic.Filters.FromPolar = Kinetic.Util._FilterWrapDoubleBuffer(FromPolar);
 
     // create a temporary canvas for working - shared between multiple calls
-    var tempCanvas = document.createElement('canvas');
+    var tempCanvas = Kinetic.Util.createCanvasElement();
 
     /*
      * Kaleidoscope Filter. 

src/shapes/Text.js

@@ -1,7 +1,7 @@
 (function() {
     // constants
     var AUTO = 'auto',
-        CANVAS = 'canvas',
+        //CANVAS = 'canvas',
         CENTER = 'center',
         CHANGE_KINETIC = 'Change.kinetic',
         CONTEXT_2D = '2d',
@@ -22,7 +22,7 @@
 
         // cached variables
         attrChangeListLen = ATTR_CHANGE_LIST.length,
-        dummyContext = document.createElement(CANVAS).getContext(CONTEXT_2D);
+        dummyContext = Kinetic.Util.createCanvasElement().getContext(CONTEXT_2D);
 
     /**
      * Text constructor