From 5fa7dd33b040efce3626672d60ddeacb60580ef0 Mon Sep 17 00:00:00 2001
From: Yuval Adam <yuval@y3xz.com>
Date: Fri, 12 Jun 2015 10:59:59 +0300
Subject: Add pixelate button'

---
 client/button.js             | 2 ++
 client/colors.less           | 5 +++--
 client/effects.js            | 3 ++-
 client/templates/photos.html | 4 ++--
 4 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/client/button.js b/client/button.js
index 0d72f7a..420224d 100644
--- a/client/button.js
+++ b/client/button.js
@@ -43,7 +43,9 @@ Template.dates.helpers({
 Template.photos.events({
   'click button.pixelate': function (event) {
     _.each(Session.get('photos'), function(x) {
+      $('#img-'+x.id).hide()
       Effects.pixelate(x.id);
+      $('#canvas-'+x.id).show()
     })
   }
 })
diff --git a/client/colors.less b/client/colors.less
index eb77db9..15d45e4 100644
--- a/client/colors.less
+++ b/client/colors.less
@@ -110,14 +110,15 @@ body {
         flex-wrap: wrap;
         div.photo {
           margin: 3px 8px;
+          width: 54px;
           div.title {
             color: #333;
             font-size: 0.7em;
             text-align: center;
           }
           img {
-            height: 50px;
-            width: 50px;
+            height: 54px;
+            width: 54px;
           }
         }
       }
diff --git a/client/effects.js b/client/effects.js
index 52e1bcc..3743b9e 100644
--- a/client/effects.js
+++ b/client/effects.js
@@ -5,7 +5,7 @@ Effects = (function() {
 
     var raster = new paper.Raster('img-' + id);
     raster.visible = false;
-    var gridSize = 20;
+    var gridSize = 6;
     var gridDim = 9;
     var colors = [];
 
@@ -29,6 +29,7 @@ Effects = (function() {
     }
 
     paper.view.draw();
+    return;
 
     var quant = MMCQ.quantize(colors, 2);
     var palette = quant.palette();
diff --git a/client/templates/photos.html b/client/templates/photos.html
index 3a4866c..4ffc198 100644
--- a/client/templates/photos.html
+++ b/client/templates/photos.html
@@ -15,14 +15,14 @@
         {{> photo}}
       {{/each}}
     </div>
+    <button class="pixelate btn btn-default">Pixelate</button>
   </div>
-  <!-- <button class="pixelate btn btn-default">Pixelate</button> -->
 </template>
 
 <template name="photo">
   <div class="photo">
     <div class="title">{{date}}</div>
     <img id="img-{{id}}" src="{{images.thumbnail.url}}" crossorigin="anonymous">
-    <!-- <canvas id="canvas-{{id}}" resize="true" style="width: 180px; height: 230px;"></canvas> -->
+    <canvas id="canvas-{{id}}" style="display: none;"></canvas>
   </div>
 </template>
-- 
cgit v1.3.1