diff --git a/compass/app/Http/Controllers/Controller.php b/compass/app/Http/Controllers/Controller.php
index 1576b9f..645e161 100644
--- a/compass/app/Http/Controllers/Controller.php
+++ b/compass/app/Http/Controllers/Controller.php
@@ -85,8 +85,10 @@ class Controller extends BaseController
return redirect('/');
-
-
+ return view('map', [
+ 'displayURL' => self::displayURL(),
+ 'database' => $db,
+ ]);
}
public function settings(Request $request, $name) {
diff --git a/compass/public/assets/map.css b/compass/public/assets/map.css
new file mode 100644
index 0000000..94f2cdd
--- /dev/null
+++ b/compass/public/assets/map.css
@@ -0,0 +1,23 @@
+html, body, #map {
+ height: 100%;
+}
+
+table.calendar {
+ width: 100%;
+}
+.calendar th, .calendar td {
+ text-align: center;
+ width: 14%;
+}
+.calendar td a {
+ display: block;
+ text-decoration: none;
+ color: black;
+}
+.calendar td a:hover, .calendar td a.selected:hover {
+ background: #999;
+ color: white;
+}
+.calendar td a.selected {
+ background: #6699ff;
+}
diff --git a/compass/public/assets/map.js b/compass/public/assets/map.js
new file mode 100644
index 0000000..6615339
--- /dev/null
+++ b/compass/public/assets/map.js
@@ -0,0 +1,112 @@
+var map = L.map('map', { zoomControl: false }).setView([45.516, -122.660], 14, null, null, 24);
+
+var layer = L.esri.basemapLayer("Topographic");
+layer.maxZoom = 24;
+layer.maxNativeZoom = 24;
+layer.addTo(map);
+
+new L.Control.Zoom({ position: 'bottomleft' }).addTo(map);
+
+var geojsonLineOptions = {
+ color: "#0033ff",
+ weight: 4,
+ opacity: 0.5
+};
+
+var visible_layers = [];
+var visible_data = [];
+var animatedMarker;
+var timers = [];
+
+function resetAnimation() {
+ if(animatedMarker) {
+ map.removeLayer(animatedMarker);
+ }
+ if(timers.length > 0) {
+ for(var i in timers) {
+ clearTimeout(timers[i]);
+ }
+ }
+}
+
+jQuery(function($){
+
+ $('.calendar a').click(function(evt){
+ var append = evt.altKey;
+
+ if(!append) {
+ $('.calendar a').removeClass('selected');
+ if(visible_layers.length) {
+ for(var i in visible_layers) {
+ map.removeLayer(visible_layers[i]);
+ }
+ }
+ visible_layers = [];
+ visible_data = [];
+ }
+ $(this).addClass('selected');
+
+ resetAnimation();
+
+ var db_name = $("#database").data("name");
+ var db_token = $("#database").data("token");
+
+ $.get("/api/query?map="+db_name+"&date="+$(this).data('date')+"&tz=America/Los_Angeles&token="+db_token, function(data){
+ visible_data.push(data);
+ visible_layers.push(L.geoJson(data, {
+ style: geojsonLineOptions
+ }).addTo(map));
+
+ // If the new layer is completely outside the current view, zoom the map to fit all layers
+ var layer = visible_layers[visible_layers.length - 1];
+ var is_outside = false;
+ if(!map.getBounds().intersects(layer.getBounds())) {
+ is_outside = true;
+ }
+
+ if(is_outside) {
+ var full_bounds;
+ for(var i in visible_layers) {
+ layer = visible_layers[i];
+ if(full_bounds) {
+ full_bounds.extend(layer.getBounds());
+ } else {
+ full_bounds = layer.getBounds();
+ }
+ }
+ map.fitBounds(full_bounds);
+ }
+
+ });
+
+ return false;
+ });
+
+ function pointFromGeoJSON(geo) {
+ return L.latLng(geo[1], geo[0])
+ }
+
+ $('#btn-play').click(function(){
+ console.log(visible_data[0].coordinates[0]);
+ var point = pointFromGeoJSON(visible_data[0].coordinates[0]);
+
+ resetAnimation();
+
+ animatedMarker = L.marker(point);
+ animatedMarker.addTo(map);
+
+ timers = [];
+
+ var interval = 3;
+ for(var i in visible_data[0].coordinates) {
+ (function(i){
+ timers.push(setTimeout(function(){
+ point = pointFromGeoJSON(visible_data[0].coordinates[i]);
+ animatedMarker.setLatLng(point);
+ }, interval*i));
+ })(i);
+ }
+
+ });
+
+});
diff --git a/compass/public/assets/script.js b/compass/public/assets/script.js
deleted file mode 100644
index e69de29..0000000
diff --git a/compass/public/assets/styles.css b/compass/public/assets/styles.css
index 2b1dfba..ca246bd 100644
--- a/compass/public/assets/styles.css
+++ b/compass/public/assets/styles.css
@@ -21,16 +21,19 @@
.corner-logo {
position: absolute;
+ z-index: 2000;
top: 6px;
left: 20px;
}
.logged-in {
position: absolute;
+ z-index: 2000;
top: 6px;
right: 20px;
font-size: 80%;
+ padding: 4px 16px;
}
-.logged-in span {
+.logged-in .logout {
margin-left: 16px;
}
diff --git a/compass/resources/views/layouts/map.blade.php b/compass/resources/views/layouts/map.blade.php
new file mode 100644
index 0000000..9b0ad79
--- /dev/null
+++ b/compass/resources/views/layouts/map.blade.php
@@ -0,0 +1,22 @@
+
+
+
+
+ Compass
+
+
+
+
+
+
+
+
+
+
+ @yield('content')
+
+
+
+
+
+
\ No newline at end of file
diff --git a/compass/resources/views/layouts/master.blade.php b/compass/resources/views/layouts/master.blade.php
index 9749641..23a8f0a 100644
--- a/compass/resources/views/layouts/master.blade.php
+++ b/compass/resources/views/layouts/master.blade.php
@@ -13,6 +13,5 @@
@yield('content')
-