Implement step 7

2 files changed, 53 insertions, 2 deletions

diff --git a/client/button.js b/client/button.js
index 84e201b..889d2b8 100644
--- a/client/button.js
+++ b/client/button.js
@@ -93,10 +93,21 @@ function animate2() {
     $('li#step5').removeClass('active');
     $('li#step6').addClass('active');
     $('div.photos').hide();
-    $('div.final').show()
+    $('div.final').show();
 
     Effects.drawFinal();
   }, delay + 2000);
+
+  delay += 1000 * photos.length;
+  delay += 2000;
+
+  _.delay(function() {
+    $('li#step6').removeClass('active');
+    $('li#step7').addClass('active');
+
+    Effects.drawFinalIcon();
+  }, delay + 2000);
+
 }
 
 Template.layout.events({
diff --git a/client/effects.js b/client/effects.js
index 08da3ee..63a5ab1 100644
--- a/client/effects.js
+++ b/client/effects.js
@@ -230,12 +230,52 @@ Effects = (function() {
     })
   }
 
+  function drawFinalIcon() {
+    var canvas = document.getElementById('canvas-final');
+    var p = new paper.PaperScope();
+    p.setup(canvas);
+
+    var gridSize = 35;
+    var gridDim = 9;
+    var photos = $('div.photo').length;
+
+    var cols = [];
+    _.each(Session.get('photos'), function (x, i) {
+      var id = x.id;
+      cols.push(Session.get(id + ':finalcols'));
+    });
+
+    for (var y = 0; y < gridDim; y++) {
+      for(var x = 0; x < gridDim; x++) {
+
+        var c = []
+        for (var j = 0; j < photos; j++) {
+          c.push(cols[j][(y * gridDim) + x]);
+        }
+
+        var freq_col = _.chain(c).countBy().pairs().max(_.last).head().value();
+        freq_col = freq_col.split(',');
+        var nc = new paper.Color(+freq_col[0], +freq_col[1], +freq_col[2]);
+
+        var rec = new paper.Path.Rectangle({
+          point: [x * gridSize, y * gridSize],
+          size: [gridSize, gridSize],
+          strokeWidth: 0,
+          fillColor: nc
+        });
+      }
+    }
+    p.view.draw();
+
+  }
+
   return {
     pixelate: pixelate,
     colorize: colorize,
     average: average,
     averageColor: averageColor,
-    drawFinal: drawFinal
+    drawFinal: drawFinal,
+    drawFinalIcon: drawFinalIcon
   }
 
 })();