[PATCH v3 1/1] Add Leaflet-Map Position selector

Sa Jan 23 17:42:15 CET 2016

Hi Dominik

Sau coole Sache! Danke für die Arbeit.

Unten sind mir zwei Sachen ins Auge gefallen.

Am Freitag, den 22.01.2016, 23:41 +0100 schrieb Dominik Heidler:
> Signed-off-by: Dominik Heidler <dominik at heidler.eu>
> ---
>  src/packages/fff/fff-web/files/www/ssl/map.html    | 88 ++++++++++++++++++++++
>  src/packages/fff/fff-web/files/www/ssl/settings.js |  8 ++
>  2 files changed, 96 insertions(+)
>  create mode 100644 src/packages/fff/fff-web/files/www/ssl/map.html
> 
> diff --git a/src/packages/fff/fff-web/files/www/ssl/map.html b/src/packages/fff/fff-web/files/www/ssl/map.html
> new file mode 100644
> index 0000000..8b70e7d
> --- /dev/null
> +++ b/src/packages/fff/fff-web/files/www/ssl/map.html
> @@ -0,0 +1,88 @@
> +<!DOCTYPE html>
> +
> +<html>
> +<head>
> +<title>Router Position auswählen</title>
> +<meta charset="utf-8"/>
> +<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.css" />
> +<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.js"></script>

Ich bin der Meinung, wir sollten kein Javascript aus einer fremden
Quelle nachladen.

> +<style type="text/css">
> +html, body, #map {
> +	width: 100%;
> +	height: 100%;
> +	margin: 0;
> +}
> +#map {
> +	cursor: default;
> +}
> +.leaflet-dragging #map {
> +	cursor: grabbing;
> +}
> +</style>
> +<script type="text/javascript">
> +var router_blue_svg = "data:image/svg+xml;base64," +
> +	"PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0" +
> +	"PSIxNCIgdmlld0JveD0iMCAwIDE0IDE0Ij48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIC0xMDM4" +
> +	"LjM2MikiPjxjaXJjbGUgY3g9IjciIGN5PSIxMDQ1LjM2MiIgcj0iNi42MTIiIGZpbGw9IiMxMjNj" +
> +	"ZmYiLz48Y2lyY2xlIGN4PSI3IiBjeT0iMTA0NS4zNjIiIHI9IjIuMDc4Ii8+PC9nPjwvc3ZnPgo=";
> +
> +var map;
> +var marker;
> +
> +function oebn0(name) {
> +	var f = window.opener.uci['system'];
> +	var i = window.opener.firstSectionID(f, "system");
> +	return window.opener.document.getElementsByName(['system', i, name].join('#'))[0];
> +}
> +
> +function add_marker(pos) {
> +	marker = L.marker(pos, {icon: L.icon({iconUrl: router_blue_svg, iconSize: [14, 14]}), draggable: true}).addTo(map);
> +	marker.on('dragend', function(e) {
> +		report_marker_pos();
> +	});
> +}
> +
> +function handle_map_click(e) {
> +	if (marker) {
> +		marker.setLatLng(e.latlng);
> +	}
> +	else {
> +		add_marker(e.latlng);
> +	}
> +	report_marker_pos();
> +}
> +
> +function report_marker_pos() {
> +	var pos = marker.getLatLng();
> +	oebn0('latitude').value = pos.lat.toFixed(8);
> +	oebn0('longitude').value = pos.lng.toFixed(8);
> +}
> +
> +function init_map() {
> +	map = L.map('map');
> +	L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {

http://wiki.openstreetmap.org/wiki/DE:Tile_usage_policy

Ich lese da raus, dass wir die Genehmigung der "System-Administrators"
benötigen.

Tim

> +		attribution: 'Map data © <a href="https://openstreetmap.org">OSM</a> contributors, ' +
> +		             '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
> +		maxNativeZoom: 19,
> +		maxZoom: 22
> +	}).addTo(map);
> +
> +	var lat = oebn0('latitude').value;
> +	var lng = oebn0('longitude').value;
> +
> +	if (lat != "" && lng != "") {
> +		add_marker([lat, lng]);
> +		map.setView([lat, lng], 18);
> +	}
> +	else {
> +		map.setView([49.46, 11.07], 10);
> +	}
> +
> +	map.on('click', handle_map_click);
> +}
> +</script>
> +</head>
> +<body onload="init_map();">
> +<div id="map"></div>
> +</body>
> +</html>
> diff --git a/src/packages/fff/fff-web/files/www/ssl/settings.js b/src/packages/fff/fff-web/files/www/ssl/settings.js
> index 00cc0aa..bf1b878 100644
> --- a/src/packages/fff/fff-web/files/www/ssl/settings.js
> +++ b/src/packages/fff/fff-web/files/www/ssl/settings.js
> @@ -57,6 +57,14 @@ function appendSetting(p, path, value, mode)
>  		b.lastChild.placeholder = "52.02713078";
>  		addInputCheck(b.lastChild, /^$|^\d{1,3}\.\d{1,8}$/, "Ung\xfcltige Eingabe. Bitte nur maximal 8 Nachkommastellen und keine Kommas verwenden.");
>  		addHelpText(b, "Die Latitude Koordinate dieses Knotens auf der Freifunk-Karte (z.B. \"52.02713078\").");
> +		var map_button = append_button(b, "Position auf Karte anzeigen / setzen", function() {
> +			window.open('/map.html', '_blank', 'location=0,status=0,scrollbars=1,width=400,height=300')
> +		});
> +		b.style["position"] = "relative";
> +		map_button.style["position"] = "absolute";
> +		map_button.style["height"] = "44px";
> +		map_button.style["margin-left"] = "5px";
> +		map_button.style["z-index"] = "-1";
>  		break;
>  	case "longitude":
>  		b = append_input(p, "GPS-Koordinaten Longitude", id, value);
> -- 
> 2.6.4
> 

-------------- nächster Teil --------------
Ein Dateianhang mit Binärdaten wurde abgetrennt...
Dateiname   : signature.asc
Dateityp    : application/pgp-signature
Dateigröße  : 473 bytes
Beschreibung: This is a digitally signed message part
URL         : <http://lists.freifunk.net/pipermail/franken-dev-freifunk.net/attachments/20160123/d85a8f1a/attachment-0002.sig>