From 16e27a2b446341c26381eeba76e2afc46be5943c Mon Sep 17 00:00:00 2001
From: JAMES ZHANG <jzhang300@us.ibm.com>
Date: Wed, 18 May 2016 17:06:18 -0500
Subject: [PATCH] add footer

---
 public/images/watson-logo.svg |  62 ++++++
 views/index.ejs               | 375 ++++++++++++++++++++++++++++++++++
 2 files changed, 437 insertions(+)
 create mode 100644 public/images/watson-logo.svg

diff --git a/public/images/watson-logo.svg b/public/images/watson-logo.svg
new file mode 100644
index 00000000..0b41269e
--- /dev/null
+++ b/public/images/watson-logo.svg
@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 474.2 468.2" style="enable-background:new 0 0 474.2 468.2;" xml:space="preserve">
+<style type="text/css">
+	.st0{opacity:0.7;fill:#1079BF;}
+</style>
+<path id="XMLID_2_" class="st0" d="M237.8,78.9c5.2,0,9.7-4.3,9.7-9.7V9.7c0-5.2-4.3-9.7-9.7-9.7c-5.2,0-9.7,4.3-9.7,9.7v59.4
+	C228.1,74.6,232.3,78.9,237.8,78.9 M333.8,101.4c1.2,0.7,2.9,1,4,1c3.8,0,7.1-1.9,8.8-5.2l25.9-53.7c0.7-1.2,1-2.9,1-4
+	c0-3.8-2.1-7.1-5.7-8.8c-1.2-0.7-2.9-1-4.3-1c-3.8,0-7.1,1.9-8.8,5.2l-25.9,53.5c-0.7,1.2-1,2.9-1,4
+	C328.1,96.5,330,99.8,333.8,101.4 M124.2,96.7c1.7,3.3,5.2,5.2,8.8,5.2c1.7,0,2.9-0.2,4-1c3.3-1.7,5.7-5,5.7-8.8c0-1.7-0.2-2.9-1-4
+	l-26.1-53.5c-1.7-3.3-5.2-5.2-8.8-5.2c-1.2,0-2.9,0.2-4,1c-3.8,1.7-5.7,5-5.7,8.8c0,1.2,0.2,2.9,1,4L124.2,96.7z M472.5,119.5
+	c-1.9-2.9-5-4.3-8.6-4.3c-1.9,0-3.8,0.7-5.2,1.7l-51.1,31.4c-2.9,1.9-4.8,5-4.8,8.1c0,1.9,0.2,3.3,1.7,5c1.9,3.1,5,4.8,8.6,4.8
+	c1.9,0,3.3-0.2,5.2-1.7l51.1-31.4c2.9-1.9,4.8-5,4.8-8.1C474.2,122.6,473.9,121.2,472.5,119.5 M60.6,165.6c3.3,0,6.7-1.7,8.6-4.8
+	c1-1.7,1.7-3.1,1.7-5c0-3.1-1.7-6.2-4.8-8.1L15,116.4c-1.7-1-3.3-1.7-5.2-1.7c-3.1,0-6.7,1.7-8.1,4.3c-1,1.7-1.7,3.3-1.7,5
+	c0,3.3,1.7,6.7,4.8,8.1l51.3,31.4C57,164.9,58.9,165.6,60.6,165.6 M389.8,358.7c0.2-19-3.8-40.6-12.6-62.5c11.6-4.8,21.6-10,29-15.7
+	v6.2C406,312.9,400.1,337.1,389.8,358.7 M367.3,275.6c-4.3-8.6-9.3-16.6-15.4-24.9c1-1.7,1.9-3.1,2.6-5c8.6,1,15.9,1.9,22.6,2.9
+	C374.4,257,371.3,266.3,367.3,275.6 M360.4,400.8l-5.7,5.7c-23,20.4-65.3,21.6-109.5,5c16.9-7.1,33.5-16.9,49.7-28.5
+	c3.8,2.6,8.6,4,13.5,4c13.5,0,24-10.7,24-23.8c0-3.8-1-7.1-2.1-10.2c13.8-14,25.7-28.3,35.2-43.2
+	C379.2,346.4,378.2,380.1,360.4,400.8 M237.8,453c-8.1,0-15.9-0.7-23.5-1.7c7.6-7.1,15.4-19,23.5-34.2
+	c24.5,11.6,48.5,17.6,70.1,18.1h5.2C290.5,446.6,264.9,453,237.8,453 M198.4,447.6c-4.8-2.6-7.6-9.7-9.3-20
+	c12.1-1.7,24.7-4.8,37.5-9C215,438.5,204.3,450.7,198.4,447.6 M188.4,387.2c9,6.9,18.5,13.1,27.8,18.8c-9.7,2.9-19.5,5.2-28.5,6.7
+	C187.4,404.8,187.7,396.3,188.4,387.2 M135.6,325.2c-9.7-13.8-17.1-27.8-23-41.6c18.1-7.6,41.3-15,68.9-21.9
+	c2.1,4.8,5.7,8.8,10,11.6c0,0.7-0.2,1.2-0.2,1.7c-4,17.1-7.1,33.3-10,47.8C163.9,324.8,149,325.2,135.6,325.2 M174.1,368
+	c-1.9-1.7-3.8-3.1-5.2-5c1.2-1.9,1.9-4.3,1.9-6.9c0-7.1-5.7-12.8-12.8-12.8c-2.6,0-4.3,0.7-6.7,1.9c-1.9-2.1-3.3-4-5.2-5.9
+	c10.9-0.2,21.9-1,32.3-1.7C176.7,348.5,175.1,358.7,174.1,368 M149.9,428.6c7.6,1,15.9,1.2,24.5,1c1,4.8,1.9,8.8,3.3,12.6
+	C167.7,438.3,158.2,433.8,149.9,428.6 M105.7,390.1c-10-13.8-14-32.5-11.9-53.7c13.1,2.1,28.7,2.9,44.7,2.9c2.9,3.1,5.2,6.7,8.6,9.7
+	c-1.7,2.1-2.6,4.8-2.6,7.1c0,7.1,5.9,12.8,12.8,12.8c2.6,0,5-1,6.9-2.1c2.9,2.9,5.7,5.2,8.8,7.8c-1.7,15-1.9,28-1.2,39.2
+	c-23,1.7-43.2-2.1-55.4-11.6C112.8,398.6,109.5,394.4,105.7,390.1 M72,313.1c-3.6-4.3,5.7-12.8,24.9-22.1c-5,10-8.8,20-11.6,29.7
+	C77.9,318.3,73.4,316,72,313.1 M80.3,346.4c-1.9-4.8-3.3-9.3-4.8-14.5c1.9,1,4.3,1.2,6.7,1.9C81.2,338.1,80.8,342.3,80.3,346.4
+	 M69.4,287.2c0-26.4,6.2-51.1,17.1-73.2c-0.2,19.7,4.8,41.8,14.5,64.9c-12.6,4.8-23.5,10-31.6,15.7L69.4,287.2 M127.8,325.2
+	c-12.6-0.2-23-1.2-31.6-2.6c2.1-10.2,5.7-21.4,10.7-31.8C112.6,302.2,119.7,314.1,127.8,325.2 M115.9,172.7l3.8-3.8
+	c23-21.4,64.4-20.9,107.9-2.6v0.2c-20,9.7-40.1,22.1-59.2,37.5c-1.2,1-2.6,2.1-3.8,3.1c-2.1-1.7-4.8-2.6-7.6-2.6
+	c-7.1,0-12.8,5.7-12.8,12.8c0,2.6,0.7,4.8,1.9,6.7c-15,15.2-27.8,31.4-37.8,47.5C94.1,231.4,96.7,194.3,115.9,172.7 M237.8,121.2
+	c6.2,0,12.8,0.2,18.8,1c-7.1,6.9-14.7,17.6-22.1,31.4c-24.9-10.7-49.7-15.7-71.3-15C185.5,127.3,210.7,121.2,237.8,121.2
+	 M277.7,126.6h0.2c4.3,1,7.1,8.6,9,20.4c-11.9,1.9-24.5,5.2-37.3,9.7C260.6,137.6,270.6,125.7,277.7,126.6 M289.4,185.3
+	c-10.9-8.1-21.9-15.4-33.3-21.4c11.2-3.1,22.1-5,32.5-5.9C289.4,165.8,289.4,175.1,289.4,185.3 M218.1,333.8
+	c3.8,5.2,10,8.8,16.9,8.8c9,0,16.6-5.7,19.5-13.8c3.3-0.7,7.6-1.2,11.9-2.1c-8.1,24.9-18.5,50.6-28.7,71.7
+	c-3.8,1.7-7.6,2.9-11.2,4.3c-12.6-6.2-24.9-13.8-37.3-22.8c1.2-13.8,3.1-28.5,5.7-43.5C202.9,335.7,211.2,334.7,218.1,333.8
+	 M269.4,241.8c-1.2-3.8-5-6.7-9.3-6.7c-5.2,0-9.7,4-10,9c-7.1,1-12.6,1.7-15.7,2.1c-1.2-7.8-5.9-14.7-12.6-18.8
+	c6.7-19.5,13.8-38.2,20.9-54.2c15.7,8.3,31.1,18.8,46.3,30.9c-0.7,11.6-1.9,23.8-3.3,35.9C279.6,240.9,274.4,241.6,269.4,241.8
+	 M276.8,288.2c-1,3.3-1.7,7.1-2.6,10.7c-1,4-2.1,8.1-3.1,12.1c-5.7,1-11.6,2.1-17.8,3.1c-3.1-6.9-10.2-11.6-18.5-11.6
+	c-10.2,0-18.8,7.6-20,17.1c-5.9,0.7-11.9,1.7-17.6,1.9c2.9-14.7,5.9-29.7,9.3-43.5c15,0,27.3-11.9,27.8-26.6
+	c5.7-1,10.9-1.7,16.2-2.1c1.7,3.3,5.2,5.9,9.3,5.9c5,0,9-3.3,10-8.1c5-0.7,9.7-1,14.5-1.2c-1,5.9-1.7,11.9-2.9,18.1
+	c-6.7,0.2-11.9,5.9-11.9,12.8C269.6,281.8,272.5,286.3,276.8,288.2 M179.6,256.6c-20,4.3-43.2,10-64.1,16.9
+	c8.8-15.7,20.4-30.9,34.2-45.4c2.1,1.7,4.8,2.6,7.6,2.6c7.1,0,13.1-5.7,13.1-12.8c0-2.6-1-5-1.9-6.9c1-1,1.9-1.7,2.9-2.6
+	c16.6-13.5,34.4-24.5,52.3-32.5c-6.2,13.8-12.1,29.7-17.8,47.3c-14.7,0.7-26.6,12.6-26.6,27.3C178.6,252.8,178.9,254.9,179.6,256.6
+	 M286.5,371.6c-11.9,8.6-24.7,15.7-37.3,21.6c8.6-19.7,16.9-42.5,24.5-67.9c21.4-4,50.1-10.7,76.7-19c-8.1,12.6-18.1,24.7-29.5,36.3
+	c-3.3-1.9-7.6-3.1-11.6-3.1c-13.1,0-24,10.7-24,23.8C284.8,366.3,285.6,369.2,286.5,371.6 M311.9,244.7c2.6,9.3,11.2,16.2,21.6,16.2
+	c2.1,0,4.3-0.2,6.2-1c6.7,9.3,12.1,19,16.9,28.7c-20.4,7.1-46.6,14.5-78.4,20.9c1.2-4,2.1-8.6,3.1-12.6c0.7-2.6,1.2-5,1.9-7.8
+	c6.9-0.2,12.1-5.9,12.1-12.6c0-5-2.9-9.3-6.9-11.2c1.2-6.9,2.6-13.5,3.8-20C299.1,244.9,305.5,244.7,311.9,244.7 M326.2,146.1
+	c-4.8-0.2-9.3-1-14-1c-5.2,0-10.7,0.2-16.2,1c-1-5.9-2.1-11.2-3.8-15.9C304.3,134.2,316,139.5,326.2,146.1 M313.8,228.1
+	c-1.7,3.1-2.9,6.2-2.9,10c-6.2,0.2-12.1,1-18.1,1.2c1.7-9.7,2.6-19.5,3.3-28.5c3.1,2.9,6.2,5.7,9,8.6
+	C308.4,222.4,311,225.2,313.8,228.1 M374.4,190.3c6.9,12.1,8.1,29.5,4.3,48.5c-7.1-1-15.4-1.2-23.5-1.7c-1-11.2-10.2-20.4-22.1-20.4
+	c-2.6,0-5,0.2-7.6,1.2c-2.9-3.1-5.9-6.2-8.8-9c-6.2-5.9-12.8-11.9-19-16.9c0.7-12.8,0.2-24.5-0.2-34.7c28.5-1,53,5.9,67.5,21.4
+	C368.2,182.5,371.6,186.5,374.4,190.3 M392,252.5c7.1,2.6,11.6,5.2,11.9,8.1v0.7c0,4-7.1,9.7-20.7,16.6
+	C387,269.4,390.1,260.6,392,252.5 M395.8,229.3c1.7,4.3,3.1,9,4.3,13.8c-1.9-0.7-3.8-1.2-5.7-1.7L395.8,229.3 M418.8,258.9v-0.7
+	c-5-30.9-18.1-59.4-37.3-83.1c-1-1.2-1.7-2.1-2.6-3.1c-1-1.2-2.1-2.6-3.3-3.8c-33.7-37.8-83.1-62-138.3-62
+	c-49.7,0-94.8,19.5-127.6,51.3c-1,0.7-1.9,1.7-2.9,2.6c-1,1-1.9,1.9-2.6,2.9c-31.1,32.5-50.6,76.3-50.6,124.5
+	c0,42.8,15.4,82.2,40.6,113.3c0.7,0.7,1,1.2,1.7,1.9c1,1,1.7,1.9,2.6,2.6c33.7,38.5,83.6,63,139,63c49.2,0,93.8-19,126.6-50.1
+	c1.2-1.2,2.6-2.1,3.8-3.3c1.2-1.2,2.1-2.6,3.1-3.8c31.4-32.3,50.1-75.8,50.1-123.5C421,277.7,420.5,268.4,418.8,258.9"/>
+</svg>
diff --git a/views/index.ejs b/views/index.ejs
index 5e059a97..3367f8f9 100755
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -9,6 +9,367 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta name="ct" content="<$= ct $>">
   <link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon">
+  <style>
+      .container {
+          width: auto;
+          border-top: 1px solid #D6D7D6;
+          padding-top: 20px;
+          display: none;
+      }
+
+      .left-box {
+          float: left;
+          width: 20%;
+          cursor: pointer;
+          background-color: #ffffff;
+      }
+
+      .redlink {
+          color: #d74108 !important;
+      }
+
+      .results-frame {
+          width: 79%;
+          float: left;
+          padding-top: 0px;
+          padding-left: 20px;
+      }
+
+      .ml-item-active {
+          border-right: #0078C1 20px solid;
+      }
+
+      .ml-item {
+          padding: 10px;
+          margin-top: 0px;
+          margin-bottom: 5px;
+          background: #f4f4f4;
+      }
+
+      .ml-item:hover {
+          background: #f4f4f4;
+      }
+
+      .base--button_submit {
+          width: 30%;
+      }
+
+      .int-hide {
+          display: none;
+      }
+
+      .arrowup {
+          background-image: url('images/icons/arrowup.svg');
+          background-repeat: no-repeat;
+          background-attachment: inherit;
+          background-position: 98% 50%;
+          background-color: #ececec;
+          background-size: 20px 20px;
+      }
+
+      .code {
+          background-image: url('images/icons/code.svg');
+          background-size: 20px 20px;
+          background-repeat: no-repeat;
+          background-attachment: inherit;
+      }
+
+      .arrowdown {
+          background-image: url('images/icons/arrowdown.svg');
+          background-repeat: no-repeat;
+          background-attachment: inherit;
+          background-position: 98% 50%;
+          background-color: #ececec;
+          background-size: 20px 20px;
+      }
+
+      .arrowup-main {
+          background-image: url('images/icons/arrowup.svg');
+          background-repeat: no-repeat;
+          background-attachment: inherit;
+          background-position: 95% 50%;
+          background-size: 1em;
+      }
+
+      .base--h1 {
+          font-size: 2.4em;
+      }
+
+      .arrowdown-main {
+          background-image: url('images/icons/arrowdown.svg');
+          background-repeat: no-repeat;
+          background-attachment: inherit;
+          background-position: 88% 50%;
+          background-size: 1em;
+      }
+
+      .add-1-result {
+          margin-top: 0px;
+      }
+
+      .right-float {
+          text-align: right;
+          margin-bottom: 10px;
+          margin-right: .5em;
+          margin-top: 0rem;
+          width: 30%;
+          float: right;
+      }
+
+      .btn-all-results-keywords,
+      .btn-all-results-entities,
+      .btn-all-results-concepts,
+      .btn-all-results-targetsentiment,
+      .btn-all-results-relations {
+          cursor: pointer;
+          color: #435D7E;
+          text-decoration: underline;
+          font-size: 1em;
+          float: left;
+          width: 20%;
+          text-align: left;
+          margin-top: 5px;
+          display: block;
+      }
+
+      .nested-relations {
+          font-size: .9em;
+      }
+
+      .output-header-tagline {
+          font-size: .9em;
+          margin-top: 5px;
+          padding-left: 1em;
+          padding-right: 1em;
+      }
+
+      .icon-hyperlink {
+          float: right;
+      }
+
+      .container-relations {
+          width: 100%;
+          border: 1px solid #e0e0e0;
+          border-bottom: 0px;
+      }
+
+      .element-relations {
+          border-bottom: 1px solid #e0e0e0;
+          margin-top: 0px;
+      }
+
+      .header-relations {
+          padding: 10px;
+          cursor: pointer;
+          margin-top: 0px;
+      }
+
+      .output {
+          background: #ffffff;
+      }
+
+      .hiden-relation {
+          display: none;
+      }
+
+      .content-relations {
+          background: #ffffff;
+          margin-top: 0rem;
+          margin-bottom: 1.5em;
+          display: none;
+          margin-top: 1.5em;
+      }
+
+      #div2,
+      #div3,
+      #div4,
+      #div5,
+      #div6,
+      #div7,
+      #div8,
+      #div9,
+      #div10,
+      #div11,
+      #div12,
+      #div13,
+      .base--table,
+      #div14,
+      .banner--row {
+          margin-top: 0px;
+      }
+
+      .banner--service-resource {
+          margin-left: 8%;
+      }
+
+      .base--h3 {
+          line-height: .8em;
+          padding-left: .5em;
+          padding-right: .5em;
+      }
+
+      .icon-reset:before {
+          color: #435D7E;
+      }
+
+      .icon-hyperlink--button {
+          color: #435D7E;
+      }
+
+      .base--a:visited {
+          color: #435D7E;
+      }
+
+      .base--a {
+          color: #435D7E;
+      }
+
+      .relations-headline {
+          padding-top: .3em;
+          font-size: 1.5em;
+      }
+
+      .footer-container {
+          margin-bottom: 4em;
+          margin-top: 4em;
+      }
+
+      .bottom-links {
+          margin-right: 1.5em;
+          float: left;
+          border: 2px solid black;
+          padding: .5em 2em .5em 2em;
+          color: #2e2e2e;
+          font-weight: bold;
+          background-color: #f4f4f4;
+          cursor: pointer;
+          -webkit-transition: background-color 1s;
+          -moz-transition: background-color 1s;
+          -ms-transition: background-color 1s;
+          -o-transition: background-color 1s;
+          transition: background-color 1s;
+      }
+
+      .bottom-links:hover {
+          background-color: #2e2e2e;
+          color: white;
+      }
+
+      .bottom-links.base--a {
+        color: #2e2e2e;
+        text-decoration: none;
+      }
+
+      .bottom-links.base--a:hover {
+          background-color: #2e2e2e;
+          color: white;
+      }
+
+      img.icons {
+          width: 20px;
+          margin-left: .5em;
+      }
+
+      .json-btn {
+          cursor: pointer;
+          text-decoration: underline;
+      }
+
+      .API--json {
+          color: #ffffff;
+          margin-left: 1em;
+          white-space: pre-wrap;
+      }
+
+      .input--API {
+          background-color: #323232;
+          border: 2px solid #777677;
+          margin-top: 0;
+          width: 100%;
+          height: 250px;
+          overflow: overlay;
+          font-family: "Courier New", "Lucida Console", monospace;
+          overflow: auto;
+      }
+
+      .loading-gif {
+          max-width: 246px;
+          height: auto;
+          margin: auto;
+      }
+
+      .loading--icon {
+          text-align: center;
+      }
+
+      .base--code {
+          color: white;
+      }
+
+      .base--thead {
+          font-weight: bold;
+          color: #325c80;
+          border-bottom: 1px solid #d5d6d5;
+          background-color: #ffffff;
+      }
+
+      .footer-title {
+          font-size: 2.1em;
+      }
+
+      .footer-tagline {
+          font-size: 1.4em;
+          margin-top: .5em;
+          color: #2e2e2e;
+      }
+
+      .footer-banner {
+          background-image: url('images/watson-logo.svg');
+          background-position: right;
+          background-repeat: no-repeat;
+          background-size: 30em;
+          width: 992px;
+          margin: auto;
+      }
+
+      .bottom-banner {
+          border-top: 2px solid #ececec;
+          display: block;
+      }
+
+      @media (max-width: 700px) {
+          .left-box {
+              width: 100%;
+          }
+          .ml-item {
+              padding: 10px;
+          }
+          .results-frame {
+              width: 100%;
+              padding-left: 0px;
+          }
+          .btn-all-results {
+              width: 35%;
+          }
+          .footer-banner {
+              background-image: none;
+              width: 100%;
+              margin-left: 0;
+              margin-right: 0;
+          }
+          .footer-tagline {
+              font-size: 1em;
+          }
+          .footer-title {
+              font-size: 1.5em;
+              color: #2e2e2e;
+          }
+          .footer-container {
+              margin-left: 2em;
+              margin-top: 1em;
+          }
+      }
+  </style>
 </head>
 
 <body>
@@ -236,7 +597,21 @@
       </div>
     </article>
   </div>
+  <div class="_demo--banner bottom-banner ">
+
+      <div class="footer-banner">
+          <div class="_demo--container footer-container">
+              <div class="footer-title">Next Up: Build your own app</div>
+
+              <div class="footer-tagline">Use AlchemyLanguage to get started.</div>
 
+              <a class="base--a bottom-links" href="https://www.ibm.com/smarterplanet/us/en/ibmwatson/developercloud/tone-analyzer/api/v3/" target="_blank">API Reference</a>
+              <a class="base--a bottom-links" href="http://www.ibm.com/smarterplanet/us/en/ibmwatson/developercloud/doc/tone-analyzer/index.shtml" target="_blank">Documentation</a>
+              <a class="base--a bottom-links" href="https://github.com/watson-developer-cloud/tone-analyzer-nodejs" target="_blank">Fork on Github</a>
+              <a class="base--a bottom-links" href="https://bluemix.net/deploy?repository=https://github.com/watson-developer-cloud/tone-analyzer-nodejs.git" target="_blank">Deploy on Bluemix</a>
+          </div>
+      </div>
+  </div>
 
   <script type="text/html" id="emotionBarGraphTemplate">
     <% _.each(items, function(item, key, list) { %>