ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-05-18 16:33:20 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Mobile] Clean Up

Browse Source 
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 2015-09-02 12:45:52 -07:00
parent d1055f0839
commit f9be00a70f
1 changed files with 65 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

186
platform/features/plot-reborn/src/directives/MCTPlot.js
View File

@ -45,10 +45,9 @@ define(
marqueeBox = {}, marqueeBox = {},
marqueeRect, // Set when exists. marqueeRect, // Set when exists.
chartElementBounds, chartElementBounds,
firstTouches,
firstTouch, firstTouch,
firstTouchDistance, firstTouchDistance,
lastTouchDistance, prevTouchDistance,
$canvas = $element.find('canvas'); $canvas = $element.find('canvas');
function updateAxesForCurrentViewport() { function updateAxesForCurrentViewport() {
@ -274,70 +273,11 @@ define(
updateAxesForCurrentViewport(); 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) { function updatePan(touch, bounds) {
// calculate offset between points. Apply that offset to viewport. var panPosition = trackTouchPosition(touch, bounds).positionAsPlotPoint,
var panPosition = trackTouchPosition(touch, bounds), dDomain = firstTouch.domain - panPosition.domain,
newPanPosition = panPosition.positionAsPlotPoint, dRange = firstTouch.range - panPosition.range;
dDomain = firstTouch.domain - newPanPosition.domain,
dRange = firstTouch.range - newPanPosition.range;
$scope.viewport = { $scope.viewport = {
topLeft: { topLeft: {
@ -356,36 +296,7 @@ define(
firstTouch = trackTouchPosition(touch, bounds).positionAsPlotPoint; 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) { function onPanStart(event, touch) {
startPan(touch.touch, touch.bounds); startPan(touch.touch, touch.bounds);
} }
@ -394,21 +305,96 @@ define(
updatePan(touch.touch, touch.bounds); updatePan(touch.touch, touch.bounds);
} }
function onTouchEnd() { function setDimensions(midpoint) {
endTouch(); 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); zoomTL = {
$scope.$on('mct:pan:change', onPanChange); 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:start', onPinchStart);
$scope.$on('mct:pinch:change', onPinchChange); $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('mct:ptouch:end', onTouchEnd);
$scope.$on('$destroy', stopWatching); $scope.$on('$destroy', stopWatching);
$scope.$watchCollection('viewport', onViewportChange);
} }
return { return {