diff --git a/website/map-timeslider.html b/website/map-timeslider.html
new file mode 100644
index 0000000..3ad7422
--- /dev/null
+++ b/website/map-timeslider.html
@@ -0,0 +1,417 @@
+<!DOCTYPE html>
+<head>    
+    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+    
+        <script>
+            L_NO_TOUCH = false;
+            L_DISABLE_3D = false;
+        </script>
+    
+        <script src="https://cdn.jsdelivr.net/npm/leaflet@1.6.0/dist/leaflet.js"></script>
+        <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
+        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
+        <!-- timeslider -->
+        <script src="SliderControl.js"></script>
+        <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
+        <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"/>
+        <script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.2/jquery.ui.touch-punch.min.js"></script>
+
+
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.js"></script>
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet@1.6.0/dist/leaflet.css"/>
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"/>
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"/>
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"/>
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Leaflet.awesome-markers/2.0.2/leaflet.awesome-markers.css"/>
+        <link rel="stylesheet" href="https://rawcdn.githack.com/python-visualization/folium/master/folium/templates/leaflet.awesome.rotate.css"/>
+        <style>html, body {width: 100%;height: 100%;margin: 0;padding: 0;}</style>
+        <style>#map {position:absolute;top:0;bottom:0;right:0;left:0;}</style>
+    
+    <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+
+        <style>
+            #map_66b5a6264dfa4a998dc8fa32442df74c {
+                position: relative;
+                width: 100.0%;
+                height: 100.0%;
+                left: 0.0%;
+                top: 0.0%;
+            }
+        </style>
+        
+</head>
+<body>    
+    
+            <div class="folium-map" id="map_66b5a6264dfa4a998dc8fa32442df74c" ></div>
+        
+</body>
+<script>    
+
+
+
+            var map_66b5a6264dfa4a998dc8fa32442df74c = L.map(
+                "map_66b5a6264dfa4a998dc8fa32442df74c",
+                {
+                    center: [52.51619, 13.377693],
+                    crs: L.CRS.EPSG3857,
+                    zoom: 13,
+                    zoomControl: false,
+                    preferCanvas: false,
+                }
+            );
+
+            
+
+        
+    
+            var tile_layer_fc34de30640440e29213a6dc88212e3c = L.tileLayer(
+                "https://stamen-tiles-{s}.a.ssl.fastly.net/toner/{z}/{x}/{y}.png",
+                {"attribution": "Map tiles by \u003ca href=\"http://stamen.com\"\u003eStamen Design\u003c/a\u003e, under \u003ca href=\"http://creativecommons.org/licenses/by/3.0\"\u003eCC BY 3.0\u003c/a\u003e. Data by \u0026copy; \u003ca href=\"http://openstreetmap.org\"\u003eOpenStreetMap\u003c/a\u003e, under \u003ca href=\"http://www.openstreetmap.org/copyright\"\u003eODbL\u003c/a\u003e.", "detectRetina": false, "maxNativeZoom": 25, "maxZoom": 25, "minZoom": 0, "noWrap": false, "opacity": 1, "subdomains": "abc", "tms": false}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var marker_e7a96a6d6b08479ba6d17d42769e5202 = L.marker(
+                [52.513729, 13.417783],
+                {}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var icon_7e68fd836a604f9481171759656817aa = L.AwesomeMarkers.icon(
+                {"extraClasses": "fa-rotate-0", "icon": "remove", "iconColor": "white", "markerColor": "purple", "prefix": "glyphicon"}
+            );
+            marker_e7a96a6d6b08479ba6d17d42769e5202.setIcon(icon_7e68fd836a604f9481171759656817aa);
+        
+    
+        var popup_61a4a06251134ea18ad31a8baefc871a = L.popup({"maxWidth": "100%"});
+
+        
+            var html_249b1b5f870c4628a7054479a1f76450 = $(`<div id="html_249b1b5f870c4628a7054479a1f76450" style="width: 100.0%; height: 100.0%;"><strong>ARTWORK_TITLE<br>short descriptive one liner about the work<strong/></div>`)[0];
+            popup_61a4a06251134ea18ad31a8baefc871a.setContent(html_249b1b5f870c4628a7054479a1f76450);
+        
+
+        marker_e7a96a6d6b08479ba6d17d42769e5202.bindPopup(popup_61a4a06251134ea18ad31a8baefc871a)
+        ;
+
+        
+    
+    
+            marker_e7a96a6d6b08479ba6d17d42769e5202.bindTooltip(
+                `<div>
+                     ARTIST_NAME_HERE
+                 </div>`,
+                {"sticky": true}
+            );
+        
+    
+            var marker_26e0d61227da43a3baa1236bca4b5d4d = L.marker(
+                [52.461211, 13.321236],
+                {}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var icon_292d966206b84639bc1fa8173c4e505d = L.AwesomeMarkers.icon(
+                {"extraClasses": "fa-rotate-0", "icon": "remove", "iconColor": "white", "markerColor": "purple", "prefix": "glyphicon"}
+            );
+            marker_26e0d61227da43a3baa1236bca4b5d4d.setIcon(icon_292d966206b84639bc1fa8173c4e505d);
+        
+    
+        var popup_786ff33144074d16a13fac5a70c80413 = L.popup({"maxWidth": "100%"});
+
+        
+            var html_3734a12f0bcc4939ac37e24b7131c514 = $(`<div id="html_3734a12f0bcc4939ac37e24b7131c514" style="width: 100.0%; height: 100.0%;"><strong>ARTWORK_TITLE<br>short descriptive one liner about the work<strong/></div>`)[0];
+            popup_786ff33144074d16a13fac5a70c80413.setContent(html_3734a12f0bcc4939ac37e24b7131c514);
+        
+
+        marker_26e0d61227da43a3baa1236bca4b5d4d.bindPopup(popup_786ff33144074d16a13fac5a70c80413)
+        ;
+
+        
+    
+    
+            marker_26e0d61227da43a3baa1236bca4b5d4d.bindTooltip(
+                `<div>
+                     ARTIST_NAME_HERE
+                 </div>`,
+                {"sticky": true}
+            );
+        
+    
+            var marker_80f591aca16a4339926dddf57e90560e = L.marker(
+                [52.54126, 13.368985],
+                {}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var icon_2210d702cc0549b592e3c7f2fdd6cfb7 = L.AwesomeMarkers.icon(
+                {"extraClasses": "fa-rotate-0", "icon": "remove", "iconColor": "white", "markerColor": "purple", "prefix": "glyphicon"}
+            );
+            marker_80f591aca16a4339926dddf57e90560e.setIcon(icon_2210d702cc0549b592e3c7f2fdd6cfb7);
+        
+    
+        var popup_510b919682944cfbb44983a15afc56ef = L.popup({"maxWidth": "100%"});
+
+        
+            var html_ced036b517b84177a9fe276aad7d6fe5 = $(`<div id="html_ced036b517b84177a9fe276aad7d6fe5" style="width: 100.0%; height: 100.0%;"><strong>ARTWORK_TITLE<br>short descriptive one liner about the work<strong/></div>`)[0];
+            popup_510b919682944cfbb44983a15afc56ef.setContent(html_ced036b517b84177a9fe276aad7d6fe5);
+        
+
+        marker_80f591aca16a4339926dddf57e90560e.bindPopup(popup_510b919682944cfbb44983a15afc56ef)
+        ;
+
+        
+    
+    
+            marker_80f591aca16a4339926dddf57e90560e.bindTooltip(
+                `<div>
+                     ARTIST_NAME_HERE
+                 </div>`,
+                {"sticky": true}
+            );
+        
+    
+            var marker_3ace0978bcfb4182a6974fc0df0b4896 = L.marker(
+                [52.511607, 13.29455],
+                {}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var icon_43d7ff98c7db401dbc989eaeeb3e14bd = L.AwesomeMarkers.icon(
+                {"extraClasses": "fa-rotate-0", "icon": "remove", "iconColor": "white", "markerColor": "purple", "prefix": "glyphicon"}
+            );
+            marker_3ace0978bcfb4182a6974fc0df0b4896.setIcon(icon_43d7ff98c7db401dbc989eaeeb3e14bd);
+        
+    
+        var popup_d21e7ba7d872418e8b292c88e70bcb9f = L.popup({"maxWidth": "100%"});
+
+        
+            var html_920805c9df724127a26990cbf65070ff = $(`<div id="html_920805c9df724127a26990cbf65070ff" style="width: 100.0%; height: 100.0%;"><strong>ARTWORK_TITLE<br>short descriptive one liner about the work<strong/></div>`)[0];
+            popup_d21e7ba7d872418e8b292c88e70bcb9f.setContent(html_920805c9df724127a26990cbf65070ff);
+        
+
+        marker_3ace0978bcfb4182a6974fc0df0b4896.bindPopup(popup_d21e7ba7d872418e8b292c88e70bcb9f)
+        ;
+
+        
+    
+    
+            marker_3ace0978bcfb4182a6974fc0df0b4896.bindTooltip(
+                `<div>
+                     ARTIST_NAME_HERE
+                 </div>`,
+                {"sticky": true}
+            );
+        
+    
+            var marker_3089ec748547475eb4974983d6bd5fb4 = L.marker(
+                [52.501228, 13.346171],
+                {}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var icon_c176bb2c0b694c0bb18140dc46fb319b = L.AwesomeMarkers.icon(
+                {"extraClasses": "fa-rotate-0", "icon": "remove", "iconColor": "white", "markerColor": "purple", "prefix": "glyphicon"}
+            );
+            marker_3089ec748547475eb4974983d6bd5fb4.setIcon(icon_c176bb2c0b694c0bb18140dc46fb319b);
+        
+    
+        var popup_f66d8723ad934c15ad31aa2175e70928 = L.popup({"maxWidth": "100%"});
+
+        
+            var html_4b058379e7c94dce8cdfe2ba9b5aee7b = $(`<div id="html_4b058379e7c94dce8cdfe2ba9b5aee7b" style="width: 100.0%; height: 100.0%;"><strong>ARTWORK_TITLE<br>short descriptive one liner about the work<strong/></div>`)[0];
+            popup_f66d8723ad934c15ad31aa2175e70928.setContent(html_4b058379e7c94dce8cdfe2ba9b5aee7b);
+        
+
+        marker_3089ec748547475eb4974983d6bd5fb4.bindPopup(popup_f66d8723ad934c15ad31aa2175e70928)
+        ;
+
+        
+    
+    
+            marker_3089ec748547475eb4974983d6bd5fb4.bindTooltip(
+                `<div>
+                     ARTIST_NAME_HERE
+                 </div>`,
+                {"sticky": true}
+            );
+        
+    
+            var marker_8aa6d065125e49eea01ae4a1a89a1425 = L.marker(
+                [52.526517, 13.47936],
+                {}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var icon_c64f390265e34ff89cc5dc85a5ae3ec3 = L.AwesomeMarkers.icon(
+                {"extraClasses": "fa-rotate-0", "icon": "remove", "iconColor": "white", "markerColor": "purple", "prefix": "glyphicon"}
+            );
+            marker_8aa6d065125e49eea01ae4a1a89a1425.setIcon(icon_c64f390265e34ff89cc5dc85a5ae3ec3);
+        
+    
+        var popup_e88378d5d1864be9b7317c8311b61ad0 = L.popup({"maxWidth": "100%"});
+
+        
+            var html_0f913dc365cd43778e6bc5f977d0e825 = $(`<div id="html_0f913dc365cd43778e6bc5f977d0e825" style="width: 100.0%; height: 100.0%;"><strong>ARTWORK_TITLE<br>short descriptive one liner about the work<strong/></div>`)[0];
+            popup_e88378d5d1864be9b7317c8311b61ad0.setContent(html_0f913dc365cd43778e6bc5f977d0e825);
+        
+
+        marker_8aa6d065125e49eea01ae4a1a89a1425.bindPopup(popup_e88378d5d1864be9b7317c8311b61ad0)
+        ;
+
+        
+    
+    
+            marker_8aa6d065125e49eea01ae4a1a89a1425.bindTooltip(
+                `<div>
+                     ARTIST_NAME_HERE
+                 </div>`,
+                {"sticky": true}
+            );
+        
+    
+            var marker_55e3f8cd86fe4056984dac1020908704 = L.marker(
+                [52.493582, 13.448384],
+                {}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var icon_995a38895cbe41eeac1c6282de7a1f9d = L.AwesomeMarkers.icon(
+                {"extraClasses": "fa-rotate-0", "icon": "remove", "iconColor": "white", "markerColor": "purple", "prefix": "glyphicon"}
+            );
+            marker_55e3f8cd86fe4056984dac1020908704.setIcon(icon_995a38895cbe41eeac1c6282de7a1f9d);
+        
+    
+        var popup_59c224cc790645a0ab94edf5b00e1f1d = L.popup({"maxWidth": "100%"});
+
+        
+            var html_f8d5d83663794c19a47b6e1bb0a3be53 = $(`<div id="html_f8d5d83663794c19a47b6e1bb0a3be53" style="width: 100.0%; height: 100.0%;"><strong>ARTWORK_TITLE<br>short descriptive one liner about the work<strong/></div>`)[0];
+            popup_59c224cc790645a0ab94edf5b00e1f1d.setContent(html_f8d5d83663794c19a47b6e1bb0a3be53);
+        
+
+        marker_55e3f8cd86fe4056984dac1020908704.bindPopup(popup_59c224cc790645a0ab94edf5b00e1f1d)
+        ;
+
+        
+    
+    
+            marker_55e3f8cd86fe4056984dac1020908704.bindTooltip(
+                `<div>
+                     ARTIST_NAME_HERE
+                 </div>`,
+                {"sticky": true}
+            );
+        
+    
+            var marker_b320a63368694eefacaa44e83b5a3217 = L.marker(
+                [52.512555, 13.316421],
+                {}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var icon_2e9b075e6bba430e9ef62b9fdea2b25a = L.AwesomeMarkers.icon(
+                {"extraClasses": "fa-rotate-0", "icon": "remove", "iconColor": "white", "markerColor": "purple", "prefix": "glyphicon"}
+            );
+            marker_b320a63368694eefacaa44e83b5a3217.setIcon(icon_2e9b075e6bba430e9ef62b9fdea2b25a);
+        
+    
+        var popup_ebe7023b4e624dd4a2476dc5d5a9165c = L.popup({"maxWidth": "100%"});
+
+        
+            var html_53372c11bb064447b261ee8b3493ef96 = $(`<div id="html_53372c11bb064447b261ee8b3493ef96" style="width: 100.0%; height: 100.0%;"><strong>ARTWORK_TITLE<br>short descriptive one liner about the work<strong/></div>`)[0];
+            popup_ebe7023b4e624dd4a2476dc5d5a9165c.setContent(html_53372c11bb064447b261ee8b3493ef96);
+        
+
+        marker_b320a63368694eefacaa44e83b5a3217.bindPopup(popup_ebe7023b4e624dd4a2476dc5d5a9165c)
+        ;
+
+        
+    
+    
+            marker_b320a63368694eefacaa44e83b5a3217.bindTooltip(
+                `<div>
+                     ARTIST_NAME_HERE
+                 </div>`,
+                {"sticky": true}
+            );
+        
+    
+            var marker_a44c470f65ba4d2089d170e056c659c5 = L.marker(
+                [52.525817, 13.404346],
+                {}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var icon_04247df2d8614d8b83714af7a2f3919f = L.AwesomeMarkers.icon(
+                {"extraClasses": "fa-rotate-0", "icon": "remove", "iconColor": "white", "markerColor": "purple", "prefix": "glyphicon"}
+            );
+            marker_a44c470f65ba4d2089d170e056c659c5.setIcon(icon_04247df2d8614d8b83714af7a2f3919f);
+        
+    
+        var popup_5c922ab0cbf24dc8af30bd533e2a4117 = L.popup({"maxWidth": "100%"});
+
+        
+            var html_d8bb3d6aefed4d4b9fc7fa9f696a1393 = $(`<div id="html_d8bb3d6aefed4d4b9fc7fa9f696a1393" style="width: 100.0%; height: 100.0%;"><strong>ARTWORK_TITLE<br>short descriptive one liner about the work<strong/></div>`)[0];
+            popup_5c922ab0cbf24dc8af30bd533e2a4117.setContent(html_d8bb3d6aefed4d4b9fc7fa9f696a1393);
+        
+
+        marker_a44c470f65ba4d2089d170e056c659c5.bindPopup(popup_5c922ab0cbf24dc8af30bd533e2a4117)
+        ;
+
+        
+    
+    
+            marker_a44c470f65ba4d2089d170e056c659c5.bindTooltip(
+                `<div>
+                     ARTIST_NAME_HERE
+                 </div>`,
+                {"sticky": true}
+            );
+        
+    
+            var marker_12769282a2f642adb0a22c281916ef69 = L.marker(
+                [52.504926, 13.358061],
+                {}
+            ).addTo(map_66b5a6264dfa4a998dc8fa32442df74c);
+        
+    
+            var icon_9ac68ca37f8f4c7e8f4cf465fdf5ca85 = L.AwesomeMarkers.icon(
+                {"extraClasses": "fa-rotate-0", "icon": "remove", "iconColor": "white", "markerColor": "purple", "prefix": "glyphicon"}
+            );
+            marker_12769282a2f642adb0a22c281916ef69.setIcon(icon_9ac68ca37f8f4c7e8f4cf465fdf5ca85);
+        
+    
+        var popup_489cff9561604268911b7e9f86aa4391 = L.popup({"maxWidth": "100%"});
+
+        
+            var html_fe5ace1c8a2f43a6aa49f145ccb72078 = $(`<div id="html_fe5ace1c8a2f43a6aa49f145ccb72078" style="width: 100.0%; height: 100.0%;"><strong>ARTWORK_TITLE<br>short descriptive one liner about the work<strong/></div>`)[0];
+            popup_489cff9561604268911b7e9f86aa4391.setContent(html_fe5ace1c8a2f43a6aa49f145ccb72078);
+        
+
+        marker_12769282a2f642adb0a22c281916ef69.bindPopup(popup_489cff9561604268911b7e9f86aa4391)
+        ;
+
+        
+    
+    
+            marker_12769282a2f642adb0a22c281916ef69.bindTooltip(
+                `<div>
+                     ARTIST_NAME_HERE
+                 </div>`,
+                {"sticky": true}
+            );
+        
+
+            // time slider
+            // time can be gotten from the api (lastLocationUpdate)
+
+            //test markers
+            var marker1 = L.marker([52.504926, 13.358061], {time: "2020-10-09T08:00:29Z"});
+            var marker2 = L.marker([52.506926, 13.358061], {time: "2020-10-09T09:00:29Z"});
+            var marker3 = L.marker([52.508926, 13.358061], {time: "2020-10-09T10:00:29Z"});
+
+            var map = map_66b5a6264dfa4a998dc8fa32442df74c;
+            // layerGroup = L.layerGroup([marker_e7a96a6d6b08479ba6d17d42769e5202]);
+            layerGroup = L.layerGroup([marker1, marker2, marker3]);
+            var sliderControl = L.control.sliderControl({layer:layerGroup});
+            map.addControl(sliderControl);
+            sliderControl.startSlider();
+</script>
\ No newline at end of file
