Implement local timewindow handling.

ui-ngx/src/app/core/api/widget-subscription.ts

@@ -321,14 +321,6 @@ export class WidgetSubscription implements IWidgetSubscription {
     });
     if (this.displayLegend) {
       this.legendData.keys = this.legendData.keys.sort((key1, key2) => key1.dataKey.label.localeCompare(key2.dataKey.label));
-      // TODO:
-    }
-    if (this.type === widgetType.timeseries) {
-      if (this.useDashboardTimewindow) {
-        // TODO:
-      } else {
-        // TODO:
-      }
     }
   }
 
@@ -395,6 +387,10 @@ export class WidgetSubscription implements IWidgetSubscription {
   }
 
   updateTimewindowConfig(newTimewindow: Timewindow): void {
+    if (!this.useDashboardTimewindow) {
+      this.timeWindowConfig = newTimewindow;
+      this.update();
+    }
   }
 
   onResetTimewindow(): void {
@@ -424,14 +420,17 @@ export class WidgetSubscription implements IWidgetSubscription {
   }
 
   sendOneWayCommand(method: string, params?: any, timeout?: number): Observable<any> {
+    // TODO:
     return undefined;
   }
 
   sendTwoWayCommand(method: string, params?: any, timeout?: number): Observable<any> {
+    // TODO:
     return undefined;
   }
 
   clearRpcError(): void {
+    // TODO:
   }
 
   update() {
@@ -536,7 +535,6 @@ export class WidgetSubscription implements IWidgetSubscription {
         this.cafs[cafId] = null;
       }
     }
-    // TODO:
   }
 
   private notifyDataLoading() {

ui-ngx/src/app/modules/home/components/dashboard/dashboard.component.html

@@ -50,6 +50,7 @@
                 {{widget.title}}
               </span>
               <tb-timewindow *ngIf="widget.hasTimewindow"
+                             #timewindowComponent
                              aggregation="{{widget.hasAggregation}}"
                              [ngModel]="widget.widget.config.timewindow"
                              (ngModelChange)="widgetComponent.onTimewindowChanged($event)">
@@ -98,7 +99,7 @@
               </button>
               <button mat-button mat-icon-button
                       [fxShow]="isRemoveActionEnabled && !widget.isFullscreen"
-                      (click)="removeWidget($event, widget)"
+                      (click)="removeWidget($event, widget);"
                       matTooltip="{{ 'widget.remove' | translate }}"
                       matTooltipPosition="above">
                 <mat-icon>close</mat-icon>

ui-ngx/src/app/modules/home/components/widget/widget.component.ts

@@ -29,7 +29,8 @@ import {
   ViewChild,
   ViewContainerRef,
   ViewEncapsulation,
-  ChangeDetectorRef
+  ChangeDetectorRef,
+  ChangeDetectionStrategy, NgZone
 } from '@angular/core';
 import { DashboardWidget, IDashboardComponent } from '@home/models/dashboard-component.models';
 import {
@@ -86,12 +87,14 @@ import { DashboardService } from '@core/http/dashboard.service';
 import { DatasourceService } from '@core/api/datasource.service';
 import { WidgetSubscription } from '@core/api/widget-subscription';
 import { EntityService } from '@core/http/entity.service';
+import { TimewindowComponent } from '@shared/components/time/timewindow.component';
 
 @Component({
   selector: 'tb-widget',
   templateUrl: './widget.component.html',
   styleUrls: ['./widget.component.scss'],
-  encapsulation: ViewEncapsulation.None
+  encapsulation: ViewEncapsulation.None,
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class WidgetComponent extends PageComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy {
 
@@ -159,6 +162,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI
               private datasourceService: DatasourceService,
               private utils: UtilsService,
               private raf: RafService,
+              private ngZone: NgZone,
               private cd: ChangeDetectorRef) {
     super(store);
   }
@@ -647,6 +651,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI
 
       this.widgetContext.$container = $('> ng-component', containerElement);
       this.widgetContext.$container.css('display', 'block');
+      this.widgetContext.$container.css('user-select', 'none');
       this.widgetContext.$container.attr('id', 'container');
       this.widgetContext.$containerParent = $(containerElement);
 
@@ -756,8 +761,9 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI
         }
       },
       timeWindowUpdated: (subscription, timeWindowConfig) => {
-        this.widget.config.timewindow = timeWindowConfig;
+        this.ngZone.run(() => {
-        this.cd.detectChanges();
+          this.widget.config.timewindow = timeWindowConfig;
+        });
       }
     };
 

ui-ngx/src/polyfills.ts

@@ -71,6 +71,8 @@
 /***************************************************************************************************
  * Zone JS is required by default for Angular itself.
  */
+
+import './zone-flags';
 import 'zone.js/dist/zone';  // Included with Angular CLI.
 import 'core-js/es/array';
 

ui-ngx/src/zone-flags.ts

@@ -0,0 +1,19 @@
+///
+/// Copyright © 2016-2019 The Thingsboard Authors
+///
+/// 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.
+///
+
+(window as any).__Zone_disable_requestAnimationFrame = false;
+(window as any).__Zone_disable_setTimeout = false;
+(window as any).__Zone_disable_setInterval = false;