Hi All,
Here is a small front end I have started for the Icom PCR1000 ....
Far from perfect, still needs de-cluttering, still needs bandscope to be done, but a fun little project so far...
Runs purely on Node Red with no external services required, barring a few additional palette nodes that aren't part of a basic install but can be installed from the pallette menu...
The only hardware required is the PCR1000 and a usb->serial el cheapo adapter....
If anybody wants the flow, just shout!!
Ed
Nice one, have you seen peter scargills LCD display?
[{"id":"5439cd84.a88ae4","type":"ui_template","z":"c552e8d2.712b48","group":"1e03a2b2.83a61d","name":"Time and Temp","order":0,"width":"6","height":"2","format":"<script>\n var icon=\"T\";\n\n \n var colours={\n \"blackOnOrange\": {items:[\"#222\",\"#fb7c00\"]}, \n \"blackOnGreen\" : {items:[\"#222\",\"#66ac66\"]},\n \"blackOnBlue\" : {items:[\"#222\",\"#8888ff\"]},\n \"blackOnYellow\" : {items:[\"#222\",\"#bbbb44\"]},\n \"blackOnWhite\" : {items:[\"#222\",\"#aaaaaa\"]},\n \"blackOnPink\" : {items:[\"#222\",\"#ff8888\"]},\n \"yellowOnRed\" : {items:[\"#ccaa22\",\"#aa2222\"]},\n \"whiteOnCyan\" : {items:[\"#dddddd\",\"#227777\"]},\n \"orangeOnBlack\" : {items:[\"#ff8800\",\"#000000\"]}, \n \"limeOnBlack\" : {items:[\"#00cc55\",\"#000000\"]}, \n } \n \n var daylist = [\"sun\", \"mon\", \"tue\", \"wed\", \"thu\", \"fri\", \"sat\"];\n (function(scope){ \n scope.$watch('msg', function(msg) {\n if (typeof(msg.type) != \"undefined\") icon=msg.type;\n \n if (icon==\"t\")\n {\n $(\"#DSEGWEATHER-BACK\").text(\" \");\n $(\"#DSEGWEATHER-ICON\").text(\" \");\n $(\"#DSEGTempcF\").text(\"C\");\n $(\"#DSEGTempcB\").text(\"8\"); \n if (typeof(msg.payload) != \"undefined\") { $(\"#DSEGTempF\").text(msg.payload); $(\"#DSEGTempB\").text(\"88\"); }\n }\n else\n {\n $(\"#DSEGTempF\").text(\"\");\n $(\"#DSEGTempcF\").text(\"\");\n $(\"#DSEGTempB\").text(\"\");\n $(\"#DSEGTempcB\").text(\"\");\n $(\"#DSEGWEATHER-BACK\").text(\"0\");\n if (typeof(msg.payload) != \"undefined\") $(\"#DSEGWEATHER-ICON\").text(msg.payload);\n \n }\n if (typeof(msg.colour) != \"undefined\") {\n $(\".Clock-Wrapper\").css('background-color', colours[msg.colour].items[1]); $(\".lcdClock\").css('color', colours[msg.colour].items[0]); \n if (colours[msg.colour].items[1]==\"#000000\") $(\".background\").css('color',\"rgba(255,255,255,0.15)\"); else $(\".background\").css('color',\"rgba(0,0,0,0.1)\");\n }\n });\n })(scope);\n\n function genTimerStrings(tm, num){\n \n \tvar i;\n \tvar ret = tm.toString(10);\n \tvar left = ret.length;\n \n \tif( left < num){\n \t\tfor(i=0; i<( num - left ); i++ ){\n \t\t\tret = String(0) + ret;\n \t\t}\n \t}\n \treturn ret;\n }\n\n function updateTimer(){\n \tvar ret;\n \tvar date = new Date();\n \tvar tm_year, tm_mon, tm_date, tm_hour, tm_min, tm_sec, tm_msec,tm_day;\n \tvar colon;\n \ttm_year = date.getFullYear();\n \ttm_mon = date.getMonth()+1;\n \ttm_date = date.getDate();\n \ttm_day = date.getDay();\n \ttm_hour = date.getHours();\n \ttm_min = date.getMinutes();\n \ttm_sec = date.getSeconds();\n \ttm_msec = date.getMilliseconds();\n \n \ttm_mon = genTimerStrings(tm_mon, 2);\n \ttm_date = genTimerStrings(tm_date, 2);\n \ttm_hour = genTimerStrings(tm_hour, 2);\n \ttm_min = genTimerStrings(tm_min, 2);\n \ttm_sec = genTimerStrings(tm_sec, 2);\n \ttm_day = daylist[tm_day];\n \n \tif( tm_msec > 499 ){\n \t\tcolon = ' ';\n \t}else{\n \t\tcolon = ':';\n \t}\n \n \tdocument.getElementById(\"DSEGClock\").innerHTML = tm_hour + colon + tm_min + \"<span style=\\\"font-size:30px;\\\">\" + tm_sec + \"</span>\";\n \tdocument.getElementById(\"DSEGClock-Year\").innerHTML = \"<span class=\\\"D7MI\\\">\" + tm_year + \"-\" + tm_mon + \"-\" + tm_date + ' ' + \"</span><span class=\\\"D14MI\\\">\" + tm_day + \".\" + \"</span>\";\n \n \tsetTimeout(\"updateTimer()\", 500 - date.getMilliseconds()%500 );\n }\n\n updateTimer();\n \n</script>\n\n<style type=\"text/css\">\n.lcdClock {\n\tbackground-color:#fbfbfb;\n\tfont-size:100%;\n\tpadding-left:10px;\n\tpadding-right:10px;\n\tpadding-bottom:10px;\n\tmax-width:300px;\n\tline-height:160%;\n\tcolor:#222;\n\tfont-family:Meiryo, 'Lucida Grande','Hiragino Kaku Gothic ProN', sans-serif;\n}\n\n@font-face {\n font-family: \"D7MI\";\n src: url(\"/myfonts/DSEG7Modern-Italic.woff\") format('woff');\n}\n\n@font-face {\n font-family: \"D14MI\";\n src: url(\"/myfonts/DSEG14Modern-Italic.woff\") format('woff');\n}\n\n@font-face {\n font-family: \"D7MBI\";\n src: url(\"/myfonts/DSEG7Modern-BoldItalic.woff\") format('woff');\n}\n\n@font-face {\n font-family: \"DWEATHER\";\n src: url(\"/myfonts/DSEGWeather.woff\") format('woff');\n}\n\n.Weather-Background{\n\tz-index:50;\n\tposition:absolute;\n\ttop:24px;\n\tleft:226px;\n\tfont-size:68px;\n}\n\n.Weather-Front{\n\tz-index:51;\n\tposition:absolute;\n\ttop:24px;\n\tleft:226px;\n\tfont-size:68px;\n}\n\n.D7MI {\nfont-family: \"D7MI\";\n}\n\n.D7MBI {\nfont-family: \"D7MBI\";\n}\n\n.D14MI {\nfont-family: \"D14MI\";\n}\n\n.DWEATHER {\nfont-family: \"DWEATHER\";\nfont-size:68px;\nheight:68px;\n}\n\n.Clock-Wrapper{\n\tposition:relative;\n\tborder:6px solid #000;\n\tborder-radius:9px;\n\theight:68px;\n\twidth:280px;\n\tbackground-color:#fb7c00;\n\tbackground-color:#66ac66;\n\tbox-shadow: 4px 4px 28px 0px rgba(0,0,0,0.3) inset; \n}\n\n.Clock-Time-Background{\n\tz-index:50;\n}\n\n.Clock-Time-Front{\n\tz-index:51;\n}\n\n.Clock-Time-Background,.Clock-Time-Front {\n \tposition:absolute;\n\ttop:38px;\n\tleft:5px; \n\tfont-size:42px;\n}\n\n.background { color:rgba(0,0,0,0.1); }\n\n.Clock-Year-Background{\n\tz-index:50;\n\tfont-size:18px;\n}\n\n.Clock-Year-Front{\n\tz-index:51;\n}\n\n.Clock-Year-Background,.Clock-Year-Front {\n \tposition:absolute;\n\ttop:2px;\n\tleft:5px; \n\tfont-size:18px;\n}\n\n.temp { z-index:51; }\n.tempBack { z-index:50; color:rgba(0,0,0,0.1); }\n.temp,.tempBack {\n \tposition:absolute;\n\ttop:28px;\n\tleft:210px; \n\tfont-size:42px;\n}\n\n.tempc { z-index:51; }\n.tempcBack { z-index:50; }\n.tempc,.tempcBack {\n \tposition:absolute;\n\ttop:36px;\n\tleft:278px; \n\tfont-size:24px;\n}\n\n#DSEG7_OUTPUT{\n\tfont-family: \"D7MI\";\n}\n\n#DSEG14_OUTPUT{\n\tfont-family: \"D14MI\";\n}\n\n#DSEG14_OUTPUT, #DSEG7_OUTPUT{\n\tfont-size:18px;\n\tmargin-top:2px;\n\tmargin-bottom:10px;\n}\n\n</style>\n\n\n<div class=\"Clock-Wrapper center lcdClock\">\n\t<span class=\"Clock-Time-Background background D7MBI\">88:88<span style=\"font-size:30px;\">88</span></span>\n\t<span id=\"DSEGClock\" class=\"Clock-Time-Front D7MBI\"></span>\n\t<span class=\"Clock-Year-Background background\"><span class=\"D7MI\">2088-88-88</span><span class=\"D14MI\"> ~~~</span></span>\n\t<span id=\"DSEGClock-Year\" class=\"Clock-Year-Front\"></span>\n\t\n\t<span id=\"DSEGTempF\" class=\"temp D7MBI\">00</span>\n\t<span id=\"DSEGTempB\" class=\"tempBack background D7MBI\">88</span>\t\n\t<span id=\"DSEGTempcF\" class=\"tempc D7MI\">C</span>\n\t<span id=\"DSEGTempcB\" class=\"tempcBack background D7MI\">8</span>\n\t\n\t\n\t<span id=\"DSEGWEATHER-BACK\" class=\"Weather-Background background DWEATHER\"></span>\n\t<span id=\"DSEGWEATHER-ICON\" class=\"Weather-Front DWEATHER\"></span>\n\t\t\n</div>\n\n","storeOutMessages":true,"fwdInMessages":false,"x":480,"y":1480,"wires":[[]]},{"id":"e26a920b.fd916","type":"inject","z":"c552e8d2.712b48","name":"21c","topic":"","payload":"21","payloadType":"num","repeat":"","crontab":"","once":false,"x":90,"y":1220,"wires":[["5439cd84.a88ae4"]]},{"id":"a92b9b7a.795228","type":"inject","z":"c552e8d2.712b48","name":"32c","topic":"","payload":"32","payloadType":"num","repeat":"","crontab":"","once":false,"x":90,"y":1260,"wires":[["5439cd84.a88ae4"]]},{"id":"6d378317.dd743c","type":"inject","z":"c552e8d2.712b48","name":"green","topic":"","payload":"blackOnGreen","payloadType":"str","repeat":"","crontab":"","once":false,"x":90,"y":1400,"wires":[["a23865de.5f59b8"]]},{"id":"24a314bf.90927c","type":"inject","z":"c552e8d2.712b48","name":"orange","topic":"","payload":"blackOnOrange","payloadType":"str","repeat":"","crontab":"","once":false,"x":90,"y":1440,"wires":[["a23865de.5f59b8"]]},{"id":"a23865de.5f59b8","type":"function","z":"c552e8d2.712b48","name":"","func":"msg.colour=msg.payload;\nmsg.payload=undefined;\nreturn msg;","outputs":1,"noerr":0,"x":270,"y":1480,"wires":[["5439cd84.a88ae4"]]},{"id":"c8edfc9b.be6ce","type":"inject","z":"c552e8d2.712b48","name":"blue","topic":"","payload":"blackOnBlue","payloadType":"str","repeat":"","crontab":"","once":false,"x":90,"y":1480,"wires":[["a23865de.5f59b8"]]},{"id":"18a1c3a.b9c283c","type":"inject","z":"c552e8d2.712b48","name":"yellow","topic":"","payload":"blackOnYellow","payloadType":"str","repeat":"","crontab":"","once":false,"x":90,"y":1520,"wires":[["a23865de.5f59b8"]]},{"id":"a5c4dd24.4b6ff","type":"inject","z":"c552e8d2.712b48","name":"white","topic":"","payload":"blackOnWhite","payloadType":"str","repeat":"","crontab":"","once":false,"x":90,"y":1560,"wires":[["a23865de.5f59b8"]]},{"id":"83e6ddc0.ec7bd","type":"inject","z":"c552e8d2.712b48","name":"pink","topic":"","payload":"blackOnPink","payloadType":"str","repeat":"","crontab":"","once":false,"x":90,"y":1600,"wires":[["a23865de.5f59b8"]]},{"id":"ebfd33d8.c8b13","type":"inject","z":"c552e8d2.712b48","name":"red and light text","topic":"","payload":"yellowOnRed","payloadType":"str","repeat":"","crontab":"","once":false,"x":120,"y":1640,"wires":[["a23865de.5f59b8"]]},{"id":"26972f6.8af94d","type":"inject","z":"c552e8d2.712b48","name":"cyan and white","topic":"","payload":"whiteOnCyan","payloadType":"str","repeat":"","crontab":"","once":false,"x":120,"y":1680,"wires":[["a23865de.5f59b8"]]},{"id":"10449ff5.d9588","type":"inject","z":"c552e8d2.712b48","name":"Type t for TEXT","topic":"","payload":"t","payloadType":"str","repeat":"","crontab":"","once":false,"x":120,"y":1760,"wires":[["fe927255.d2e2a"]]},{"id":"3e44785a.6181b8","type":"inject","z":"c552e8d2.712b48","name":"Type w for weather","topic":"","payload":"w","payloadType":"str","repeat":"","crontab":"","once":false,"x":130,"y":1800,"wires":[["fe927255.d2e2a"]]},{"id":"fe927255.d2e2a","type":"function","z":"c552e8d2.712b48","name":"","func":"msg.type=msg.payload;\nmsg.payload=undefined;\nreturn msg;","outputs":1,"noerr":0,"x":310,"y":1740,"wires":[["5439cd84.a88ae4"]]},{"id":"94706c5b.a9292","type":"inject","z":"c552e8d2.712b48","name":"weather 2","topic":"","payload":"2","payloadType":"str","repeat":"","crontab":"","once":false,"x":100,"y":1299,"wires":[["5439cd84.a88ae4"]]},{"id":"77b95bb8.1ce774","type":"inject","z":"c552e8d2.712b48","name":"weather 3","topic":"","payload":"3","payloadType":"str","repeat":"","crontab":"","once":false,"x":100,"y":1339,"wires":[["5439cd84.a88ae4"]]},{"id":"30c75186.ef732e","type":"inject","z":"c552e8d2.712b48","name":"lime on black","topic":"","payload":"limeOnBlack","payloadType":"str","repeat":"","crontab":"","once":false,"x":110,"y":1720,"wires":[["a23865de.5f59b8"]]},{"id":"1e03a2b2.83a61d","type":"ui_group","z":"","name":"testy","tab":"f9bab960.c839b8","disp":true,"width":"6"},{"id":"f9bab960.c839b8","type":"ui_tab","z":"","name":"testy","icon":"dashboard"}]
Yeh... seen that a while back... It is cute!
Latest version... Still a way to go, but plenty of help from a kind soul on the forum to get some "analog" controls in and working...
Unfortunately due to a small crisis I haven't been able to fully follow the forum and it looks like another week or so before this fully ends, but when I get more time I would like to pick your brain on a few things.
More than welcome... but I am far from proficient in this... I will answer where I can!
@eddee54455 what a great looking dashboard!
Thank you!
It's a never ending circle - Down the rabbit hole I go... Now need to look at a better method of tuning.... an encoder type knob.... and a more attractive Frequency display...
Ed
It takes to think a bit deeper. At the moment the idea started to turn over to actual thing, the thing you tough you willing to do takes form of Möbius stripe. And every step forwards cuts it half along the mid line.
Problem is... Cut the strip a second time and you never get back onto the original track!!
Have you tried a second cut?
Lol
E
Edit: All a bit "42" actually....
Not trying to lead the thread of topic, the dashboard you have created develops in many different ways you haven't even imagined when you started. But that is not only case of this current example. That is true nature of everlasting evolution.
I love it when a topic meanders.... Makes it interesting... Oh Look... A squirrel!!
But seriously, a topic meandering but remaining loosely on course generates ideas and out of the box thinking.... Too often a topic remains too rigid, only imparting the barest of scope of thought outside of the current subject - this curtails the development in my opinion...
A comment about Pete's digital display on here got me thinking about prettyfying it, initially in a useful way with rotary controls (with the enormous assistance of a very learned and kind gent)...
All input is good input - it either teaches you what to do, or what not to do!!
Any input, suggestion or constructive criticism is worthwhile...No matter whether it relates directly or meanders a bit!!
Ed
Edit: ...and I meandered totally.... My original intent was using this receiver as a tool... Which the front end now allows... but add the prettyness (With a little more ease of use)... and "Oh WoW!!
@eddee54455 can you send me a copy of the flow, im looking into playing with the user interface. and this would be a good one to try and get my head round it.
have you seen these gauges?
https://discourse.nodered.org/t/first-september-give-away-lets-create-one-gauge/50507/87
Yeh... they're Brilliant!!
If you would post your latest flow here for dashboard there may be others interested
Coming up! .... There are a couple of things I am Testing at the moment, so E&OE!!
flows(8).json (133.2 KB)
thanks, not seeing the input_knob.js file though.
neat layout though well done. A flow you can follow!
was it this one?
https://github.com/g200kg/input-knobs
Oops.... I'm a newbie with this... Here it is...
input-knob js file.txt (12.2 KB)
Pretty much the same... Just a few minor changes were needed...
Just realised... I need to post the .knob files for the whole shebang too.... Any idea how I can post them (site wont allow the suffix)...
E
maybe just zip them see if it allows that?
having my own issues with windows and the Http static location. ill wait till im home the run it on linux!
ps love the Html KnobWrapper made me chuckle ( so immature me lol!)
Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.
The OpenJS Foundation | Terms of Use | Privacy Policy | OpenJS Foundation Bylaws | Trademark Policy | Trademark List | Cookie Policy
