diff options
| author | Yuval Adam <yuval@y3xz.com> | 2015-06-17 21:36:44 +0300 |
|---|---|---|
| committer | Yuval Adam <yuval@y3xz.com> | 2015-06-17 21:36:44 +0300 |
| commit | 651491ca50532e8b7cf497c072cf909545ef8a3e (patch) | |
| tree | 560c0d9502f2a039ae6180aac1671aebe8ba6096 /client/effects.js | |
| parent | 161734857bdf3c3a382a2740a58f9065c929990f (diff) | |
averageColor() also animated
Diffstat (limited to 'client/effects.js')
| -rw-r--r-- | client/effects.js | 90 |
1 files changed, 46 insertions, 44 deletions
diff --git a/client/effects.js b/client/effects.js index 2eb9fb6..cacbc8e 100644 --- a/client/effects.js +++ b/client/effects.js @@ -132,69 +132,71 @@ Effects = (function() { var g_p1 = new paper.Color(g_palette[0][0] / 256, g_palette[0][1] / 256, g_palette[0][2] / 256); var g_p2 = new paper.Color(g_palette[1][0] / 256, g_palette[1][1] / 256, g_palette[1][2] / 256); - console.log(g_palette); + Session.set('g_p1', g_p1); + Session.set('g_p2', g_p2); + } - _.each(photos, function(x) { - var id = x.id.split('-')[1]; - var cols = Session.get(id + ':newcolors'); - var palette = Session.get(id + ':palette'); + function averageColor(id) { + var cols = Session.get(id + ':newcolors'); + var palette = Session.get(id + ':palette'); - var canvas = document.getElementById('canvas-' + id); - var p = new paper.PaperScope(); - p.setup(canvas); + var g_p1 = Session.get('g_p1'); + var g_p2 = Session.get('g_p2'); - // params - var gridSize = 6; - var gridDim = 9; + var canvas = document.getElementById('canvas-' + id); + var p = new paper.PaperScope(); + p.setup(canvas); - var p1 = new paper.Color(palette[0][0] / 256, palette[0][1] / 256, palette[0][2] / 256); - var p2 = new paper.Color(palette[1][0] / 256, palette[1][1] / 256, palette[1][2] / 256); + // params + var gridSize = 6; + var gridDim = 9; - var d1 = Math.abs(p1.red - g_p1.red) + Math.abs(p1.green - g_p1.green) + Math.abs(p1.blue - g_p1.blue); - var d2 = Math.abs(p2.red - g_p1.red) + Math.abs(p2.green - g_p1.green) + Math.abs(p2.blue - g_p1.blue); - var d3 = Math.abs(p1.red - g_p2.red) + Math.abs(p1.green - g_p2.green) + Math.abs(p1.blue - g_p2.blue); - var d4 = Math.abs(p2.red - g_p2.red) + Math.abs(p2.green - g_p2.green) + Math.abs(p2.blue - g_p2.blue); + var p1 = new paper.Color(palette[0][0] / 256, palette[0][1] / 256, palette[0][2] / 256); + var p2 = new paper.Color(palette[1][0] / 256, palette[1][1] / 256, palette[1][2] / 256); + var d1 = Math.abs(p1.red - g_p1.red) + Math.abs(p1.green - g_p1.green) + Math.abs(p1.blue - g_p1.blue); + var d2 = Math.abs(p2.red - g_p1.red) + Math.abs(p2.green - g_p1.green) + Math.abs(p2.blue - g_p1.blue); + var d3 = Math.abs(p1.red - g_p2.red) + Math.abs(p1.green - g_p2.green) + Math.abs(p1.blue - g_p2.blue); + var d4 = Math.abs(p2.red - g_p2.red) + Math.abs(p2.green - g_p2.green) + Math.abs(p2.blue - g_p2.blue); - var flipped = false; - if (d1+d4 > d2+d3) { - var t = p2; - p2 = p1; - p1 = t; - flipped = true; - } + var flipped = false; - for (var y = 0; y < gridDim; y++) { - for(var x = 0; x < gridDim; x++) { - var c = cols[(y * gridDim) + x]; + if (d1+d4 > d2+d3) { + var t = p2; + p2 = p1; + p1 = t; + flipped = true; + } - var nc; - if (c[0] == palette[0][0] && c[1] == palette[0][1] && palette[0][2]) { - nc = flipped ? g_p2 : g_p1; - } else { - nc = flipped ? g_p1 : g_p2; - } + for (var y = 0; y < gridDim; y++) { + for(var x = 0; x < gridDim; x++) { + var c = cols[(y * gridDim) + x]; - var rec = new paper.Path.Rectangle({ - point: [x * gridSize, y * gridSize], - size: [gridSize, gridSize], - strokeColor: nc, - fillColor: nc - }); + var nc; + if (c[0] == palette[0][0] && c[1] == palette[0][1] && palette[0][2]) { + nc = flipped ? g_p2 : g_p1; + } else { + nc = flipped ? g_p1 : g_p2; } - } - - p.view.draw(); - }); + var rec = new paper.Path.Rectangle({ + point: [x * gridSize, y * gridSize], + size: [gridSize, gridSize], + strokeColor: nc, + fillColor: nc + }); + } + } + p.view.draw(); } return { pixelate: pixelate, colorize: colorize, - average: average + average: average, + averageColor: averageColor } })(); |
