Let clicks be sendable, let buttons be updateable

to close #308 and close #309

Author: dceejay

CHANGELOG.md

@@ -1,5 +1,6 @@
 ### Change Log for Node-RED Worldmap
 
+ - v5.2.0 - Allow left click send back co-ords. Let Button be replaceable more easily and take value property. Issue #308 and #309
  - v5.1.6 - Let Cot __milsym set the SIDC if present.
  - v5.1.5 - Fix links to SIDC unitgenerator so it is now local.
  - v5.1.4 - Fix clearlayer for tracks node.
@@ -8,13 +9,13 @@
  - v5.1.0 - Let special icons be sizeable using iconSize property.
  - v5.0.9 - Slight tidy on flags, bump turf dep.
  - v5.0.8 - Fix flag handling for SIDC 2525D, add example.
- - v5.0.7 - Allow Tooltip options (see new example). #PR295.
+ - v5.0.7 - Allow Tooltip options (see new example). PR #295.
  - v5.0.6 - Tweak SIDC flag handling slightly to show direction if available and moving.
  - v5.0.4 - Tweak CoT handling slightly.
- - v5.0.3 - Add great context menu example flow. PR#290. Bump express lib. PR#291.
- - v5.0.2 - Fix sidcEdgeIcon docs PR#289.
+ - v5.0.3 - Add great context menu example flow. PR #290. Bump express lib. PR #291.
+ - v5.0.2 - Fix sidcEdgeIcon docs PR #289.
  - v5.0.1 - Fix isArray error PR #288.
- - v5.0.0 - Feedback cleanup PR#281, edgeicons option PR#287, bump libs for vuln fixes.
+ - v5.0.0 - Feedback cleanup PR #281, edgeicons option PR #287, bump libs for vuln fixes.
  - v4.9.0 - If payload.flag is two char ISO code replace it with flag emoji. Revert part of PR #271
  - v4.8.1 - Slight tidy of some of the geojson handling
  - v4.8.0 - Merged PR for feedback functionality cleanup and example. PR #271 and #272

README.md

@@ -13,6 +13,7 @@ Feel free to [![](https://img.shields.io/static/v1?label=Sponsor&message=%E2%9D%
 
 ### Updates
 
+- v5.2.0 - Allow left click send back co-ords. Let Button be replaceable more easily and take value property. Issue #308 and #309
 - v5.1.6 - Let Cot __milsym set the SIDC if present.
 - v5.1.5 - Fix links to SIDC unitgenerator so it is now local.
 - v5.1.4 - Fix clearlayer for tracks node.
@@ -21,13 +22,13 @@ Feel free to [![](https://img.shields.io/static/v1?label=Sponsor&message=%E2%9D%
 - v5.1.0 - Let special icons be sizeable using iconSize property.
 - v5.0.9 - Slight tidy on flags, bump turf dep.
 - v5.0.8 - Fix flag handling for SIDC 2525D, add example.
-- v5.0.7 - Allow Tooltip options (see new example). #PR295.
+- v5.0.7 - Allow Tooltip options (see new example). PR #295.
 - v5.0.6 - Tweak SIDC flag handling slightly to show direction if available and moving.
 - v5.0.4 - Tweak CoT handling slightly.
-- v5.0.3 - Add great context menu example flow. PR#290. Bump express lib. PR#291.
-- v5.0.2 - Fix sidcEdgeIcon docs PR#289.
+- v5.0.3 - Add great context menu example flow. PR #290. Bump express lib. PR #291.
+- v5.0.2 - Fix sidcEdgeIcon docs PR #289.
 - v5.0.1 - Fix isArray error PR #288.
-- v5.0.0 - v5.0.0 - Feedback cleanup PR#281, edgeicons option PR#287, bump libs for vuln fixes.
+- v5.0.0 - v5.0.0 - Feedback cleanup PR #281, edgeicons option PR #287, bump libs for vuln fixes.
 
 
 - see [CHANGELOG](https://github.com/dceejay/RedMap/blob/master/CHANGELOG.md) for full list of changes.

package.json

@@ -1,6 +1,6 @@
 {
     "name": "node-red-contrib-web-worldmap",
-    "version": "5.1.6",
+    "version": "5.2.0",
     "description": "A Node-RED node to provide a web page of a world map for plotting things on.",
     "dependencies": {
         "@turf/bezier-spline": "~7.2.0",

worldmap.html

@@ -667,6 +667,7 @@
                     { value: "layer", label: "Add, remove layers"},
                     { value: "bounds", label: "Boundary change"},
                     { value: "files", label: "File drop"},
+                    { value: "click", label: "Click on map"},
                     { value: "other", label: "All other"}
                 ]
             }]});

worldmap.js

@@ -323,7 +323,7 @@ module.exports = function(RED) {
     var WorldMapIn = function(n) {
         RED.nodes.createNode(this,n);
         this.path = n.path || "/worldmap";
-        this.events = n.events || "connect,disconnect,point,layer,bounds,files,draw,other";
+        this.events = n.events || "connect,disconnect,point,layer,bounds,files,draw,click,other";
         if (this.path.charAt(0) != "/") { this.path = "/" + this.path; }
         if (!sockets[this.path]) {
             var libPath = path.posix.join(RED.settings.httpNodeRoot, this.path, 'leaflet', 'sockjs.min.js');
@@ -349,6 +349,9 @@ module.exports = function(RED) {
                     if ((node.events.indexOf("bounds")!==-1) && (message.action === "bounds")) {
                         setImmediate(function() {node.send({payload:message, topic:node.path.substr(1), _sessionid:client.id, _sessionip:sessionip})});
                     }
+                    if ((node.events.indexOf("click")!==-1) && (message.action === "click")) {
+                        setImmediate(function() {node.send({payload:message, topic:node.path.substr(1), _sessionid:client.id, _sessionip:sessionip})});
+                    }
                     if ((node.events.indexOf("point")!==-1) && ((message.action === "point")||(message.action === "move")||(message.action === "delete") ))  {
                         setImmediate(function() {node.send({payload:message, topic:node.path.substr(1), _sessionid:client.id, _sessionip:sessionip})});
                     }
@@ -362,7 +365,7 @@ module.exports = function(RED) {
                     if ((node.events.indexOf("draw")!==-1) && ((message.action === "draw")||(message.action === "drawdelete")))  {
                         setImmediate(function() {node.send({payload:message, topic:node.path.substr(1), _sessionid:client.id, _sessionip:sessionip})});
                     }
-                    if (node.events.indexOf("other")!==-1 && "connected,point,addlayer,dellayer,delete,move,draw,drawdelete,files,bounds".indexOf(message.action) === -1) {
+                    if (node.events.indexOf("other")!==-1 && "connected,point,addlayer,dellayer,delete,move,draw,drawdelete,files,bounds,click".indexOf(message.action) === -1) {
                         setImmediate(function() {node.send({payload:message, topic:node.path.substr(1), _sessionid:client.id, _sessionip:sessionip})});
                     }
                 }

worldmap/worldmap.js

@@ -938,9 +938,9 @@ var feedback = function(n = "map",v,a = "feedback",c) {
     if (c === true) { map.closePopup(); }
 }
 
-// map.on('click', function(e) {
-//    ws.send(JSON.stringify({action:"click", lat:e.latlng.lat.toFixed(5), lon:e.latlng.lng.toFixed(5)}));
-// });
+map.on('click', function(e) {
+    ws.send(JSON.stringify({action:"click", lat:e.latlng.lat.toFixed(5), lon:e.latlng.lng.toFixed(5)}));
+});
 
 // allow double right click to zoom out (if enabled)
 // single right click opens a message window that adds a marker
@@ -1966,7 +1966,6 @@ function setMarker(data) {
                 iconAnchor: [sizc, sizc],
                 html:'<img src="'+svgarrow+'" style="width:'+siz+'px; height:'+siz+'px; -webkit-transform:rotate('+dir+'deg); -moz-transform:rotate('+dir+'deg);"/>',
             });
-            console.log("MM",myMarker)
             marker = L.marker(ll, {title:data["name"], icon:myMarker, draggable:drag});
         }
         else if (data.icon === "wind") {
@@ -2602,14 +2601,17 @@ function doCommand(cmd) {
     if (cmd.hasOwnProperty("button")) {
         if (!Array.isArray(cmd.button)) { cmd.button = [cmd.button]; }
         cmd.button.forEach(function(b) {
-            if (b.icon) {
-                if (!buttons[b.name]) {
-                    buttons[b.name] = L.easyButton( b.icon, function() {
-                        ws.send(JSON.stringify({action:"button", name:b.name}));
-                    }, b.name, { position:b.position||'topright' }).addTo(map);
+            if (b.name && b.icon) {
+                if (buttons[b.name]) {
+                    buttons[b.name].removeFrom(map);
+                    delete buttons[b.name];
                 }
+                buttons[b.name] = L.easyButton( b.icon, function() {
+                    ws.send(JSON.stringify({action:"button", name:b.name, value:b?.value}));
+                }, b.name, { position:b.position||'topright' });
+                buttons[b.name].addTo(map);
             }
-            else {
+            else if (b.name && !b.icon){
                 if (buttons[b.name]) {
                     buttons[b.name].removeFrom(map);
                     delete buttons[b.name];