1 files changed, 99 insertions, 0 deletions
diff --git a/csci4131/hw5/strap012_hw5/client/stock.html b/csci4131/hw5/strap012_hw5/client/stock.html
new file mode 100755
index 0000000..91f8493
--- /dev/null
+++ b/csci4131/hw5/strap012_hw5/client/stock.html
@@ -0,0 +1,99 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+  <style>
+      textarea {
+          width: 100%;
+          min-height: 30rem;
+          background-color: black;
+          font-family: "Lucida Console", Monaco, monospace;
+          font-size: 0.75 rem;
+          line-height: 1.2;
+          color: #fff;
+      }
+  </style>
+</head>
+
+<body>
+  <nav class="navbar navbar-default">
+   	<div class="container-fluid">
+      <ul class="nav navbar-nav">
+        <li><a href="index.html"><b>Home</b></a></li>
+        <li><a href="contacts.html"><b>Contacts</b></a></li>
+        <li><a href="addContact.html"><b>Add Contact</b></a></li>
+        <li><a href="stock.html"><b>Stock Page</b></a></li>
+      </ul>
+  	</div>
+	</nav>
+  <br><br>
+
+  <div class="container">
+    <div class="panel panel-default">
+      <div class="panel-body"><center>Welcome to Stock Page</center></div>
+    </div>
+  </div>
+
+  <div class="container">
+    <div class="row">
+      <div class="col">
+        <table class="table table-bordered table-hover">
+          <tbody>
+            <tr>
+              <td class="col-md-6">Company</td>
+              <td class="col-md-6">
+                <div class="form-group">
+                  <select name="Company">
+                    <option value="GME">Gamestop</option>
+                    <option value="MSFT">Microsoft</option>
+                    <option value="BA">Boeing Company</option>
+                    <option value="AAPL">Apple Inc</option>
+                    <option value="AMZN">Amazon</option>
+                    <option value="NVDA">NVIDIA Corporation</option>
+                  </select>
+                </div>
+              </td>
+            </tr>
+            <tr>
+              <td colspan="2">
+                <button type="button">Get Data</button>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </div>
+
+  <div class="container">
+      <div id="chartContainer"></div>
+  </div>
+
+  <div class="container">
+    <table class="table" id="StockData">
+      <thead>
+        <tr>
+          <th scope="col">Company-MetaData</th>
+          <th scope="col">Stock-Info</th>
+        </tr>
+      </thead>
+      <tbody></tbody>
+    </table>
+  </div>
+
+  <!-- <script>
+   /* TODO:
+   /    Bonus 1. Request the TIME_SERIES_DAILY endpoint of alphavantage API
+   /             for the company selected in the dropdown. Display the JSON
+   /             in the result according to the write up.
+   /    Bonus 2. Take the JSON from the alphavantage API and chart it to a
+   /             line chart using Chart.js to the chartContainer div. Ensure
+   /             the chart meets all requirements from the HW writeup.
+   /*/
+  </script> -->
+</body>
+</html>