Create Test Reporting landing page

JIRA: RELENG-165

In this patch, I do the follow things:
1.deploy tornado server(currently I haven't write any backend code,
since the backend code depend on the testapi and I need to
communicate with Serena).

2.landing page code(almostly finished. But I haven't the data, so
for now, the data this page shows is a mock json. When the testapi
and my backend code ready, this page will finally finished)

3.deployment: supervisor + nginx + tornado + angular

usage:
docker run -itd -p 8000:8000 opnfv/reporting:<tag>

visit landing page:
http://server_ip:8000/reporting/index.html

test api:
http://server_ip:8000/landing-page/filters

visit old reporting page:
http://server_ip:8000/display/master/yardstick/status-apex.html

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

1 files changed, 252 insertions, 0 deletions

diff --git a/utils/test/reporting/pages/app/views/main.html b/utils/test/reporting/pages/app/views/main.html
new file mode 100644
index 000000000..1e3fe9e5a
--- /dev/null
+++ b/utils/test/reporting/pages/app/views/main.html
@@ -0,0 +1,252 @@
+
+<div class="navbar-wrapper">
+  <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
+    <div class="container">
+      <div class="navbar-header page-scroll">
+        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false"
+          aria-controls="navbar">
+                        <span class="sr-only">Toggle navigation</span>
+                        <span class="icon-bar"></span>
+                        <span class="icon-bar"></span>
+                        <span class="icon-bar"></span>
+                    </button>
+        <a class="navbar-brand" href="index.html">OPNFV-DASHBOARD</a>
+      </div>
+      <div id="navbar" class="navbar-collapse collapse">
+        <ul class="nav navbar-nav navbar-right">
+          <li><a href="#page-top">Home</a></li>
+          <li><a href="#DashBoard">DashBoard</a></li>
+          <!--<li><a href="#team">Team</a></li>
+                        <li><a href="#testimonials">Testimonials</a></li>
+                        <li><a href="#pricing">Pricing</a></li>
+                        <li><a href="#contact">Contact</a></li>-->
+        </ul>
+      </div>
+    </div>
+  </nav>
+</div>
+
+
+<div id="inSlider" class="carousel carousel-fade" data-ride="carousel">
+  <ol class="carousel-indicators">
+    <!--<li data-target="#inSlider" data-slide-to="0" class="active"></li>
+        <li data-target="#inSlider" data-slide-to="1"></li>-->
+  </ol>
+  <div class="carousel-inner" role="listbox">
+    <div class="item active">
+      <div class="container">
+        <div class="carousel-caption">
+          <h1>OPNFV<br/> facilitates the development and evolution<br/> of NFV components across<br/> various open source ecosystems<br/>
+          </h1>
+          <!--<p>Lorem Ipsum is simply dummy text of the printing.</p>
+                    <p>-->
+          <a class="btn btn-lg btn-primary" href="#" role="button">READ MORE</a>
+          <!--<a class="caption-link" href="#" role="button">Inspinia Theme</a>-->
+          <!--</p>-->
+        </div>
+        <!--<div class="carousel-image wow zoomIn">
+                    <img src="img/landing/laptop.png" alt="laptop"/>
+                </div>-->
+      </div>
+      <!-- Set background for slide in css -->
+      <div class="header-back one" style="background: url('images/header_one.jpg') 50% 0 no-repeat;"></div>
+
+    </div>
+    <!--<div class="item">
+            <div class="container">
+                <div class="carousel-caption blank">
+                    <h1>We create meaningful <br/> interfaces that inspire.</h1>
+                    <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
+                    <p><a class="btn btn-lg btn-primary" href="#" role="button">Learn more</a></p>
+                </div>
+            </div>-->
+    <!-- Set background for slide in css -->
+    <!--<div class="header-back two"></div>
+        </div>-->
+  </div>
+  <!--<a class="left carousel-control" href="#inSlider" role="button" data-slide="prev">
+        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
+        <span class="sr-only">Previous</span>
+    </a>
+    <a class="right carousel-control" href="#inSlider" role="button" data-slide="next">
+        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
+        <span class="sr-only">Next</span>
+    </a>-->
+</div>
+
+  <section id="DashBoard" class="container services">
+        <div class="row">
+
+            <h1>
+                OPNFV’s goals are to:
+            </h1>
+            <div class="col-sm-3">
+
+                <p>Develop an integrated and tested open source platform that can be used to build NFV functionality--accelerating
+                    the introduction of new products and services</p>
+                <p><a class="navy-link" href="#" role="button">Details &raquo;</a></p>
+            </div>
+            <div class="col-sm-3">
+
+                <p>Include participation of leading end users to validate that OPNFV meets the needs of user community</p>
+                <p><a class="navy-link" href="#" role="button">Details &raquo;</a></p>
+            </div>
+            <div class="col-sm-3">
+
+                <p>Contribute to and participate in relevant open source projects that will be leveraged in the OPNFV platform;
+                    ensuring consistency, performance and interoperability among open source components</p>
+                <p><a class="navy-link" href="#" role="button">Details &raquo;</a></p>
+            </div>
+            <div class="col-sm-3">
+
+                <p>Establish an ecosystem for NFV solutions based on open standards and software to meet the needs of end users</p>
+                <p><a class="navy-link" href="#" role="button">Details &raquo;</a></p>
+            </div>
+            <div class="col-sm-3">
+
+                <p>Promote OPNFV as the preferred platform and community for open source NFV</p>
+                <p><a class="navy-link" href="#" role="button">Details &raquo;</a></p>
+            </div>
+        </div>
+    </section>
+
+
+<div ui-view></div>
+
+<section id="contact" class="gray-section contact" style="background-image: url(images/word_map.png)">
+  <div class="container">
+    <div class="row m-b-lg">
+      <div class="col-lg-12 text-center">
+        <div class="navy-line"></div>
+        <h1>Contact Us</h1>
+      </div>
+    </div>
+    <div class="row m-b-lg">
+      <div class="col-lg-3 col-lg-offset-3">
+        <address>
+          <strong><span class="navy">Press, Analyst, or Speaking Inquiries</span></strong><br/> pr@opnfv.org
+          <br/>
+        </address>
+        <address>
+          <strong><span class="navy">OPNFV Events</span></strong><br/> events@opnfv.org
+          <br/>
+        </address>
+        <address>
+          <strong><span class="navy">IT Support</span></strong><br/>opnfv-helpdesk@rt.linuxfoundation.org
+          <br/>
+        </address>
+      </div>
+
+      <div class="col-lg-4">
+        <address>
+          <strong><span class="navy">To submit and track bugs related to OPNFV</span></strong><br/>Please visit https://jira.opnfv.org
+          <br/>
+        </address>
+        <address>
+          <strong><span class="navy">Newsletter</span></strong><br/>Sign up for the OPNFV newsletter
+          <br/>
+        </address>
+        <address>
+          <strong><span class="navy">Membership</span></strong><br/>Please visit the Join as a Member page
+          <br/>
+        </address>
+
+      </div>
+    </div>
+    <div class="row">
+      <div class="col-lg-12 text-center">
+        <img src="images/logo.png" />
+
+      </div>
+    </div>
+    <div class="row">
+      <div class="col-lg-8 col-lg-offset-2 text-center m-t-lg m-b-lg">
+        <p><strong>&copy; 2016 Open Platform for NFV Project, Inc</strong><br/> A Linux Foundation Collaborative Project. All
+          Rights Reserved. Open Platform for NFV and OPNFV are trademarks of the Open Platform for NFV Project, Inc. Linux
+          Foundation is a registered trademark of The Linux Foundation. Linux is a registered trademark of Linus Torvalds.
+          Please see our terms of use, trademark policy, and privacy policy.
+        </p>
+      </div>
+    </div>
+  </div>
+</section>
+
+<script>
+
+    $(document).ready(function () {
+
+        $('body').scrollspy({
+            target: '.navbar-fixed-top',
+            offset: 80
+        });
+
+        // Page scrolling feature
+        $('a.page-scroll').bind('click', function(event) {
+            var link = $(this);
+            $('html, body').stop().animate({
+                scrollTop: $(link.attr('href')).offset().top - 50
+            }, 500);
+            event.preventDefault();
+            $("#navbar").collapse('hide');
+        });
+
+
+          console.log(  $("selectVersion").val());
+
+    });
+
+            // $(".select2_demo_1").select2();
+            // $(".select2_demo_2").select2();
+            // $(".select2_demo_3").select2({
+            //     placeholder: "Version",
+            //     allowClear: true
+            // });
+            //   $(".select2_demo_4").select2({
+            //     placeholder: "Period",
+            //     allowClear: true
+            // });
+
+
+    var config = {
+                '.chosen-select'           : {},
+                '.chosen-select-deselect'  : {allow_single_deselect:true},
+                '.chosen-select-no-single' : {disable_search_threshold:10},
+                '.chosen-select-no-results': {no_results_text:'Oops, nothing found!'},
+                '.chosen-select-width'     : {width:"95%"}
+                }
+            for (var selector in config) {
+                $(selector).chosen(config[selector]);
+            }
+
+    var cbpAnimatedHeader = (function() {
+        var docElem = document.documentElement,
+                header = document.querySelector( '.navbar-default' ),
+                didScroll = false,
+                changeHeaderOn = 200;
+        function init() {
+            window.addEventListener( 'scroll', function( event ) {
+                if( !didScroll ) {
+                    didScroll = true;
+                    setTimeout( scrollPage, 250 );
+                }
+            }, false );
+        }
+        function scrollPage() {
+            var sy = scrollY();
+            if ( sy >= changeHeaderOn ) {
+                $(header).addClass('navbar-scroll')
+            }
+            else {
+                $(header).removeClass('navbar-scroll')
+            }
+            didScroll = false;
+        }
+        function scrollY() {
+            return window.pageYOffset || docElem.scrollTop;
+        }
+        init();
+
+    })();
+
+
+</script>