Merge branch 'master' of http://github.uconn.edu/arc12012/2017-CSE-Se…

…nior-Project-Team-2
arc12012 · Dec 1, 2016 · 95de890 · 95de890
2 parents 6f39a00 + 882b041
commit 95de890
Show file tree

Hide file tree

Showing 4 changed files with 140 additions and 8 deletions.
diff --git a/html/javascript/request.js b/html/javascript/request.js
@@ -120,7 +120,7 @@ function getCartItems(){
 function getUnavailableItems(){
 	var unavailable = new Array;
 	var unavailable_str = localStorage.getItem('unavailable');
-	if(unavailable_str !== null){
+	if(unavailable_str !== ""){
 		unavailable = JSON.parse(unavailable_str);
 	}
 	return unavailable;

diff --git a/html/javascript/shoppingCart.js b/html/javascript/shoppingCart.js
@@ -221,7 +221,7 @@ This function gets unavailable items from local storage.
 function getUnavailableItems(){
 	var unavailable = new Array;								//make new array
 	var unavailable_str = localStorage.getItem('unavailable');	//get the string from local storage
-	if(unavailable_str !== null){								//as long as its not null
+	if(unavailable_str !== ''){								//as long as its not null
 		unavailable = JSON.parse(unavailable_str);				//make into array
 	}
 	return unavailable;											//return value is an array

diff --git a/html/webpages/homePage.html b/html/webpages/homePage.html
@@ -78,15 +78,17 @@ <h2>Return</h2>
       </div>
       <div>
     		<a class = "divlink" href = "listingPage.html">
-              <div class = "menuOption">
-                <h2>All Items</h2>
-                <p>Just curious to see what devices we have to offer? You've come to the right place.</p>   
-              </div>
+          <div class = "menuOption">
+            <h2>All Items</h2>
+            <p>Just curious to see what devices we have to offer? You've come to the right place.</p>   
+          </div>
     		</a>
+        <a class = "divlink" href="map.html">
           <div class = "menuOption">
-            <h2>Data</h2>
-            <p>Interested in statistics related to this service? Check out this link!</p>
+            <h2>Map</h2>
+            <p>Wanna see the distribution of devices throughout the world? Check it out! HERE!</p>
           </div>
+        </a>
       </div>
     </div>
 

diff --git a/html/webpages/map.html b/html/webpages/map.html
@@ -0,0 +1,130 @@
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <meta name="description" content="">
+    <meta name="author" content="">
+
+    <title>Synchrony Financial</title>
+
+    <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/1.12.4/jquery.min.js"></script>
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+    <link rel = "stylesheet" type = "text/css" href = "../css/stylesheet.css">  
+
+    <style>
+      /* Always set the map height explicitly to define the size of the div
+       * element that contains the map. */
+      #map {
+        height: 60%;
+        width: 60%;
+        margin:0 auto;
+        border-style: solid;
+        border-width: 20px;
+      }
+
+      h2{
+        text-align: center;
+        padding-bottom: 60px;
+      }
+    </style>
+
+  </head>
+
+  <body>
+
+    <nav class="navbar navbar-inverse navbar-fixed-top">
+      <div class="container-fluid">
+        <div class="navbar-header">
+          <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="#"><img src="../imgs/synchrony-financial-logo-dlpx.png" style = "height: 100%;"></a>
+        </div>
+        <div id="navbar" class="navbar-collapse collapse" aria-expanded="false">
+          <ul class="nav navbar-nav navbar-right">
+            <li><a href="homePage.html">Home</a></li>
+            <li><a href="requestPage.html">Request Device</a></li>
+            <li><a href="#">Return Device</a></li>
+            <li><a href="listingPage.html">Device Listing</a></li>
+            <li><a href="shoppingCart.html">Shopping Cart</a></li>
+          </ul>
+        </div>
+      </div>
+    </nav>
+
+    <h2>Our Wonderful Synchrony Financial Map!</h2>
+
+    <div id="map"></div>
+    <script>
+
+      function initMap() {
+
+        var map = new google.maps.Map(document.getElementById('map'), {
+          zoom: 5,
+          center: {lat: 38.907192, lng: -77.036871}
+        });
+
+        // Create an array of alphabetical characters used to label the markers.
+        var labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
+
+        // Add some markers to the map.
+        // Note: The code uses the JavaScript Array.prototype.map() method to
+        // create an array of markers based on a given "locations" array.
+        // The map() method here has nothing to do with the Google Maps API.
+        var markers = locations.map(function(location, i) {
+          return new google.maps.Marker({
+            position: location,
+            label: labels[i % labels.length]
+          });
+        });
+
+        // Add a marker clusterer to manage the markers.
+        var markerCluster = new MarkerClusterer(map, markers,
+            {imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'});
+      }
+      var locations = [
+        {lat: 47.610150, lng: -122.201516}, //Bellevue, WA
+        {lat: 37.774929, lng: -122.419416}, //San Francisco, CA
+        {lat: 37.338208, lng: -121.886329}, //San Jose, CA
+        {lat: 33.641132, lng: -117.918669}, //Costa Mesa, CA
+        {lat: 40.760779, lng: -111.891047}, //Salt Lake City, UT
+        {lat: 33.448377, lng: -112.074037}, //Phoenix, AZ
+        {lat: 44.080543, lng: -103.231015}, //Rapid City, SD
+        {lat: 39.023617, lng: -94.69357}, //Merriam, KS
+        {lat: 39.023617, lng: -94.69357}, //Merriam, KS
+        {lat: 36.372854, lng: -94.208817}, //Bentonville, AR
+        {lat: 33.150674, lng: -96.823612}, //Frisco, TX
+        {lat: 44.953703, lng: -93.089958}, //St. Paul, MN
+        {lat: 44.953703, lng: -93.089958}, //St. Paul, MN
+        {lat: 44.953703, lng: -93.089958}, //St. Paul, MN
+        {lat: 41.878114, lng: -87.629798}, //Chicago, IL
+        {lat: 39.689504, lng: -84.168827}, //Kettering, OH
+        {lat: 34.075376, lng: -84.29409}, //Alpharetta, GA
+        {lat: 40.798947, lng: -81.378447}, //Canton, OH
+        {lat: 35.227087, lng: -80.843127}, //Charloette, NC
+        {lat: 28.538335, lng: -81.379236}, //Orlando, FL
+        {lat: 40.593964, lng: -74.604906}, //Bridgewater, NJ
+        {lat: 41.053430, lng: -73.538734}, //Stamford, CT
+        {lat: 41.053430, lng: -73.538734}, //Stamford, CT
+        {lat: 41.053430, lng: -73.538734}, //Stamford, CT
+        {lat: 41.053430, lng: -73.538734}, //Stamford, CT
+        {lat: 41.053430, lng: -73.538734}, //Stamford, CT
+        {lat: 41.053430, lng: -73.538734}, //Stamford, CT
+        {lat: 41.053430, lng: -73.538734}, //Stamford, CT
+        {lat: 42.345927, lng: -71.552287} //Marlborough, MA
+      ]
+    </script>
+    <script src="https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/markerclusterer.js">
+    </script>
+    <script async defer
+    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCndOcexx4GAOGkRKBeK1E43u_sB9gjcaU&callback=initMap">
+    </script>
+
+  </body>
+</html>