ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-06-16 06:08:11 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

[Info Service] Render info bubble after positioning

Browse Source 
Render info bubble after positioning with the popupService,
to apply arrow classes appropriately.
This commit is contained in:
Victor Woeltjen
2015-10-02 10:21:42 -07:00
parent bebe53820f
commit 73dc16d398
2 changed files with 16 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
platform/commonUI/inspect/src/InfoConstants.js
View File

@ -42,7 +42,8 @@ define({
offsetY: -26 offsetY: -26
}, },
BUBBLE_MOBILE_POSITION: [ 0, -25 ], BUBBLE_MOBILE_POSITION: [ 0, -25 ],
// Max width and margins allowed for bubbles; defined in /platform/commonUI/general/res/sass/_constants.scss // Max width and margins allowed for bubbles;
// defined in /platform/commonUI/general/res/sass/_constants.scss
BUBBLE_MARGIN_LR: 10, BUBBLE_MARGIN_LR: 10,
BUBBLE_MAX_WIDTH: 300 BUBBLE_MAX_WIDTH: 300
}); });

25
platform/commonUI/inspect/src/services/InfoService.js
View File

@ -57,20 +57,13 @@ define(
var $compile = this.$compile, var $compile = this.$compile,
$rootScope = this.$rootScope, $rootScope = this.$rootScope,
scope = $rootScope.$new(), scope = $rootScope.$new(),
span = $compile('<span></span>')(scope),
bubbleSpaceLR = InfoConstants.BUBBLE_MARGIN_LR + bubbleSpaceLR = InfoConstants.BUBBLE_MARGIN_LR +
InfoConstants.BUBBLE_MAX_WIDTH, InfoConstants.BUBBLE_MAX_WIDTH,
options, options,
popup, popup,
bubble; bubble;
// Pass model & container parameters into the scope
scope.bubbleModel = content;
scope.bubbleTemplate = templateKey;
scope.bubbleTitle = title;
// Create the context menu
bubble = $compile(BUBBLE_TEMPLATE)(scope);
options = Object.create(OPTIONS); options = Object.create(OPTIONS);
options.marginX = -bubbleSpaceLR; options.marginX = -bubbleSpaceLR;
@ -81,13 +74,23 @@ define(
options = {}; options = {};
} }
popup = this.popupService.display(bubble, position, options); popup = this.popupService.display(span, position, options);
// Pass model & container parameters into the scope
scope.bubbleModel = content;
scope.bubbleTemplate = templateKey;
scope.bubbleTitle = title;
// Style the bubble according to how it was positioned // Style the bubble according to how it was positioned
scope.bubbleLayout = [ scope.bubbleLayout = [
popup.goesLeft() ? 'arw-right' : 'arw-left', popup.goesUp() ? 'arw-btm' : 'arw-top',
popup.goesUp() ? 'arw-btm' : 'arw-top' popup.goesLeft() ? 'arw-right' : 'arw-left'
].join(' '); ].join(' ');
scope.bubbleLayout = 'arw-top arw-left';
// Create the info bubble, now that we know how to
// point the arrow...
bubble = $compile(BUBBLE_TEMPLATE)(scope);
span.append(bubble);
// Return a function to dismiss the info bubble // Return a function to dismiss the info bubble
return function dismiss() { return function dismiss() {