add suggestions in result page

filter suggestions in results page
fix ui in results page

Change-Id: Id0eebd9575b5f494061130afe2c7d42c74985cec
Signed-off-by: thuva4 <tharma.thuva@gmail.com>

3 files changed, 93 insertions, 15 deletions

diff --git a/testapi/opnfv_testapi/tests/UI/e2e/resultsControllerSpec.js b/testapi/opnfv_testapi/tests/UI/e2e/resultsControllerSpec.js
index d6dfa1c..132f77d 100644
--- a/testapi/opnfv_testapi/tests/UI/e2e/resultsControllerSpec.js
+++ b/testapi/opnfv_testapi/tests/UI/e2e/resultsControllerSpec.js
@@ -143,7 +143,7 @@ describe('testing the result page for anonymous user', function () {
         browser.get(baseURL+"#/results");
         var row = element.all(by.repeater('(index, result) in ctrl.data.results')).first();
         var cells = row.all(by.tagName('td'));
-        expect(cells.get(0).getText()).toContain("5a45170bbb2092000e2643f4");
+        expect(cells.get(0).getText()).toContain("0e2643f4");
     });
 
     it('Should show the results in results page related to the filters for anonymous user ', function () {
@@ -156,11 +156,11 @@ describe('testing the result page for anonymous user', function () {
         buttonFilter.click();
         var row = element.all(by.repeater('(index, result) in ctrl.data.results')).first();
         var cells = row.all(by.tagName('td'));
-        expect(cells.get(0).getText()).toContain("5a45170bbb2092000e2643f5");
+        expect(cells.get(0).getText()).toContain("0e2643f5");
         filter.sendKeys('case');
         filterText.sendKeys('testcase')
         buttonFilter.click();
-        expect(cells.get(0).getText()).toContain("5a45170bbb2092000e2643f6");
+        expect(cells.get(0).getText()).toContain("0e2643f6");
     });
     it('Should not show the results in results page related to the filters for anonymous user ', function () {
         browser.get(baseURL+"#/results");
@@ -329,7 +329,7 @@ describe('testing the result page for user', function () {
         browser.get(baseURL+"#/results");
         var row = element.all(by.repeater('(index, result) in ctrl.data.results')).first();
         var cells = row.all(by.tagName('td'));
-        expect(cells.get(0).getText()).toContain("5a45170bbb2092000e2643f4");
+        expect(cells.get(0).getText()).toContain("0e2643f4");
     });
 
     it('Should show the results in results page related to the filters for user ', function () {
@@ -342,11 +342,11 @@ describe('testing the result page for user', function () {
         buttonFilter.click();
         var row = element.all(by.repeater('(index, result) in ctrl.data.results')).first();
         var cells = row.all(by.tagName('td'));
-        expect(cells.get(0).getText()).toContain("5a45170bbb2092000e2643f5");
+        expect(cells.get(0).getText()).toContain("0e2643f5");
         filter.sendKeys('case');
         filterText.sendKeys('testcase')
         buttonFilter.click();
-        expect(cells.get(0).getText()).toContain("5a45170bbb2092000e2643f6");
+        expect(cells.get(0).getText()).toContain("0e2643f6");
     });
 
     it('Clear the filter', function () {
@@ -359,12 +359,12 @@ describe('testing the result page for user', function () {
         buttonFilter.click();
         var row = element.all(by.repeater('(index, result) in ctrl.data.results')).first();
         var cells = row.all(by.tagName('td'));
-        expect(cells.get(0).getText()).toContain("5a45170bbb2092000e2643f5");
+        expect(cells.get(0).getText()).toContain("0e2643f5");
         var buttonClear = element(by.buttonText('Clear'));
         buttonClear.click();
         var row = element.all(by.repeater('(index, result) in ctrl.data.results')).first();
         var cells = row.all(by.tagName('td'));
-        expect(cells.get(0).getText()).toContain("5a45170bbb2092000e2643f4");
+        expect(cells.get(0).getText()).toContain("0e2643f4");
     });
     it('Should not show the results in results page related to the filters for user ', function () {
         browser.get(baseURL+"#/results");
diff --git a/testapi/opnfv_testapi/ui/components/results/results.html b/testapi/opnfv_testapi/ui/components/results/results.html
index b0c05ba..2756bb0 100644
--- a/testapi/opnfv_testapi/ui/components/results/results.html
+++ b/testapi/opnfv_testapi/ui/components/results/results.html
@@ -31,8 +31,11 @@
         </div>
         <div class="col-sm-2 pull-right" ng-class="{'hidden': ctrl.filter=='start_date' || ctrl.filter=='end_date'}">
             <span style="margin-top:6px">Search:&nbsp;&nbsp;</span>
-            <input type="text" class="form-control search" style="display:inline;width:105px;padding-left:6px;"
+            <input list="filter" name="filter" class="form-control search" style="display:inline;width:105px;padding-left:6px;"
                 ng-Model="ctrl.filterText" placeholder="Search String">
+                <datalist id="filter" ng-class="{ 'hidden' : ctrl.filterOption.length<0}">
+                    <option ng-repeat="(index, filterValue) in ctrl.filterOption " value="{{filterValue}}">{{filterValue}}</option>
+                </datalist>
         </div>
         <div class="col-sm-3 pull-right" style="width:20%" ng-class="{'hidden': ctrl.filter!='start_date'}">
             <span style="margin-top:6px">Start&nbsp;Date:&nbsp;&nbsp;</span>
@@ -64,7 +67,7 @@
         </div>
         <div class="col-md-2 row pull-right" style="width: 20%;">
             <span style="margin-top:6px">Filter:&nbsp;&nbsp;</span>
-            <select ng-model="ctrl.filter" class="form-control" style="display:inline; width:150px;">
+            <select ng-model="ctrl.filter" ng-change="ctrl.encodeFilter()" class="form-control" style="display:inline; width:150px;">
                     <option value="pod" ng-disabled="ctrl.testFilter('pod')" >Pod Name</option>
                     <option value="project" ng-disabled="ctrl.testFilter('project')" >Project Name</option>
                     <option value="case" ng-disabled="ctrl.testFilter('case')">Case Name</option>
@@ -79,9 +82,9 @@
         </div>
 
         <div class='filter-box'>
-            <div class='filter-tag' ng-repeat="(key, tag) in ctrl.tagArray">
+            <div class='filter-tag col-md-1' ng-repeat="(key, tag) in ctrl.tagArray" style="background-color: #f5f5f5;border: 1px solid #e3e3e3;/* border:  1px; */margin-top: 3px;padding: 4px;margin-left: 15px;width: 13%;">
                 {{key}}&nbsp:&nbsp{{tag}}
-                <div class='delete-tag' ng-click='ctrl.deleteTag(key)'>
+                <div class='delete-tag btn btn-danger btn-xs' ng-click='ctrl.deleteTag(key)'>
                     &times;
                 </div>
             </div>
@@ -143,4 +146,4 @@
     <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
     <span class="sr-only">Error:</span>
     {{ctrl.error}}
-</div>
+</div>
\ No newline at end of file
diff --git a/testapi/opnfv_testapi/ui/components/results/resultsController.js b/testapi/opnfv_testapi/ui/components/results/resultsController.js
index 73f3c15..24f9f55 100644
--- a/testapi/opnfv_testapi/ui/components/results/resultsController.js
+++ b/testapi/opnfv_testapi/ui/components/results/resultsController.js
@@ -56,8 +56,12 @@
         ctrl.filterList= filterList;
         ctrl.testFilter = testFilter
         ctrl.viewResult = viewResult;
+        ctrl.filter = "pod"
+        ctrl.filterValue = "pod_name"
+        ctrl.encodeFilter = encodeFilter
 
         ctrl.tagArray = {}
+        ctrl.filterOption=[]
 
         /** Mappings of Interop WG components to marketing program names. */
         ctrl.targetMappings = {
@@ -121,6 +125,75 @@
         //     ctrl.filterList();
         // }
 
+        function encodeFilter(){
+            ctrl.filterText = ''
+            ctrl.filterOption=[]
+            if(ctrl.filter=="pod" || ctrl.filter=="project" || ctrl.filter=="scenario"){
+                var reqURL = testapiApiUrl +"/" + ctrl.filter + "s"
+                ctrl.datasRequest =
+                    $http.get(reqURL).success(function (data) {
+                        ctrl.filterData = data;
+                        for(var index in ctrl.filterData[ctrl.filter + "s"]){
+                            if( ctrl.filterOption.indexOf(ctrl.filterData[ctrl.filter + "s"][index]["name"]) < 0){
+                                ctrl.filterOption.push(ctrl.filterData[ctrl.filter + "s"][index]["name"])
+                            }
+                        }
+                    }).catch(function (data) {
+                        ctrl.data = null;
+                        ctrl.showError = true;
+                        ctrl.error = data.statusText;
+                    });
+
+            }
+            else if(ctrl.filter=="case"){
+                if("project" in ctrl.tagArray){
+                    var reqURL = testapiApiUrl +"/projects/"+ctrl.tagArray["project"]+"/cases"
+                    ctrl.dataRequest =
+                                $http.get(reqURL).success(function (data) {
+                                    ctrl.filterData = data;
+                                    for(var index in ctrl.filterData.testcases){
+                                        if( ctrl.filterOption.indexOf(ctrl.filterData.testcases[index]["name"]) < 0){
+                                            ctrl.filterOption.push(ctrl.filterData.testcases[index]["name"])
+                                        }
+                                    }
+                                }).catch(function (data) {
+                                    ctrl.data = null;
+                                    ctrl.showError = true;
+                                    ctrl.error = data.statusText;
+                                });
+
+                }
+                else{
+                    var reqURL = testapiApiUrl +"/projects"
+                    ctrl.dataRequest =
+                        $http.get(reqURL).success(function (data) {
+                            ctrl.projectsData = data;
+                            for(var indexP in ctrl.projectsData.projects){
+                                reqURL = testapiApiUrl +"/projects/" + ctrl.projectsData.projects[indexP]["name"] +"/cases"
+                                ctrl.datasRequest =
+                                    $http.get(reqURL).success(function (data) {
+                                        ctrl.filterData = data;
+                                        for(var index in ctrl.filterData.testcases){
+                                            if( ctrl.filterOption.indexOf(ctrl.filterData.testcases[index]["name"]) < 0){
+                                                ctrl.filterOption.push(ctrl.filterData.testcases[index]["name"])
+                                            }
+                                        }
+                                    }).catch(function (data) {
+                                        ctrl.data = null;
+                                        ctrl.showError = true;
+                                        ctrl.error = data.statusText;
+                                    });
+                            }
+                        }).catch(function (data) {
+                            ctrl.data = null;
+                            ctrl.showError = true;
+                            ctrl.error = data.statusText;
+                        });
+                }
+
+            }
+        }
+
         function viewResult(_id){
             $state.go('result', {'_id':_id}, {reload: true});
         }
@@ -144,7 +217,7 @@
          * results.
          */
         function filterList(){
-            if(ctrl.filter && ctrl.filterText!=""){
+            if(ctrl.filter && ctrl.filterText!="" && ctrl.filterText!=undefined){
                 ctrl.tagArray[ctrl.filter] =  ctrl.filterText;
             }
             ctrl.showError = false;
@@ -176,6 +249,7 @@
                         ctrl.data = data;
                         ctrl.totalItems = ctrl.data.pagination.total_pages * ctrl.itemsPerPage;
                         ctrl.currentPage = ctrl.data.pagination.current_page;
+                        ctrl.encodeFilter();
                     }).error(function (error) {
                         ctrl.data = null;
                         ctrl.totalItems = 0;
@@ -188,6 +262,7 @@
         }
         ctrl.filterList();
 
+
         /**
          * This is called when the date filter calendar is opened. It
          * does some event handling, and sets a scope variable so the UI
@@ -211,4 +286,4 @@
             ctrl.filterList();
         }
     }
-})();
+})();
\ No newline at end of file