Operation of a slider

General
1

I have 4 injections, 2 for the X axis and the other 2 for the Y axis; I want that when the "up" is pressed it adds 1 and when the "down" is pressed it subtracts 1, thus with a maximum value of 100, the same for "left" and "right"
image

2

What are you expecting the output to be -

  • An array: msg.payload = [21, 42]
  • An object: msg.payload = {"horizontal": 21, "vertical": 42}
  • Context variables: flow.horizontal = 21, flow.vertical = 42
    etc ?
3

Here's an example of a simple flow for a virtual slider using flow variables.

a_exg_A
a_exg_A764×324 23.4 KB

[{"id":"df1913c70995b382","type":"tab","label":"Virtual slider","disabled":false,"info":"","env":[]},{"id":"c9e3bef5d9c8cd19","type":"group","z":"df1913c70995b382","name":"","style":{"fill":"#e3f3d3","label":true},"nodes":["d15a1813899dd1be","744b8ba38cdb2563","d8ae3e7b8ad646bc"],"x":634,"y":179,"w":212,"h":222},{"id":"e1a9a82fc3802606","type":"inject","z":"df1913c70995b382","name":"Up","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"up","payload":"1","payloadType":"num","x":230,"y":240,"wires":[["295b3758258aa7e4"]]},{"id":"c0d1db6c2f1a5173","type":"inject","z":"df1913c70995b382","name":"Down","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"down","payload":"1","payloadType":"num","x":230,"y":280,"wires":[["295b3758258aa7e4"]]},{"id":"e56d04675fbe2140","type":"inject","z":"df1913c70995b382","name":"Left","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"left","payload":"1","payloadType":"num","x":230,"y":360,"wires":[["295b3758258aa7e4"]]},{"id":"3d95145401c4f376","type":"inject","z":"df1913c70995b382","name":"Right","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"right","payload":"1","payloadType":"num","x":230,"y":400,"wires":[["295b3758258aa7e4"]]},{"id":"6bf6ebd0d5cb1a04","type":"inject","z":"df1913c70995b382","name":"Reset","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"reset","payload":"1","payloadType":"num","x":230,"y":180,"wires":[["295b3758258aa7e4"]]},{"id":"295b3758258aa7e4","type":"function","z":"df1913c70995b382","name":"Example using flow variables","func":"// Change these values according to your needs\nif (msg.topic == \"reset\") {\n    flow.set(\"x\", 0);  // Set initial X value (might want 50 ?)\n    flow.set(\"y\", 0);  // Set initial Y value (might want 50 ?)\n}\n\nlet X = flow.get(\"x\") || 0;\n\nif (msg.topic == \"up\") {\n    if (X <100) {\n        X = X + 1;\n        flow.set(\"x\",X);\n    }\n}\nelse if (msg.topic == \"down\") {\n    if (X > 0) {\n        X = X -1;\n        flow.set(\"x\", X)\n    }\n}\n\n// I'm assuming \"right\" will increment the slider and \"left\" will decrement it\n\nlet Y = flow.get(\"y\") || 0;\n\nif (msg.topic == \"right\") {\n    if (Y < 100) {\n        Y = Y + 1;\n        flow.set(\"y\", Y);\n    }\n}\nelse if (msg.topic == \"left\") {\n    if (Y > 0) {\n        Y = Y - 1;\n        flow.set(\"y\", Y)\n    }\n}\n\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":480,"y":320,"wires":[["d15a1813899dd1be","744b8ba38cdb2563"]]},{"id":"d15a1813899dd1be","type":"function","z":"df1913c70995b382","g":"c9e3bef5d9c8cd19","name":"Show value of X","func":"let X = flow.get(\"x\") || 0;\n\nnode.status({ text: \"X = \" + X });\n\nreturn msg;\n","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":740,"y":280,"wires":[[]]},{"id":"744b8ba38cdb2563","type":"function","z":"df1913c70995b382","g":"c9e3bef5d9c8cd19","name":"Show value of Y","func":"let Y = flow.get(\"y\") || 0;\n\nnode.status({ text: \"Y = \" + Y });\nreturn msg;\n","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":740,"y":360,"wires":[[]]},{"id":"d8ae3e7b8ad646bc","type":"comment","z":"df1913c70995b382","g":"c9e3bef5d9c8cd19","name":"Debug","info":"","x":710,"y":220,"wires":[]}]

You can also see the X and Y values in the Context Data tab (top-right of Node-RED's main window).
a_exg_B

Notes:

  1. I have a Reset inject node that is fired when the flow is started to set initial values for X and Y.
  2. I have assumed the X and Y sliders each start at 0 (can be changed in the Function node).
  3. Each 'Inject' node has a topic-name that is used within the 'Function' node.
  4. I have assumed 'Right' will increment Y and 'Left' will decrement (change in Function node).

This is one example. I'm sure other examples will be posted here by some of the forum members.

4

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.