From 4056142b97025f43ddd5ec63a047ea6ffa311617 Mon Sep 17 00:00:00 2001
From: jdescottes <julian.descottes@gmail.com>
Date: Wed, 18 Dec 2013 23:37:17 +0100
Subject: [PATCH] Issue#145 : Hide highlighted pixel

+ BaseTool : added new method hideHighlightedPixel
+ DrawingController : mousemove event plugged on mousenter
  and unplugged on mouseleave
+ DrawingController : tool.hideHighlightPixel called on mouseleave and
  when switching the current tool to active (i.e. when user starts
  clicking)
---
 js/controller/DrawingController.js | 25 +++++++++++++++++++++----
 js/drawingtools/BaseTool.js        |  7 +++++++
 2 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/js/controller/DrawingController.js b/js/controller/DrawingController.js
index 71a7ce31..ee7ab623 100644
--- a/js/controller/DrawingController.js
+++ b/js/controller/DrawingController.js
@@ -63,7 +63,8 @@
   ns.DrawingController.prototype.initMouseBehavior = function() {
     var body = $('body');
     this.container.mousedown($.proxy(this.onMousedown_, this));
-    this.container.mousemove($.proxy(this.onMousemove_, this));
+    this.container.mouseenter($.proxy(this.onMouseenter_, this));
+    this.container.mouseleave($.proxy(this.onMouseleave_, this));
 
     if (pskl.utils.UserAgent.isChrome) {
       this.container.on('mousewheel', $.proxy(this.onMousewheel_, this));
@@ -82,7 +83,7 @@
       window.clearInterval(this.resizeTimer);
     }
     this.resizeTimer = window.setTimeout($.proxy(this.afterWindowResize_, this), 200);
-  },
+  };
 
   ns.DrawingController.prototype.afterWindowResize_ = function () {
     var initialWidth = this.compositeRenderer.getDisplaySize().width;
@@ -93,7 +94,7 @@
     this.compositeRenderer.setZoom(newZoom);
 
     $.publish(Events.ZOOM_CHANGED);
-  },
+  };
 
   /**
    * @private
@@ -102,7 +103,7 @@
     if(settingsName == pskl.UserSettings.SHOW_GRID) {
       console.warn('DrawingController:onUserSettingsChange_ not implemented !');
     }
-  },
+  };
 
   ns.DrawingController.prototype.onFrameSizeChanged_ = function () {
     this.compositeRenderer.setDisplaySize(this.getContainerWidth_(), this.getContainerHeight_());
@@ -111,6 +112,21 @@
     $.publish(Events.ZOOM_CHANGED);
   };
 
+  /**
+   * @private
+   */
+  ns.DrawingController.prototype.onMouseenter_ = function (event) {
+    this.container.bind('mousemove', $.proxy(this.onMousemove_, this));
+  };
+
+  /**
+   * @private
+   */
+  ns.DrawingController.prototype.onMouseleave_ = function (event) {
+    this.container.unbind('mousemove');
+    this.currentToolBehavior.hideHighlightedPixel(this.overlayFrame);
+  };
+
   /**
    * @private
    */
@@ -124,6 +140,7 @@
       }
     } else {
       this.isClicked = true;
+      this.currentToolBehavior.hideHighlightedPixel(this.overlayFrame);
 
       this.currentToolBehavior.applyToolAt(
         coords.x,
diff --git a/js/drawingtools/BaseTool.js b/js/drawingtools/BaseTool.js
index b3e33e30..890c045b 100644
--- a/js/drawingtools/BaseTool.js
+++ b/js/drawingtools/BaseTool.js
@@ -31,6 +31,13 @@
     }
   };
 
+  ns.BaseTool.prototype.hideHighlightedPixel = function(overlay) {
+    overlay.setPixel(this.highlightedPixelCol, this.highlightedPixelRow, Constants.TRANSPARENT_COLOR);
+    this.highlightedPixelRow = null;
+    this.highlightedPixelCol = null;
+  };
+
+
   ns.BaseTool.prototype.releaseToolAt = function(col, row, color, frame, overlay, event) {};
 
   /**