Create Catalogue page

JIRA: RELENG-193

1.create a page to list all project.
2.This page can get test case list of certain project.
3.This page can show information of certain test case.

Change-Id: I79e0d3aafa99c054865a0d2948b99918802f32a7
Signed-off-by: chenjiankun <chenjiankun1@huawei.com>

7 files changed, 460 insertions, 0 deletions

diff --git a/utils/test/reporting/pages/app/views/commons/admin.html b/utils/test/reporting/pages/app/views/commons/admin.html
new file mode 100644
index 000000000..25911ac96
--- /dev/null
+++ b/utils/test/reporting/pages/app/views/commons/admin.html
@@ -0,0 +1,35 @@
+<div class="row">
+    <div classs="container">
+        <div class="col-lg-12">
+            <div class="ibox float-e-margins">
+                <div class="ibox-content">
+
+                    <div>
+                        <h3 class="font-bold no-margins">
+                            My Scenarios
+                        </h3>
+                        <small>List all your Scenarios.</small>
+                    </div>
+                    <hr>
+                    <table class="table table-striped">
+                        <tbody>
+                            <tr ng-init="count=1" ng-click="showSelect(count)" ng-repeat=" list in scenarioList">
+
+                                <td> {{list}}</td>
+                                <td> <input type="checkbox"></i>
+                                </td>
+
+                            </tr>
+                        </tbody>
+                    </table>
+
+                </div>
+
+            </div>
+        </div>
+    </div>
+    <div style="margin-top: 10px;" class="pull-right">
+        <button class="btn btn-primary" ng-click="test()">Create</button>
+        <button class="btn btn-primary" ng-click="test()">Delete</button>
+    </div>
+</div>
\ No newline at end of file
diff --git a/utils/test/reporting/pages/app/views/commons/selectTestcase.html b/utils/test/reporting/pages/app/views/commons/selectTestcase.html
new file mode 100644
index 000000000..4c9e2b346
--- /dev/null
+++ b/utils/test/reporting/pages/app/views/commons/selectTestcase.html
@@ -0,0 +1,142 @@
+<!--select page-->
+<div class="row">
+    <div classs="container">
+        <div class="col-lg-8">
+            <div class="ibox float-e-margins">
+                <div class="ibox-content">
+                    <div>
+                        <!--<span class="pull-right text-right">
+                                        <small>Average value of sales in the past month in: <strong>United states</strong></small>
+                                            <br/>
+                                            All sales: 162,862
+                                        </span>-->
+                        <h3 class="font-bold no-margins">
+                            Select Project
+                        </h3>
+                        <small>Choose a Project to Select Test cases.</small>
+                        <div class="pull-right">
+                            <selectize options="VersionOption" ng-model="VersionSelected" config="VersionConfig"></selectize>
+                        </div>
+                    </div>
+                    <hr>
+
+                    <div class="m-t-sm">
+
+                        <div class="row">
+
+                            <center>
+                                <div data-toggle="buttons" class="m-t-sm">
+                                    <label class="btn btn-outline btn-success " style=" margin-right: 5px;" ng-click="toggleSelection('FuncTest')">
+                              <input type="radio"  disabled="disabled"  >FuncTest
+                            
+                                </label>
+                                    <label class="btn btn-outline btn-success " style=" margin-right: 5px;" ng-click="toggleSelection('YardStick')">
+                              <input type="radio"  disabled="disabled" > YardStick
+                            
+                                </label>
+                                    <label class="btn btn-outline btn-success " style=" margin-right: 5px;" ng-click="toggleSelection('Bottleneck')">
+                              <input type="radio"  disabled="disabled" > Bottleneck
+                            
+                                </label>
+                                </div>
+                            </center>
+
+                        </div>
+
+                    </div>
+
+                </div>
+            </div>
+        </div>
+        <div class="col-lg-4">
+            <div class="ibox float-e-margins">
+                <div class="ibox-content">
+                    <div>
+                        <!--<span class="pull-right text-right">
+                                        <small>Average value of sales in the past month in: <strong>United states</strong></small>
+                                            <br/>
+                                            All sales: 162,862
+                                        </span>-->
+                        <h3 class="font-bold no-margins">
+                            Project Description
+
+                        </h3>
+
+
+
+                    </div>
+                    <hr>
+                    <div class="m-t-sm" ng-show="projectSelect.indexOf('YardStick')!=-1">
+                        <p>
+                            YardStick is a someting.......
+                        </p>
+                    </div>
+                    <div class="m-t-sm" ng-show="projectSelect.indexOf('FuncTest')!=-1">
+                        <p>
+                            FuncTest is a someting.......
+                        </p>
+                    </div>
+                    <div class="m-t-sm" ng-show="projectSelect.indexOf('Bottleneck')!=-1">
+                        <p>
+                            Bottleneck is a someting.......
+                        </p>
+                    </div>
+
+
+                </div>
+            </div>
+
+        </div>
+
+        <div class="col-lg-12">
+            <div class="ibox float-e-margins">
+                <div class="ibox-content">
+                    <div>
+                        <!--<span class="pull-right text-right">
+                                        <small>Average value of sales in the past month in: <strong>United states</strong></small>
+                                            <br/>
+                                            All sales: 162,862
+                                        </span>-->
+                        <h3 class="font-bold no-margins">
+                            Select Test Case
+                        </h3>
+                        <small>Choose Test Cases </small>
+
+                    </div>
+                    <hr>
+
+                    <div class="m-t-sm">
+                        <div data-toggle="buttons" class="m-t-sm" ng-show="projectSelect.indexOf('FuncTest')!=-1">
+                            <label class="btn btn-outline btn-success " style=" margin-right: 5px;" tooltips tooltip-template="FuncTest is something" tooltip-size="small" ng-repeat="case in funcTestCase" value={{case}} ng-class="{'active': case == selectedFunc}">
+                              <input type="checkbox"  disabled="disabled"  >{{case}}
+                            
+                                </label>
+                        </div>
+                        <div data-toggle="buttons" class="m-t-sm" ng-show="projectSelect.indexOf('YardStick')!=-1">
+                            <label class="btn btn-outline btn-success " style=" margin-right: 5px;" tooltips tooltip-template="FuncTest is something" tooltip-size="small" ng-repeat="case in yardStickCase" value={{case}}>
+                              <input type="checkbox"  disabled="disabled"  >{{case}}
+                            
+                                </label>
+                        </div>
+                        <div data-toggle="buttons" class="m-t-sm" ng-show="projectSelect.indexOf('Bottleneck')!=-1">
+                            <label class="btn btn-outline btn-success " style=" margin-right: 5px;" tooltips tooltip-template="FuncTest is something" tooltip-size="small" ng-repeat="case in bottleNeckCase" value={{case}} ng-class="{'active': case == selectBottle}">
+                              <input type="checkbox"  disabled="disabled"  >{{case}}
+                            
+                                </label>
+                        </div>
+
+                    </div>
+
+                </div>
+
+
+            </div>
+
+        </div>
+    </div>
+    <div style="margin-top: 10px;" class="pull-right">
+        <button class="btn btn-primary" ng-click="test()">Submit</button>
+    </div>
+
+
+</div>
\ No newline at end of file
diff --git a/utils/test/reporting/pages/app/views/commons/testCaseList.html b/utils/test/reporting/pages/app/views/commons/testCaseList.html
new file mode 100644
index 000000000..0a28b6ce6
--- /dev/null
+++ b/utils/test/reporting/pages/app/views/commons/testCaseList.html
@@ -0,0 +1,55 @@
+<div class="col-lg-12">
+    <div class="ibox float-e-margins">
+        <div class="ibox-content">
+            <div>
+                <h3 class="font-bold no-margins">
+                    Test Case List
+                </h3>
+                <small>list for test case </small>
+            </div>
+            <hr>
+
+            <table class="table table-striped">
+                <thead>
+                    <tr>
+                        <th>Scenario Name</th>
+                        <th>Owner</th>
+                        <th>Description</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td> os_nosdn_kvm_noha</td>
+                        <td>username</td>
+                        <td>balalalalala</td>
+                    </tr>
+                    <tr>
+                        <td> os_nosdn_kvm_</td>
+                        <td>username</td>
+                        <td>balalalalala</td>
+                    </tr>
+                    <tr>
+                        <td> os_nosdn_kvm_noha</td>
+                        <td>username</td>
+                        <td>balalalalala</td>
+                    </tr>
+
+                </tbody>
+
+
+
+
+
+            </table>
+
+
+
+
+
+
+
+
+
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/utils/test/reporting/pages/app/views/commons/testCaseVisual.html b/utils/test/reporting/pages/app/views/commons/testCaseVisual.html
new file mode 100644
index 000000000..9d146ba93
--- /dev/null
+++ b/utils/test/reporting/pages/app/views/commons/testCaseVisual.html
@@ -0,0 +1,126 @@
+<!--select page-->
+
+
+<div class="row">
+
+
+    <div class="row  border-bottom white-bg dashboard-header" style="border-radius: 5px 5px 5px 5px ">
+
+        <h3>OPNFV Test ecosystem
+            <small> *mouse over display test case list</small>
+        </h3>
+        <p>There are several projects dealing with integration and testing</p>
+
+        <div>
+            <img src="images/overview.png" usemap="#overview" class="img-responsive">
+            <map name="overview">
+                <area shape="rect" coords={{dovet}} alt="test" href="{{doveturl}}" onmouseover="pop(event)" ng-mouseover="myTrigger('dovetail')"/>
+               <area shape="rect" coords={{functest}} alt="test" href="{{functesturl}}"  onmouseover="pop(event)" ng-mouseover="myTrigger('functest')" />
+                <area shape="rect" coords={{yardstick}} alt="test" href="{{yardstickurl}}" onmouseover="pop(event)" ng-mouseover="myTrigger('yardstick')"/>
+                 <area shape="rect" coords={{vsperf}} alt="test" href="{{vsperfurl}}" onmouseover="pop(event)" ng-mouseover="myTrigger('vsperf')" />
+                  <area shape="rect" coords={{stor}} alt="test" href="{{storperfurl}}" onmouseover="pop(event)" ng-mouseover="myTrigger('storperf')"/>
+                   <area shape="rect" coords={{qtip}} alt="test" href="{{qtipurl}}"  onmouseover="pop(event)" ng-mouseover="myTrigger('qtip')" />
+                    <area shape="rect" coords={{bootleneck}} alt="test"  href="{{bottlenecksurl}}" onmouseover="pop(event)" ng-mouseover="myTrigger('bootlenecks')" />
+                     <area shape="rect" coords={{noPopArea1}} alt="test" onmouseover="pophide(event)"  />
+                      <area shape="rect" coords={{noPopArea2}} alt="test"  onmouseover="pophide(event)"  />
+                       <area shape="rect" coords={{noPopArea3}} alt="test"  onmouseover="pophide(event)"  />
+                
+           </map>
+
+        </div>
+    </div>
+    <div style="display: inline-block;">
+        <div class="row  border-bottom white-bg dashboard-header" style="border-radius: 5px 5px 5px 5px;margin-right:30px;margin-top:10px;display:inline-block; ">
+            <h4>Introduction</h4>
+            <p>
+                Testing is still a key challenge for OPNFV.
+            </p>
+            <p>
+                All the projects must manage their test strategy (unit, functional, security, performance)
+            </p>
+            <p>
+                Several specific test projects have been validated by TSC and already deal with:
+                <ul>
+                    <li>Define testcases</li>
+                    <li>Perform tests not covered by a single project</li>
+                    <li>Create tooling</li>
+                    <li>Study Performance end to end</li>
+                </ul>
+            </p>
+
+
+        </div>
+        <div class="row  border-bottom white-bg dashboard-header" style="border-radius: 5px 5px 5px 5px;margin-top:10px;display:inline-block;">
+            <h4>Project details</h4>
+
+            We consider the projects referenced on the wiki main page:
+            <ul>
+                <li>Functest: VIM and NFVI funcionnal testing Umbrella project for functional testing</li>
+                <li>Yardstick: Verification of the infrastructure compliance when running VNF applications.
+                    <br>Umbrella project for performance testing</li>
+                <li>Storperf: Storage Perfomance testing</li>
+                <li>VSperf: Data-plane performance testing</li>
+                <li>CPerf: Controller performance testing</li>
+                <li>Bottlenecks:Detect Bottlenecks in OPNFV solution</li>
+                <li>QTIP: Platform Performance Benchmarking</li>
+                <li>Dovetail: Test OPNFV validation criteria for use of OPNFV trademarks</li>
+            </ul>
+            </p>
+        </div>
+    </div>
+
+
+    <div id="popup" class="popup" style="width: 20%;height: 35%" dw-loading="Key">
+
+        <div ng-show="tableData.length==0">
+            <center>
+                <h3> No Data </h3>
+            </center>
+        </div>
+        <div ng-show="tableData.length!=0">
+
+            <table class="table">
+                <thead>
+                    <tr>
+                        <td>
+                            <h3>Name</h3>
+                        </td>
+                    </tr>
+                </thead>
+
+                <tbody>
+                    <tr dir-paginate="data in tableData | itemsPerPage: 8  track by $index ">
+                        <td><a ng-click="getDetail(data)"> {{data}}</a></td>
+                        <tr>
+
+                </tbody>
+
+            </table>
+
+            <center>
+                <dir-pagination-controls></dir-pagination-controls>
+            </center>
+        </div>
+
+    </div>
+
+
+    <script>
+        $(document).ready(function(e) {
+            $('img[usemap]').rwdImageMaps();
+
+        });
+
+        function pop(e) {
+            var thing = document.getElementById("popup");
+            thing.style.left = e.clientX + 'px';
+            thing.style.top = e.clientY + 'px';
+            setTimeout('$("#popup").show()', 1000);
+            return true;
+        }
+
+        function pophide(e) {
+            $('#popup').hide();
+            return true;
+        }
+    </script>
\ No newline at end of file
diff --git a/utils/test/reporting/pages/app/views/main.html b/utils/test/reporting/pages/app/views/main.html
index cca893713..6c53dc019 100644
--- a/utils/test/reporting/pages/app/views/main.html
+++ b/utils/test/reporting/pages/app/views/main.html
@@ -15,6 +15,7 @@
                     <li><a href="#page-top">Home</a></li>
                     <li><a href="#DashBoard">DashBoard</a></li>
                     <li><a ui-sref="select.selectTestCase">TestCase</a></li>
+                    <li><a ui-sref="select.testVisual">catalogue page</a></li>
                     <li><a ui-sref="login">Login</a></li>
                     <!--<li><a href="#team">Team</a></li>
                         <li><a href="#testimonials">Testimonials</a></li>
diff --git a/utils/test/reporting/pages/app/views/modal/testcasedetail.html b/utils/test/reporting/pages/app/views/modal/testcasedetail.html
new file mode 100644
index 000000000..8918b3f74
--- /dev/null
+++ b/utils/test/reporting/pages/app/views/modal/testcasedetail.html
@@ -0,0 +1,7 @@
+<h4>Test Case Detail</h4>
+<div class="hr-line-dashed"></div>
+
+
+<strong> name</strong>: {{project_name_modal}}<br>
+
+<strong>description</strong>: {{description_modal}}<br>
\ No newline at end of file
diff --git a/utils/test/reporting/pages/app/views/testcase.html b/utils/test/reporting/pages/app/views/testcase.html
new file mode 100644
index 000000000..0a4f266ae
--- /dev/null
+++ b/utils/test/reporting/pages/app/views/testcase.html
@@ -0,0 +1,94 @@
+<div id="wrapper" style="min-height:100%;">
+    <div id="page-wrapper" class="gray-bg">
+        <div class="row border-bottom white-bg">
+            <nav class="navbar navbar-static-top" role="navigation">
+                <div class="navbar-header">
+                    <button aria-controls="navbar" aria-expanded="false" data-target="#navbar" data-toggle="collapse" class="navbar-toggle collapsed" type="button">
+                    <i class="fa fa-reorder"></i>
+                </button>
+                    <a href="#" class="navbar-brand">OPNFV-TESTCASE</a>
+                </div>
+                <div class="navbar-collapse collapse" id="navbar">
+                    <ul class="nav navbar-nav">
+                        <!--<li class="active">
+                            <a aria-expanded="false" role="button" href="layouts.html"> Back to main Layout page</a>
+                        </li>-->
+                        <li class="dropdown" ng-class="{active: $state.includes('select.selectTestCase')}">
+                            <a aria-expanded="false" role="button" ui-sref="select.selectTestCase" data-toggle="dropdown"> Test Case Selection</a>
+                            <!--<ul role="menu" class="dropdown-menu">
+                                <li><a href="">Menu item</a></li>
+                                <li><a href="">Menu item</a></li>
+                                <li><a href="">Menu item</a></li>
+                                <li><a href="">Menu item</a></li>
+                            </ul>-->
+                        </li>
+                        <li class="dropdown" ng-class="{active: $state.includes('select.testlist')}">
+                            <a aria-expanded="false" role="button" ui-sref="select.testlist" data-toggle="dropdown"> Test Case List</a>
+                        </li>
+                        <li class="dropdown" ng-class="{active: $state.includes('select.admin')}">
+                            <a aria-expanded="false" role="button" data-toggle="dropdown"> Owner Center  <span class="caret"></span></a>
+                            <ul role="menu" class="dropdown-menu">
+                                <li ng-class="{active:$state.includes('select.admin')}"><a ui-sref="select.admin">My Scenarios</a></li>
+                                <li><a href="">others</a></li>
+                                <!--<li><a href="">Menu item</a></li>
+                                <li><a href="">Menu item</a></li>-->
+                            </ul>
+                        </li>
+
+                        <li class="dropdown" ng-class="{active: $state.includes('select.testVisual')}">
+                            <a aria-expanded="false" role="button" ui-sref="select.testVisual" data-toggle="dropdown"> Catalogue Page</a>
+                        </li>
+                        <li class="dropdown" ng-class="{active: $state.includes('landingpage.table')}">
+                            <a aria-expanded="false" role="button" ui-sref="landingpage.table" data-toggle="dropdown"> Landing Page</a>
+                        </li>
+
+                        <!--<li class="dropdown">
+                            <a aria-expanded="false" role="button" href="#" class="dropdown-toggle" data-toggle="dropdown"> Menu item <span class="caret"></span></a>
+                            <ul role="menu" class="dropdown-menu">
+                                <li><a href="">Menu item</a></li>
+                                <li><a href="">Menu item</a></li>
+                                <li><a href="">Menu item</a></li>
+                                <li><a href="">Menu item</a></li>
+                            </ul>
+                        </li>
+                        <li class="dropdown">
+                            <a aria-expanded="false" role="button" href="#" class="dropdown-toggle" data-toggle="dropdown"> Menu item <span class="caret"></span></a>
+                            <ul role="menu" class="dropdown-menu">
+                                <li><a href="">Menu item</a></li>
+                                <li><a href="">Menu item</a></li>
+                                <li><a href="">Menu item</a></li>
+                                <li><a href="">Menu item</a></li>
+                            </ul>
+                        </li>-->
+
+                    </ul>
+                    <ul class="nav navbar-top-links navbar-right">
+                        <li>
+                            <a ui-sref="login">
+                                <i class="fa fa-sign-in"></i> Log in
+                            </a>
+                        </li>
+                    </ul>
+                </div>
+            </nav>
+        </div>
+        <div class="wrapper wrapper-content">
+
+            <div ui-view></div>
+
+        </div>
+        <div class="footer">
+            <!--<div class="pull-right">
+                10GB of <strong>250GB</strong> Free.
+            </div>-->
+            <div>
+                <strong>Copyright</strong> OPNFV &copy; 2014-2015
+            </div>
+        </div>
+
+    </div>
+</div>
+
+<script>
+    $("document").scrollTop();
+</script>
\ No newline at end of file