Merge pull request #768 from karelhala/HAWKULAR-889

HAWKULAR-889

console/src/main/scripts/plugins/directives/subtab/ts/subtabDirective.ts

@@ -1,5 +1,5 @@
 ///
-/// Copyright 2015 Red Hat, Inc. and/or its affiliates
+/// Copyright 2015-2016 Red Hat, Inc. and/or its affiliates
 /// and other contributors as indicated by the @author tags.
 ///
 /// Licensed under the Apache License, Version 2.0 (the "License");
@@ -93,7 +93,7 @@ module Subtab {
       };
 
       $scope.getUrlFromId = (id) => {
-        if (!$scope.resource) {
+        if (!$scope.resource && $scope.isUrlPage()) {
           $scope.resource = HawkularInventory.Resource.get({environmentId: globalEnvironmentId, resourcePath: id},
             (data) => {
               $scope.resourceName = data.properties.url;

console/src/main/scripts/plugins/metrics/html/directives/url-list/item.html

@@ -1,34 +1,41 @@
-<div ng-click="vm.redirectToUrlAvailability(resource.id)">
+<div ng-click="vm.redirectToUrlAvailability(vm.resource.id)">
   <div class="tile">
     <div class="tile-content">
-      <div class="text-right hk-tile-alert">
-        <a href="{{vm.getAlertUrl(resource.id)}}">
-          <span ng-if="vm.alerts.length === 0" class="badge"></span>
-          <span ng-if="vm.alerts.length > 0" class="badge hk-bg-danger">{{vm.alerts.length}}</span>
-        </a>
+      <div class="text-left hk-tile-alert">
+        <span ng-if="vm.alerts.length === 0" class="badge"></span>
+        <span ng-if="vm.alerts.length > 0" class="badge hk-bg-danger">{{vm.alerts.length}}</span>
       </div>
-      <div class="hk-tile-title">{{resource.properties.url}}</div>
+      <div class="hk-tile-title">{{vm.resource.properties.url}}</div>
       <div class="hk-tile-status">
-        <span ng-show="resource.responseTime.length > 0">{{resource.isUp ? 'Up' : 'Down'}}</span>
+        <span ng-show="vm.resource.responseTime.length > 0">{{vm.resource.isUp ? 'Up' : 'Down'}}</span>
       </div>
       <div>
-        <div ng-show="resource.responseTime.length > 0 && resource.isUp" class="hk-tile-circle-icon hk-success"><i class="fa fa-arrow-up"></i></div>
-        <div ng-show="resource.responseTime.length > 0 && !resource.isUp" class="hk-tile-circle-icon hk-danger"><i class="fa fa-arrow-down"></i></div>
-        <span class="spinner spinner-inline" ng-hide="resource.responseTime.length > 0" popover="Your data is being collected. You should see something in a few seconds." popover-trigger="mouseenter" popover-placement="bottom"></span>
+        <div ng-show="vm.resource.responseTime.length > 0 && vm.resource.isUp" class="hk-tile-circle-icon hk-success"><i class="fa fa-arrow-up"></i></div>
+        <div ng-show="vm.resource.responseTime.length > 0 && !vm.resource.isUp" class="hk-tile-circle-icon hk-danger"><i class="fa fa-arrow-down"></i></div>
+        <span class="spinner spinner-inline" ng-hide="vm.resource.responseTime.length > 0" popover="Your data is being collected. You should see something in a few seconds." popover-trigger="mouseenter" popover-placement="bottom"></span>
       </div>
-      <div class="chart-pf-sparkline {{resource.isUp?'':'c3-danger'}}">
+      <div class="chart-pf-sparkline {{vm.resource.isUp?'':'c3-danger'}}">
         <hawkular-sparkline-chart
-          data="resource.graphResponseTime"
+          data="vm.resource.graphResponseTime"
           show-x-axis-values="false"
           show-y-axis-values="false">
         </hawkular-sparkline-chart>
       </div>
       <div class="hk-tile-info">
         <a href="{{vm.getResponseTimeUrl(resource.id)}}">
-          <span ng-show="resource.responseTime.length > 0 && resource.responseTime[0].value < 0">n/a</span>
-          <span ng-show="resource.responseTime.length > 0 && resource.responseTime[0].value >= 0">Response Time: {{resource.responseTime[0].value}}ms</span>
+          <span ng-show="vm.resource.responseTime.length > 0 && vm.resource.responseTime[0].value < 0">n/a</span>
+          <span ng-show="vm.resource.responseTime.length > 0 && vm.resource.responseTime[0].value >= 0">Response Time: {{vm.resource.responseTime[0].value}}ms</span>
         </a>
       </div>
     </div>
+    <button
+      class="btn-link hk-delete"
+      data-toggle="tooltip"
+      data-placement="top"
+      title=""
+      data-original-title="Delete"
+      ng-click="vm.removeUrl($event)">
+      <span class="pficon-delete"></span>
+    </button>
   </div>
 </div>

console/src/main/scripts/plugins/metrics/html/directives/url-list/summary.html

@@ -4,6 +4,7 @@
       <div class="col-lg-2 col-md-3 col-sm-3" ng-repeat="res in resourceList track by res.properties.url">
         <url-list-item
           resource="res"
+          delete-resource="deleteResource({res:res})"
         ></url-list-item>
       </div>
     </div>

console/src/main/scripts/plugins/metrics/html/url-list.html

@@ -3,7 +3,10 @@
     <div class="spinner spinner-lg"></div>
     <p class="hk-spinner-legend-below">Loading...</p>
   </div>
+
   <div class="hk-urls-list" ng-class="{'hk-urls-empty text-center': vm.resourceList.length === 0, 'hk-fade-in': vm.resourceList}" ng-show="vm.resourceList">
+    <hawkular-subtab ng-controller="Subtab.SubtabController" ng-show="vm.resourceList.length > 0">
+    </hawkular-subtab>
     <h1 class="text-center">Hello {{currentPersona.owner ? currentPersona.name : userDetails.firstName}}!</h1>
     <i class="fa fa-line-chart" ng-show="vm.resourceList.length === 0"></i>
     <h2 ng-show="vm.resourceList.length === 0">Collect metrics from a URL that you want to monitor.</h2>
@@ -16,13 +19,13 @@ <h2 ng-show="vm.resourceList.length === 0">Collect metrics from a URL that you w
                    placeholder="Enter a website URL (e.g.: http://www.website.com)" required hk-autofocus>
             <span class="input-group-btn">
               <button class="btn btn-primary" type="submit" ng-disabled="addUrlForm.$invalid || vm.addProgress">
-               <div ng-show="vm.addProgress" class="spinner spinner-sm"></div>
-              Add URL
+                <div ng-show="vm.addProgress" class="spinner spinner-sm"></div>
+                Add URL
               </button>
             </span>
           </div>
           <span class="help-block"
-                  ng-show="addUrlForm.resourceUrl.$dirty && addUrlForm.resourceUrl.$invalid">The URL you entered is not valid. Please enter a valid URL.</span>
+                ng-show="addUrlForm.resourceUrl.$dirty && addUrlForm.resourceUrl.$invalid">The URL you entered is not valid. Please enter a valid URL.</span>
 
         </div>
       </div>

console/src/main/scripts/plugins/metrics/ts/directives/url-list/urlItemController.ts

@@ -1,5 +1,5 @@
 ///
-/// Copyright 2015 Red Hat, Inc. and/or its affiliates
+/// Copyright 2015-2016 Red Hat, Inc. and/or its affiliates
 /// and other contributors as indicated by the @author tags.
 ///
 /// Licensed under the Apache License, Version 2.0 (the "License");
@@ -33,15 +33,18 @@ module HawkularMetrics {
     private autoRefreshPromise:ng.IPromise<number>;
     public startTimeStamp:TimestampInMillis;
     public endTimeStamp:TimestampInMillis;
+    private initialStartTime:TimestampInMillis;
 
     constructor(private $location:ng.ILocationService,
                 private $routeParams:any,
-                private $rootScope:any,
                 private HawkularAlertRouterManager: IHawkularAlertRouterManager,
                 private $interval:ng.IIntervalService) {
-      this.startTimeStamp = +moment().subtract(($routeParams.timeOffset || 3600000), 'milliseconds');
+      this.initialStartTime = this.$routeParams.timeOffset || 3600000;
+      this.resourceId = this.resource.id;
+      this.initStartTimeStamp();
       this.endTimeStamp = +moment();
-      this.getAlerts();
+      this.registerAlerts();
+      this.refresh();
       this.autoRefresh(20);
     }
 
@@ -91,20 +94,31 @@ module HawkularMetrics {
       );
     }
 
+    private initStartTimeStamp() {
+      this.startTimeStamp = +moment().subtract((this.$routeParams.timeOffset || 3600000), 'milliseconds');
+    }
+
+    public removeUrl($event) {
+      $event.stopPropagation();
+      if (this.hasOwnProperty('deleteResource')) {
+        this['deleteResource']({res:this.resource});
+      }
+    }
+
     public redirectToUrlAvailability(resourceId) {
       this.$location.path(this.getAvailabilityUrl(resourceId));
     }
 
     public getAlertUrl(resourceId):string {
-      return UrlItemController.ALERT_URL + resourceId + '/' + this.$rootScope.hkParams.timeOffset;
+      return UrlItemController.ALERT_URL + resourceId + '/' + this.initialStartTime;
     }
 
     public getResponseTimeUrl(resourceId):string {
-      return UrlItemController.RESPONSE_TIME_URL + resourceId + '/' + this.$rootScope.hkParams.timeOffset;
+      return UrlItemController.RESPONSE_TIME_URL + resourceId + '/' + this.initialStartTime;
     }
 
     public getAvailabilityUrl(resourceId):string {
-      return UrlItemController.AVAILABILITY_URL + resourceId + '/' + this.$rootScope.hkParams.timeOffset;
+      return UrlItemController.AVAILABILITY_URL + resourceId + '/' + this.initialStartTime;
     }
   }
   _module.controller('UrlItemController', UrlItemController);

console/src/main/scripts/plugins/metrics/ts/directives/url-list/urlListDirective.ts

@@ -1,5 +1,5 @@
 ///
-/// Copyright 2015 Red Hat, Inc. and/or its affiliates
+/// Copyright 2015-2016 Red Hat, Inc. and/or its affiliates
 /// and other contributors as indicated by the @author tags.
 ///
 /// Licensed under the Apache License, Version 2.0 (the "License");
@@ -18,18 +18,11 @@
 /// <reference path="../../metricsPlugin.ts"/>
 /// <reference path="../../../includes.ts"/>
 module HawkularMetrics {
+
   let itemLink = (scope:any, element:ng.IAugmentedJQuery, attrs:ng.IAttributes) => {
     if (typeof scope.alerts === 'undefined') {
       scope.alerts = [];
     }
-
-    scope.$watch('resource', (newResource) => {
-      scope.vm.resourceId = newResource.id;
-      scope.vm.resource = newResource;
-      scope.vm.registerAlerts();
-      scope.vm.refresh();
-    });
-
     scope.$on('$destroy', () => {
       scope.vm.destroy();
     });
@@ -55,10 +48,12 @@ module HawkularMetrics {
   export class ItemDirective implements ng.IDirective {
     public link = itemLink;
     public replace:boolean = true;
+    public scope = {};
     public controller = UrlItemController;
     public controllerAs = 'vm';
-    public scope = {
-      resource: '='
+    public bindToController = {
+      resource: '=',
+      deleteResource: '&'
     };
     public templateUrl = 'plugins/metrics/html/directives/url-list/item.html';
     public static Factory() {

console/src/main/scripts/plugins/metrics/ts/urlList.ts

@@ -1,5 +1,5 @@
 ///
-/// Copyright 2015 Red Hat, Inc. and/or its affiliates
+/// Copyright 2015-2016 Red Hat, Inc. and/or its affiliates
 /// and other contributors as indicated by the @author tags.
 ///
 /// Licensed under the Apache License, Version 2.0 (the "License");
@@ -77,7 +77,7 @@ module HawkularMetrics {
     /// this is for minification purposes
     public static $inject = ['$location', '$scope', '$rootScope', '$interval', '$log', '$filter', '$modal',
       'HawkularInventory', 'HawkularMetric', 'HawkularAlertsManager', 'ErrorsManager', '$q', 'MetricsService',
-      'md5', 'HkHeaderParser', 'NotificationsService'];
+      'md5', 'HkHeaderParser', 'NotificationsService', '$routeParams'];
 
     private autoRefreshPromise:ng.IPromise<number>;
     private static NUM_OF_POINTS = 30;
@@ -97,6 +97,7 @@ module HawkularMetrics {
 
     public sorting:any;
     public currentSortIndex:number = 0;
+    public startTimeStamp:TimestampInMillis;
     constructor(private $location:ng.ILocationService,
                 private $scope:any,
                 private $rootScope:any,
@@ -113,9 +114,11 @@ module HawkularMetrics {
                 private md5:any,
                 private HkHeaderParser:IHkHeaderParser,
                 private NotificationsService:INotificationsService,
+                private $routeParams:any,
                 public resourceUrl:string) {
       $scope.vm = this;
       this.resourceUrl = this.httpUriPart;
+      this.startTimeStamp = +moment().subtract((this.$routeParams.timeOffset || 3600000), 'milliseconds');
 
       if ($rootScope.currentPersona) {
         this.getResourceList(this.$rootScope.currentPersona.id);
@@ -199,6 +202,7 @@ module HawkularMetrics {
         resourceTypePath: '/URL',
         id: resourceId,
         properties: {
+          created: new Date().getTime(),
           url: url,
           'hwk-gui-domainSort': domainSort
         }