I bought myself a book on jQuery and Ajax for Christmas.
Here's a write-up on my first attempt at writing some jQuery that interfaces to Node-RED.
The index.txt file must be renamed as index.html (as Discourse does not allow this type of file to be uploaded).
It's a simple piece of html that links in jquery and sketch.js.
The eight 'soft' buttons have unique 'id's.
e.g. "turnREDon", "turnREDoff", etc...
The index.html and sketch.js files can reside on any webpage on your local network.
The sketch.txt file must be renamed to sketch.js (as Discourse does not allow this type of file to be uploaded).
The sketch.js file defines the destination URL where the command will be sent.
Note: Change this URL to match where Node-RED is running.
The jquery is failrly straightforward. It tags the 'soft' buttons' click event with an action.
For example, it sends... command:"redOn" when the turnREDon button is clicked.
One of the advantages of jQuery and Ajax is you can send or submit a command without the need for a "Submit" button on your webpage and without leaving the html page.
The simple Node-RED flow uses an HTTP-In node to collect the command, while the function nodes perform a simple decode of the received command.
In this simple example, node.status (in each function node) is used to show what's going on.
In a real application you could drive an LED, relay, etc...
At this moment in time I have no immediate use for this.
It's like a lot of things in life... you've just got to do it - because you can!!!
I hope someone finds a use for this after all my hard work.
Please let me know if you do.
Happy New Year.
index.txt (729 Bytes)
sketch.txt (792 Bytes)
NR-flow.txt (1.9 KB)