[Mobile, Gestures] Pinch

Moved MCTPinch directive into
plot-reborn. Now emits on pinch action
the event to the controller. Edited plot.html
to clean up and edited mct-plot.html to
include mct-pinch. DrawLoader adjusted to
allow  and prevent error.
This commit is contained in:
Shivam Dave
2015-08-17 12:51:33 -07:00
parent 17e2da2d2c
commit 5c3fe78bd5
7 changed files with 18 additions and 25 deletions

View File

@ -47,6 +47,11 @@
"key": "mctOverlayPlot", "key": "mctOverlayPlot",
"implementation": "directives/MCTOverlayPlot.js", "implementation": "directives/MCTOverlayPlot.js",
"depends": [] "depends": []
},
{
"key": "mctPinch",
"implementation": "directives/MCTPinch.js",
"depends": [ "$log", "agentService" ]
} }
], ],
"controllers": [ "controllers": [

View File

@ -47,13 +47,15 @@
<!--TODO: Show/hide using CSS? --> <!--TODO: Show/hide using CSS? -->
</div> </div>
<!-- APPLY MCTPinch here-->
<mct-chart series="series" <mct-chart series="series"
viewport="viewport" viewport="viewport"
rectangles="rectangles" rectangles="rectangles"
ng-mousemove="plot.trackMousePosition($event)" ng-mousemove="plot.trackMousePosition($event)"
ng-mouseleave="plot.untrackMousePosition()" ng-mouseleave="plot.untrackMousePosition()"
ng-mousedown="plot.startMarquee()" ng-mousedown="plot.startMarquee()"
ng-mouseup="plot.endMarquee()"> ng-mouseup="plot.endMarquee()"
mct-pinch>
</mct-chart> </mct-chart>
<span class="t-wait-spinner loading" ng-show="plot.isRequestPending()"> <span class="t-wait-spinner loading" ng-show="plot.isRequestPending()">

View File

@ -5,5 +5,5 @@
axes="axes" axes="axes"
displayable-range="displayableRange" displayable-range="displayableRange"
displayable-domain="displayableDomain"> displayable-domain="displayableDomain">
</mct-plot> </mct-plot>
</span> </span>

View File

@ -153,6 +153,10 @@ define(
} }
}; };
} }
function onPinchAction(event) {
console.log("TEST");
}
function followDataIfLive() { function followDataIfLive() {
if (isLive) { if (isLive) {
@ -163,6 +167,7 @@ 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.$watch('domainObject', linkDomainObject); $scope.$watch('domainObject', linkDomainObject);

View File

@ -28,7 +28,7 @@ define(
function MCTPinch($log, agentService) { function MCTPinch($log, agentService) {
function link(scope, element, attrs) { function link($scope, element, attrs) {
var posPrev, var posPrev,
evePrev; evePrev;
@ -44,13 +44,7 @@ define(
touchPositionPrev = posPrev || touchPosition, touchPositionPrev = posPrev || touchPosition,
eventPrev = evePrev || event; eventPrev = evePrev || event;
scope.mctPinch({ $scope.$emit('mct:pinch:action', event);
dimensions: touchPosition,
prevDimensions: touchPositionPrev,
event: event,
eventPrev: eventPrev
});
// 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;
@ -71,14 +65,11 @@ define(
} }
// Stop checking for resize when scope is destroyed // Stop checking for resize when scope is destroyed
// scope.$on("$destroy", destroyEverythingNow); // $scope.$on("$destroy", destroyEverythingNow);
} }
return { return {
restrict: "A", restrict: "A",
scope: {
mctPinch: "&"
},
// Link with the provided function // Link with the provided function
link: link link: link
}; };

View File

@ -5,7 +5,7 @@ define(
'./DrawWebGL', './DrawWebGL',
'./Draw2D' './Draw2D'
], ],
function (DrawWebGL, Draw2D) { function ($log, DrawWebGL, Draw2D) {
var CHARTS = [ var CHARTS = [
DrawWebGL, DrawWebGL,

View File

@ -17,16 +17,6 @@
"key": "mctChart", "key": "mctChart",
"implementation": "MCTChart.js", "implementation": "MCTChart.js",
"depends": [ "$interval", "$log" ] "depends": [ "$interval", "$log" ]
},
{
"key": "mctPinch",
"implementation": "MCTPinch.js",
"depends": [ "$log", "agentService" ]
},
{
"key": "mctPan",
"implementation": "MCTPan.js",
"depends": [ "$log", "agentService" ]
} }
], ],
"controllers": [ "controllers": [