mirror of
https://github.com/nasa/openmct.git
synced 2025-05-18 08:23:21 +00:00
[Mobile] Clean Up
Reorganizaed MCTPlot touch functions to be in suitable order. Also made code DRYer by removing unnecessary functions and combining statements that are used once. Also renamed variables to differentiate similar ones from one another. Added marks to show where comments are needed (will be edited in next commit).
This commit is contained in:
Shivam Dave
parent
d1055f0839
commit
f9be00a70f
@ -45,10 +45,9 @@ define(
|
||||
marqueeBox = {},
|
||||
marqueeRect, // Set when exists.
|
||||
chartElementBounds,
|
||||
firstTouches,
|
||||
firstTouch,
|
||||
firstTouchDistance,
|
||||
lastTouchDistance,
|
||||
prevTouchDistance,
|
||||
$canvas = $element.find('canvas');
|
||||
|
||||
function updateAxesForCurrentViewport() {
|
||||
@ -274,70 +273,11 @@ define(
|
||||
updateAxesForCurrentViewport();
|
||||
}
|
||||
|
||||
function setDimensions(midpoint) {
|
||||
return {
|
||||
tl: {
|
||||
domain: Math.abs(midpoint.domain - ($scope.viewport.topLeft.domain)),
|
||||
range: Math.abs(midpoint.range - ($scope.viewport.topLeft.range))
|
||||
},
|
||||
br: {
|
||||
domain: Math.abs(($scope.viewport.bottomRight.domain) - midpoint.domain),
|
||||
range: Math.abs(($scope.viewport.bottomRight.range) - midpoint.range)
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function calculateViewport(midpoint, ratio) {
|
||||
var tl,
|
||||
br,
|
||||
dimensions = setDimensions(midpoint),
|
||||
checkRatio = (ratio - 1) || 0,
|
||||
type = (-1 * (checkRatio / Math.abs(checkRatio))) || 1;
|
||||
|
||||
tl = {
|
||||
domain: type * ZOOM_AMT * dimensions.tl.domain,
|
||||
range: type * ZOOM_AMT * dimensions.tl.range
|
||||
};
|
||||
br = {
|
||||
domain: type * ZOOM_AMT * dimensions.br.domain,
|
||||
range: type * ZOOM_AMT * dimensions.br.range
|
||||
};
|
||||
|
||||
return {
|
||||
topLeft: {
|
||||
domain: (($scope.viewport.topLeft.domain) + tl.domain),
|
||||
range: (($scope.viewport.topLeft.range) - tl.range)
|
||||
},
|
||||
bottomRight: {
|
||||
domain: (($scope.viewport.bottomRight.domain) - br.domain),
|
||||
range: (($scope.viewport.bottomRight.range) + br.range)
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function updateZoom(midpoint, bounds, distance) {
|
||||
// calculate offset between points. Apply that offset to viewport.
|
||||
var midpointPosition = trackTouchPosition(midpoint, bounds),
|
||||
newMidpointPosition = midpointPosition.positionAsPlotPoint,
|
||||
distanceRatio = (lastTouchDistance / distance) || (firstTouchDistance / distance),
|
||||
newViewport = calculateViewport(newMidpointPosition, distanceRatio);
|
||||
|
||||
$scope.viewport = newViewport;
|
||||
}
|
||||
|
||||
function startZoom(midpoint, bounds, touches, distance) {
|
||||
firstTouches = [trackTouchPosition(touches[0], bounds).positionAsPlotPoint,
|
||||
trackTouchPosition(touches[1], bounds).positionAsPlotPoint];
|
||||
firstTouchDistance = distance;
|
||||
firstTouch = trackTouchPosition(midpoint, bounds).positionAsPlotPoint;
|
||||
}
|
||||
|
||||
//
|
||||
function updatePan(touch, bounds) {
|
||||
// calculate offset between points. Apply that offset to viewport.
|
||||
var panPosition = trackTouchPosition(touch, bounds),
|
||||
newPanPosition = panPosition.positionAsPlotPoint,
|
||||
dDomain = firstTouch.domain - newPanPosition.domain,
|
||||
dRange = firstTouch.range - newPanPosition.range;
|
||||
var panPosition = trackTouchPosition(touch, bounds).positionAsPlotPoint,
|
||||
dDomain = firstTouch.domain - panPosition.domain,
|
||||
dRange = firstTouch.range - panPosition.range;
|
||||
|
||||
$scope.viewport = {
|
||||
topLeft: {
|
||||
@ -356,36 +296,7 @@ define(
|
||||
firstTouch = trackTouchPosition(touch, bounds).positionAsPlotPoint;
|
||||
}
|
||||
|
||||
function endTouch() {
|
||||
$scope.$emit('user:viewport:change:end', $scope.viewport);
|
||||
}
|
||||
|
||||
function onPinchStart(event, touch) {
|
||||
$scope.$emit('user:viewport:change:start');
|
||||
startZoom(touch.midpoint, touch.bounds, touch.touches, touch.distance);
|
||||
}
|
||||
|
||||
|
||||
function comparePinchDrag(distance, firstDistance, lastDistance) {
|
||||
return (((firstDistance + PINCH_DRAG_AMT) >= distance) &&
|
||||
((firstDistance - PINCH_DRAG_AMT) <= distance)) ||
|
||||
(((lastDistance + PINCH_DRAG_AMT) >= distance) &&
|
||||
((lastDistance - PINCH_DRAG_AMT) <= distance));
|
||||
}
|
||||
|
||||
function onPinchChange(event, touch) {
|
||||
if(comparePinchDrag(Math.round(touch.distance),
|
||||
Math.round(firstTouchDistance),
|
||||
Math.round(lastTouchDistance))) {
|
||||
//console.log("# PINCH PAN");
|
||||
updatePan(touch.midpoint, touch.bounds);
|
||||
} else {
|
||||
//console.log("# PINCH ZOOM");
|
||||
updateZoom(touch.midpoint, touch.bounds, touch.distance);
|
||||
}
|
||||
lastTouchDistance = touch.distance;
|
||||
}
|
||||
|
||||
//
|
||||
function onPanStart(event, touch) {
|
||||
startPan(touch.touch, touch.bounds);
|
||||
}
|
||||
@ -394,21 +305,96 @@ define(
|
||||
updatePan(touch.touch, touch.bounds);
|
||||
}
|
||||
|
||||
function onTouchEnd() {
|
||||
endTouch();
|
||||
function setDimensions(midpoint) {
|
||||
return {
|
||||
tl: {
|
||||
domain: Math.abs(midpoint.domain - ($scope.viewport.topLeft.domain)),
|
||||
range: Math.abs(midpoint.range - ($scope.viewport.topLeft.range))
|
||||
},
|
||||
br: {
|
||||
domain: Math.abs(($scope.viewport.bottomRight.domain) - midpoint.domain),
|
||||
range: Math.abs(($scope.viewport.bottomRight.range) - midpoint.range)
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
$scope.$watchCollection('viewport', onViewportChange);
|
||||
function calculateViewport(midpoint, ratio) {
|
||||
var zoomTL, zoomBR,
|
||||
dimensions = setDimensions(midpoint),
|
||||
checkRatio = (ratio - 1) || 0,
|
||||
type = (-1 * (checkRatio / Math.abs(checkRatio))) || 1,
|
||||
zoomAmt = type * ZOOM_AMT;
|
||||
|
||||
$scope.$on('mct:pan:start', onPanStart);
|
||||
$scope.$on('mct:pan:change', onPanChange);
|
||||
zoomTL = {
|
||||
domain: zoomAmt * dimensions.tl.domain,
|
||||
range: zoomAmt * dimensions.tl.range
|
||||
};
|
||||
zoomBR = {
|
||||
domain: zoomAmt * dimensions.br.domain,
|
||||
range: zoomAmt * dimensions.br.range
|
||||
};
|
||||
|
||||
return {
|
||||
topLeft: {
|
||||
domain: (($scope.viewport.topLeft.domain) + zoomTL.domain),
|
||||
range: (($scope.viewport.topLeft.range) - zoomTL.range)
|
||||
},
|
||||
bottomRight: {
|
||||
domain: (($scope.viewport.bottomRight.domain) - zoomBR.domain),
|
||||
range: (($scope.viewport.bottomRight.range) + zoomBR.range)
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function updateZoom(midpoint, bounds, distance) {
|
||||
var midpointPosition = trackTouchPosition(midpoint, bounds).positionAsPlotPoint,
|
||||
distanceRatio = ((prevTouchDistance || firstTouchDistance) / distance);
|
||||
|
||||
$scope.viewport = calculateViewport(midpointPosition, distanceRatio);
|
||||
}
|
||||
|
||||
function startZoom(midpoint, bounds, touches, distance) {
|
||||
firstTouchDistance = distance;
|
||||
firstTouch = trackTouchPosition(midpoint, bounds).positionAsPlotPoint;
|
||||
}
|
||||
|
||||
//
|
||||
function onPinchStart(event, touch) {
|
||||
$scope.$emit('user:viewport:change:start');
|
||||
startZoom(touch.midpoint, touch.bounds, touch.touches, touch.distance);
|
||||
}
|
||||
|
||||
function comparePinchDrag(distance, prevDistance) {
|
||||
return ((prevDistance + PINCH_DRAG_AMT) >= distance) &&
|
||||
((prevDistance - PINCH_DRAG_AMT) <= distance);
|
||||
}
|
||||
|
||||
function onPinchChange(event, touch) {
|
||||
if(comparePinchDrag(Math.round(touch.distance),
|
||||
Math.round(prevTouchDistance || firstTouchDistance))) {
|
||||
updatePan(touch.midpoint, touch.bounds);
|
||||
} else {
|
||||
updateZoom(touch.midpoint, touch.bounds, touch.distance);
|
||||
}
|
||||
prevTouchDistance = touch.distance;
|
||||
}
|
||||
|
||||
//
|
||||
function onTouchEnd() {
|
||||
$scope.$emit('user:viewport:change:end', $scope.viewport);
|
||||
}
|
||||
|
||||
$scope.$on('mct:pinch:start', onPinchStart);
|
||||
$scope.$on('mct:pinch:change', onPinchChange);
|
||||
|
||||
$scope.$on('mct:pan:start', onPanStart);
|
||||
$scope.$on('mct:pan:change', onPanChange);
|
||||
|
||||
$scope.$on('mct:ptouch:end', onTouchEnd);
|
||||
|
||||
$scope.$on('$destroy', stopWatching);
|
||||
|
||||
$scope.$watchCollection('viewport', onViewportChange);
|
||||
}
|
||||
|
||||
return {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user