add addToForm utility function

This commit is contained in:
Dave Conway-Jones 2021-02-20 15:42:55 +00:00
parent 27deece616
commit 804569d95c
No known key found for this signature in database
GPG Key ID: 88BA2B8A411BE9FF
4 changed files with 22 additions and 2 deletions

View File

@ -1,5 +1,6 @@
### Change Log for Node-RED Worldmap
- v2.8.4 - Add addToForm(n,v) option and $form - to make contextmenu form submission easier.
- v2.8.3 - Let feedback include lat lon for context menu on general map.
- v2.8.2 - Improve direction handling of 3d objects.
- v2.8.1 - Fix old tracks re-appearing afer hide/show. Issue #135

View File

@ -11,6 +11,7 @@ map web page for plotting "things" on.
### Updates
- v2.8.4 - Add addToForm(n,v) option and $form - to make contextmenu form submission easier.
- v2.8.3 - Let feedback include lat lon for context menu on general map.
- v2.8.2 - Improve direction handling of 3d objects.
- v2.8.1 - Fix old tracks re-appearing afer hide/show. Issue #135
@ -361,6 +362,16 @@ There are some internal functions available to make interacting with Node-RED ea
- **feedback()** : it takes 2, 3, or 4 parameters, name, value, and optionally an action name (defaults to "feedback"), and optional boolean to close the popup on calling this function, and can be used inside something like an input tag - `onchange='feedback(this.name,this.value,null,true)'`. Value can be a more complex object if required as long as it is serialisable. If used with a marker the name should be that of the marker - you can use `$name` to let it be substituted automatically.
- **addToForm()** : takes a property name value pair to add to a variable called form. When used with contextmenu feedback (above) you can set the feedback value to `"$form"` to substitute this accumulated value. This allows you to do things like `onChange='addToForm(this.name,this.value)'` over several different fields in the menu and then use `feedback(this.name,"$form")` to submit them all at once. For example a simple multiple line form could be:
```
var menu = "Add some data <input name='foo' onchange='addToForm(this.name,this.value)'></input><br/>"
menu += "Add more data <input name='bar' onchange='addToForm(this.name,this.value)'></input><br/>"
menu += '<button name="my_form" onclick=\'feedback(this.name,"$form",null,true)\'>Submit</button>'
msg.payload = { command: { "contextmenu":menu } }
```
- **delMarker()** : takes the name of the marker as a parameter. In a popup this can be specified as `$name` for dynamic substitution.
- **editPoly()** : takes the name of the shape or line as a parameter. In a popup this can be specified as `$name` for dynamic substitution.

View File

@ -1,6 +1,6 @@
{
"name": "node-red-contrib-web-worldmap",
"version": "2.8.3",
"version": "2.8.4",
"description": "A Node-RED node to provide a web page of a world map for plotting things on.",
"dependencies": {
"cgi": "0.3.1",

View File

@ -667,9 +667,10 @@ var addThing = function() {
}
var feedback = function(n,v,a,c) {
if (v === "$form") { v = form; }
if (markers[n]) {
var fp = markers[n]._latlng;
ws.send(JSON.stringify({action:a||"feedback", name:n, layer:markers[n].lay, lat:fp.lat, lon:fp.lng, value:v}));
ws.send(JSON.stringify({action:a||"feedback", name:n, value:v, layer:markers[n].lay, lat:fp.lat, lon:fp.lng}));
}
else {
if (n === undefined) { n = "map"; }
@ -678,10 +679,16 @@ var feedback = function(n,v,a,c) {
if (c === true) { map.closePopup(); }
}
var form = {};
var addToForm = function(n,v) {
form[n] = v;
}
// allow double right click to zoom out (if enabled)
// single right click opens a message window that adds a marker
var rclicked = false;
var rtout = null;
map.on('contextmenu', function(e) {
if (rclicked) {
rclicked = false;
@ -696,6 +703,7 @@ map.on('contextmenu', function(e) {
rclicked = false;
if ((hiderightclick !== true) && (addmenu.length > 0)) {
rclk = e.latlng;
form = {};
rightmenuMap.setLatLng(e.latlng);
map.openPopup(rightmenuMap);
setTimeout( function() {