Hide timewindow when all options are hidden (#2287)

* Hide timewindow when all options are hidden

* Disable timewindow button when all options hidden

ui/src/app/components/timewindow-button.tpl.html

@@ -15,7 +15,7 @@
     limitations under the License.
 
 -->
-<md-button ng-disabled="disabled" class="md-raised md-primary" ng-click="openEditMode($event)">
+<md-button ng-disabled="timewindowDisabled" class="md-raised md-primary" ng-click="openEditMode($event)">
     <ng-md-icon icon="query_builder"></ng-md-icon>
     <span>{{model.displayValue}}</span>
 </md-button>

ui/src/app/components/timewindow.directive.js

@@ -97,7 +97,7 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM
         element.html(template);
 
         scope.openEditMode = function (event) {
-            if (scope.disabled) {
+            if (scope.timewindowDisabled) {
                 return;
             }
             var position;
@@ -212,6 +212,10 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM
             }
         }
 
+        scope.isTimewindowDisabled = function () {
+            return scope.disabled || (!scope.isEdit && scope.model.hideInterval && scope.model.hideAggregation && scope.model.hideAggInterval);
+        }
+
         ngModelCtrl.$render = function () {
             scope.model = timeService.defaultTimewindow();
             if (ngModelCtrl.$viewValue) {
@@ -243,6 +247,7 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM
                 model.hideAggregation = value.hideAggregation;
                 model.hideAggInterval = value.hideAggInterval;
             }
+            scope.timewindowDisabled = scope.isTimewindowDisabled();
             scope.updateDisplayValue();
         };
 

ui/src/app/components/timewindow.tpl.html

@@ -16,7 +16,7 @@
 
 -->
 <section class="tb-timewindow" layout='row' layout-align="start center">
-    <md-button ng-if="direction === 'left'" ng-disabled="disabled" class="md-icon-button tb-md-32" aria-label="{{ 'timewindow.edit' | translate }}" ng-click="openEditMode($event)">
+    <md-button ng-if="direction === 'left'" ng-disabled="timewindowDisabled" class="md-icon-button tb-md-32" aria-label="{{ 'timewindow.edit' | translate }}" ng-click="openEditMode($event)">
         <md-tooltip md-direction="{{tooltipDirection}}">
             {{ 'timewindow.edit' | translate }}
         </md-tooltip>
@@ -28,7 +28,7 @@
         </md-tooltip>
         {{model.displayValue}}
     </span>
-    <md-button ng-if="direction === 'right'" ng-disabled="disabled" class="md-icon-button tb-md-32" aria-label="{{ 'timewindow.edit' | translate }}" ng-click="openEditMode($event)">
+    <md-button ng-if="direction === 'right'" ng-disabled="timewindowDisabled" class="md-icon-button tb-md-32" aria-label="{{ 'timewindow.edit' | translate }}" ng-click="openEditMode($event)">
         <md-tooltip md-direction="{{tooltipDirection}}">
             {{ 'timewindow.edit' | translate }}
         </md-tooltip>