mirror of
https://github.com/nasa/openmct.git
synced 2025-06-23 01:18:57 +00:00
[Mobile, Gestures] Pinch
Split the pinch gesture into start, change, and end/cancel. Each of those are read in and then they emit through the scope to functions in the controller.
This commit is contained in:
@ -154,8 +154,16 @@ define(
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
function onPinchAction(event) {
|
function onPinchStart(event) {
|
||||||
console.log("TEST");
|
console.log("Pinch Start");
|
||||||
|
}
|
||||||
|
|
||||||
|
function onPinchChange(event) {
|
||||||
|
console.log("Pinch Change");
|
||||||
|
}
|
||||||
|
|
||||||
|
function onPinchEnd(event) {
|
||||||
|
console.log("Pinch End");
|
||||||
}
|
}
|
||||||
|
|
||||||
function followDataIfLive() {
|
function followDataIfLive() {
|
||||||
@ -167,7 +175,9 @@ define(
|
|||||||
$scope.$on('series:data:add', followDataIfLive);
|
$scope.$on('series:data:add', followDataIfLive);
|
||||||
$scope.$on('user:viewport:change:end', onUserViewportChangeEnd);
|
$scope.$on('user:viewport:change:end', onUserViewportChangeEnd);
|
||||||
$scope.$on('user:viewport:change:start', onUserViewportChangeStart);
|
$scope.$on('user:viewport:change:start', onUserViewportChangeStart);
|
||||||
$scope.$on('mct:pinch:action', onPinchAction);
|
$scope.$on('mct:pinch:start', onPinchStart);
|
||||||
|
$scope.$on('mct:pinch:change', onPinchChange);
|
||||||
|
$scope.$on('mct:pinch:end', onPinchEnd);
|
||||||
|
|
||||||
$scope.$watch('domainObject', linkDomainObject);
|
$scope.$watch('domainObject', linkDomainObject);
|
||||||
|
|
||||||
|
@ -37,14 +37,15 @@ define(
|
|||||||
return [event.clientX, event.clientY];
|
return [event.clientX, event.clientY];
|
||||||
}
|
}
|
||||||
|
|
||||||
function pinchAction(event) {
|
function pinchStart(event) {
|
||||||
if (event.changedTouches.length === 2) {
|
if (event.changedTouches.length === 2 ||
|
||||||
var touchPosition = [trackPosition(event.changedTouches[0]),
|
event.touches.length === 2) {
|
||||||
trackPosition(event.changedTouches[1])],
|
var touchPosition = [trackPosition(event.touches[0]),
|
||||||
|
trackPosition(event.touches[1])],
|
||||||
touchPositionPrev = posPrev || touchPosition,
|
touchPositionPrev = posPrev || touchPosition,
|
||||||
eventPrev = evePrev || event;
|
eventPrev = evePrev || event;
|
||||||
|
|
||||||
$scope.$emit('mct:pinch:action', event);
|
$scope.$emit('mct:pinch:start');
|
||||||
// Set current position to be previous position
|
// Set current position to be previous position
|
||||||
// for next touch action
|
// for next touch action
|
||||||
posPrev = touchPosition;
|
posPrev = touchPosition;
|
||||||
@ -58,10 +59,39 @@ define(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function pinchChange(event) {
|
||||||
|
if (event.changedTouches.length === 2) {
|
||||||
|
var touchPosition = [trackPosition(event.changedTouches[0]),
|
||||||
|
trackPosition(event.changedTouches[1])],
|
||||||
|
touchPositionPrev = posPrev || touchPosition,
|
||||||
|
eventPrev = evePrev || event;
|
||||||
|
|
||||||
|
$scope.$emit('mct:pinch:change');
|
||||||
|
// Set current position to be previous position
|
||||||
|
// for next touch action
|
||||||
|
posPrev = touchPosition;
|
||||||
|
|
||||||
|
// Set current event to be previous event
|
||||||
|
// for next touch action
|
||||||
|
evePrev = event;
|
||||||
|
|
||||||
|
// Stops other gestures/button clicks from being active
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function pinchEnd(event) {
|
||||||
|
$scope.$emit('mct:pinch:end');
|
||||||
|
|
||||||
|
// Stops other gestures/button clicks from being active
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
|
||||||
if (agentService.isMobile(navigator.userAgent)) {
|
if (agentService.isMobile(navigator.userAgent)) {
|
||||||
element.on('touchstart', pinchAction);
|
element.on('touchstart', pinchStart);
|
||||||
element.on('touchmove', pinchAction);
|
element.on('touchmove', pinchChange);
|
||||||
element.on('touchend', pinchAction);
|
element.on('touchend', pinchEnd);
|
||||||
|
element.on('touchcancel', pinchEnd);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Stop checking for resize when scope is destroyed
|
// Stop checking for resize when scope is destroyed
|
||||||
|
Reference in New Issue
Block a user