ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-06-18 23:28:14 +00:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

[Menus] Reposition context menus correctly

Browse Source 
Fix styles used to reposition context menus when they are
near the edge of the screen, so that these menus remain
both on-screen and near the user's mouse. WTD-719.
This commit is contained in:
Victor Woeltjen
2015-01-27 14:01:53 -08:00
parent 5c34382933
commit 76c38affc3
2 changed files with 34 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
platform/representation/src/gestures/ContextMenuGesture.js
View File

@ -59,10 +59,14 @@ define(
scope.domainObject = domainObject; scope.domainObject = domainObject;
scope.menuStyle = {}; scope.menuStyle = {};
scope.menuStyle[goLeft ? "right" : "left"] = scope.menuStyle[goLeft ? "right" : "left"] =
eventCoors[0] + 'px'; (goLeft ? (winDim[0] - eventCoors[0]) : eventCoors[0]) + 'px';
scope.menuStyle[goUp ? "bottom" : "top"] = scope.menuStyle[goUp ? "bottom" : "top"] =
eventCoors[1] + 'px'; (goUp ? (winDim[1] - eventCoors[1]) : eventCoors[1]) + 'px';
scope.menuClass = { "go-left": goLeft, "go-up": goUp, "context-menu-holder": true }; scope.menuClass = {
"go-left": goLeft,
"go-up": goUp,
"context-menu-holder": true
};
// Create the context menu // Create the context menu
menu = $compile(MENU_TEMPLATE)(scope); menu = $compile(MENU_TEMPLATE)(scope);

29
platform/representation/test/gestures/ContextMenuGestureSpec.js
View File

@ -10,7 +10,8 @@ define(
"use strict"; "use strict";
var JQLITE_FUNCTIONS = [ "on", "off", "find", "append", "remove" ], var JQLITE_FUNCTIONS = [ "on", "off", "find", "append", "remove" ],
DOMAIN_OBJECT_METHODS = [ "getId", "getModel", "getCapability", "hasCapability", "useCapability" ]; DOMAIN_OBJECT_METHODS = [ "getId", "getModel", "getCapability", "hasCapability", "useCapability" ],
MENU_DIMENSIONS = GestureConstants.MCT_MENU_DIMENSIONS;
describe("The 'context menu' gesture", function () { describe("The 'context menu' gesture", function () {
@ -34,7 +35,7 @@ define(
mockMenu = jasmine.createSpyObj("menu", JQLITE_FUNCTIONS); mockMenu = jasmine.createSpyObj("menu", JQLITE_FUNCTIONS);
mockDocument = jasmine.createSpyObj("$document", JQLITE_FUNCTIONS); mockDocument = jasmine.createSpyObj("$document", JQLITE_FUNCTIONS);
mockBody = jasmine.createSpyObj("body", JQLITE_FUNCTIONS); mockBody = jasmine.createSpyObj("body", JQLITE_FUNCTIONS);
mockWindow = { innerWidth: GestureConstants[0] * 4, innerHeight: GestureConstants[1] * 4 }; mockWindow = { innerWidth: MENU_DIMENSIONS[0] * 4, innerHeight: MENU_DIMENSIONS[1] * 4 };
mockRootScope = jasmine.createSpyObj("$rootScope", ["$new"]); mockRootScope = jasmine.createSpyObj("$rootScope", ["$new"]);
mockScope = {}; mockScope = {};
mockElement = jasmine.createSpyObj("element", JQLITE_FUNCTIONS); mockElement = jasmine.createSpyObj("element", JQLITE_FUNCTIONS);
@ -93,6 +94,30 @@ define(
expect(mockEvent.preventDefault).toHaveBeenCalled(); expect(mockEvent.preventDefault).toHaveBeenCalled();
}); });
it("positions menus where clicked", function () {
mockEvent.pageX = 10;
mockEvent.pageY = 5;
fireGesture(mockEvent);
expect(mockScope.menuStyle.left).toEqual("10px");
expect(mockScope.menuStyle.top).toEqual("5px");
expect(mockScope.menuStyle.right).toBeUndefined();
expect(mockScope.menuStyle.bottom).toBeUndefined();
expect(mockScope.menuClass['go-up']).toBeFalsy();
expect(mockScope.menuClass['go-left']).toBeFalsy();
});
it("repositions menus near the screen edge", function () {
mockEvent.pageX = mockWindow.innerWidth - 10;
mockEvent.pageY = mockWindow.innerHeight - 5;
fireGesture(mockEvent);
expect(mockScope.menuStyle.right).toEqual("10px");
expect(mockScope.menuStyle.bottom).toEqual("5px");
expect(mockScope.menuStyle.left).toBeUndefined();
expect(mockScope.menuStyle.top).toBeUndefined();
expect(mockScope.menuClass['go-up']).toBeTruthy();
expect(mockScope.menuClass['go-left']).toBeTruthy();
});
it("removes a menu when body is clicked", function () { it("removes a menu when body is clicked", function () {
// Show the menu // Show the menu
fireGesture(mockEvent); fireGesture(mockEvent);