From f3c2bd5c01ced2907192d3a97c01325817da4dd7 Mon Sep 17 00:00:00 2001
From: ippo615 <acippolit@gmail.com>
Date: Mon, 6 Jan 2014 19:27:47 -0500
Subject: [PATCH] Changed Kaleidoscope parameters: power and angle

---
 src/filters/Kaleidoscope.js            | 59 +++++++++++++++++---------
 test/unit/filters/Kaleidoscope-test.js | 31 +++++++-------
 2 files changed, 54 insertions(+), 36 deletions(-)

diff --git a/src/filters/Kaleidoscope.js b/src/filters/Kaleidoscope.js
index e7d901dd..4ba08a54 100644
--- a/src/filters/Kaleidoscope.js
+++ b/src/filters/Kaleidoscope.js
@@ -231,10 +231,11 @@
   Kinetic.Filters.Kaleidoscope = function(imageData){
     var xSize = imageData.width,
         ySize = imageData.height;
-    var nCopies = Math.round( this.kaleidoscopeSides() );
-    var size = Math.round( this.kaleidoscopeSides() );
-    var offset = this.kaleidoscopeOffset() || 0;
-    if( nCopies < 1 ){return;}
+    var power = Math.round( this.kaleidoscopePower() );
+    var angle = Math.round( this.kaleidoscopeAngle() );
+    var offset = Math.floor(xSize*(angle%360)/360);
+
+    if( power < 1 ){return;}
 
     // Work with our shared buffer canvas
     tempCanvas.width = xSize;
@@ -247,15 +248,29 @@
       polarCenterY:ySize/2
     });
 
-    // Copy/repeat a section along the r axis for effect
-    //var sectionSize = size; //Math.floor(xSize/nCopies);
-    //var nCopies = xSize/sectionSize;
-    var sectionSize = Math.ceil(xSize/nCopies);
-    var x,y,xoff,i, r,g,b,a, srcPos, dstPos;
+    // Determine how big each section will be, if it's too small 
+    // make it bigger
+    var minSectionSize = xSize / Math.pow(2,power);
+    while( minSectionSize <= 8){
+      minSectionSize = minSectionSize*2;
+      power -= 1;
+    }
+    minSectionSize = Math.ceil(minSectionSize);
+    var sectionSize = minSectionSize;
 
     // Copy the offset region to 0
+    // Depending on the size of filter and location of the offset we may need
+    // to copy the section backwards to prevent it from rewriting itself
+    var xStart = 0,
+        xEnd = sectionSize,
+        xDelta = 1;
+    if( offset+minSectionSize > xSize ){
+      xStart = sectionSize;
+      xEnd = 0;
+      xDelta = -1;
+    }
     for( y=0; y<ySize; y+=1 ){
-      for( x=0; x<sectionSize; x+=1 ){
+      for( x=xStart; x !== xEnd; x+=xDelta ){
         xoff = Math.round(x+offset)%xSize;
         srcPos = (xSize*y+xoff)*4;
         r = scratchData.data[srcPos+0];
@@ -269,21 +284,25 @@
         scratchData.data[dstPos+3] = a;
       }
     }
+
     // Perform the actual effect
+    var x,y,xoff,i, r,g,b,a, srcPos, dstPos;
     for( y=0; y<ySize; y+=1 ){
-      for( x=0; x<sectionSize; x+=1 ){
-        srcPos = (xSize*y+x)*4;
-        r = scratchData.data[srcPos+0];
-        g = scratchData.data[srcPos+1];
-        b = scratchData.data[srcPos+2];
-        a = scratchData.data[srcPos+3];
-        for( i=1; i<nCopies; i+=1 ){
-          dstPos = (xSize*y+x+sectionSize*i)*4;
+      sectionSize = Math.floor( minSectionSize );
+      for( i=0; i<power; i+=1 ){
+        for( x=0; x<sectionSize+1; x+=1 ){
+          srcPos = (xSize*y+x)*4;
+          r = scratchData.data[srcPos+0];
+          g = scratchData.data[srcPos+1];
+          b = scratchData.data[srcPos+2];
+          a = scratchData.data[srcPos+3];
+          dstPos = (xSize*y+sectionSize*2-x-1)*4;
           scratchData.data[dstPos+0] = r;
           scratchData.data[dstPos+1] = g;
           scratchData.data[dstPos+2] = b;
           scratchData.data[dstPos+3] = a;
         }
+        sectionSize *= 2;
       }
     }
 
@@ -291,8 +310,8 @@
     FromPolar(scratchData,imageData,{polarRotation:0});
   };
 
-    Kinetic.Factory.addFilterGetterSetter(Kinetic.Node, 'kaleidoscopeSides', 5);
-    Kinetic.Factory.addFilterGetterSetter(Kinetic.Node, 'kaleidoscopeOffset', 0);
+    Kinetic.Factory.addFilterGetterSetter(Kinetic.Node, 'kaleidoscopePower', 2);
+    Kinetic.Factory.addFilterGetterSetter(Kinetic.Node, 'kaleidoscopeAngle', 0);
 
     /**
     * get/set kaleidoscope side
diff --git a/test/unit/filters/Kaleidoscope-test.js b/test/unit/filters/Kaleidoscope-test.js
index fce58dd5..49192510 100644
--- a/test/unit/filters/Kaleidoscope-test.js
+++ b/test/unit/filters/Kaleidoscope-test.js
@@ -19,18 +19,18 @@ suite('Kaleidoscope', function() {
 
             darth.cache();
             darth.filters([Kinetic.Filters.Kaleidoscope]);
-            darth.kaleidoscopeSides(9);
+            darth.kaleidoscopePower(2);
 
-            assert.equal(darth.kaleidoscopeSides(), 9);
+            assert.equal(darth.kaleidoscopePower(), 2);
             assert.equal(darth._filterUpToDate, false);
 
             layer.draw();
 
             assert.equal(darth._filterUpToDate, true);
             
-            darth.kaleidoscopeSides(16);
+            darth.kaleidoscopePower(3);
 
-            assert.equal(darth.kaleidoscopeSides(), 16);
+            assert.equal(darth.kaleidoscopePower(), 3);
             assert.equal(darth._filterUpToDate, false);
 
             layer.draw();
@@ -44,7 +44,7 @@ suite('Kaleidoscope', function() {
     });
 
     // ======================================================
-    test('tween offset', function(done) {
+    test('tween angle', function(done) {
         var stage = addStage();
 
         var imageObj = new Image();
@@ -63,15 +63,14 @@ suite('Kaleidoscope', function() {
 
             darth.cache();
             darth.filters([Kinetic.Filters.Kaleidoscope]);
-            darth.kaleidoscopeSides(5);
-            darth.kaleidoscopeOffset(0);
+            darth.kaleidoscopePower(3);
+            darth.kaleidoscopeAngle(0);
             layer.draw();
 
             var tween = new Kinetic.Tween({
               node: darth, 
-              duration: 4.0,
-              kaleidoscopeOffset: 64,
-              //rippleSize: 64,
+              duration: 10.0,
+              kaleidoscopeAngle: 720,
               easing: Kinetic.Easings.EaseInOut
             });
         
@@ -90,7 +89,7 @@ suite('Kaleidoscope', function() {
     });
 
     // ======================================================
-    test('tween sides', function(done) {
+    test('tween power', function(done) {
         var stage = addStage();
 
         var imageObj = new Image();
@@ -109,15 +108,15 @@ suite('Kaleidoscope', function() {
 
             darth.cache();
             darth.filters([Kinetic.Filters.Kaleidoscope]);
-            darth.kaleidoscopeSides(1);
-            darth.kaleidoscopeOffset(0);
+            darth.kaleidoscopePower(0);
+            darth.kaleidoscopeAngle(0);
             layer.draw();
 
             var tween = new Kinetic.Tween({
               node: darth, 
               duration: 2.0,
-              kaleidoscopeSides: 32,
-              easing: Kinetic.Easings.EaseInOut
+              kaleidoscopePower: 8,
+              easing: Kinetic.EasingsEaseInOut
             });
         
             darth.on('mouseover', function() {
@@ -131,7 +130,7 @@ suite('Kaleidoscope', function() {
             done();
 
         };
-        imageObj.src = 'assets/cropped-darth.jpg';
+        imageObj.src = 'assets/lion.png';
     });
 
 });
\ No newline at end of file