Steelseries Widgets im NodeRed Dashboard nutzen

mickym

@garf Danke freut mich, dass es funktioniert. ;)

mickym

So - auch wenn der Thread alt ist, ist es thematisch passend - weil es im Prinzip auch darum geht eigene Webseiten mit eigenem Script einzubinden.

Habe die FlipFlopUhr auch erfolgreich in das Dashboard einbinden können:

Hier animiert: ;)

FlipFlopUhr in NR Dashboard.mp4

Neben der eigentlichen Website hier die entsprechenden Script und Style Dateien:

style.css flipclock.min.js flipclock.js flipclock.css

[
   {
       "id": "ee9422c7.e25a6",
       "type": "ui_template",
       "z": "f19174b9.aa88f8",
       "group": "50c0120e.95a5bc",
       "name": "Flip Flop Uhr",
       "order": 22,
       "width": "10",
       "height": "3",
       "format": "<html>\n\t<head>\n\t\t<link rel=\"stylesheet\" href=\"/myjs/FlipFlopUhr/compiled/flipclock.css\">\n\t\t<link rel=\"stylesheet\" type=\"text/css\" href=\"/myjs/FlipFlopUhr/compiled/style.css\" />\n\n\t\t<script src=\"http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js\"></script>\n\n\t\t<script src=\"/myjs/FlipFlopUhr/compiled/flipclock.js\"></script>\t\t\n\t</head>\n\t<body>\n\t\t<div class=\"clock\" style=\"margin:2em;\"></div>\n\n\t\t<script type=\"text/javascript\">\n\t\t\tvar clock;\n\t\t\t\n\t\t\t$(document).ready(function() {\n\t\t\t\tclock = $('.clock').FlipClock({\n\t\t\t\t\tclockFace: 'TwentyFourHourClock',\n\t\t\t\t\t\n\t\t\t\t\tshowSeconds: true\n\t\t\t\t});\n\t\t\t});\n\t\t</script>\n\t\t\n\t</body>\n</html>",
       "storeOutMessages": true,
       "fwdInMessages": true,
       "resendOnRefresh": true,
       "templateScope": "local",
       "className": "",
       "x": 640,
       "y": 3300,
       "wires": [
           []
       ]
   },
   {
       "id": "50c0120e.95a5bc",
       "type": "ui_group",
       "name": "FlipFlop",
       "tab": "f9bab960.c839b8",
       "order": 2,
       "disp": true,
       "width": "10",
       "collapse": false,
       "className": ""
   },
   {
       "id": "f9bab960.c839b8",
       "type": "ui_tab",
       "name": "testy",
       "icon": "dashboard",
       "order": 18,
       "disabled": false,
       "hidden": false
   }
]

Die Uhr funktioniert aber nicht, da das Script pausiert wenn es im Hintergrund ist und dann muss man die Seite aktualisieren - das geht nicht automatisch. Stecke da aber keinen Aufwand mehr rein. Manchmal tuts manchmal nicht.

? Offline

@mickym Kannst du das etwas genauer erklären? Ehrlich gesagt habe ich keinen Schimmer wo ich das angegebene Verzeichnis finde wo die Dateien hin kopiert werden sollen.

mickym

@noah3112 Was möchtest Du denn machen - diese Steelseries Teile ausprobieren? -
von der FlipFlop Uhr würde ich ja eher abraten.

? Offline

@mickym Das Erste 👍

mickym

@noah3112 Als Erstes musst Du Dir, wie im Eingangsposting über den http-static Parameter einen Basispfad definieren, wo Du eigene Resourcen speicherst.

Wenn also ich in der Template Node oder generell Bilder in meinem Dashboard nutze ist das immer relativ zu diesem Pfad.
Hast Du denn auf Deinem System ein Basisverzeichnis definiert in dem Du dann alles reinkopierst?

Nutzt Du node-Red als Standalone Version oder als Adapter im iobroker?

? Offline

@mickym Sorry ich verstehe nur Bahnhof 🤔Bin erst seit geraumer Zeit an Node Red dran und habe das wahrscheinlich noch nicht gebraucht bzw vermisst. Kannst es mir vielleicht erklären?

mickym

@noah3112 sagte in Steelseries Widgets im NodeRed Dashboard nutzen:

@mickym Sorry ich verstehe nur Bahnhof 🤔Bin erst seit geraumer Zeit an Node Red dran und habe das wahrscheinlich noch nicht gebraucht bzw vermisst. Kannst es mir vielleicht erklären?

Gerne - also nochmal Frage für Frage - nutzt Du NodeRed als Standalone Version oder im Adapter des iobrokers?
Auf welchem System arbeitest Du - einem Raspberry?

Hast Du Zugriff auf die Kommandozeile?

Im iobroker ist die richtige settings.js im Verzeichnis: /opt/iobroker/node_modules/iobroker.node-red/

? Offline

@mickym Okay dann versuche ich mal alles zu beantworten. Ich nutze den Adapter von ioBroker und dieser wiederum läuft auf einem Proxmox System. Beantwortet das auch die Frage zur Kommandozeile?

? Offline

@mickym sagte in Steelseries Widgets im NodeRed Dashboard nutzen:

Im iobroker ist die richtige settings.js im Verzeichnis: /opt/iobroker/node_modules/iobroker.node-red/

Was mache ich damit?

mickym

@noah3112 sagte in Steelseries Widgets im NodeRed Dashboard nutzen:

@mickym sagte in Steelseries Widgets im NodeRed Dashboard nutzen:

Im iobroker ist die richtige settings.js im Verzeichnis: /opt/iobroker/node_modules/iobroker.node-red/

Was mache ich damit?

In diesem Verzeichnis befindet sich die settings.js Datei um einen Pfad einzutragen, wo NodeRed später die Dateien findet.

Also ich gehe mal davon aus, dass Du via ssh oder einem Terminal auf Dein Proxmox System zugreifst.

In dieser Datei kommentierst Du die http Static Direktive ein und spezifizierst den Pfad worauf NodeRed später Zugriff haben sollt. In diesen Pfad musst Du dann auch die Dateien aus dem Thread hier kopieren.

Wenn Du es genauso wie ich haben möchtest, dann erstellst Du Dir halt auch einen Ordner unter data node-red

Also Kommandozeile öffnen:

dann

sudo mkdir /data
sudo mkdir /data/node-red

dann gehst Du in das Verzeichnis, dass ich vorher gepostet habe.

cd /opt/iobroker/node_modules/iobroker.node-red
sudo nano settings.js

dort wanderst Du dann runter wie in meinem screenshot beschrieben zu dem http-static parameter und kommentierst den Parameter ein und gibst den Pfad ein:

httpStatic: '/data/node-red/',

? Offline

@mickym sagte in Steelseries Widgets im NodeRed Dashboard nutzen:

Also ich gehe mal davon aus, dass Du via ssh oder einem Terminal auf Dein Proxmox System zugreifst.

Richtig

? Offline

@mickym Du hast doch bestimmt die Befehle wie ich das schnell bewerkstelligen kann ;-)

mickym

@noah3112 sagte in Steelseries Widgets im NodeRed Dashboard nutzen:

@mickym Du hast doch bestimmt die Befehle wie ich das schnell bewerkstelligen kann ;-)

Habe ich nun alles im Vorpost aktualisiert.
Wenn Du unsicher bist, machst nochmal einen Screenshot mit der von Dir geänderten Stelle in der settings.js ein.

? Offline

@mickym Danke das hat schon mal funktioniert. Jetzt nicht lachen aber wie bekomme ich jetzt die beiden Dateien in dieses Verzeichnis was ich nicht mal finde. Sorry stehe mit Linux auf Kriegsfuß.

? Offline

@mickym Wollte es mir einfach machen und FileZilla die Dateien kopieren.

mickym

@noah3112 Also finden solltest Du es schon:

Wenn Du also

cd /data

und

ls -l

machst dann sollte ein Verzeichnis node-red vorhanden sein.

pi@MWHome:~ $ cd /data
pi@MWHome:/data $ ls -l

drwxrwxr-x 4 root  adm    4096 25. Mai 2021  node-red

mickym

@noah3112 sagte in Steelseries Widgets im NodeRed Dashboard nutzen:

@mickym Wollte es mir einfach machen und FileZilla die Dateien kopieren.

FileZilla ist glaub ein Programm, dass über ftp funktioniert - das würde aber bedeuten, dass Du einen ftp Server auf Deinem System installiert hast.

Auf welchem System arbeitest Du - Win10?

Egal wenn Du es nicht hast gehst Du in das von Dir erstellte Verzeichnis:

cd /data/node-red
sudo mkdir myjs
cd myjs

? Offline

@mickym

ulf@iobroker:/data$ ls -l
insgesamt 4
drwxr-xr-x 2 root root 4096 Dez 20 22:14 node-red
ulf@iobroker:/data$

Das klappt schon nur weiß ich nicht wie ich die Dateien von meinem Windows System dort hinbekomme. Mit FileZilla kann ich auf das Dateisystem von meinem Server zugreifen. Ist so ähnlich wie ssh...

? Offline

@mickym

ulf@iobroker:/data$ ls -l
insgesamt 4
drwxr-xr-x 2 root root 4096 Dez 20 22:14 node-red
ulf@iobroker:/data$ ^C
ulf@iobroker:/data$ cd
ulf@iobroker:~$ cd /data/node-red
ulf@iobroker:/data/node-red$ sudo mkdir myjs
[sudo] Passwort für ulf:
ulf@iobroker:/data/node-red$ cd myjs
ulf@iobroker:/data/node-red/myjs$

ist erledigt

Community Forum

NEWS

Steelseries Widgets im NodeRed Dashboard nutzen

Support us

685

32.6k

82.2k

1.3m