diff --git a/platform/commonUI/inspect/src/InfoConstants.js b/platform/commonUI/inspect/src/InfoConstants.js new file mode 100644 index 0000000000..c550c1a6c3 --- /dev/null +++ b/platform/commonUI/inspect/src/InfoConstants.js @@ -0,0 +1,32 @@ +/***************************************************************************** + * Open MCT Web, Copyright (c) 2014-2015, United States Government + * as represented by the Administrator of the National Aeronautics and Space + * Administration. All rights reserved. + * + * Open MCT Web is licensed under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * http://www.apache.org/licenses/LICENSE-2.0. + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT + * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the + * License for the specific language governing permissions and limitations + * under the License. + * + * Open MCT Web includes source code licensed under additional open source + * licenses. See the Open Source Licenses file (LICENSES.md) included with + * this source code distribution or the Licensing information page available + * at runtime from the About dialog for additional information. + *****************************************************************************/ +/*global define*/ +define({ + BUBBLE_TEMPLATE: "" + + "" + + "" + + "", + // Pixel offset for bubble, to align arrow position + BUBBLE_OFFSET: [ 0, -16 ] +}); \ No newline at end of file diff --git a/platform/commonUI/inspect/src/services/InfoService.js b/platform/commonUI/inspect/src/services/InfoService.js index f071bacad5..bbd23ed134 100644 --- a/platform/commonUI/inspect/src/services/InfoService.js +++ b/platform/commonUI/inspect/src/services/InfoService.js @@ -1,17 +1,12 @@ /*global define*/ define( - [], - function () { + ['../InfoConstants'], + function (InfoConstants) { "use strict"; - var BUBBLE_TEMPLATE = "" + - "" + - "" + - "", - OFFSET = [ 0, 16 ]; // Pixel offset for bubble, to align arrow position + var BUBBLE_TEMPLATE = InfoConstants.BUBBLE_TEMPLATE, + OFFSET = InfoConstants.BUBBLE_OFFSET; /** * Displays informative content ("info bubbles") for the user. @@ -40,14 +35,14 @@ define( // Position the bubble bubble.css('position', 'absolute'); if (goLeft) { - bubble.css('right', (winDim[0] - position[0] - OFFSET[0]) + 'px'); + bubble.css('right', (winDim[0] - position[0] + OFFSET[0]) + 'px'); } else { - bubble.css('left', position[0] - OFFSET[0] + 'px'); + bubble.css('left', position[0] + OFFSET[0] + 'px'); } if (goUp) { - bubble.css('bottom', (winDim[1] - position[1] - OFFSET[1]) + 'px'); + bubble.css('bottom', (winDim[1] - position[1] + OFFSET[1]) + 'px'); } else { - bubble.css('top', position[1] - OFFSET[1] + 'px'); + bubble.css('top', position[1] + OFFSET[1] + 'px'); } // Add the menu to the body diff --git a/platform/commonUI/inspect/test/services/InfoServiceSpec.js b/platform/commonUI/inspect/test/services/InfoServiceSpec.js index 68d34e7fe8..7cb3d62a1e 100644 --- a/platform/commonUI/inspect/test/services/InfoServiceSpec.js +++ b/platform/commonUI/inspect/test/services/InfoServiceSpec.js @@ -22,8 +22,8 @@ /*global define,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/ define( - ['../../src/services/InfoService'], - function (InfoService) { + ['../../src/services/InfoService', '../../src/InfoConstants'], + function (InfoService, InfoConstants) { "use strict"; describe("The info service", function () { @@ -74,6 +74,57 @@ define( expect(mockElement.remove).toHaveBeenCalled(); }); + describe("depending on mouse position", function () { + // Positioning should vary based on quadrant in window, + // which is 1000 x 100 in this test case. + it("displays from the top-left in the top-left quadrant", function () { + service.display('', '', {}, [250, 25]); + expect(mockElement.css).toHaveBeenCalledWith( + 'left', + (250 + InfoConstants.BUBBLE_OFFSET[0]) + 'px' + ); + expect(mockElement.css).toHaveBeenCalledWith( + 'top', + (25 + InfoConstants.BUBBLE_OFFSET[1]) + 'px' + ); + }); + + it("displays from the top-right in the top-right quadrant", function () { + service.display('', '', {}, [700, 25]); + expect(mockElement.css).toHaveBeenCalledWith( + 'right', + (300 + InfoConstants.BUBBLE_OFFSET[0]) + 'px' + ); + expect(mockElement.css).toHaveBeenCalledWith( + 'top', + (25 + InfoConstants.BUBBLE_OFFSET[1]) + 'px' + ); + }); + + it("displays from the bottom-left in the bottom-left quadrant", function () { + service.display('', '', {}, [250, 70]); + expect(mockElement.css).toHaveBeenCalledWith( + 'left', + (250 + InfoConstants.BUBBLE_OFFSET[0]) + 'px' + ); + expect(mockElement.css).toHaveBeenCalledWith( + 'bottom', + (30 + InfoConstants.BUBBLE_OFFSET[1]) + 'px' + ); + }); + + it("displays from the bottom-right in the bottom-right quadrant", function () { + service.display('', '', {}, [800, 60]); + expect(mockElement.css).toHaveBeenCalledWith( + 'right', + (200 + InfoConstants.BUBBLE_OFFSET[0]) + 'px' + ); + expect(mockElement.css).toHaveBeenCalledWith( + 'bottom', + (40 + InfoConstants.BUBBLE_OFFSET[1]) + 'px' + ); + }); + }); }); }