Commit 4feb78144b71924d835ae82c507f7a84d4f6dce6
Committed by
mp-loki
1 parent
12f0fd6c
TB-53: Fixed handling of mouse events on dashboard widgets.
Showing
2 changed files
with
22 additions
and
61 deletions
... | ... | @@ -87,8 +87,6 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, t |
87 | 87 | var highlightedMode = false; |
88 | 88 | var highlightedWidget = null; |
89 | 89 | var selectedWidget = null; |
90 | - var mouseDownWidget = -1; | |
91 | - var widgetMouseMoved = false; | |
92 | 90 | |
93 | 91 | var gridsterParent = $('#gridster-parent', $element); |
94 | 92 | var gridsterElement = angular.element($('#gridster-child', gridsterParent)); |
... | ... | @@ -152,9 +150,9 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, t |
152 | 150 | vm.resetHighlight = resetHighlight; |
153 | 151 | |
154 | 152 | vm.onWidgetFullscreenChanged = onWidgetFullscreenChanged; |
153 | + | |
155 | 154 | vm.widgetMouseDown = widgetMouseDown; |
156 | - vm.widgetMouseMove = widgetMouseMove; | |
157 | - vm.widgetMouseUp = widgetMouseUp; | |
155 | + vm.widgetClicked = widgetClicked; | |
158 | 156 | |
159 | 157 | vm.widgetSizeX = widgetSizeX; |
160 | 158 | vm.widgetSizeY = widgetSizeY; |
... | ... | @@ -185,22 +183,22 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, t |
185 | 183 | vm.dashboardTimewindowApi = { |
186 | 184 | onResetTimewindow: function() { |
187 | 185 | if (vm.originalDashboardTimewindow) { |
188 | - vm.dashboardTimewindow = angular.copy(vm.originalDashboardTimewindow); | |
189 | - vm.originalDashboardTimewindow = null; | |
186 | + $timeout(function() { | |
187 | + vm.dashboardTimewindow = angular.copy(vm.originalDashboardTimewindow); | |
188 | + vm.originalDashboardTimewindow = null; | |
189 | + }, 0); | |
190 | 190 | } |
191 | 191 | }, |
192 | 192 | onUpdateTimewindow: function(startTimeMs, endTimeMs) { |
193 | 193 | if (!vm.originalDashboardTimewindow) { |
194 | 194 | vm.originalDashboardTimewindow = angular.copy(vm.dashboardTimewindow); |
195 | 195 | } |
196 | - vm.dashboardTimewindow = timeService.toHistoryTimewindow(vm.dashboardTimewindow, startTimeMs, endTimeMs); | |
196 | + $timeout(function() { | |
197 | + vm.dashboardTimewindow = timeService.toHistoryTimewindow(vm.dashboardTimewindow, startTimeMs, endTimeMs); | |
198 | + }, 0); | |
197 | 199 | } |
198 | 200 | }; |
199 | 201 | |
200 | - //$element[0].onmousemove=function(){ | |
201 | - // widgetMouseMove(); | |
202 | - // } | |
203 | - | |
204 | 202 | //TODO: widgets visibility |
205 | 203 | /*gridsterParent.scroll(function () { |
206 | 204 | updateVisibleRect(); |
... | ... | @@ -350,7 +348,6 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, t |
350 | 348 | } |
351 | 349 | |
352 | 350 | function loadDashboard() { |
353 | - resetWidgetClick(); | |
354 | 351 | $timeout(function () { |
355 | 352 | if (vm.loadWidgets) { |
356 | 353 | var promise = vm.loadWidgets(); |
... | ... | @@ -434,42 +431,17 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, t |
434 | 431 | return gridsterElement && gridsterElement[0] === gridster.$element[0]; |
435 | 432 | } |
436 | 433 | |
437 | - function resetWidgetClick () { | |
438 | - mouseDownWidget = -1; | |
439 | - widgetMouseMoved = false; | |
440 | - } | |
441 | - | |
442 | 434 | function onWidgetFullscreenChanged(expanded, widget) { |
443 | 435 | vm.isWidgetExpanded = expanded; |
444 | 436 | $scope.$broadcast('onWidgetFullscreenChanged', vm.isWidgetExpanded, widget); |
445 | 437 | } |
446 | 438 | |
447 | 439 | function widgetMouseDown ($event, widget) { |
448 | - mouseDownWidget = widget; | |
449 | - widgetMouseMoved = false; | |
450 | 440 | if (vm.onWidgetMouseDown) { |
451 | 441 | vm.onWidgetMouseDown({event: $event, widget: widget}); |
452 | 442 | } |
453 | 443 | } |
454 | 444 | |
455 | - function widgetMouseMove () { | |
456 | - if (mouseDownWidget) { | |
457 | - widgetMouseMoved = true; | |
458 | - } | |
459 | - } | |
460 | - | |
461 | - function widgetMouseUp ($event, widget) { | |
462 | - $timeout(function () { | |
463 | - if (!widgetMouseMoved && mouseDownWidget) { | |
464 | - if (widget === mouseDownWidget) { | |
465 | - widgetClicked($event, widget); | |
466 | - } | |
467 | - } | |
468 | - mouseDownWidget = null; | |
469 | - widgetMouseMoved = false; | |
470 | - }, 0); | |
471 | - } | |
472 | - | |
473 | 445 | function widgetClicked ($event, widget) { |
474 | 446 | if ($event) { |
475 | 447 | $event.stopPropagation(); |
... | ... | @@ -518,7 +490,6 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, t |
518 | 490 | } |
519 | 491 | |
520 | 492 | function editWidget ($event, widget) { |
521 | - resetWidgetClick(); | |
522 | 493 | if ($event) { |
523 | 494 | $event.stopPropagation(); |
524 | 495 | } |
... | ... | @@ -528,7 +499,6 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, t |
528 | 499 | } |
529 | 500 | |
530 | 501 | function exportWidget ($event, widget) { |
531 | - resetWidgetClick(); | |
532 | 502 | if ($event) { |
533 | 503 | $event.stopPropagation(); |
534 | 504 | } |
... | ... | @@ -538,7 +508,6 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, t |
538 | 508 | } |
539 | 509 | |
540 | 510 | function removeWidget($event, widget) { |
541 | - resetWidgetClick(); | |
542 | 511 | if ($event) { |
543 | 512 | $event.stopPropagation(); |
544 | 513 | } |
... | ... | @@ -548,27 +517,21 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, t |
548 | 517 | } |
549 | 518 | |
550 | 519 | function highlightWidget(widget, delay) { |
551 | - highlightedMode = true; | |
552 | - highlightedWidget = widget; | |
553 | - if (vm.gridster) { | |
554 | - var item = $('.gridster-item', vm.gridster.$element)[vm.widgets.indexOf(widget)]; | |
555 | - if (item) { | |
556 | - var height = $(item).outerHeight(true); | |
557 | - var rectHeight = gridsterParent.height(); | |
558 | - var offset = (rectHeight - height) / 2; | |
559 | - var scrollTop = item.offsetTop; | |
560 | - if (offset > 0) { | |
561 | - scrollTop -= offset; | |
562 | - } | |
563 | - gridsterParent.animate({ | |
564 | - scrollTop: scrollTop | |
565 | - }, delay); | |
566 | - } | |
520 | + if (!highlightedMode || highlightedWidget != widget) { | |
521 | + highlightedMode = true; | |
522 | + highlightedWidget = widget; | |
523 | + scrollToWidget(widget, delay); | |
567 | 524 | } |
568 | 525 | } |
569 | 526 | |
570 | 527 | function selectWidget(widget, delay) { |
571 | - selectedWidget = widget; | |
528 | + if (selectedWidget != widget) { | |
529 | + selectedWidget = widget; | |
530 | + scrollToWidget(widget, delay); | |
531 | + } | |
532 | + } | |
533 | + | |
534 | + function scrollToWidget(widget, delay) { | |
572 | 535 | if (vm.gridster) { |
573 | 536 | var item = $('.gridster-item', vm.gridster.$element)[vm.widgets.indexOf(widget)]; |
574 | 537 | if (item) { | ... | ... |
... | ... | @@ -37,9 +37,7 @@ |
37 | 37 | 'tb-not-highlighted': vm.isNotHighlighted(widget), |
38 | 38 | 'md-whiteframe-4dp': vm.dropWidgetShadow(widget)}" |
39 | 39 | tb-mousedown="vm.widgetMouseDown($event, widget)" |
40 | - tb-mousemove="vm.widgetMouseMove($event, widget)" | |
41 | - tb-mouseup="vm.widgetMouseUp($event, widget)" | |
42 | - ng-click="" | |
40 | + ng-click="vm.widgetClicked($event, widget)" | |
43 | 41 | tb-contextmenu="vm.openWidgetContextMenu($event, widget, $mdOpenMousepointMenu)" |
44 | 42 | ng-style="{cursor: 'pointer', |
45 | 43 | color: vm.widgetColor(widget), |
... | ... | @@ -49,7 +47,7 @@ |
49 | 47 | <span ng-show="vm.showWidgetTitle(widget)" ng-style="vm.widgetTitleStyle(widget)" class="md-subhead">{{widget.config.title}}</span> |
50 | 48 | <tb-timewindow aggregation ng-if="vm.hasTimewindow(widget)" ng-model="widget.config.timewindow"></tb-timewindow> |
51 | 49 | </div> |
52 | - <div class="tb-widget-actions" layout="row" layout-align="start center"> | |
50 | + <div class="tb-widget-actions" layout="row" layout-align="start center" tb-mousedown="$event.stopPropagation()"> | |
53 | 51 | <md-button id="expand-button" |
54 | 52 | ng-show="!vm.isEdit && vm.enableWidgetFullscreen(widget)" |
55 | 53 | aria-label="{{ 'fullscreen.fullscreen' | translate }}" | ... | ... |