ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-03-24 04:55:21 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Mobile] Touch Hold Gesture

Browse Source 
Rough touch hold gesture added
to the info gesture. Currently
if you hold on an item (that you
would normally hover over) for
500ms, you get the info gesture pop
up.
This commit is contained in:
Shivam Dave 2015-07-24 16:02:06 -07:00
parent 011e6fc512
commit ddc2295ec3
1 changed files with 27 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
platform/commonUI/inspect/src/gestures/InfoGesture.js
View File

@ -42,13 +42,22 @@ define(
var dismissBubble,
pendingBubble,
mousePosition,
scopeOff;
touchPosition,
scopeOff,
touchDELAY = 500;
function trackPosition(event) {
// Record mouse position, so bubble can be shown at latest
// mouse position (not just where the mouse entered)
mousePosition = [ event.clientX, event.clientY ];
}
function trackTouchPosition(event) {
var tEvent = event.changedTouches[0];
// Record mouse position, so bubble can be shown at latest
// mouse position (not just where the mouse entered)
touchPosition = [ tEvent.clientX + 44, tEvent.clientY ];
}
function hideBubble() {
// If a bubble is showing, dismiss it
@ -67,6 +76,7 @@ define(
// Also clear mouse position so we don't have a ton of tiny
// arrays allocated while user mouses over things
mousePosition = undefined;
touchPosition = undefined;
}
function showBubble(event) {
@ -92,12 +102,28 @@ define(
element.on('mouseleave', hideBubble);
}
function showTouchBubble(event) {
trackTouchPosition(event);
pendingBubble = $timeout(function () {
dismissBubble = infoService.display(
"info-table",
domainObject.getModel().name,
domainObject.useCapability('metadata'),
touchPosition
);
}, touchDELAY);
element.on('touchend', hideBubble);
}
// Checks if you are on a mobile device, if the device is
// not mobile (queryService.isMobile() = false), then
// the pendingBubble and therefore hovering is allowed
if (!queryService.isMobile(navigator.userAgent)) {
// Show bubble (on a timeout) on mouse over
element.on('mouseenter', showBubble);
} else if (queryService.isMobile(navigator.userAgent)) {
element.on('touchstart', showTouchBubble);
}
// Also make sure we dismiss bubble if representation is destroyed