From aad41becbc41882abf1558c6b5aa38db6a9e99c8 Mon Sep 17 00:00:00 2001
From: Jose Antonio Marquez
Date: Tue, 19 Jun 2012 15:06:45 -0700
Subject: Fixing logic to close color panel popup

This resolves closing the color panel popup when a user make a click outside the popup area or resizes the Ninja window. This should be tested prior to merging.
---
 js/panels/color/colorpopup-manager.js | 56 +++++++++++------------------------
 1 file changed, 17 insertions(+), 39 deletions(-)

(limited to 'js/panels')

diff --git a/js/panels/color/colorpopup-manager.js b/js/panels/color/colorpopup-manager.js
index 529ec1c8..4667f2b4 100755
--- a/js/panels/color/colorpopup-manager.js
+++ b/js/panels/color/colorpopup-manager.js
@@ -29,49 +29,27 @@ exports.ColorPopupManager = Montage.create(Component, {
     	enumerable: false,
     	value: function () {
     		////////////////////////////////////////////////////////////
-            //TODO: Improve logic on handling closing the popup
-            ////////////////////////////////////////////////////////////
-            //Hiding popup on any panel(s) actions
-            this.eventManager.addEventListener("panelOrderChanged", function (e) {
-                this.application.ninja.colorController.colorPopupManager.hideColorPopup();
-            }.bind(this));
-            //
-            this.eventManager.addEventListener("panelClose", function (e) {
-                this.application.ninja.colorController.colorPopupManager.hideColorPopup();
-            }.bind(this));
-            //
-            this.eventManager.addEventListener("panelCollapsed", function (e) {
-                this.application.ninja.colorController.colorPopupManager.hideColorPopup();
-            }.bind(this));
-            //
-            this.eventManager.addEventListener("panelSelected", function (e) {
-                this.application.ninja.colorController.colorPopupManager.hideColorPopup();
-            }.bind(this));
-            //
-            this.eventManager.addEventListener("togglePanel", function (e) {
-                this.application.ninja.colorController.colorPopupManager.hideColorPopup();
-            }.bind(this));
-            //
-            this.eventManager.addEventListener("panelResizing", function (e) {
-                this.application.ninja.colorController.colorPopupManager.hideColorPopup();
-            }.bind(this));
-            //
-            this.eventManager.addEventListener("panelResizedStart", function (e) {
-                this.application.ninja.colorController.colorPopupManager.hideColorPopup();
-            }.bind(this));
-            //
-            this.eventManager.addEventListener("panelResizedEnd", function (e) {
-                this.application.ninja.colorController.colorPopupManager.hideColorPopup();
-            }.bind(this));
-            //
+            //Closing popups on resize
             window.addEventListener('resize', function (e) {
                 this.application.ninja.colorController.colorPopupManager.hideColorPopup();
             }.bind(this));
-            //
+            //Storing limits of popup
+            var top, bottom, left, right; 
+            //Closing popups if outside limits
             document.addEventListener('mousedown', function (e) {
-                //
-                if (e._event.srcElement.getAttribute('data-montage-id') === 'stageCanvas' || e._event.srcElement.id === 'mainContainer' || e._event.srcElement.getAttribute('data-montage-id') === 'drawingCanvas') {
-                	this.application.ninja.colorController.colorPopupManager.hideColorPopup();
+                //Checking for popup to be opened otherwise nothing happens
+                if (this._popupPanel.opened && this._popupPanel.popup && this._popupPanel.popup.element && !e._event.srcElement.inputType) {
+                	//Getting horizontal limits	
+                	left = parseInt(this._popupPanel.popup.element.style.left) + parseInt(this._popupPanel.popup.element.style.marginLeft);
+                	right = left + parseInt(this._popupPanel.popup.element.offsetWidth);
+                	//Getting vertical limits
+                	top = parseInt(this._popupPanel.popup.element.style.top) + parseInt(this._popupPanel.popup.element.style.marginTop);
+                	bottom = left + parseInt(this._popupPanel.popup.element.offsetHeight);
+                	//Checking click position in relation to limits
+                	if ((e._event.clientX < left || e._event.clientX > right) || (e._event.clientY < top || e._event.clientY > bottom)) {
+                		//Hides popups since click is outside limits
+	                	this.application.ninja.colorController.colorPopupManager.hideColorPopup();
+                	}
                 }
             }.bind(this));
             ////////////////////////////////////////////////////////////
-- 
cgit v1.2.3