1 files changed, 128 insertions, 0 deletions
diff --git a/html/index.html b/html/index.html
new file mode 100644
index 0000000..d72b4f5
--- /dev/null
+++ b/html/index.html
@@ -0,0 +1,128 @@
+<!--
+   index.html
+   
+   Copyright 2021 joak <joak@nospace.at>
+   
+   This program is free software; you can redistribute it and/or modify
+   it under the terms of the GNU General Public License as published by
+   the Free Software Foundation; either version 2 of the License, or
+   (at your option) any later version.
+   
+   This program is distributed in the hope that it will be useful,
+   but WITHOUT ANY WARRANTY; without even the implied warranty of
+   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+   GNU General Public License for more details.
+   
+   You should have received a copy of the GNU General Public License
+   along with this program; if not, write to the Free Software
+   Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston,
+   MA 02110-1301, USA.
+   
+   
+-->
+
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+
+<head>
+	<title>map nospace.at</title>
+	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
+	<link rel="stylesheet" href="/static/leaflet.css" />
+	<script src="/static/leaflet.js"></script>
+	<script src="/static/leaflet.ajax.min.js"></script>
+	<script src="data.geojson" type="text/javascript"></script>
+
+	<style>
+	#mapid { 
+		position: fixed;
+		top: 0px;
+		left: 0px;
+		height: 100vH; 
+		width: 100vW;
+	}
+
+	.scan{
+		width: 300px;
+	}
+	
+	.leaflet-popup-content{
+		width: 320px
+		margin: 13px 13px;
+	}
+	.leaflet-popup-content-wrapper{
+		border-radius: 0px;
+		border: 1px solid #000;
+		position: fixed;
+		text-align: center;
+		margin-bottom: 20px;
+		top: 50%;
+		left: 50%;
+		transform: translate(-50%, -50%) !important;
+		box-shadow: none;
+	}
+	.leaflet-popup-tip-container{
+		display: none;
+	}
+	a.leaflet-popup-close-button{
+		display: none;
+	}
+	</style>
+</head>
+
+<body>
+	<h1>map</h1>
+	 <div id="mapid"></div>
+
+</body>
+	<script>
+		
+	var penIcon = L.icon({
+		iconUrl: 'static/images/pen.png',
+		iconSize:     [26, 43],
+		iconAnchor:   [13, 21],
+		popupAnchor:  [-3, -76]
+	});
+	var imageIcon = L.icon({
+		iconUrl: 'static/images/image.png',
+		iconSize:     [26, 43],
+		iconAnchor:   [13, 21],
+		popupAnchor:  [0, 0]
+	});
+		
+
+	var themap = L.map('mapid').setView([48.112646337861406, 16.214275360107425], 13);
+	//L.tileLayer('http://a.tile.stamen.com/toner/{z}/{x}/{y}.png', {
+	L.tileLayer('https://stamen-tiles.a.ssl.fastly.net/toner/{z}/{x}/{y}.png	', {
+		maxZoom: 18,
+		attribution: '',
+		id: '',
+		tileSize: 512,
+		zoomOffset: -1
+	}).addTo(themap);
+	
+
+	//var geojson = new L.GeoJSON.AJAX("data.geojson");
+	//geojson.on('data:loaded').addTo(themap);
+	function popUp(f,l){
+		var out = [];
+
+		
+		if (f.properties){
+			if(f.properties.type == "sound"){
+				l.bindPopup("<audio src=files/"+f.properties.file+" controls></audio><br />");
+				l.options.icon = penIcon;
+			}
+			if(f.properties.type == "image"){
+				l.bindPopup("<img class='scan' src=files/"+f.properties.file+"><br />");
+				l.options.icon = imageIcon;
+			}
+		}
+	}
+	function theIcon(f,l){
+		console.log(f,l);
+	}
+	
+	var geojson = new L.GeoJSON.AJAX("data.geojson",{onEachFeature:popUp, icon: theIcon}).addTo(themap);
+	</script>
+</html>