From 445f22ccb0868409dab6d684d0277858c42c4026 Mon Sep 17 00:00:00 2001
From: Victor Woeltjen <victor.woeltjen@nasa.gov>
Date: Fri, 2 Oct 2015 11:01:49 -0700
Subject: [PATCH] [Context Menu] Use popupService to display menus

---
 platform/representation/bundle.json           |  8 ++-
 .../src/actions/ContextMenuAction.js          | 54 ++++++++++---------
 2 files changed, 37 insertions(+), 25 deletions(-)

diff --git a/platform/representation/bundle.json b/platform/representation/bundle.json
index 44656b0f4c..331856a9a8 100644
--- a/platform/representation/bundle.json
+++ b/platform/representation/bundle.json
@@ -54,7 +54,13 @@
             {
                 "key": "menu",
                 "implementation": "actions/ContextMenuAction.js",
-                "depends": [ "$compile", "$document", "$window", "$rootScope", "agentService" ]
+                "depends": [
+                    "$compile",
+                    "$document",
+                    "$rootScope",
+                    "popupService",
+                    "agentService"
+                ]
             }
         ]
     }
diff --git a/platform/representation/src/actions/ContextMenuAction.js b/platform/representation/src/actions/ContextMenuAction.js
index 56e5fa33f9..cbb6fcf8b3 100644
--- a/platform/representation/src/actions/ContextMenuAction.js
+++ b/platform/representation/src/actions/ContextMenuAction.js
@@ -43,40 +43,50 @@ define(
          * @constructor
          * @param $compile Angular's $compile service
          * @param $document the current document
-         * @param $window the active window
          * @param $rootScope Angular's root scope
-         * @param actionContexr the context in which the action
+         * @param {platform/commonUI/general.PopupService} popupService
+         * @param actionContext the context in which the action
          *                      should be performed
          * @implements {Action}
          */
-        function ContextMenuAction($compile, $document, $window, $rootScope, agentService, actionContext) {
+        function ContextMenuAction(
+            $compile,
+            $document,
+            $rootScope,
+            popupService,
+            agentService,
+            actionContext
+        ) {
             this.$compile = $compile;
             this.agentService = agentService;
             this.actionContext = actionContext;
+            this.popupService = popupService;
             this.getDocument = function () { return $document; };
-            this.getWindow = function () { return $window; };
             this.getRootScope = function () { return $rootScope; };
         }
 
         ContextMenuAction.prototype.perform = function () {
             var $compile = this.$compile,
                 $document = this.getDocument(),
-                $window = this.getWindow(),
                 $rootScope = this.getRootScope(),
                 actionContext = this.actionContext,
-                winDim = [$window.innerWidth, $window.innerHeight],
-                eventCoors = [actionContext.event.pageX, actionContext.event.pageY],
+                eventCoords = [
+                    actionContext.event.pageX,
+                    actionContext.event.pageY
+                ],
                 menuDim = GestureConstants.MCT_MENU_DIMENSIONS,
                 body = $document.find('body'),
                 scope = $rootScope.$new(),
-                goLeft = eventCoors[0] + menuDim[0] > winDim[0],
-                goUp = eventCoors[1] + menuDim[1] > winDim[1],
-                initiatingEvent = this.agentService.isMobile() ? 'touchstart' : 'mousedown',
-                menu;
+                initiatingEvent = this.agentService.isMobile() ?
+                        'touchstart' : 'mousedown',
+                menu,
+                popup;
 
             // Remove the context menu
             function dismiss() {
-                menu.remove();
+                popup.dismiss();
+                popup = undefined;
+                scope.$destroy();
                 body.off("mousedown", dismiss);
                 dismissExistingMenu = undefined;
             }
@@ -91,21 +101,17 @@ define(
 
             // Set up the scope, including menu positioning
             scope.domainObject = actionContext.domainObject;
-            scope.menuStyle = {};
-            scope.menuStyle[goLeft ? "right" : "left"] =
-                (goLeft ? (winDim[0] - eventCoors[0]) : eventCoors[0]) + 'px';
-            scope.menuStyle[goUp ? "bottom" : "top"] =
-                (goUp ? (winDim[1] - eventCoors[1]) : eventCoors[1]) + 'px';
-            scope.menuClass = {
-                "go-left": goLeft,
-                "go-up": goUp,
-                "context-menu-holder": true
-            };
+            scope.menuClass = { "context-menu-holder": true };
             // Create the context menu
             menu = $compile(MENU_TEMPLATE)(scope);
 
-            // Add the menu to the body
-            body.append(menu);
+            popup = this.popupService.display(menu, eventCoords, {
+                marginX: -menuDim[0],
+                marginY: -menuDim[1]
+            });
+
+            scope.menuClass['go-left'] = popup.goesLeft();
+            scope.menuClass['go-up'] = popup.goesUp();
 
             // Stop propagation so that clicks or touches on the menu do not close the menu
             menu.on(initiatingEvent, function (event) {