From 3e1c29b9349ea958ee326c73a66104ab21fbd53f Mon Sep 17 00:00:00 2001
From: Christian Franke <nobody@nowhere.ws>
Date: Sat, 18 Jun 2016 16:38:18 +0200
Subject: Add support for polylines

---
 web/js/eventmap.js            | 112 ++++++++++++++++++++++++++++++++++++++++--
 web/js/leaflet.contextmenu.js |   6 ++-
 2 files changed, 112 insertions(+), 6 deletions(-)

(limited to 'web/js')

diff --git a/web/js/eventmap.js b/web/js/eventmap.js
index 7302da9..b956fd2 100644
--- a/web/js/eventmap.js
+++ b/web/js/eventmap.js
@@ -16,9 +16,22 @@ function eventmap_send_update() {
 
 		var marker_info = update_doc.markers[marker_name];
 
-		marker_info.lat = marker.getLatLng().lat;
-		marker_info.lng = marker.getLatLng().lng;
-		marker_info.layer = marker.options.layer_name;
+		if (marker_name.startsWith("__polyline")) {
+			/* Polyline */
+			marker_info.points = [];
+			$.each(marker.getLatLngs(), function(index, point) {
+				marker_info.points.push({
+					lat: point.lat,
+					lng: point.lng
+				});
+			});
+			marker_info.layer = marker.options.layer_name;
+		} else {
+			/* Regular marker */
+			marker_info.lat = marker.getLatLng().lat;
+			marker_info.lng = marker.getLatLng().lng;
+			marker_info.layer = marker.options.layer_name;
+		}
 	});
 
 	$.ajax({
@@ -38,12 +51,46 @@ function LoadingException(message) {
 	this.name = "LoadingException";
 }
 
+function process_polyline_update(marker_name, marker_info) {
+	if (marker_name in marker_store) {
+		var marker = marker_store[marker_name];
+
+		/* TODO: compare array, update only on change*/
+		marker.setLatLngs(marker_info.points);
+		marker.options.sync_id = marker_store_sync_id;
+		console.log("Kept polyline '" + marker_name + "'.");
+	} else {
+		var marker = L.polyline(marker_info.points);
+		var target_layer_group;
+
+		marker.options.label_text = marker_name;
+		marker_store[marker_name] = marker;
+
+		marker.options.layer_name = marker_info.layer;
+		marker.options.label_text = marker_name;
+		target_layer_group = layers[marker_info.layer];
+		if (target_layer_group === undefined) {
+			throw new LoadingException("Don't know about layer '"
+					+ marker_info.layer + "'!");
+		}
+
+		target_layer_group.getLayers()[1].addLayer(marker);
+		marker.options.sync_id = marker_store_sync_id;
+		add_contextmenu(marker);
+		console.log("Added polyline '" + marker_name + "'.");
+	}
+}
+
 function eventmap_process_update(data) {
 	if (typeof data == "string")
 		data = JSON.parse(data);
 	marker_store_sync_id = data['sync-id'];
 	if (data['markers'] !== undefined)
 	    $.each(data['markers'], function(marker_name, marker_info) {
+		if (marker_name.startsWith("__polyline"))
+			return process_polyline_update(marker_name, marker_info);
+
+		/* Regular marker */
 		if (marker_name in marker_store) {
 			var marker = marker_store[marker_name];
 			var marker_pos = marker.getLatLng();
@@ -119,7 +166,25 @@ function delete_marker(marker) {
 	eventmap_send_update();
 }
 
+function add_polyline_contextmenu(marker) {
+	marker.bindContextMenu({
+		contextmenu: true,
+		contextmenuItems: [
+			{
+				text: 'Delete',
+				callback: function() {
+					delete_marker(marker);
+				}
+			}
+		]
+	});
+}
+
 function add_contextmenu(marker) {
+	if (marker.options.label_text !== undefined
+	    && marker.options.label_text.startsWith("__polyline"))
+		return add_polyline_contextmenu(marker);
+
 	marker.options.contextmenu = true;
 	marker.options.contextmenuItems = [
 		{
@@ -175,6 +240,10 @@ function rename_marker(marker) {
 
 	do {
 		new_label_text = prompt("Please enter name", label_text);
+		if (new_label_text.startsWith("__")) {
+			alert("This name is not valid!");
+			continue;
+		}
 		if (new_label_text in marker_store
 		    && marker_store[new_label_text] !== marker) {
 			alert("This name is not unique!");
@@ -249,6 +318,33 @@ function marker_labels_calc_nohide(e) {
 	});
 }
 
+function polyline_added(e) {
+	var created_object_type = e.layerType;
+	var created_object = e.layer;
+
+	$.each(layers, function(layer_name, layer_object) {
+		if (!map.hasLayer(layer_object))
+			return true;
+
+		layer_object.getLayers()[1].addLayer(created_object);
+		created_object.options.layer_name = layer_name;
+
+		var index = 0;
+		var marker_name;
+
+		do {
+			marker_name = "__polyline_" + layer_name + "_" + index;
+			index++;
+		} while (marker_name in marker_store);
+
+		marker_store[marker_name] = created_object;
+		marker.options.label_text = marker_name;
+		add_contextmenu(marker);
+		eventmap_send_update();
+		return false;
+	});
+}
+
 $(function() {
 	$("#progress").html("Initializing map...");
 	map = L.map('map', {
@@ -262,7 +358,7 @@ $(function() {
 
 	draw_control = new L.Control.Draw({
 		draw: {
-			polyline: false,
+			polyline: true,
 			polygon: false,
 			rectangle: false,
 			circle: false,
@@ -276,6 +372,8 @@ $(function() {
 			var records = [];
 
 			for (var key in marker_store) {
+				if (key.startsWith("__polyline"))
+					continue;
 				if (key.toLowerCase().indexOf(input_lower) != 0)
 					continue;
 
@@ -312,7 +410,13 @@ $(function() {
 		var created_object_type = e.layerType;
 		var created_object = e.layer;
 
+		if (created_object_type === 'polyline') {
+			return polyline_added(e);
+		}
+		
 		if (created_object_type !== 'marker') {
+			console.log("Other Type drawn:");
+			console.log(created_object_type);
 			return;
 		}
 
diff --git a/web/js/leaflet.contextmenu.js b/web/js/leaflet.contextmenu.js
index 05e25c5..7975c09 100644
--- a/web/js/leaflet.contextmenu.js
+++ b/web/js/leaflet.contextmenu.js
@@ -1,5 +1,7 @@
 /*
 	Leaflet.contextmenu, a context menu for Leaflet.
-	(c) 2013, Adam Ratcliffe, GeoSmart Maps Limited
+	(c) 2015, Adam Ratcliffe, GeoSmart Maps Limited
+       
+        @preserve
 */
-L.Map.mergeOptions({contextmenuItems:[]});L.Map.ContextMenu=L.Handler.extend({statics:{BASE_CLS:"leaflet-contextmenu"},initialize:function(map){L.Handler.prototype.initialize.call(this,map);this._items=[];this._visible=false;var container=this._container=L.DomUtil.create("div",L.Map.ContextMenu.BASE_CLS,map._container);container.style.zIndex=1e4;container.style.position="absolute";if(map.options.contextmenuWidth){container.style.width=map.options.contextmenuWidth+"px"}this._createItems();L.DomEvent.on(container,"click",L.DomEvent.stop).on(container,"mousedown",L.DomEvent.stop).on(container,"dblclick",L.DomEvent.stop).on(container,"contextmenu",L.DomEvent.stop)},addHooks:function(){L.DomEvent.on(document,"keydown",this._onKeyDown,this);this._map.on({contextmenu:this._show,mouseout:this._hide,mousedown:this._hide,movestart:this._hide,zoomstart:this._hide},this)},removeHooks:function(){L.DomEvent.off(document,"keydown",this._onKeyDown,this);this._map.off({contextmenu:this._show,mouseout:this._hide,mousedown:this._hide,movestart:this._hide,zoomstart:this._hide},this)},showAt:function(point,data){if(point instanceof L.LatLng){point=this._map.latLngToContainerPoint(point)}this._showAtPoint(point,data)},hide:function(){this._hide()},addItem:function(options){return this.insertItem(options)},insertItem:function(options,index){index=index!==undefined?index:this._items.length;var item=this._createItem(this._container,options,index);this._items.push(item);this._sizeChanged=true;this._map.fire("contextmenu.additem",{contextmenu:this,el:item.el,index:index});return item.el},removeItem:function(item){var container=this._container;if(!isNaN(item)){item=container.children[item]}if(item){this._removeItem(L.Util.stamp(item));this._sizeChanged=true;this._map.fire("contextmenu.removeitem",{contextmenu:this,el:item})}},removeAllItems:function(){var item;while(this._container.children.length){item=this._container.children[0];this._removeItem(L.Util.stamp(item))}},setDisabled:function(item,disabled){var container=this._container,itemCls=L.Map.ContextMenu.BASE_CLS+"-item";if(!isNaN(item)){item=container.children[item]}if(item&&L.DomUtil.hasClass(item,itemCls)){if(disabled){L.DomUtil.addClass(item,itemCls+"-disabled");this._map.fire("contextmenu.disableitem",{contextmenu:this,el:item})}else{L.DomUtil.removeClass(item,itemCls+"-disabled");this._map.fire("contextmenu.enableitem",{contextmenu:this,el:item})}}},isVisible:function(){return this._visible},_createItems:function(){var itemOptions=this._map.options.contextmenuItems,item,i,l;for(i=0,l=itemOptions.length;i<l;i++){this._items.push(this._createItem(this._container,itemOptions[i]))}},_createItem:function(container,options,index){if(options.separator||options==="-"){return this._createSeparator(container,index)}var itemCls=L.Map.ContextMenu.BASE_CLS+"-item",cls=options.disabled?itemCls+" "+itemCls+"-disabled":itemCls,el=this._insertElementAt("a",cls,container,index),callback=this._createEventHandler(el,options.callback,options.context),html="";if(options.icon){html='<img class="'+L.Map.ContextMenu.BASE_CLS+'-icon" src="'+options.icon+'"/>'}else if(options.iconCls){html='<span class="'+L.Map.ContextMenu.BASE_CLS+"-icon "+options.iconCls+'"></span>'}el.innerHTML=html+options.text;el.href="#";L.DomEvent.on(el,"click",L.DomEvent.stopPropagation).on(el,"mousedown",L.DomEvent.stopPropagation).on(el,"dblclick",L.DomEvent.stopPropagation).on(el,"click",L.DomEvent.preventDefault).on(el,"click",callback);return{id:L.Util.stamp(el),el:el,callback:callback}},_removeItem:function(id){var item,el,i,l;for(i=0,l=this._items.length;i<l;i++){item=this._items[i];if(item.id===id){el=item.el;callback=item.callback;if(callback){L.DomEvent.off(el,"click",L.DomEvent.stopPropagation).off(el,"mousedown",L.DomEvent.stopPropagation).off(el,"dblclick",L.DomEvent.stopPropagation).off(el,"click",L.DomEvent.preventDefault).off(el,"click",item.callback)}this._container.removeChild(el);this._items.splice(i,1);return item}}return null},_createSeparator:function(container,index){var el=this._insertElementAt("div",L.Map.ContextMenu.BASE_CLS+"-separator",container,index);return{id:L.Util.stamp(el),el:el}},_createEventHandler:function(el,func,context){var me=this,map=this._map,disabledCls=L.Map.ContextMenu.BASE_CLS+"-item-disabled";return function(e){if(L.DomUtil.hasClass(el,disabledCls)){return}me._hide();func.call(context||map,me._showLocation);me._map.fire("contextmenu:select",{contextmenu:me,el:el})}},_insertElementAt:function(tagName,className,container,index){var refEl,el=document.createElement(tagName);el.className=className;if(index!==undefined){refEl=container.children[index]}if(refEl){container.insertBefore(el,refEl)}else{container.appendChild(el)}return el},_show:function(e){this._showAtPoint(e.containerPoint)},_showAtPoint:function(pt,data){if(!this._visible&&this._items.length){var map=this._map,layerPoint=map.containerPointToLayerPoint(pt),latlng=map.layerPointToLatLng(layerPoint),event={contextmenu:this};if(data){event=L.extend(data,event)}this._showLocation={latlng:latlng,layerPoint:layerPoint,containerPoint:pt};this._setPosition(pt);this._container.style.display="block";this._visible=true;this._map.fire("contextmenu.show",event)}},_hide:function(){if(this._visible){this._container.style.display="none";this._visible=false;this._map.fire("contextmenu.hide",{contextmenu:this})}},_setPosition:function(pt){var mapSize=this._map.getSize(),container=this._container,containerSize=this._getElementSize(container);container._leaflet_pos=pt;if(pt.x+containerSize.x>mapSize.x){container.style.left="auto";container.style.right=mapSize.x-pt.x+"px"}else{container.style.left=pt.x+"px";container.style.right="auto"}if(pt.y+containerSize.y>mapSize.y){container.style.top="auto";container.style.bottom=mapSize.y-pt.y+"px"}else{container.style.top=pt.y+"px";container.style.bottom="auto"}},_getElementSize:function(el){var size=this._size;if(!size||this._sizeChanged){size={};el.style.left="-999999px";el.style.right="auto";el.style.display="block";size.x=el.offsetWidth;size.y=el.offsetHeight;el.style.left="auto";el.style.display="none";this._sizeChanged=false}return size},_onKeyDown:function(e){var key=e.keyCode;if(key===27&&this._visible){this._hide()}}});L.Map.addInitHook("addHandler","contextmenu",L.Map.ContextMenu);L.Mixin.ContextMenu={_initContextMenu:function(){this._items=[];this.on("contextmenu",this._showContextMenu,this)},_showContextMenu:function(e){var itemOptions,pt,i,l;if(this._map.contextmenu){pt=this._map.mouseEventToContainerPoint(e.originalEvent);for(i=0,l=this.options.contextmenuItems.length;i<l;i++){itemOptions=this.options.contextmenuItems[i];this._items.push(this._map.contextmenu.insertItem(itemOptions,itemOptions.index))}this._map.once("contextmenu.hide",this._hideContextMenu,this);this._map.contextmenu.showAt(pt,{relatedTarget:this})}},_hideContextMenu:function(){var i,l;for(i=0,l=this._items.length;i<l;i++){this._map.contextmenu.removeItem(this._items[i])}this._items.length=0}};L.Marker.mergeOptions({contextmenu:false,contextmenuItems:[]});L.Marker.addInitHook(function(){if(this.options.contextmenu){this._initContextMenu()}});L.Marker.include(L.Mixin.ContextMenu);
+(function(t){var e;if(typeof define==="function"&&define.amd){define(["leaflet"],t)}else if(typeof module!=="undefined"){e=require("leaflet");module.exports=t(e)}else{if(typeof window.L==="undefined"){throw new Error("Leaflet must be loaded first")}t(window.L)}})(function(t){t.Map.mergeOptions({contextmenuItems:[]});t.Map.ContextMenu=t.Handler.extend({_touchstart:t.Browser.msPointer?"MSPointerDown":t.Browser.pointer?"pointerdown":"touchstart",statics:{BASE_CLS:"leaflet-contextmenu"},initialize:function(e){t.Handler.prototype.initialize.call(this,e);this._items=[];this._visible=false;var n=this._container=t.DomUtil.create("div",t.Map.ContextMenu.BASE_CLS,e._container);n.style.zIndex=1e4;n.style.position="absolute";if(e.options.contextmenuWidth){n.style.width=e.options.contextmenuWidth+"px"}this._createItems();t.DomEvent.on(n,"click",t.DomEvent.stop).on(n,"mousedown",t.DomEvent.stop).on(n,"dblclick",t.DomEvent.stop).on(n,"contextmenu",t.DomEvent.stop)},addHooks:function(){t.DomEvent.on(document,t.Browser.touch?this._touchstart:"mousedown",this._onMouseDown,this).on(document,"keydown",this._onKeyDown,this);this._map.on({contextmenu:this._show,mousedown:this._hide,movestart:this._hide,zoomstart:this._hide},this);t.DomEvent.on(this._map.getContainer(),"mouseleave",this._hide,this)},removeHooks:function(){t.DomEvent.off(document,t.Browser.touch?this._touchstart:"mousedown",this._onMouseDown,this).off(document,"keydown",this._onKeyDown,this);this._map.off({contextmenu:this._show,mousedown:this._hide,movestart:this._hide,zoomstart:this._hide},this);t.DomEvent.off(this._map.getContainer(),"mouseleave",this._hide,this)},showAt:function(e,n){if(e instanceof t.LatLng){e=this._map.latLngToContainerPoint(e)}this._showAtPoint(e,n)},hide:function(){this._hide()},addItem:function(t){return this.insertItem(t)},insertItem:function(t,e){e=e!==undefined?e:this._items.length;var n=this._createItem(this._container,t,e);this._items.push(n);this._sizeChanged=true;this._map.fire("contextmenu.additem",{contextmenu:this,el:n.el,index:e});return n.el},removeItem:function(e){var n=this._container;if(!isNaN(e)){e=n.children[e]}if(e){this._removeItem(t.Util.stamp(e));this._sizeChanged=true;this._map.fire("contextmenu.removeitem",{contextmenu:this,el:e})}},removeAllItems:function(){var e;while(this._container.children.length){e=this._container.children[0];this._removeItem(t.Util.stamp(e))}},hideAllItems:function(){var t,e,n;for(e=0,n=this._items.length;e<n;e++){t=this._items[e];t.el.style.display="none"}},showAllItems:function(){var t,e,n;for(e=0,n=this._items.length;e<n;e++){t=this._items[e];t.el.style.display=""}},setDisabled:function(e,n){var i=this._container,o=t.Map.ContextMenu.BASE_CLS+"-item";if(!isNaN(e)){e=i.children[e]}if(e&&t.DomUtil.hasClass(e,o)){if(n){t.DomUtil.addClass(e,o+"-disabled");this._map.fire("contextmenu.disableitem",{contextmenu:this,el:e})}else{t.DomUtil.removeClass(e,o+"-disabled");this._map.fire("contextmenu.enableitem",{contextmenu:this,el:e})}}},isVisible:function(){return this._visible},_createItems:function(){var t=this._map.options.contextmenuItems,e,n,i;for(n=0,i=t.length;n<i;n++){this._items.push(this._createItem(this._container,t[n]))}},_createItem:function(e,n,i){if(n.separator||n==="-"){return this._createSeparator(e,i)}var o=t.Map.ContextMenu.BASE_CLS+"-item",s=n.disabled?o+" "+o+"-disabled":o,h=this._insertElementAt("a",s,e,i),a=this._createEventHandler(h,n.callback,n.context,n.hideOnSelect),r="";if(n.icon){r='<img class="'+t.Map.ContextMenu.BASE_CLS+'-icon" src="'+n.icon+'"/>'}else if(n.iconCls){r='<span class="'+t.Map.ContextMenu.BASE_CLS+"-icon "+n.iconCls+'"></span>'}h.innerHTML=r+n.text;h.href="#";t.DomEvent.on(h,"mouseover",this._onItemMouseOver,this).on(h,"mouseout",this._onItemMouseOut,this).on(h,"mousedown",t.DomEvent.stopPropagation).on(h,"click",a);return{id:t.Util.stamp(h),el:h,callback:a}},_removeItem:function(e){var n,i,o,s,h;for(o=0,s=this._items.length;o<s;o++){n=this._items[o];if(n.id===e){i=n.el;h=n.callback;if(h){t.DomEvent.off(i,"mouseover",this._onItemMouseOver,this).off(i,"mouseover",this._onItemMouseOut,this).off(i,"mousedown",t.DomEvent.stopPropagation).off(i,"click",h)}this._container.removeChild(i);this._items.splice(o,1);return n}}return null},_createSeparator:function(e,n){var i=this._insertElementAt("div",t.Map.ContextMenu.BASE_CLS+"-separator",e,n);return{id:t.Util.stamp(i),el:i}},_createEventHandler:function(e,n,i,o){var s=this,h=this._map,a=t.Map.ContextMenu.BASE_CLS+"-item-disabled",o=o!==undefined?o:true;return function(r){if(t.DomUtil.hasClass(e,a)){return}if(o){s._hide()}if(n){n.call(i||h,s._showLocation)}s._map.fire("contextmenu:select",{contextmenu:s,el:e})}},_insertElementAt:function(t,e,n,i){var o,s=document.createElement(t);s.className=e;if(i!==undefined){o=n.children[i]}if(o){n.insertBefore(s,o)}else{n.appendChild(s)}return s},_show:function(t){this._showAtPoint(t.containerPoint)},_showAtPoint:function(e,n){if(this._items.length){var i=this._map,o=i.containerPointToLayerPoint(e),s=i.layerPointToLatLng(o),h={contextmenu:this};if(n){h=t.extend(n,h)}this._showLocation={latlng:s,layerPoint:o,containerPoint:e};if(n&&n.relatedTarget){this._showLocation.relatedTarget=n.relatedTarget}this._setPosition(e);if(!this._visible){this._container.style.display="block";this._visible=true}else{this._setPosition(e)}this._map.fire("contextmenu.show",h)}},_hide:function(){if(this._visible){this._visible=false;this._container.style.display="none";this._map.fire("contextmenu.hide",{contextmenu:this})}},_setPosition:function(e){var n=this._map.getSize(),i=this._container,o=this._getElementSize(i),s;if(this._map.options.contextmenuAnchor){s=t.point(this._map.options.contextmenuAnchor);e=e.add(s)}i._leaflet_pos=e;if(e.x+o.x>n.x){i.style.left="auto";i.style.right=Math.max(n.x-e.x,0)+"px"}else{i.style.left=Math.max(e.x,0)+"px";i.style.right="auto"}if(e.y+o.y>n.y){i.style.top="auto";i.style.bottom=Math.max(n.y-e.y,0)+"px"}else{i.style.top=Math.max(e.y,0)+"px";i.style.bottom="auto"}},_getElementSize:function(t){var e=this._size,n=t.style.display;if(!e||this._sizeChanged){e={};t.style.left="-999999px";t.style.right="auto";t.style.display="block";e.x=t.offsetWidth;e.y=t.offsetHeight;t.style.left="auto";t.style.display=n;this._sizeChanged=false}return e},_onMouseDown:function(t){this._hide()},_onKeyDown:function(t){var e=t.keyCode;if(e===27){this._hide()}},_onItemMouseOver:function(e){t.DomUtil.addClass(e.target||e.srcElement,"over")},_onItemMouseOut:function(e){t.DomUtil.removeClass(e.target||e.srcElement,"over")}});t.Map.addInitHook("addHandler","contextmenu",t.Map.ContextMenu);t.Mixin.ContextMenu={bindContextMenu:function(e){t.setOptions(this,e);this._initContextMenu();return this},unbindContextMenu:function(){this.off("contextmenu",this._showContextMenu,this);return this},_initContextMenu:function(){this._items=[];this.on("contextmenu",this._showContextMenu,this)},_showContextMenu:function(t){var e,n,i,o;if(this._map.contextmenu){n=this._map.mouseEventToContainerPoint(t.originalEvent);if(!this.options.contextmenuInheritItems){this._map.contextmenu.hideAllItems()}for(i=0,o=this.options.contextmenuItems.length;i<o;i++){e=this.options.contextmenuItems[i];this._items.push(this._map.contextmenu.insertItem(e,e.index))}this._map.once("contextmenu.hide",this._hideContextMenu,this);this._map.contextmenu.showAt(n,{relatedTarget:this})}},_hideContextMenu:function(){var t,e;for(t=0,e=this._items.length;t<e;t++){this._map.contextmenu.removeItem(this._items[t])}this._items.length=0;if(!this.options.contextmenuInheritItems){this._map.contextmenu.showAllItems()}}};var e=[t.Marker,t.Path],n={contextmenu:false,contextmenuItems:[],contextmenuInheritItems:true},i,o,s;for(o=0,s=e.length;o<s;o++){i=e[o];if(!i.prototype.options){i.prototype.options=n}else{i.mergeOptions(n)}i.addInitHook(function(){if(this.options.contextmenu){this._initContextMenu()}});i.include(t.Mixin.ContextMenu)}return t.Map.ContextMenu});
\ No newline at end of file
-- 
cgit v1.2.1