[{"id":"38ea9d64.e96db2","type":"inject","z":"39ebd91b.6a6e86","name":"","topic":"","payload":"111111","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":390,"y":600,"wires":[["f62a5c2f.d369c"]]},{"id":"b1d1ac47.e9935","type":"inject","z":"39ebd91b.6a6e86","name":"","topic":"","payload":"222222","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":390,"y":640,"wires":[["f62a5c2f.d369c"]]},{"id":"9d9e3a29.ad0138","type":"inject","z":"39ebd91b.6a6e86","name":"","topic":"","payload":"333333","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":390,"y":680,"wires":[["f62a5c2f.d369c"]]},{"id":"e935218b.0c0ea","type":"inject","z":"39ebd91b.6a6e86","name":"","topic":"","payload":"444444","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":390,"y":720,"wires":[["f62a5c2f.d369c"]]},{"id":"29a418ba.f4cec8","type":"inject","z":"39ebd91b.6a6e86","name":"","topic":"","payload":"555555","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":390,"y":760,"wires":[["f62a5c2f.d369c"]]},{"id":"745cf76c.af8328","type":"websocket out","z":"39ebd91b.6a6e86","name":"","server":"f2759208.7a31c","client":"","x":980,"y":700,"wires":[]},{"id":"162f6aa5.806805","type":"http response","z":"39ebd91b.6a6e86","name":"","x":1050,"y":620,"wires":[]},{"id":"fbec4733.43eb38","type":"http in","z":"39ebd91b.6a6e86","name":"","url":"/simple","method":"get","swaggerDoc":"","x":681,"y":620,"wires":[["1a22a1f0.a9d29e"]]},{"id":"1a22a1f0.a9d29e","type":"template","z":"39ebd91b.6a6e86","name":"Simple Web Page","field":"payload","fieldType":"msg","format":"html","syntax":"mustache","template":"<!DOCTYPE HTML>\n<html>\n <head>\n <title>Simple Live Display</title>\n <script type=\"text/javascript\">\n var ws;\n var wsUri = \"ws:\";\n var loc = window.location;\n console.log(loc);\n if (loc.protocol === \"https:\") { wsUri = \"wss:\"; }\n // This needs to point to the web socket in the Node-RED flow\n // ... in this case it's ws/simple\n wsUri += \"//\" + loc.host + loc.pathname.replace(\"simple\",\"ws/simple\");\n\n function wsConnect() {\n console.log(\"connect\",wsUri);\n ws = new WebSocket(wsUri);\n //var line = \"\"; // either uncomment this for a building list of messages\n ws.onmessage = function(msg) {\n var line = \"\"; // or uncomment this to overwrite the existing message\n // parse the incoming message as a JSON object\n var data = msg.data;\n //console.log(data);\n // build the output from the topic and payload parts of the object\n line += \"<p>\"+data+\"</p>\";\n // replace the messages div with the new \"line\"\n document.getElementById('messages').innerHTML = line;\n //ws.send(JSON.stringify({data:data}));\n }\n ws.onopen = function() {\n // update the status div with the connection status\n document.getElementById('status').innerHTML = \"connected\";\n //ws.send(\"Open for data\");\n console.log(\"connected\");\n }\n ws.onclose = function() {\n // update the status div with the connection status\n document.getElementById('status').innerHTML = \"not connected\";\n // in case of lost connection tries to reconnect every 3 secs\n setTimeout(wsConnect,3000);\n }\n }\n \n function doit(m) {\n if (ws) { ws.send(m); }\n }\n </script>\n </head>\n <body onload=\"wsConnect();\" onunload=\"ws.disconnect();\">\n <font face=\"Arial\">\n <h1>Simple Live Display</h1>\n <div id=\"messages\"></div>\n <button type=\"button\" onclick='doit(\"click\");'>Click to send message</button>\n <hr/>\n <div id=\"status\">unknown</div>\n </font>\n </body>\n</html>\n","x":878,"y":620,"wires":[["162f6aa5.806805"]]},{"id":"f62a5c2f.d369c","type":"function","z":"39ebd91b.6a6e86","name":"format time nicely","func":"msg.payload = msg.payload.toString();\nreturn msg;","outputs":1,"noerr":0,"x":768,"y":700,"wires":[["745cf76c.af8328"]]},{"id":"b052ceb9.0437b","type":"websocket in","z":"39ebd91b.6a6e86","name":"","server":"f2759208.7a31c","client":"","x":767,"y":752,"wires":[["218546d0.da694a"]]},{"id":"218546d0.da694a","type":"debug","z":"39ebd91b.6a6e86","name":"","active":true,"console":"false","complete":"false","x":957,"y":752,"wires":[]},{"id":"f2759208.7a31c","type":"websocket-listener","z":"39ebd91b.6a6e86","path":"/ws/simple","wholemsg":"false"}]