Dear all,
got a setup/understanding issue with my Node-red Docker based installation on my QNAP NAS . I would like to use the nice steel gauges from https://laptrinhx.com/steelseries-and-node-red-3482335268/ in my dashboard. They are loaded with the script template and need to have the httpstatic directory to be pointed at a location of choice where you need to put the two js files. Some also use this to store and load pictures I believe.
I do have changed the set the httpstatic line in the settings.js to : httpStatic: '/data/myjs', and copied the two files to the very same directory on my docker instance. Unfortunately I do have a empty Dashboard loaded that just displays the name of the template object with a wite frame
Interestingly I do have created a 2nd simple flow that just creates a file and used the “current” directory to store a timestamp. When I looked in the console that new file was strangely created in the /usr/src/node-red directory. Well I copied the two java files to that directory too but with out success. The Dashboard is still empty.
Now as beginner I am stuck with ideas and would appreciate any help. Below my configuration :
Cheers bkumio
NodeRed Startup log:
8 Apr 20:03:15 - [info] Node-RED version: v1.2.9
8 Apr 20:03:15 - [info] Node.js version: v10.23.2
8 Apr 20:03:15 - [info] Linux 4.14.24-qnap x64 LE
8 Apr 20:03:16 - [info] Loading palette nodes
8 Apr 20:03:19 - [info] Dashboard version 2.28.2 started at /ui
8 Apr 20:03:19 - [info] Settings file : /data/settings.js
8 Apr 20:03:19 - [info] HTTP Static : /data/myjs
8 Apr 20:03:19 - [info] Context store : 'default' [module=memory]
8 Apr 20:03:19 - [info] User directory : /data
8 Apr 20:03:19 - [warn] Projects disabled : editorTheme.projects.enabled=false
8 Apr 20:03:19 - [info] Flows file : /data/flows.json
The dashboard template has got the following code :
<script src="tween-min.js"></script>
<script src="steelseries-min.js"></script>
<script>
var radial4;
(function(scope){
scope.$watch('msg', function(msg) {
if (typeof(msg.value) != "undefined") radial4.setValueAnimated(msg.value);
if (typeof(msg.threshold) != "undefined") radial4.setThreshold(msg.threshold);
if (typeof(msg.odo) != "undefined")radial4.setOdoValue(msg.odo);
if (typeof(msg.userLed) != "undefined") radial4.setUserLedOnOff(msg.userLed);
if (typeof(msg.trend) != "undefined")
{
if (msg.trend==1) radial4.setTrend(steelseries.TrendState.UP);
if (msg.trend==0) radial4.setTrend(steelseries.TrendState.STEADY);
if (msg.trend==-1) radial4.setTrend(steelseries.TrendState.DOWN);
if (msg.trend==-2) radial4.setTrend(steelseries.TrendState.OFF);
}
});
})(scope);
var sections = [steelseries.Section(0, 25, 'rgba(0, 0, 220, 0.3)'),
steelseries.Section(25, 50, 'rgba(0, 220, 0, 0.3)'),
steelseries.Section(50, 75, 'rgba(220, 220, 0, 0.3)') ],
// Define one area
areas = [steelseries.Section(75, 100, 'rgba(220, 0, 0, 0.3)')],
radial4 = new steelseries.Radial('canvasRadial4', {
gaugeType: steelseries.GaugeType.TYPE4,
size: 292,
section: sections,
area: areas,
titleString: "Heating",
unitString: "Degrees C",
threshold: 50,
thresholdRising: false,
userLedVisible: true,
useOdometer: true,
lcdVisible: true,
trendVisible: true
});
radial4.setFrameDesign(steelseries.FrameDesign.BLACK_METAL);
radial4.setValueAnimated(0);
radial4.setThreshold(50);
radial4.blinkUserLed(0);
radial4.setOdoValue(0);
</script>
<canvas id="canvasRadial4" width="401" height="401"></canvas>