From 430645b1f2e196bd865a369df8c4fee29fd15e7c Mon Sep 17 00:00:00 2001 From: Henry Date: Wed, 5 Oct 2016 09:04:13 -0700 Subject: [PATCH] TOI working in time conductor --- .../features/conductor-v2/conductor/bundle.js | 10 +- .../res/sass/_time-conductor-base.scss | 4 +- .../res/templates/conductor-data.html | 15 +++ .../res/templates/time-conductor.html | 13 +- .../src/ui/ConductorTOIController.js | 114 ++++++++++++++++++ .../src/ui/TimeConductorController.js | 1 - 6 files changed, 146 insertions(+), 11 deletions(-) create mode 100644 platform/features/conductor-v2/conductor/res/templates/conductor-data.html create mode 100644 platform/features/conductor-v2/conductor/src/ui/ConductorTOIController.js diff --git a/platform/features/conductor-v2/conductor/bundle.js b/platform/features/conductor-v2/conductor/bundle.js index c9520de1bb9..2c692f2a4b6 100644 --- a/platform/features/conductor-v2/conductor/bundle.js +++ b/platform/features/conductor-v2/conductor/bundle.js @@ -25,6 +25,7 @@ define([ "./src/ui/TimeConductorController", "./src/TimeConductor", "./src/ui/ConductorAxisController", + "./src/ui/ConductorTOIController", "./src/ui/MctConductorAxis", "./src/ui/NumberFormat", "text!./res/templates/time-conductor.html", @@ -36,6 +37,7 @@ define([ TimeConductorController, TimeConductor, ConductorAxisController, + ConductorTOIController, MCTConductorAxis, NumberFormat, timeConductorTemplate, @@ -83,11 +85,13 @@ define([ ] }, { - "key": "ConductorAxisController", - "implementation": ConductorAxisController, + "key": "ConductorTOIController", + "implementation": ConductorTOIController, "depends": [ + "$scope", "timeConductor", - "formatService" + "timeConductorViewService", + "$timeout" ] } ], diff --git a/platform/features/conductor-v2/conductor/res/sass/_time-conductor-base.scss b/platform/features/conductor-v2/conductor/res/sass/_time-conductor-base.scss index 801aba63534..8c728b8ea7d 100644 --- a/platform/features/conductor-v2/conductor/res/sass/_time-conductor-base.scss +++ b/platform/features/conductor-v2/conductor/res/sass/_time-conductor-base.scss @@ -246,7 +246,9 @@ &:hover { // Hide the cursor, because the TOI element essentially "becomes" the cursor // when the user is hovering over the visualization area. - cursor: none; + + // AH - not any more it doesn't? + //cursor: none; .l-toi-holder.hover { opacity: 1; } diff --git a/platform/features/conductor-v2/conductor/res/templates/conductor-data.html b/platform/features/conductor-v2/conductor/res/templates/conductor-data.html new file mode 100644 index 00000000000..96cbb100907 --- /dev/null +++ b/platform/features/conductor-v2/conductor/res/templates/conductor-data.html @@ -0,0 +1,15 @@ + +
+ +
+
+
2016-09-15 21:31:30.000Z
+
+
+
+ \ No newline at end of file diff --git a/platform/features/conductor-v2/conductor/res/templates/time-conductor.html b/platform/features/conductor-v2/conductor/res/templates/time-conductor.html index 2d75fb72135..d7e42b34c7e 100644 --- a/platform/features/conductor-v2/conductor/res/templates/time-conductor.html +++ b/platform/features/conductor-v2/conductor/res/templates/time-conductor.html @@ -95,19 +95,20 @@ -
+
+ ng-class="{ 'pinned': toi.pinned, 'val-to-right': false }" + ng-style="{'left': toi.left + '%'}">
- - 21:31:30 + +
2016-09-15 21:31:30.000Z
diff --git a/platform/features/conductor-v2/conductor/src/ui/ConductorTOIController.js b/platform/features/conductor-v2/conductor/src/ui/ConductorTOIController.js new file mode 100644 index 00000000000..c168acadf63 --- /dev/null +++ b/platform/features/conductor-v2/conductor/src/ui/ConductorTOIController.js @@ -0,0 +1,114 @@ +/***************************************************************************** + * Open MCT Web, Copyright (c) 2014-2015, United States Government + * as represented by the Administrator of the National Aeronautics and Space + * Administration. All rights reserved. + * + * Open MCT Web is licensed under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * http://www.apache.org/licenses/LICENSE-2.0. + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT + * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the + * License for the specific language governing permissions and limitations + * under the License. + * + * Open MCT Web includes source code licensed under additional open source + * licenses. See the Open Source Licenses file (LICENSES.md) included with + * this source code distribution or the Licensing information page available + * at runtime from the About dialog for additional information. + *****************************************************************************/ + +define( + ["zepto"], + function ($) { + + /** + * The mct-conductor-axis renders a horizontal axis with regular + * labelled 'ticks'. It requires 'start' and 'end' integer values to + * be specified as attributes. + */ + function ConductorTOIController($scope, conductor, conductorViewService, $timeout) { + this.conductor = conductor; + this.conductorViewService = conductorViewService; + + //Bind all class functions to 'this' + Object.keys(ConductorTOIController.prototype).filter(function (key) { + return typeof ConductorTOIController.prototype[key] === 'function'; + }).forEach(function (key) { + this[key] = ConductorTOIController.prototype[key].bind(this); + }.bind(this)); + + this.conductor.on('timeOfInterest', this.changeTimeOfInterest); + this.conductorViewService.on('zoom', this.setOffsetFromBounds); + this.conductorViewService.on('pan', this.setOffsetFromBounds); + + this.$timeout = $timeout; + + var generateRandomTOI = function () { + var bounds = conductor.bounds(); + var range = bounds.end - bounds.start; + var toi = Math.random() * range + bounds.start; + console.log('calculated random TOI of ' + toi); + conductor.timeOfInterest(toi); + //this.timeoutHandle = $timeout(generateRandomTOI, 1000); + }.bind(this); + + //this.timeoutHandle = $timeout(generateRandomTOI, 2000); + + $scope.$on('$destroy', this.destroy); + + } + + ConductorTOIController.prototype.destroy = function () { + this.conductor.off('timeOfInterest', this.setOffsetFromBounds); + this.conductorViewService.off('zoom', this.setOffsetFromBounds); + this.conductorViewService.off('pan', this.setOffsetFromBounds); + + this.$timeout.cancel(this.timeoutHandle); + }; + + ConductorTOIController.prototype.setOffsetFromBounds = function (bounds) { + var toi = this.conductor.timeOfInterest(); + var offset = toi - bounds.start; + this.left = offset / (bounds.end - bounds.start) * 100; + }; + + ConductorTOIController.prototype.changeTimeOfInterest = function () { + var bounds = this.conductor.bounds(); + if (bounds) { + this.setOffsetFromBounds(bounds); + this.pinned = true; + } + }; + + ConductorTOIController.prototype.click = function (e) { + if (e.altKey) { + var element = $(e.currentTarget); + var width = element.width(); + var relativeX = e.pageX - element.offset().left; + var percX = relativeX / width; + var bounds = this.conductor.bounds(); + var timeRange = bounds.end - bounds.start; + + this.conductor.timeOfInterest(timeRange * percX + bounds.start); + } + }; + + /* + ConductorTOIController.prototype.zoom = function (bounds) { + this.changeTOI(bounds) + }; + + ConductorTOIController.prototype.pan = function (bounds) { + this.changeTOI(bounds) + };*/ + + ConductorTOIController.prototype.resize = function () { + //Do something + }; + + return ConductorTOIController; + } +); diff --git a/platform/features/conductor-v2/conductor/src/ui/TimeConductorController.js b/platform/features/conductor-v2/conductor/src/ui/TimeConductorController.js index 176d1bbb2f5..0a87141443d 100644 --- a/platform/features/conductor-v2/conductor/src/ui/TimeConductorController.js +++ b/platform/features/conductor-v2/conductor/src/ui/TimeConductorController.js @@ -99,7 +99,6 @@ define( // Watch scope for selection of mode or time system by user this.$scope.$watch('modeModel.selectedKey', this.setMode); this.conductorViewService.on('pan', this.pan); - this.conductorViewService.on('pan-stop', this.panStop); this.$scope.$on('$destroy', this.destroy);