From cd2a937e7c930c0305e2600937e19915a845d4d8 Mon Sep 17 00:00:00 2001
From: Masayuki Igawa <masayuki.igawa@gmail.com>
Date: Wed, 30 Mar 2016 17:44:38 +0900
Subject: [PATCH] Add search filter to job graphs on the homepage

This commit adds the search filter to the job graphs on the homepage.
With this patch, users can know the specified jobs such as the
integrated tests like this filter[1].

[1] openstack-dev/devstack|openstack-infra/devstack-gate|openstack/(cinder|glance|keystone|nova|requirements|tempest)$

Change-Id: Ia8b8d0432048b912f67c35886a3284d6a4a92ac6
Partial-Bug: #1552700
---
 app/js/controllers/home.js    |  8 +++++---
 app/js/services/health-api.js |  3 +++
 app/js/services/projects.js   | 15 +++++++++++----
 app/views/home.html           | 20 ++++++++++++++++++--
 4 files changed, 37 insertions(+), 9 deletions(-)

diff --git a/app/js/controllers/home.js b/app/js/controllers/home.js
index 7400dbe9..f1a9454f 100644
--- a/app/js/controllers/home.js
+++ b/app/js/controllers/home.js
@@ -32,8 +32,8 @@ function HomeController(
     vm.hold -= 1;
   };
 
-  var processData = function(data) {
-    var projects = projectService.createProjects(data.runs);
+  var processData = function(data, projectRe) {
+    var projects = projectService.createProjects(data.runs, projectRe);
     var blanks = projectService.findBlanks(data.runs);
     var dateStats = projectService.getStatsByDate(projects);
     var entries = getChartEntries(dateStats, blanks);
@@ -115,11 +115,12 @@ function HomeController(
       stop_date: viewService.periodEnd(),
       datetime_resolution: viewService.resolution().key
     }).then(function(response) {
-      processData(response.data);
+      processData(response.data, vm.searchProject);
       vm.loaded = true;
     });
     healthService.getRecentFailedTests().then(function(response) {
       vm.recentTests = response.data;
+      vm.recentRuns = {};
       angular.forEach(vm.recentTests, function(test) {
         if (!vm.recentRuns[test.link]) {
           vm.recentRuns[test.link] = [];
@@ -161,6 +162,7 @@ function HomeController(
 
   vm.onSearchChange = function() {
     $location.search('searchProject', $scope.home.searchProject).replace();
+    loadData();
   };
 }
 controllersModule.controller('HomeController', HomeController);
diff --git a/app/js/services/health-api.js b/app/js/services/health-api.js
index dbbaa64e..2779d246 100644
--- a/app/js/services/health-api.js
+++ b/app/js/services/health-api.js
@@ -76,6 +76,7 @@ function HealthService($http, config) {
   service.getRunsGroupedByMetadataPerDatetime = function(key, options) {
     return config.get().then(function(config) {
       return $http.jsonp(config.apiRoot + '/runs/group_by/' + key, {
+        cache: true,
         params: angular.extend(options, { callback: 'JSON_CALLBACK' })
       });
     });
@@ -144,6 +145,7 @@ function HealthService($http, config) {
 
     return config.get().then(function(config) {
       return $http.jsonp(config.apiRoot + '/runs/key/' + runMetadataKey + '/' + value + '/recent', {
+        cache: true,
         params: angular.extend(options, { callback: 'JSON_CALLBACK' })
       });
     });
@@ -154,6 +156,7 @@ function HealthService($http, config) {
 
     return config.get().then(function(config) {
       return $http.jsonp(config.apiRoot + '/tests/recent/fail', {
+        cache: true,
         params: angular.extend(options, { callback: 'JSON_CALLBACK' })
       });
     });
diff --git a/app/js/services/projects.js b/app/js/services/projects.js
index 81c2f312..f3d5a954 100644
--- a/app/js/services/projects.js
+++ b/app/js/services/projects.js
@@ -36,14 +36,21 @@ var projectService = function(projectFactory, metricsService) {
     return blanks;
   };
 
-  service.createProjects = function(runsJson) {
+  service.createProjects = function(runsJson, projectRe) {
     var projects = [];
     var index = {};
-
+    var pattern = null;
+    try {
+      pattern = new RegExp(projectRe);
+    } catch (e) {
+      pattern = '';
+    }
     angular.forEach(runsJson, function(projectsJson, dateString) {
       angular.forEach(projectsJson, function(runEntries, name) {
-        var project = findOrCreate(index, projects, name, projectFactory.create);
-        project.addRuns(dateString, runEntries);
+        if (pattern.test(name)) {
+          var project = findOrCreate(index, projects, name, projectFactory.create);
+          project.addRuns(dateString, runEntries);
+        }
       });
     });
 
diff --git a/app/views/home.html b/app/views/home.html
index 96d6fb9f..02bb8fe7 100644
--- a/app/views/home.html
+++ b/app/views/home.html
@@ -22,8 +22,16 @@
     <div class="row">
         <div class="col-lg-12">
             <div class="panel panel-default">
-                <div class="panel-heading">
+                <div class="panel-heading panel-controls">
                     <h3 class="panel-title">Total Jobs</h3>
+                    <div class="input-group">
+                        <div class="input-group-addon"><i class="fa fa-search"></i></div>
+                        <input type="text" class="form-control"
+                               placeholder="Search for {{ home.groupKey }}"
+                               ng-model="home.searchProject"
+                               ng-model-options="{debounce: 250}"
+                               ng-change="home.onSearchChange()">
+                    </div>
                 </div>
                 <div class="panel-body">
                     <chart-line data="home.chartData" width="100%" height="250"
@@ -31,8 +39,16 @@
                 </div>
             </div>
             <div class="panel panel-default">
-                <div class="panel-heading">
+                <div class="panel-heading panel-controls">
                     <h3 class="panel-title">Job Failure Rate</h3>
+                    <div class="input-group">
+                        <div class="input-group-addon"><i class="fa fa-search"></i></div>
+                        <input type="text" class="form-control"
+                               placeholder="Search for {{ home.groupKey }}"
+                               ng-model="home.searchProject"
+                               ng-model-options="{debounce: 250}"
+                               ng-change="home.onSearchChange()">
+                    </div>
                 </div>
                 <div class="panel-body">
                     <chart-line data="home.chartDataRate" width="100%" height="250"