Use Openstreet Instead of Mapbox for Front End Map (#3)

* change to openstreet

* rename vars, add back base layer

* touch up index.html formatting

static/index.html

@@ -174,26 +174,21 @@ <h1 id="title" class="title">Map Visualizer on OpenShift 3</h1>
 
 	var backends = new Map();
 
-	var mbAttr = 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
-					'<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
-					'Imagery © <a href="http://mapbox.com">Mapbox</a>',
-			mbUrl = 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1Ijoiam9yZ2Vtb3JhbGVzcG91IiwiYSI6ImNpemR4ODE2ajAwNDcycW8xY2tybTFqejEifQ.zPgwmgYDgWemYRMXHYynLQ';
+	var osAttr = 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
+					'<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
+			osUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
 
-
-	var grayscale = L.tileLayer(mbUrl, {id: 'mapbox.light', attribution: mbAttr}),
-			streets = L.tileLayer(mbUrl, {id: 'mapbox.streets', attribution: mbAttr});
+	var base = L.tileLayer(osUrl);
 
 	var map = L.map('map', {
 		center: [27.60567, -18.19336],
 		zoom: 3,
-		layers: [grayscale]
+		layers: [base]
 	});
 
 	var baseLayers = {
-		"Grayscale": grayscale,
-		"Streets": streets
-	};
-
+		"Base Layer": base
+	}
 	var overlays = {};
 
 	var controls = L.control.layers(baseLayers, overlays, {collapsed:false} );