diff --git a/Gruntfile.js b/Gruntfile.js
index 6f8cb7cb..58814269 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -40,9 +40,9 @@ module.exports = function(grunt) {
     'src/filters/Brighten.js', 
     'src/filters/Invert.js', 
     'src/filters/Blur.js', 
-    'src/filters/Mask.js'/*,
-    'src/filters/Colors.js',
-    'src/filters/Convolution.js'*/
+    'src/filters/Mask.js',
+    'src/filters/ColorPack.js',
+    'src/filters/ConvolvePack.js'
   ];
 
   var unitTestFiles = [
diff --git a/src/filters/Colors.js b/src/filters/ColorPack.js
similarity index 93%
rename from src/filters/Colors.js
rename to src/filters/ColorPack.js
index cec8992b..dfc17464 100644
--- a/src/filters/Colors.js
+++ b/src/filters/ColorPack.js
@@ -80,13 +80,14 @@
     };
 
     /**
-     * shift hue
+     * Shift Hue Filter.
      * @function
      * @memberof Kinetic.Filters
      * @param {Object} imageData
+     * @author ippo615
      */
     Kinetic.Filters.ShiftHue = function(imageData) {
-        shift_hue(imageData,this.getFilterHueShiftDeg());
+        shift_hue(imageData, this.getFilterHueShiftDeg() % 360 );
     };
 
     Kinetic.Node.addFilterGetterSetter(Kinetic.Image, 'filterHueShiftDeg', 0);
@@ -106,10 +107,12 @@
 
 
     /**
-     * colorizes the image so that it is just varying shades of the specified color
+     * Colorize Filter.
+     *  colorizes the image so that it is just varying shades of the specified color
      * @function
      * @memberof Kinetic.Filters
      * @param {Object} imageData
+     * @author ippo615
      */
     Kinetic.Filters.Colorize = function(imageData) {
         var data = imageData.data;
@@ -119,7 +122,7 @@
             hsl = rgb_to_hsl(color[0],color[1],color[2]),
             hue = hsl[0];
 
-        // Color it red
+        // Color it red, by removing green and blue
         for(var i = 0; i < data.length; i += 4) {
             data[i + 1] = 0;
             data[i + 2] = 0;
@@ -146,3 +149,4 @@
      */
 
 })();
+
diff --git a/src/filters/Convolution.js b/src/filters/Convolution.js
deleted file mode 100644
index 92af8566..00000000
--- a/src/filters/Convolution.js
+++ /dev/null
@@ -1,393 +0,0 @@
-(function() {
-
-    var convolve_internal = function(imageData,matrix){
-        // Input data
-        var pixels = imageData.data,
-            imageSizeX = imageData.width,
-            imageSizeY = imageData.height,
-            nPixels = imageSizeX*imageSizeY,
-            pixel;
-
-        // An array for storing the result
-        var result = [];
-        result.length = imageSizeX*imageSizeY*4;
-
-        // Determine the size and demsionality of the matrix
-        // Note: it should be square and odd (3,5,7,9 etc...)
-        var is2D = (matrix[0].length > 0) || 0,
-            matrixSizeX = matrix.length,
-            matrixSizeY = matrix.length;
-
-        // Make sure we don't try to access pixels outside the image
-        var xMax = Math.floor(imageSizeX - matrixSizeX/2),
-            xMin = Math.floor(matrixSizeX/2),
-            yMax = Math.floor(imageSizeY - matrixSizeY/2),
-            yMin = Math.floor(matrixSizeY/2);
-
-        // Accumlators and positions for iterating
-        var r,g,b,a, x, y, pos, i,j;
-
-        // Handle the 2D matrix
-        if( is2D ){
-            for( y=yMin; y<yMax; y+=1){
-                for( x=xMin; x<xMax; x+=1){
-    
-                    // Perform the convolution
-                    r = 0; g = 0; b = 0; a = 0;
-                    for( i=0; i<matrixSizeX; i+=1){
-                        for( j=0; j<matrixSizeY; j+=1){
-                            pos = ((y+j)*imageSizeX+x+i)*4;
-                            r += matrix[j][i]*pixels[pos+0];
-                            g += matrix[j][i]*pixels[pos+1];
-                            b += matrix[j][i]*pixels[pos+2];
-                            //a += matrix[j][i]*pixels[pos+3];
-                        }
-                    }
-
-                    // Store the result
-                    pos = (y*imageSizeX+x)*4;
-                    result[pos+0] = r;
-                    result[pos+1] = g;
-                    result[pos+2] = b;
-                    //result[pos+3] = a;
-                }
-            }
-        }
-        // Handle the 1D matrix
-        else{
-
-            // Horizontal pass (ie convolving every row of the image)
-            for( y=0; y<imageSizeY; y+=1){
-                for( x=xMin; x<xMax; x+=1){
-                    pos = (y*imageSizeX+x)*4;
-    
-                    // Perform the convolution
-                    r = 0; g = 0; b = 0; a = 0;
-                    for( j=0; j<matrixSizeX; j+=1){
-                        pos += 4;
-                        r += matrix[j]*pixels[pos+0];
-                        g += matrix[j]*pixels[pos+1];
-                        b += matrix[j]*pixels[pos+2];
-                        //a += matrix[j]*pixels[pos+3];
-                    }
-
-                    // Multiply by 1/2 because the other 1/2 comes from the vertical pass
-                    pos = (y*imageSizeX+x)*4;
-                    result[pos+0] = r*0.5;
-                    result[pos+1] = g*0.5;
-                    result[pos+2] = b*0.5;
-                    //result[pos+3] = a*0.5;
-                }
-            }
-
-            // Vertical pass (ie convolving every column of the image)
-            for( x=0; x<imageSizeX; x+=1){
-                for( y=yMin; y<yMax; y+=1){
-                    pos = (y*imageSizeX+x)*4;
-    
-                    // Perform the convolution
-                    r = 0; g = 0; b = 0; a = 0;
-                    for( j=0; j<matrixSizeX; j+=1){
-                        pos += 4*imageSizeX;
-                        r += matrix[j]*pixels[pos+0];
-                        g += matrix[j]*pixels[pos+1];
-                        b += matrix[j]*pixels[pos+2];
-                        //a += matrix[j]*pixels[pos+3];
-                    }
-    
-                    // Multiply by 1/2 and add to horizontal pass results
-                    pos = (y*imageSizeX+x)*4;
-                    result[pos+0] += r*0.5;
-                    result[pos+1] += g*0.5;
-                    result[pos+2] += b*0.5;
-                    //result[pos+3] += a*0.5;
-                }
-            }
-        }
-
-        // copy the result to the original canvas
-        var lastPos = nPixels*4;
-        for( pos=0; pos<lastPos; pos+=4 ){
-             pixels[pos+0] = result[pos+0];
-             pixels[pos+1] = result[pos+1];
-             pixels[pos+2] = result[pos+2];
-             //pixels[pos+3] = result[pos+3];
-        }
-    };
-
-    // Definition of a gaussian function
-    var gaussian = function(x,mean,sigma){
-        var dx = x - mean;
-        return Math.pow(Math.E, -dx*dx / (2*sigma*sigma));
-    };
-
-    var make_blur_kernel = function( size, scale ){
-
-        // make sure size is odd:
-        if( size % 2 === 0 ){ size += 1; }
-
-        // Generate the kernel, we can just multiply 2 single dimensional
-        // gaussians to get a 2D guassian
-        var kernel = [], i,j, row;
-        for( i=0; i<size; i+=1 ){
-            row = [];
-            for( j=0; j<size; j+=1 ){
-                row.push( scale * gaussian(i,size/2,1) * gaussian(j,size/2,1) );
-            }
-            kernel.push(row);
-        }
-
-        return kernel;
-    };
-
-    var make_soft_blur_kernel = function( size, blur_percent ){
-        // A soft blur is achieve by blurring the image then
-        // merging the blured and unblurred image (ie 60/40).
-        // Instead of that we've scaling the blur kernel (ie 60)
-        // and adding the identity scaled (ie 40) to the kernel
-        var kernel = make_blur_kernel( size, blur_percent / 100 ),
-            mid = Math.floor(size/2);
-        kernel[mid][mid] += 1 - (blur_percent/100);
-        return kernel;
-    };
-
-    var make_unsharp_kernel = function( size, unsharp_percent ){
-        // An 'unsharp mask' is made by blurring the inverted image
-        // and combining it with the original (like a soft blur but
-        // with the blur negated). We can achieve this by negating 
-        // blur kernel, and adding twice the identity to that kernel.
-        var kernel = make_blur_kernel( size, -blur_percent / 100 ),
-            mid = Math.floor(size/2);
-        kernel[mid][mid] += 2;
-        return kernel;
-    };
-
-    /**
-     * general convolution
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.Convolve = function(imageData) {
-        convolve_internal(imageData,this.getFilterConvolutionMatrix());
-    };
-
-    Kinetic.Node.addFilterGetterSetter(Kinetic.Image, 'filterConvolutionMatrix', 0);
-    /**
-     * get the current convolution matrix.
-     * @name getFilterConvolutionMatrix
-     * @method
-     * @memberof Kinetic.Image.prototype
-     */
-
-    /**
-     * set the current convolution matrix, can be a single dimensional array
-     *  or a 2D array. A 1D array will be applied horizontally then flipped
-     *  and applied vertically. A 2D array will be applied as-is. The array
-     *  dimensions should be odd (ie 3x3, 5x5, 7, etc...)
-     * @name setFilterConvolutionMatrix
-     * @method
-     * @memberof Kinetic.Image.prototype
-     */
-
-    /**
-     * unsharp mask
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.UnsharpMask = function(imageData) {
-        convolve_internal(imageData,
-            make_unsharp_kernel(
-                this.getFilterSoftBlurSize(),
-                this.getFilterSoftBlurAmount()
-            )
-        );
-    };
-
-    /**
-     * soft blur
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.SoftBlur = function(imageData) {
-        convolve_internal(imageData,
-            make_soft_blur_kernel(
-                this.getFilterSoftBlurSize(),
-                this.getFilterSoftBlurAmount()
-            )
-        );
-    };
-
-    Kinetic.Node.addFilterGetterSetter(Kinetic.Image, 'filterSoftBlurAmount', 60);
-    /**
-     * get the soft blur amount
-     * @name getFilterSoftBlurAmount
-     * @method
-     * @memberof Kinetic.Image.prototype
-     */
-
-    /**
-     * set the soft blur amount. 0 = no blur, 100 = full blur
-     * @name setFilterSoftBlurAmount
-     * @method
-     * @memberof Kinetic.Image.prototype
-     */
-
-    Kinetic.Node.addFilterGetterSetter(Kinetic.Image, 'filterSoftBlurSize', 3);
-    /**
-     * get the soft blur size
-     * @name getFilterSoftBlurSize
-     * @method
-     * @memberof Kinetic.Image.prototype
-     */
-
-    /**
-     * set the soft blur size in number of pixels
-     * @name setFilterSoftBlurSize
-     * @method
-     * @memberof Kinetic.Image.prototype
-     */
-
-    /**
-     * sharpening filter, makes edges more pointed
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.Sharpen = function(imageData) {
-        convolve_internal(imageData,[
-            [ 0,-2, 0],
-            [-2, 9,-2],
-            [ 0,-2, 0]
-        ]);
-    };
-
-    /**
-     * mean removal
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.RemoveMean = function(imageData) {
-        convolve_internal(imageData,[
-            [-1,-1,-1],
-            [-1, 9,-1],
-            [-1,-1,-1]
-        ]);
-    };
-
-    /**
-     * emboss
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.Emboss = function(imageData) {
-        convolve_internal(imageData,[
-            [-2,-1, 0],
-            [-1, 1, 1],
-            [ 0, 1, 2]
-        ]);
-    };
-
-    /**
-     * detects horizontal edges 
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.DetectHorizontalEdges = function(imageData) {
-        convolve_internal(imageData,[
-            [-1,-1,-1],
-            [ 2, 2, 2],
-            [-1,-1,-1]
-        ]);
-    };
-
-    /**
-     * detects vertical edges 
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.DetectVerticalEdges = function(imageData) {
-        convolve_internal(imageData,[
-            [-1, 2,-1],
-            [-1, 2,-1],
-            [-1, 2,-1]
-        ]);
-    };
-
-    /**
-     * detects 45* angle edges 
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.DetectDiagonal45Edges = function(imageData) {
-        convolve_internal(imageData,[
-            [-1,-1, 2],
-            [-1, 2,-1],
-            [ 2,-1,-1]
-        ]);
-    };
-
-    /**
-     * detects 135* angle edges 
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.DetectDiagonal135Edges = function(imageData) {
-        convolve_internal(imageData,[
-            [ 2,-1,-1],
-            [-1, 2,-1],
-            [-1,-1, 2]
-        ]);
-    };
-
-    /**
-     * detects edges 
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.DetectEdges = function(imageData) {
-        convolve_internal(imageData,[
-            [-1,-1,-1],
-            [-1, 8,-1],
-            [-1,-1,-1]
-        ]);
-    };
-
-    /**
-     * makes image lighter
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.Lighten = function(imageData) {
-        convolve_internal(imageData,[
-            [ 0,  0, 0],
-            [ 0,1.2, 0],
-            [ 0,  0, 0]
-        ]);
-    };
-
-    /**
-     * makes image darker
-     * @function
-     * @memberof Kinetic.Filters
-     * @param {Object} imageData
-     */
-    Kinetic.Filters.Darken = function(imageData) {
-        convolve_internal(imageData,[
-            [ 0,  0, 0],
-            [ 0,0.8, 0],
-            [ 0,  0, 0]
-        ]);
-    };
-
-})();
diff --git a/src/filters/ConvolvePack.js b/src/filters/ConvolvePack.js
new file mode 100644
index 00000000..048eecde
--- /dev/null
+++ b/src/filters/ConvolvePack.js
@@ -0,0 +1,215 @@
+(function() {
+
+    var convolve_internal = function(imageData,matrix){
+        // Input data
+        var pixels = imageData.data,
+            imageSizeX = imageData.width,
+            imageSizeY = imageData.height,
+            nPixels = imageSizeX*imageSizeY,
+            pixel;
+
+        // An array for storing the result
+        var result = [];
+        result.length = imageSizeX*imageSizeY*4;
+
+        // Determine the size and demsionality of the matrix
+        // Note: it should be square and odd (3,5,7,9 etc...)
+        var matrixSizeX = matrix.length,
+            matrixSizeY = matrix[0].length,
+            matrixMidX = Math.floor(matrix.length/2),
+            matrixMidY = Math.floor(matrix[0].length/2);
+
+        // Accumlators and positions for iterating
+        var r,g,b,a, x,y, px,py, pos, i,j;
+
+        // Handle the 2D matrix
+        for( y=0; y<imageSizeY; y+=1){
+            for( x=0; x<imageSizeX; x+=1){
+
+                // Perform the convolution
+                r = 0; g = 0; b = 0; a = 0;
+                for( i=0; i<matrixSizeX; i+=1){
+                    for( j=0; j<matrixSizeY; j+=1){
+
+                        // tile the image to account for pixels past the
+                        // edge (and make sure they are positive)
+                        px = (x+i-matrixMidX) % imageSizeX;
+                        px = (px>0)?px:-px;
+                        py = (y+i-matrixMidY) % imageSizeY;
+                        py = (py>0)?py:-py;
+
+                        // get the pixel and convolve
+                        pos = (py*imageSizeX + px)*4;
+                        r += matrix[j][i]*pixels[pos+0];
+                        g += matrix[j][i]*pixels[pos+1];
+                        b += matrix[j][i]*pixels[pos+2];
+                        //a += matrix[j][i]*pixels[pos+3];
+                    }
+                }
+
+                // Store the result
+                pos = (y*imageSizeX+x)*4;
+                result[pos+0] = r;
+                result[pos+1] = g;
+                result[pos+2] = b;
+                //result[pos+3] = a;
+            }
+        }
+
+        // copy the result to the original canvas
+        var lastPos = nPixels*4;
+        for( pos=0; pos<lastPos; pos+=4 ){
+             pixels[pos+0] = result[pos+0];
+             pixels[pos+1] = result[pos+1];
+             pixels[pos+2] = result[pos+2];
+             //pixels[pos+3] = result[pos+3];
+        }
+    };
+
+    // Definition of a gaussian function
+    var gaussian = function(x,mean,sigma){
+        var dx = x - mean;
+        return Math.pow(Math.E, -dx*dx / (2*sigma*sigma));
+    };
+
+    var make_blur_kernel = function( size, scale, sigma ){
+
+        // make sure size is odd:
+        if( size % 2 === 0 ){ size += 1; }
+
+        // Generate the kernel, we can just multiply 2 single dimensional
+        // gaussians to get a 2D guassian
+        var kernel = [], i,j, row;
+        for( i=0; i<size; i+=1 ){
+            row = [];
+            for( j=0; j<size; j+=1 ){
+                row.push( scale * gaussian(i,size/2,sigma) * gaussian(j,size/2,sigma) );
+            }
+            kernel.push(row);
+        }
+
+        return kernel;
+    };
+
+    var make_edge_detect_kernel = function( size, scale, sigma ){
+
+        // make sure size is odd:
+        if( size % 2 === 0 ){ size += 1; }
+
+        // Create a difference-of-gaussians kernel (by subtracting gaussians)
+        // 1.6 is a good sigma ratio to approximate a laplacian of gaussian 
+        var kernel = [], i,j, row, g;
+        for( i=0; i<size; i+=1 ){
+            row = [];
+            for( j=0; j<size; j+=1 ){
+                g1 = gaussian(i,size/2,sigma) * gaussian(j,size/2,sigma);
+                g2 = gaussian(i,size/2,sigma*1.6) * gaussian(j,size/2,sigma*1.6);
+                row.push( scale * (g2-g1) );
+            }
+            kernel.push(row);
+        }
+
+        return kernel;   
+    };
+
+    var make_soft_blur_kernel = function( size, percent ){
+        // A soft blur is achieve by blurring the image then
+        // merging the blured and unblurred image (ie 60/40).
+        // Instead of that we've scaling the blur kernel (ie 60)
+        // and adding the identity scaled (ie 40) to the kernel
+        var kernel = make_blur_kernel( size, percent, 1 ),
+            mid = Math.floor(size/2);
+        kernel[mid][mid] += 1-percent;
+        return kernel;
+    };
+
+    var make_unsharp_kernel = function( size, percent ){
+        // An 'unsharp mask' is made by blurring the inverted image
+        // and combining it with the original (like a soft blur but
+        // with the blur negated). We can achieve this by negating 
+        // blur kernel, and adding twice the identity to that kernel.
+        var kernel = make_blur_kernel( size, -percent, 1 ),
+            mid = Math.floor(size/2);
+        kernel[mid][mid] += 1+percent;
+        return kernel;
+    };
+
+    Kinetic.Node.addFilterGetterSetter(Kinetic.Image, 'filterAmount', 50);
+    /**
+     * get the current filter amount
+     * @name getFilterAmount
+     * @method
+     * @memberof Kinetic.Image.prototype
+     */
+    /**
+     * set the current filter amount 0 = no filter, 100 = max filter
+     * @name setFilterAmount
+     * @method
+     * @memberof Kinetic.Image.prototype
+     */
+
+
+    /**
+     * Unsharp Mask Filter.
+     * @function
+     * @memberof Kinetic.Filters
+     * @param {Object} imageData
+     * @author ippo615
+     */
+    Kinetic.Filters.UnsharpMask = function(imageData) {
+        convolve_internal(imageData,
+            make_unsharp_kernel(5,this.getFilterAmount()/100)
+        );
+    };
+
+    /**
+     * Soft Blur Filter.
+     * @function
+     * @memberof Kinetic.Filters
+     * @param {Object} imageData
+     * @author ippo615
+     */
+    Kinetic.Filters.SoftBlur = function(imageData) {
+        convolve_internal(imageData,
+            make_soft_blur_kernel(5,this.getFilterAmount()/100)
+        );
+    };
+
+
+    /**
+     * Edge Filter.
+     *  Makes edges more noticable.
+     * @function
+     * @memberof Kinetic.Filters
+     * @param {Object} imageData
+     * @author ippo615
+     */
+    Kinetic.Filters.Edge = function(imageData) {
+        var s = this.getFilterAmount()/100;
+        if( s === 0 ){ return; }
+        convolve_internal(imageData,[
+            [ 0,  -1*s, 0],
+            [-1*s,(1-s)+4*s,-1*s],
+            [ 0,  -1*s, 0]
+        ]);
+    };
+
+    /**
+     * Emboss Filter.
+     *  Makes the image apear to have some depth.
+     * @function
+     * @memberof Kinetic.Filters
+     * @param {Object} imageData
+     * @author ippo615
+     */
+    Kinetic.Filters.Emboss = function(imageData) {
+        var s = this.getFilterAmount()/100;
+        if( s === 0 ){ return; }
+        convolve_internal(imageData,[
+            [-1*s,-0.5*s, 0],
+            [-0.5*s,1+0.5*s, 0.5*s],
+            [ 0,    0.5*s, 1*s]
+        ]);
+    };
+
+})();
diff --git a/tests/html/filterTests.html b/tests/html/filterTests.html
new file mode 100644
index 00000000..90f1d69a
--- /dev/null
+++ b/tests/html/filterTests.html
@@ -0,0 +1,26 @@
+<!DOCTYPE HTML>
+<html>
+    <head>
+        <style>
+            /* overwrite CSS */
+
+        </style>
+        <link rel="stylesheet" type="text/css"href="../base.css">
+        <script src="../../dist/kinetic-v0.0.0.js"></script>
+        <script src="../assets/dataUrls.js"></script>
+        <script src="../js/Test.js"></script>
+        <script src="../js/filterTests.js"></script>
+        <script>
+            window.onload = function() {
+                var test = new Test();
+                test.run();
+
+                document.getElementsByTagName('body')[0].addEventListener('mousemove', function(evt) {
+                    //console.log(evt.clientX + ',' + evt.clientY);
+                }, false);
+            };
+
+        </script>
+    </head>
+    <body></body>
+</html>
diff --git a/tests/html/index.html b/tests/html/index.html
index b50d21de..602b29a8 100644
--- a/tests/html/index.html
+++ b/tests/html/index.html
@@ -4,12 +4,13 @@
 		<h1>KineticJS Test Suite</h1>
 		<p>atomated test counts updated on 08-10-2013</p>
 		<ul>
-			<li><a href="unitTests.html">Unit Tests (793)</a></li>
-			<li><a href="functionalTests.html">Functional Tests (172)</a></li>
-			<li><a href="visualTests.html">Visual Tests (53)</a></li>
+			<li><a href="unitTests.html">Unit Tests</a></li>
+			<li><a href="functionalTests.html">Functional Tests</a></li>
+			<li><a href="visualTests.html">Visual Tests</a></li>
+			<li><a href="filterTests.html">Filter Tests</a></li>
 			<li><a href="manualTests.html">Manual Tests</a></li>
 			<li><a href="performanceTests.html">Performance Tests</a></li>
 			<li><a href="special/index.html">Special Tests</a></li>
 		</ul>
 	</body>
-</html>
\ No newline at end of file
+</html>
diff --git a/tests/html/performanceTests.html b/tests/html/performanceTests.html
index 4660670c..d743d56e 100644
--- a/tests/html/performanceTests.html
+++ b/tests/html/performanceTests.html
@@ -8,7 +8,7 @@
 		<script src="../js/performanceTests.js"></script>
 
 		<!-- versions -->
-<!--
+
 		<script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.5.2.min.js"></script>
 		<script>
 		  run(Kinetic);
@@ -28,7 +28,7 @@
 		<script>
 		  run(Kinetic);
 		</script>
--->
+
 		<script src="../../dist/kinetic-dev.js"></script>
 		<script>
 		  run(Kinetic);
diff --git a/tests/js/filterTests.js b/tests/js/filterTests.js
new file mode 100644
index 00000000..f366c9ed
--- /dev/null
+++ b/tests/js/filterTests.js
@@ -0,0 +1,552 @@
+
+
+Test.Modules.IMAGE = {
+    'crop add and scale image': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer();
+            darth = new Kinetic.Image({
+                x: 200,
+                y: 75,
+                image: imageObj,
+                width: 107,
+                height: 75,
+                crop: [186, 211, 292 - 186, 285 - 211],
+                draggable: true,
+                scale: [0.5, 0.5]
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+            
+            //console.log(layer.toDataURL());
+            
+            testDataUrl(layer.toDataURL(), 'crop and scale image', 'problem rendering cropped and scaled image');
+        };
+        imageObj.src = '../assets/darth-vader.jpg';
+    },
+    'create image hit region': function(containerId) {
+        var imageObj = new Image();
+
+        var stage = new Kinetic.Stage({
+            container: containerId,
+            width: 578,
+            height: 200
+        });
+        var layer = new Kinetic.Layer();
+
+        imageObj.onload = function() {
+
+            var lion = new Kinetic.Image({
+                x: 200,
+                y: 40,
+                image: imageObj,
+                draggable: true,
+                shadowColor: 'black',
+            	shadowBlur: 10,
+            	shadowOffset: [20, 20],
+            	shadowOpacity: 0.2
+            });
+
+            // override color key with black
+            lion.colorKey = '000000';
+
+            layer.add(lion);
+
+            lion.createImageHitRegion(function() {
+                stage.add(layer);
+                layer.drawHit();
+
+                var hitDataUrl = layer.hitCanvas.toDataURL();
+
+                //console.log(hitDataUrl);
+                testDataUrl(hitDataUrl,'transparent image hit render', 'problem rendering image on hit graph');
+
+            });
+        };
+        imageObj.src = '../assets/lion.png';
+
+        showHit(layer);
+    },
+    'grayscale image': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer({
+                throttle: 999
+            });
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+
+            darth.setFilter(Kinetic.Filters.Grayscale);
+
+            layer.draw();
+
+            testDataUrl(layer.toDataURL(), 'grayscale image', 'problem with Grayscale filter.');
+       
+        };
+        imageObj.src = '../assets/darth-vader.jpg';
+    },
+    'invert image': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer({
+                throttle: 999
+            });
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+
+            darth.setFilter(Kinetic.Filters.Invert);
+
+            layer.draw();
+            var dataUrl = layer.toDataURL();
+
+            testDataUrl(layer.toDataURL(), 'invert image', 'problem with Invert filter.');
+
+        };
+        imageObj.src = '../assets/darth-vader.jpg';
+    },
+    'adjust image brightness': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer({
+                throttle: 999
+            });
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+
+            darth.setFilter(Kinetic.Filters.Brighten);
+            darth.setFilterBrightness(100);
+
+            layer.draw();
+
+            testDataUrl(layer.toDataURL(), 'adjust image brightness', 'problem with Brighten filter.');
+        };
+        imageObj.src = '../assets/darth-vader.jpg';
+    },
+    'gaussian blur filter': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer();
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+
+            darth.setFilter(Kinetic.Filters.Blur);
+            darth.setFilterRadius(10);
+            layer.draw();
+            var dataUrl = layer.toDataURL();
+            //console.log(dataUrl);
+            testDataUrl(dataUrl, 'blur filter', 'problem with Blur filter.');
+        };
+        imageObj.src = '../assets/darth-vader.jpg';
+    },
+    'colorizing filter': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer();
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+
+            darth.setFilter(Kinetic.Filters.Colorize);
+            darth.setFilterColorizeColor([255,0,128]);
+            layer.draw();
+            var dataUrl = layer.toDataURL();
+            //console.log(dataUrl);
+            testDataUrl(dataUrl, 'colorizing filter', 'problem with colorizing filter.');
+        };
+        imageObj.src = '../assets/darth-vader.jpg';
+    },
+    'shift hue filter': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer();
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+
+            darth.setFilter(Kinetic.Filters.ShiftHue);
+            darth.setFilterHueShiftDeg(360);
+            layer.draw();
+
+            var tween = new Kinetic.Tween({
+              node: darth, 
+              duration: 5.0,
+              filterHueShiftDeg: 0,
+              easing: Kinetic.Easings.EaseInOut
+            });
+        
+            darth.on('mouseover', function() {
+              tween.play();
+            });
+      
+            darth.on('mouseout', function() {
+              tween.reverse();
+            });
+
+            var dataUrl = layer.toDataURL();
+            //console.log(dataUrl);
+            testDataUrl(dataUrl, 'shift hue filter', 'problem with hue shifting filter.');
+        };
+        imageObj.src = '../assets/lion.png';
+    },
+    'unsharp mask filter': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer();
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+            darth.setFilter(Kinetic.Filters.UnsharpMask);
+            darth.setFilterAmount(100);
+            layer.draw();
+
+            var tween = new Kinetic.Tween({
+              node: darth, 
+              duration: 0.6,
+              filterAmount: 0,
+              easing: Kinetic.Easings.EaseInOut
+            });
+        
+            darth.on('mouseover', function() {
+              tween.play();
+            });
+      
+            darth.on('mouseout', function() {
+              tween.reverse();
+            });
+
+            var dataUrl = layer.toDataURL();
+            //console.log(dataUrl);
+            testDataUrl(dataUrl, 'unsharp mask filter', 'problem with unsharp mask filter.');
+        };
+        //imageObj.src = '../assets/darth-vader.jpg';
+        imageObj.src = '../assets/lion.png';
+    },
+    'soft blur filter': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer();
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+            darth.setFilter(Kinetic.Filters.SoftBlur);
+            darth.setFilterAmount(100);
+            layer.draw();
+
+            var tween = new Kinetic.Tween({
+              node: darth, 
+              duration: 0.6,
+              filterAmount: 0,
+              easing: Kinetic.Easings.EaseInOut
+            });
+        
+            darth.on('mouseover', function() {
+              tween.play();
+            });
+      
+            darth.on('mouseout', function() {
+              tween.reverse();
+            });
+
+            var dataUrl = layer.toDataURL();
+            //console.log(dataUrl);
+            testDataUrl(dataUrl, 'soft blur filter', 'problem with soft blur filter.');
+        };
+        //imageObj.src = '../assets/darth-vader.jpg';
+        imageObj.src = '../assets/lion.png';
+    },
+    'edge detection filter 1': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer();
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+            darth.setFilter(Kinetic.Filters.Edge);
+            darth.setFilterAmount(100);
+            layer.draw();
+
+            var tween = new Kinetic.Tween({
+              node: darth, 
+              duration: 0.6,
+              filterAmount: 0,
+              easing: Kinetic.Easings.EaseInOut
+            });
+        
+            darth.on('mouseover', function() {
+              tween.play();
+            });
+      
+            darth.on('mouseout', function() {
+              tween.reverse();
+            });
+
+            var dataUrl = layer.toDataURL();
+            //console.log(dataUrl);
+            testDataUrl(dataUrl, 'sharpen filter', 'problem with sharpen filter.');
+        };
+        //imageObj.src = '../assets/darth-vader.jpg';
+        imageObj.src = '../assets/lion.png';
+    },
+    'emboss filter': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer();
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+            darth.setFilter(Kinetic.Filters.Emboss);
+            darth.setFilterAmount(50);
+            layer.draw();
+
+            var tween = new Kinetic.Tween({
+              node: darth, 
+              duration: 0.6,
+              filterAmount: 0,
+              easing: Kinetic.Easings.EaseInOut
+            });
+        
+            darth.on('mouseover', function() {
+              tween.play();
+            });
+      
+            darth.on('mouseout', function() {
+              tween.reverse();
+            });
+
+            var dataUrl = layer.toDataURL();
+            //console.log(dataUrl);
+            testDataUrl(dataUrl, 'emboss filter', 'problem with emboss filter.');
+        };
+        //imageObj.src = '../assets/darth-vader.jpg';
+        imageObj.src = '../assets/lion.png';
+    },
+    'filter transformed image': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer({
+                throttle: 999
+            });
+            darth = new Kinetic.Image({
+                x: 50,
+                y: 50,
+                //width: 438,
+                //height: 300,
+                image: imageObj,
+                draggable: true,
+                rotationDeg: 10,
+                scale: 0.3
+            });
+
+            darth.setOffset(darth.getWidth() / 2, darth.getHeight() / 2);
+
+            layer.add(darth);
+            stage.add(layer);
+
+            darth.setFilter(Kinetic.Filters.Grayscale);
+
+            layer.draw();
+            //console.log(layer.toDataURL());
+            testDataUrl(layer.toDataURL(), 'filter transformed image', 'problem filtering transformed image');
+        };
+        imageObj.src = '../assets/darth-vader.jpg';
+    },
+    'apply shadow to transparent image': function(containerId) {
+        var imageObj = new Image();
+
+        var stage = new Kinetic.Stage({
+            container: containerId,
+            width: 578,
+            height: 200
+        });
+        var layer = new Kinetic.Layer();
+
+        imageObj.onload = function() {
+
+            var lion = new Kinetic.Image({
+                x: 200,
+                y: 40,
+                image: imageObj,
+                draggable: true,
+                shadowColor: 'black',
+            	shadowBlur: 10,
+            	shadowOffset: [20, 20],
+            	shadowOpacity: 0.2
+            });
+
+            layer.add(lion);
+            stage.add(layer);
+
+            var dataUrl = layer.toDataURL();
+
+            testDataUrl(layer.toDataURL(), 'transparent image shadow', 'problem applying shadow to image with transparent pixels');
+
+        };
+        imageObj.src = '../assets/lion.png';
+
+        showHit(layer);
+    },
+     'mask unicolor background filter': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 600,
+                height: 200
+            });
+            var layer = new Kinetic.Layer({
+                throttle: 999
+            });
+            var bamoon = new Kinetic.Image({
+                x: 0,
+                y: 0,
+                image: imageObj,
+                draggable: true
+            }),
+            filtered = new Kinetic.Image({
+                x: 300,
+                y: 0,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(bamoon);
+            layer.add(filtered);
+            stage.add(layer);
+
+            filtered.setFilter(Kinetic.Filters.Mask);
+            filtered.setFilterThreshold(10);
+
+            layer.draw();
+            var dataUrl = layer.toDataURL();
+            //console.log(dataUrl);
+            testDataUrl(dataUrl, 'mask filter', 'problem with Mask filter.');
+        };
+        imageObj.src = '../assets/bamoon.jpg';
+    }
+};
+
diff --git a/tests/js/visualTests.js b/tests/js/visualTests.js
index 8525f955..958b946e 100644
--- a/tests/js/visualTests.js
+++ b/tests/js/visualTests.js
@@ -1240,588 +1240,6 @@ Test.Modules.BLOB = {
 };
 
 
-Test.Modules.IMAGE = {
-    'crop add and scale image': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 200,
-                y: 75,
-                image: imageObj,
-                width: 107,
-                height: 75,
-                crop: [186, 211, 292 - 186, 285 - 211],
-                draggable: true,
-                scale: [0.5, 0.5]
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-            
-            //console.log(layer.toDataURL());
-            
-            testDataUrl(layer.toDataURL(), 'crop and scale image', 'problem rendering cropped and scaled image');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-    },
-    'create image hit region': function(containerId) {
-        var imageObj = new Image();
-
-        var stage = new Kinetic.Stage({
-            container: containerId,
-            width: 578,
-            height: 200
-        });
-        var layer = new Kinetic.Layer();
-
-        imageObj.onload = function() {
-
-            var lion = new Kinetic.Image({
-                x: 200,
-                y: 40,
-                image: imageObj,
-                draggable: true,
-                shadowColor: 'black',
-            	shadowBlur: 10,
-            	shadowOffset: [20, 20],
-            	shadowOpacity: 0.2
-            });
-
-            // override color key with black
-            lion.colorKey = '000000';
-
-            layer.add(lion);
-
-            lion.createImageHitRegion(function() {
-                stage.add(layer);
-                layer.drawHit();
-
-                var hitDataUrl = layer.hitCanvas.toDataURL();
-
-                //console.log(hitDataUrl);
-                testDataUrl(hitDataUrl,'transparent image hit render', 'problem rendering image on hit graph');
-
-            });
-        };
-        imageObj.src = '../assets/lion.png';
-
-        showHit(layer);
-    },
-    'grayscale image': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer({
-                throttle: 999
-            });
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-
-            darth.setFilter(Kinetic.Filters.Grayscale);
-
-            layer.draw();
-
-            testDataUrl(layer.toDataURL(), 'grayscale image', 'problem with Grayscale filter.');
-       
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-    },
-    'invert image': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer({
-                throttle: 999
-            });
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-
-            darth.setFilter(Kinetic.Filters.Invert);
-
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-
-            testDataUrl(layer.toDataURL(), 'invert image', 'problem with Invert filter.');
-
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-    },
-    'adjust image brightness': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer({
-                throttle: 999
-            });
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-
-            darth.setFilter(Kinetic.Filters.Brighten);
-            darth.setFilterBrightness(100);
-
-            layer.draw();
-
-            testDataUrl(layer.toDataURL(), 'adjust image brightness', 'problem with Brighten filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-    },
-    'gaussian blur filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-
-            darth.setFilter(Kinetic.Filters.Blur);
-            darth.setFilterRadius(10);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'blur filter', 'problem with Blur filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-    },
-    'colorizing filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-
-            darth.setFilter(Kinetic.Filters.Colorize);
-            darth.setFilterColorizeColor([255,0,128]);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'colorizing filter', 'problem with colorizing filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-    },
-    'shift hue filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-
-            darth.setFilter(Kinetic.Filters.ShiftHue);
-            darth.setFilterHueShiftDeg(90);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'shift hue filter', 'problem with hue shifting filter.');
-        };
-        imageObj.src = '../assets/lion.png';
-    },
-    'unsharp mask filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-            darth.setFilter(Kinetic.Filters.UnsharpMask);
-            darth.setFilterSoftBlurAmount(90);
-            darth.setFilterSoftBlurSize(7);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'unsharp mask filter', 'problem with unsharp mask filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-        //imageObj.src = '../assets/lion.png';
-    },
-    'soft blur filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-            darth.setFilter(Kinetic.Filters.SoftBlur);
-            darth.setFilterSoftBlurAmount(10);
-            darth.setFilterSoftBlurSize(7);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'soft blur filter', 'problem with soft blur filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-        //imageObj.src = '../assets/lion.png';
-    },
-    'sharpen filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-            darth.setFilter(Kinetic.Filters.Sharpen);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'sharpen filter', 'problem with sharpen filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-        //imageObj.src = '../assets/lion.png';
-    },
-    'remove mean filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-            darth.setFilter(Kinetic.Filters.RemoveMean);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'remove mean filter', 'problem with remove mean filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-        //imageObj.src = '../assets/lion.png';
-    },
-    'emboss filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-            darth.setFilter(Kinetic.Filters.Emboss);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'emboss filter', 'problem with emboss filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-        //imageObj.src = '../assets/lion.png';
-    },
-    'edge detection filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-            //darth.setFilter(Kinetic.Filters.DetectHorizontalEdge);
-            //darth.setFilter(Kinetic.Filters.DetectVerticalEdge);
-            //darth.setFilter(Kinetic.Filters.DetectDiagonal45Edge);
-            //darth.setFilter(Kinetic.Filters.DetectDiagonal135Edge);
-            darth.setFilter(Kinetic.Filters.DetectEdges);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'edge detection filter', 'problem with edge detection filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-        //imageObj.src = '../assets/lion.png';
-    },
-    'lighten filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-            darth.setFilter(Kinetic.Filters.Lighten);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'lighten filter', 'problem with lighten filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-        //imageObj.src = '../assets/lion.png';
-    },
-    'darken filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer();
-            darth = new Kinetic.Image({
-                x: 10,
-                y: 10,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(darth);
-            stage.add(layer);
-            darth.setFilter(Kinetic.Filters.Darken);
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'darken filter', 'problem with darken filter.');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-        //imageObj.src = '../assets/lion.png';
-    },
-    'filter transformed image': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 578,
-                height: 200
-            });
-            var layer = new Kinetic.Layer({
-                throttle: 999
-            });
-            darth = new Kinetic.Image({
-                x: 50,
-                y: 50,
-                //width: 438,
-                //height: 300,
-                image: imageObj,
-                draggable: true,
-                rotationDeg: 10,
-                scale: 0.3
-            });
-
-            darth.setOffset(darth.getWidth() / 2, darth.getHeight() / 2);
-
-            layer.add(darth);
-            stage.add(layer);
-
-            darth.setFilter(Kinetic.Filters.Grayscale);
-
-            layer.draw();
-            //console.log(layer.toDataURL());
-            testDataUrl(layer.toDataURL(), 'filter transformed image', 'problem filtering transformed image');
-        };
-        imageObj.src = '../assets/darth-vader.jpg';
-    },
-    'apply shadow to transparent image': function(containerId) {
-        var imageObj = new Image();
-
-        var stage = new Kinetic.Stage({
-            container: containerId,
-            width: 578,
-            height: 200
-        });
-        var layer = new Kinetic.Layer();
-
-        imageObj.onload = function() {
-
-            var lion = new Kinetic.Image({
-                x: 200,
-                y: 40,
-                image: imageObj,
-                draggable: true,
-                shadowColor: 'black',
-            	shadowBlur: 10,
-            	shadowOffset: [20, 20],
-            	shadowOpacity: 0.2
-            });
-
-            layer.add(lion);
-            stage.add(layer);
-
-            var dataUrl = layer.toDataURL();
-
-            testDataUrl(layer.toDataURL(), 'transparent image shadow', 'problem applying shadow to image with transparent pixels');
-
-        };
-        imageObj.src = '../assets/lion.png';
-
-        showHit(layer);
-    },
-     'mask unicolor background filter': function(containerId) {
-        var imageObj = new Image();
-        imageObj.onload = function() {
-            var stage = new Kinetic.Stage({
-                container: containerId,
-                width: 600,
-                height: 200
-            });
-            var layer = new Kinetic.Layer({
-                throttle: 999
-            });
-            var bamoon = new Kinetic.Image({
-                x: 0,
-                y: 0,
-                image: imageObj,
-                draggable: true
-            }),
-            filtered = new Kinetic.Image({
-                x: 300,
-                y: 0,
-                image: imageObj,
-                draggable: true
-            });
-
-            layer.add(bamoon);
-            layer.add(filtered);
-            stage.add(layer);
-
-            filtered.setFilter(Kinetic.Filters.Mask);
-            filtered.setFilterThreshold(10);
-
-            layer.draw();
-            var dataUrl = layer.toDataURL();
-            //console.log(dataUrl);
-            testDataUrl(dataUrl, 'mask filter', 'problem with Mask filter.');
-        };
-        imageObj.src = '../assets/bamoon.jpg';
-    }
-};
-
 Test.Modules.SPLINE = {
     'add splines': function(containerId) {
         var stage = new Kinetic.Stage({