removed flip and mirror filters because the same effect can be achieved with transforms, cloning, caching, etc.

Gruntfile.js

@@ -18,9 +18,7 @@ module.exports = function(grunt) {
     'src/filters/ColorPack.js',
     'src/filters/ConvolvePack.js',
     'src/filters/Enhance.js',
-    'src/filters/Flip.js',
     'src/filters/Levels.js',
-    'src/filters/Mirror.js',
     'src/filters/Noise.js',
     'src/filters/Pixelate.js',
     'src/filters/Polar.js',

src/filters/Flip.js

@@ -1,101 +0,0 @@
-(function () {
-
-  /**
-   * FlipX Filter. Flips the image horizontally so that the 
-   *  left-most pixels become the right-most pixels and vice-versa.
-   *  Performs w*h pixel reads, 0 computations, and w*h pixel writes.
-   * @function
-   * @author ippo615
-   * @memberof Kinetic.Filters
-   * @param {ImageData} src, the source image data (what will be transformed)
-   * @param {ImageData} dst, the destination image data (where it will be saved)
-   * @param {Object} opt, There are no options for this filter
-   */
-
-  var FlipX = function (src, dst, opt) {
-    var srcPixels = src.data,
-      dstPixels = dst.data,
-      xSize = src.width,
-      xEnd = Math.ceil(0.5*xSize),
-      ySize = src.height,
-      i, m, x, y, r,g,b,a;
-    for (x = 0; x < xEnd; x += 1) {
-      for (y = 0; y < ySize; y += 1) {
-        i = (y * xSize + x) * 4; // original 
-        m = (y * xSize + (xSize-1) - x) * 4; // flipped
-        // Instead of copying each row from the source to the destiation
-        // swap rows - this let's us achive a full flip in a single buffer
-        r = srcPixels[m + 0];
-        g = srcPixels[m + 1];
-        b = srcPixels[m + 2];
-        a = srcPixels[m + 3];
-        dstPixels[m + 0] = srcPixels[i + 0];
-        dstPixels[m + 1] = srcPixels[i + 1];
-        dstPixels[m + 2] = srcPixels[i + 2];
-        dstPixels[m + 3] = srcPixels[i + 3];
-        dstPixels[i + 0] = r;
-        dstPixels[i + 1] = g;
-        dstPixels[i + 2] = b;
-        dstPixels[i + 3] = a;
-      }
-    }
-  };
-
-  /**
-   * FlipY Filter. Flips the image vertically so that the top-most
-   *  pixels become the bottom-most pixels and vice-versa.
-   *  Performs w*h pixel reads, 0 computations, and w*h pixel writes.
-   * @function
-   * @author ippo615
-   * @memberof Kinetic.Filters
-   * @param {ImageData} src, the source image data (what will be transformed)
-   * @param {ImageData} dst, the destination image data (where it will be saved)
-   * @param {Object} opt, There are no options for this filter
-   */
-
-  var FlipY = function (src, dst, opt) {
-    var srcPixels = src.data,
-      dstPixels = dst.data,
-      xSize = src.width,
-      ySize = src.height,
-      yEnd = Math.ceil(0.5*ySize),
-      i, m, x, y, r,g,b,a;
-    for (x = 0; x < xSize; x += 1) {
-      for (y = 0; y < yEnd; y += 1) {
-        i = (y * xSize + x) * 4; // original 
-        m = ((ySize-1 - y) * xSize + x) * 4; // flipped
-        // Instead of copying each row from the source to the destiation
-        // swap rows - this let's us achive a full flip in a single buffer
-        r = srcPixels[m + 0];
-        g = srcPixels[m + 1];
-        b = srcPixels[m + 2];
-        a = srcPixels[m + 3];
-        dstPixels[m + 0] = srcPixels[i + 0];
-        dstPixels[m + 1] = srcPixels[i + 1];
-        dstPixels[m + 2] = srcPixels[i + 2];
-        dstPixels[m + 3] = srcPixels[i + 3];
-        dstPixels[i + 0] = r;
-        dstPixels[i + 1] = g;
-        dstPixels[i + 2] = b;
-        dstPixels[i + 3] = a;
-      }
-    }
-  };
-
-  Kinetic.Filters.FlipX = function(src,dst,opt){
-    if( this === Kinetic.Filters ){
-      FlipX(src, dst||src, opt );
-    }else{
-      FlipX.call(this, src, dst||src, opt);
-    }
-  };
-
-  Kinetic.Filters.FlipY = function(src,dst,opt){
-    if( this === Kinetic.Filters ){
-      FlipY(src, dst||src, opt );
-    }else{
-      FlipY.call(this, src, dst||src, opt);
-    }
-  };
-
-})();

src/filters/Mirror.js

@@ -1,92 +0,0 @@
-(function () {
-
-  /**
-   * MirrorX Filter. Copies and flips the left half of the image
-   *  to the right side of the image
-   *  Performs w*h pixel reads and w*h pixel writes.
-   * @function
-   * @author ippo615
-   * @memberof Kinetic.Filters
-   * @param {ImageData} src, the source image data (what will be transformed)
-   * @param {ImageData} dst, the destination image data (where it will be saved)
-   * @param {Object} opt, There are no options for this filter
-   */
-
-  var MirrorX = function (src, dst, opt) {
-    var srcPixels = src.data,
-      dstPixels = dst.data,
-      xSize = src.width,
-      ySize = src.height,
-      xMid = Math.ceil(xSize / 2),
-      i, m, x, y;
-    for (x = 0; x <= xMid; x += 1) {
-      for (y = 0; y < ySize; y += 1) {
-        // copy the original
-        i = (y * xSize + x) * 4;
-        dstPixels[i + 0] = srcPixels[i + 0];
-        dstPixels[i + 1] = srcPixels[i + 1];
-        dstPixels[i + 2] = srcPixels[i + 2];
-        dstPixels[i + 3] = srcPixels[i + 3];
-        // copy the mirrored
-        m = (y * xSize + xSize - x) * 4;
-        dstPixels[m + 0] = srcPixels[i + 0];
-        dstPixels[m + 1] = srcPixels[i + 1];
-        dstPixels[m + 2] = srcPixels[i + 2];
-        dstPixels[m + 3] = srcPixels[i + 3];
-      }
-    }
-  };
-
-  /**
-   * MirrorY Filter. Copies and flips the top half of the image
-   *  to the bottom of the image
-   *  Performs w*h pixel reads and w*h pixel writes.
-   * @function
-   * @author ippo615
-   * @memberof Kinetic.Filters
-   * @param {ImageData} src, the source image data (what will be transformed)
-   * @param {ImageData} dst, the destination image data (where it will be saved)
-   * @param {Object} opt, There are no options for this filter
-   */
-  var MirrorY = function (src, dst, opt) {
-    var srcPixels = src.data,
-      dstPixels = dst.data,
-      xSize = src.width,
-      ySize = src.height,
-      yMid = Math.ceil(ySize / 2),
-      i, m, x, y;
-    for (x = 0; x < xSize; x += 1) {
-      for (y = 0; y <= yMid; y += 1) {
-        // copy the original
-        i = (y * xSize + x) * 4;
-        dstPixels[i + 0] = srcPixels[i + 0];
-        dstPixels[i + 1] = srcPixels[i + 1];
-        dstPixels[i + 2] = srcPixels[i + 2];
-        dstPixels[i + 3] = srcPixels[i + 3];
-        // copy the mirrored
-        m = ( (ySize-y) * xSize + x) * 4;
-        dstPixels[m + 0] = srcPixels[i + 0];
-        dstPixels[m + 1] = srcPixels[i + 1];
-        dstPixels[m + 2] = srcPixels[i + 2];
-        dstPixels[m + 3] = srcPixels[i + 3];
-      }
-    }
-  };
-
-  Kinetic.Filters.MirrorX = function(src,dst,opt){
-    if( this === Kinetic.Filters ){
-      MirrorX(src, dst||src, opt );
-    }else{
-      MirrorX.call(this, src, dst||src, opt);
-    }
-  };
-
-  Kinetic.Filters.MirrorY = function(src,dst,opt){
-    if( this === Kinetic.Filters ){
-      MirrorY(src, dst||src, opt );
-    }else{
-      MirrorY.call(this, src, dst||src, opt);
-    }
-  };
-
-})();

test/runner.html

@@ -94,9 +94,8 @@
     <script src="unit/filters/Noise-test.js"></script>
     <script src="unit/filters/Threshold-test.js"></script>
     <script src="unit/filters/Levels-test.js"></script>
-    <!--<script src="unit/filters/Flip-test.js"></script>
+
-    <script src="unit/filters/Mirror-test.js"></script>
+    <!--<script src="unit/filters/Sepia-test.js"></script>
-    <script src="unit/filters/Sepia-test.js"></script>
     -->
 
     <!--=============== functional tests ================-->

test/unit/filters/Flip-test.js

@@ -1,269 +0,0 @@
-suite('Flip', function () {
-    // ======================================================
-    test('both', function (done) {
-        var stage = addStage();
-
-        var shapesLayer = new Kinetic.Layer();
-
-        // The important line!
-        shapesLayer.on('draw', function () {
-          var imageData = this.getContext().getImageData(0,0,this.getCanvas().width,this.getCanvas().height);
-          var scratchData = this.getContext().createImageData(imageData); // only size copied
-          Kinetic.Filters.FlipX(imageData,scratchData,{});
-          Kinetic.Filters.FlipY(scratchData,imageData,{});
-          this.getContext().putImageData(imageData,0,0);
-
-          // repeat for hit canvas
-          var hit = this.getHitCanvas();
-          //console.info(hit);
-          imageData = hit.getContext().getImageData(0,0,hit.getWidth(),hit.getHeight());
-          //imageData = hit.context.getImageData(0,0,hit.getWidth(),hit.getHeight());
-          Kinetic.Filters.FlipX(imageData,scratchData,{});
-          Kinetic.Filters.FlipY(scratchData,imageData,{});
-          hit.getContext().putImageData(imageData,0,0);
-
-          imageData = null;
-          scratchData = null;
-        });
-
-        var triangle = new Kinetic.RegularPolygon({
-          x: stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          sides: 3,
-          radius: 80,
-          fillRadialGradientStartPoint: 0,
-          fillRadialGradientStartRadius: 0,
-          fillRadialGradientEndPoint: 0,
-          fillRadialGradientEndRadius: 70,
-          fillRadialGradientColorStops: [0, '#881111', 0.5, '#888811', 1, '#000088'],
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true
-        });
-
-        var circle = new Kinetic.Circle({
-          x: 3 * stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          radius: 70,
-          fill: '#880000',
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true,
-          id: 'myCircle'
-        });
-
-        for( var i=0; i<10; i+=1 ){
-          for( var j=0; j<10; j+=1 ){
-            var rect = new Kinetic.Rect({
-              x: i/10*stage.getWidth(),
-              y: j/10*stage.getHeight(),
-              width: stage.getWidth()/10,
-              height: stage.getHeight()/10,
-              fill: (i+j)%2===0?'#FF0000':'#FFFF00',
-              stroke: 'black',
-              strokeWidth: 4,
-              draggable: true
-            });
-            shapesLayer.add(rect);
-          }
-        }
-
-        shapesLayer.add(circle);
-        shapesLayer.add(triangle);
-
-        stage.add(shapesLayer);
-
-        done();
-    });
-
-    // ======================================================
-    test('horizontal', function (done) {
-        var stage = addStage();
-
-        var shapesLayer = new Kinetic.Layer();
-
-        // The important line!
-        shapesLayer.on('draw', function () {
-          var imageData = this.getContext().getImageData(0,0,this.getCanvas().width,this.getCanvas().height);
-          var scratchData = this.getContext().createImageData(imageData); // only size copied
-          Kinetic.Filters.FlipX(imageData,scratchData,{});
-          this.getContext().putImageData(scratchData,0,0);
-
-          // repeat for hit canvas
-          var hit = this.getHitCanvas();
-          imageData = hit.getContext().getImageData(0,0,hit.getWidth(),hit.getHeight());
-          //imageData = hit.context.getImageData(0,0,hit.getWidth(),hit.getHeight());
-          Kinetic.Filters.FlipX(imageData,scratchData,{});
-          hit.getContext().putImageData(scratchData,0,0);
-
-          imageData = null;
-          scratchData = null;
-        });
-
-        var triangle = new Kinetic.RegularPolygon({
-          x: stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          sides: 3,
-          radius: 80,
-          fillRadialGradientStartPoint: 0,
-          fillRadialGradientStartRadius: 0,
-          fillRadialGradientEndPoint: 0,
-          fillRadialGradientEndRadius: 70,
-          fillRadialGradientColorStops: [0, '#881111', 0.5, '#888811', 1, '#000088'],
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true
-        });
-
-        var circle = new Kinetic.Circle({
-          x: 3 * stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          radius: 70,
-          fill: '#880000',
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true,
-          id: 'myCircle'
-        });
-
-        for( var i=0; i<10; i+=1 ){
-          for( var j=0; j<10; j+=1 ){
-            var rect = new Kinetic.Rect({
-              x: i/10*stage.getWidth(),
-              y: j/10*stage.getHeight(),
-              width: stage.getWidth()/10,
-              height: stage.getHeight()/10,
-              fill: (i+j)%2===0?'#FF0000':'#FFFF00',
-              stroke: 'black',
-              strokeWidth: 4,
-              draggable: true
-            });
-            shapesLayer.add(rect);
-          }
-        }
-
-        shapesLayer.add(circle);
-        shapesLayer.add(triangle);
-
-        stage.add(shapesLayer);
-
-        done();
-    });
-
-    // ======================================================
-    test('vertical', function (done) {
-        var stage = addStage();
-
-        var shapesLayer = new Kinetic.Layer();
-
-        // The important line!
-        shapesLayer.on('draw', function () {
-          var imageData = this.getContext().getImageData(0,0,this.getCanvas().width,this.getCanvas().height);
-          var scratchData = this.getContext().createImageData(imageData); // only size copied
-          Kinetic.Filters.FlipY(imageData,scratchData,{});
-          this.getContext().putImageData(scratchData,0,0);
-
-          // repeat for hit canvas
-          var hit = this.getHitCanvas();
-          imageData = hit.getContext().getImageData(0,0,hit.getWidth(),hit.getHeight());
-          //imageData = hit.context.getImageData(0,0,hit.getWidth(),hit.getHeight());
-          Kinetic.Filters.FlipY(imageData,scratchData,{});
-          hit.getContext().putImageData(scratchData,0,0);
-
-          imageData = null;
-          scratchData = null;
-        });
-
-        var triangle = new Kinetic.RegularPolygon({
-          x: stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          sides: 3,
-          radius: 80,
-          fillRadialGradientStartPoint: 0,
-          fillRadialGradientStartRadius: 0,
-          fillRadialGradientEndPoint: 0,
-          fillRadialGradientEndRadius: 70,
-          fillRadialGradientColorStops: [0, '#881111', 0.5, '#888811', 1, '#000088'],
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true
-        });
-
-        var circle = new Kinetic.Circle({
-          x: 3 * stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          radius: 70,
-          fill: '#880000',
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true,
-          id: 'myCircle'
-        });
-
-        for( var i=0; i<10; i+=1 ){
-          for( var j=0; j<10; j+=1 ){
-            var rect = new Kinetic.Rect({
-              x: i/10*stage.getWidth(),
-              y: j/10*stage.getHeight(),
-              width: stage.getWidth()/10,
-              height: stage.getHeight()/10,
-              fill: (i+j)%2===0?'#FF0000':'#FFFF00',
-              stroke: 'black',
-              strokeWidth: 4,
-              draggable: true
-            });
-            shapesLayer.add(rect);
-          }
-        }
-
-        shapesLayer.add(circle);
-        shapesLayer.add(triangle);
-
-        stage.add(shapesLayer);
-
-        done();
-    });
-
-    // ======================================================
-    test('on image', function(done) {
-        var stage = addStage();
-
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            
-            var layer = new Kinetic.Layer();
-            var xFlip = new Kinetic.Image({
-                x: 160,
-                y: 10,
-                image: imageObj,
-                draggable: true,
-                filter: Kinetic.Filters.FlipX
-            });
-            var yFlip = new Kinetic.Image({
-                x: 320,
-                y: 10,
-                image: imageObj,
-                draggable: true,
-                filter: Kinetic.Filters.FlipY
-            });
-            var noFlip = new Kinetic.Image({
-                x: 0,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(noFlip);
-            layer.add(xFlip);
-            layer.add(yFlip);
-            stage.add(layer);
-
-            layer.draw();
-
-            done();
-        };
-        imageObj.src = 'assets/lion.png';
-
-    });
-
-});

test/unit/filters/Mirror-test.js

@@ -1,238 +0,0 @@
-suite('Mirror', function () {
-    // ======================================================
-    test('both', function (done) {
-        var stage = addStage();
-
-        var shapesLayer = new Kinetic.Layer();
-
-        // The important line!
-        shapesLayer.on('draw', function () {
-          var imageData = this.getContext().getImageData(0,0,this.getCanvas().width,this.getCanvas().height);
-          var scratchData = this.getContext().createImageData(imageData); // only size copied
-          Kinetic.Filters.MirrorX(imageData,scratchData,{});
-          Kinetic.Filters.MirrorY(scratchData,imageData,{});
-          this.getContext().putImageData(imageData,0,0);
-          //this.getContext().putImageData(scratchData,0,0);
-        });
-
-        var triangle = new Kinetic.RegularPolygon({
-          x: stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          sides: 3,
-          radius: 80,
-          fillRadialGradientStartPoint: 0,
-          fillRadialGradientStartRadius: 0,
-          fillRadialGradientEndPoint: 0,
-          fillRadialGradientEndRadius: 70,
-          fillRadialGradientColorStops: [0, '#881111', 0.5, '#888811', 1, '#000088'],
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true
-        });
-
-        var circle = new Kinetic.Circle({
-          x: 3 * stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          radius: 70,
-          fill: '#880000',
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true,
-          id: 'myCircle'
-        });
-
-        for( var i=0; i<10; i+=1 ){
-          for( var j=0; j<10; j+=1 ){
-            var rect = new Kinetic.Rect({
-              x: i/10*stage.getWidth(),
-              y: j/10*stage.getHeight(),
-              width: stage.getWidth()/10,
-              height: stage.getHeight()/10,
-              fill: (i+j)%2===0?'#FF0000':'#FFFF00',
-              stroke: 'black',
-              strokeWidth: 4,
-              draggable: true
-            });
-            shapesLayer.add(rect);
-          }
-        }
-
-        shapesLayer.add(circle);
-        shapesLayer.add(triangle);
-
-        stage.add(shapesLayer);
-
-        done();
-    });
-
-    // ======================================================
-    test('horizontal', function (done) {
-        var stage = addStage();
-
-        var shapesLayer = new Kinetic.Layer();
-
-        // The important line!
-        shapesLayer.on('draw', function () {
-          var imageData = this.getContext().getImageData(0,0,this.getCanvas().width,this.getCanvas().height);
-          var scratchData = this.getContext().createImageData(imageData); // only size copied
-          Kinetic.Filters.MirrorX(imageData,scratchData,{});
-          this.getContext().putImageData(scratchData,0,0);
-        });
-
-        var triangle = new Kinetic.RegularPolygon({
-          x: stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          sides: 3,
-          radius: 80,
-          fillRadialGradientStartPoint: 0,
-          fillRadialGradientStartRadius: 0,
-          fillRadialGradientEndPoint: 0,
-          fillRadialGradientEndRadius: 70,
-          fillRadialGradientColorStops: [0, '#881111', 0.5, '#888811', 1, '#000088'],
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true
-        });
-
-        var circle = new Kinetic.Circle({
-          x: 3 * stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          radius: 70,
-          fill: '#880000',
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true,
-          id: 'myCircle'
-        });
-
-        for( var i=0; i<10; i+=1 ){
-          for( var j=0; j<10; j+=1 ){
-            var rect = new Kinetic.Rect({
-              x: i/10*stage.getWidth(),
-              y: j/10*stage.getHeight(),
-              width: stage.getWidth()/10,
-              height: stage.getHeight()/10,
-              fill: (i+j)%2===0?'#FF0000':'#FFFF00',
-              stroke: 'black',
-              strokeWidth: 4,
-              draggable: true
-            });
-            shapesLayer.add(rect);
-          }
-        }
-
-        shapesLayer.add(circle);
-        shapesLayer.add(triangle);
-
-        stage.add(shapesLayer);
-
-        done();
-    });
-
-    // ======================================================
-    test('vertical', function (done) {
-        var stage = addStage();
-
-        var shapesLayer = new Kinetic.Layer();
-
-        // The important line!
-        shapesLayer.on('draw', function () {
-          var imageData = this.getContext().getImageData(0,0,this.getCanvas().width,this.getCanvas().height);
-          var scratchData = this.getContext().createImageData(imageData); // only size copied
-          Kinetic.Filters.MirrorY(imageData,scratchData,{});
-          this.getContext().putImageData(scratchData,0,0);
-        });
-
-        var triangle = new Kinetic.RegularPolygon({
-          x: stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          sides: 3,
-          radius: 80,
-          fillRadialGradientStartPoint: 0,
-          fillRadialGradientStartRadius: 0,
-          fillRadialGradientEndPoint: 0,
-          fillRadialGradientEndRadius: 70,
-          fillRadialGradientColorStops: [0, '#881111', 0.5, '#888811', 1, '#000088'],
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true
-        });
-
-        var circle = new Kinetic.Circle({
-          x: 3 * stage.getWidth() / 4,
-          y: stage.getHeight() / 2,
-          radius: 70,
-          fill: '#880000',
-          stroke: 'black',
-          strokeWidth: 4,
-          draggable: true,
-          id: 'myCircle'
-        });
-
-        for( var i=0; i<10; i+=1 ){
-          for( var j=0; j<10; j+=1 ){
-            var rect = new Kinetic.Rect({
-              x: i/10*stage.getWidth(),
-              y: j/10*stage.getHeight(),
-              width: stage.getWidth()/10,
-              height: stage.getHeight()/10,
-              fill: (i+j)%2===0?'#FF0000':'#FFFF00',
-              stroke: 'black',
-              strokeWidth: 4,
-              draggable: true
-            });
-            shapesLayer.add(rect);
-          }
-        }
-
-        shapesLayer.add(circle);
-        shapesLayer.add(triangle);
-
-        stage.add(shapesLayer);
-
-        done();
-    });
-
-    // ======================================================
-    test('on image', function(done) {
-        var stage = addStage();
-
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            
-            var layer = new Kinetic.Layer();
-            var xMirror = new Kinetic.Image({
-                x: 160,
-                y: 10,
-                image: imageObj,
-                draggable: true,
-                filter: Kinetic.Filters.MirrorX
-            });
-            var yMirror = new Kinetic.Image({
-                x: 320,
-                y: 10,
-                image: imageObj,
-                draggable: true,
-                filter: Kinetic.Filters.MirrorY
-            });
-            var noMirror = new Kinetic.Image({
-                x: 0,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(noMirror);
-            layer.add(xMirror);
-            layer.add(yMirror);
-            stage.add(layer);
-
-            layer.draw();
-
-            done();
-        };
-        imageObj.src = 'assets/lion.png';
-
-    });
-
-});