From cf2c0e7045b3d7c117090abb994bd57e03b0edd3 Mon Sep 17 00:00:00 2001
From: jdescottes <julian.descottes@gmail.com>
Date: Thu, 24 Apr 2014 00:38:21 +0200
Subject: [PATCH] Enhancement : preview copied selection + paste only opaque

---
 .../drawingtools/selectiontools/BaseSelect.js | 28 +++++++++---
 src/js/selection/SelectionManager.js          | 43 +++++++++++++------
 2 files changed, 51 insertions(+), 20 deletions(-)

diff --git a/src/js/drawingtools/selectiontools/BaseSelect.js b/src/js/drawingtools/selectiontools/BaseSelect.js
index 896fac11..29bd9f85 100644
--- a/src/js/drawingtools/selectiontools/BaseSelect.js
+++ b/src/js/drawingtools/selectiontools/BaseSelect.js
@@ -76,18 +76,24 @@
    */
   ns.BaseSelect.prototype.moveUnactiveToolAt = function(col, row, color, frame, overlay, event) {
     if (overlay.containsPixel(col, row)) {
-      if(overlay.getPixel(col, row) != Constants.SELECTION_TRANSPARENT_COLOR) {
+      if(this.isInSelection(col, row)) {
         // We're hovering the selection, show the move tool:
-        this.BodyRoot.addClass(this.toolId);
-        this.BodyRoot.removeClass(this.secondaryToolId);
-      } else {
-        // We're not hovering the selection, show create selection tool:
         this.BodyRoot.addClass(this.secondaryToolId);
         this.BodyRoot.removeClass(this.toolId);
+      } else {
+        // We're not hovering the selection, show create selection tool:
+        this.BodyRoot.addClass(this.toolId);
+        this.BodyRoot.removeClass(this.secondaryToolId);
       }
     }
   };
 
+  ns.BaseSelect.prototype.isInSelection = function (col, row) {
+    return this.selection && this.selection.pixels.some(function (pixel) {
+      return pixel.col === col && pixel.row === row;
+    });
+  };
+
   ns.BaseSelect.prototype.hideHighlightedPixel = function() {
     // there is no highlighted pixel for selection tools, do nothing
   };
@@ -99,10 +105,20 @@
   ns.BaseSelect.prototype.drawSelectionOnOverlay_ = function (overlay) {
     var pixels = this.selection.pixels;
     for(var i=0, l=pixels.length; i<l; i++) {
-      overlay.setPixel(pixels[i].col, pixels[i].row, Constants.SELECTION_TRANSPARENT_COLOR);
+      var pixel = pixels[i];
+      var hasColor = pixel.color && pixel.color !== Constants.TRANSPARENT_COLOR ;
+      var color = hasColor ? this.getTransparentVariant(pixel.color) : Constants.SELECTION_TRANSPARENT_COLOR;
+
+      overlay.setPixel(pixels[i].col, pixels[i].row, color);
     }
   };
 
+  ns.BaseSelect.prototype.getTransparentVariant = function (colorStr) {
+    var color = window.tinycolor(colorStr);
+    color = window.tinycolor.lighten(color, 10);
+    color.setAlpha(0.5);
+    return color.toRgbString();
+  };
 
   // The list of callbacks to implement by specialized tools to implement the selection creation behavior.
   /** @protected */
diff --git a/src/js/selection/SelectionManager.js b/src/js/selection/SelectionManager.js
index 6a63c6ce..2a7f2e3f 100644
--- a/src/js/selection/SelectionManager.js
+++ b/src/js/selection/SelectionManager.js
@@ -19,6 +19,7 @@
     $.subscribe(Events.SELECTION_MOVE_REQUEST, $.proxy(this.onSelectionMoved_, this));
 
     pskl.app.shortcutService.addShortcut('ctrl+V', this.paste.bind(this));
+    pskl.app.shortcutService.addShortcut('shift+V', this.pasteOpaqueOnly.bind(this));
     pskl.app.shortcutService.addShortcut('ctrl+X', this.cut.bind(this));
     pskl.app.shortcutService.addShortcut('ctrl+C', this.copy.bind(this));
     pskl.app.shortcutService.addShortcut('del', this.erase.bind(this));
@@ -93,23 +94,37 @@
   ns.SelectionManager.prototype.paste = function() {
     if(this.currentSelection && this.currentSelection.hasPastedContent) {
       var pixels = this.currentSelection.pixels;
-      var currentFrame = this.piskelController.getCurrentFrame();
-
-      $.publish(Events.PISKEL_SAVE_STATE, {
-        type : pskl.service.HistoryService.REPLAY,
-        scope : this,
-        replay : {
-          type : SELECTION_REPLAY.PASTE,
-          pixels : JSON.parse(JSON.stringify(pixels.slice(0)))
-        }
-      });
-
-      pixels.forEach(function (pixel) {
-        currentFrame.setPixel(pixel.col,pixel.row,pixel.color);
-      });
+      this.pastePixels(pixels);
     }
   };
 
+  ns.SelectionManager.prototype.pasteOpaqueOnly = function() {
+    if(this.currentSelection && this.currentSelection.hasPastedContent) {
+      var pixels = this.currentSelection.pixels;
+      var opaquePixels = pixels.filter(function (p) {
+        return p.color !== Constants.TRANSPARENT_COLOR;
+      });
+      this.pastePixels(opaquePixels);
+    }
+  };
+
+  ns.SelectionManager.prototype.pastePixels = function(pixels) {
+    var currentFrame = this.piskelController.getCurrentFrame();
+
+    $.publish(Events.PISKEL_SAVE_STATE, {
+      type : pskl.service.HistoryService.REPLAY,
+      scope : this,
+      replay : {
+        type : SELECTION_REPLAY.PASTE,
+        pixels : JSON.parse(JSON.stringify(pixels.slice(0)))
+      }
+    });
+
+    pixels.forEach(function (pixel) {
+      currentFrame.setPixel(pixel.col,pixel.row,pixel.color);
+    });
+  };
+
   ns.SelectionManager.prototype.replay = function (frame, replayData) {
     var pixels = replayData.pixels;
     pixels.forEach(function (pixel) {