Aus HTML Datei in einen Datenpunkt schreiben
-
Hallo,
ich würde gerne einen eigenen Colorpicker in VIS einfügen um damit später RGB Lampen zu steuern. Ich habe eine HTML-Datei eine JS-Datei und eine CSS-Datei. Die habe ich jeweils zusammen in einem Ordner im IoBroker als Datei gespeichert. Über ein Widget greife ich auf das HTML Dokument zu, sodass mir der Colorpicker in meiner Visualisierung angezeigt wird.
Meine Frage dazu lautet an dieser Stelle, wie ich nun aus dem HTML-Script heraus in einen Datenpunkt schreiben kann. Folgender Ansatzt hat nicht funktioniert, da die Funktion setState anscheinend nur im JavaScript-Adapter verfügbar ist.
<script>
colorPicker.on('color:change', function(color){ colorIndicator.style.backgroundColor=color.hexString; setState(zigbee.0.Test.Test_Color, color.hexString); });</script>
Vielen Dank schon einmal im vorraus
-
vis.setValue('zigbee.0.Test.Test_Color', color.hexString) -
Das klappt leider dennoch nicht. Es kommt im Browser die Fehlermeldung das vis nicht bekannt ist
Dies habe ich aus der Browser Konsole kopiert
Das Widget habe ich so implemeniert
Ich habe das Widget iFrame benutzt um folgende Ansicht zu erhalten
Die Dateien habe ich so abgelegt
Gibt es eine andere Möglichkeit das Widget in die Visualisierung einzubringen, sodass ich vis.setValue benutzen kann ?
-
evtl hilft das beispiel - habe einen file upload realisiert
https://forum.iobroker.net/topic/47654/fileupload-vom-pc-tablet-in-die-vis
anstatt einen file-picker - mußt du halt einen colorpicker integrieren
das ganze steht im html widget und darin ist vis.setValue erreichbar
-
Vielen Dank für die Antwort.
Wenn sich die .css Datei im Pfad /vis.0/main/colorpicker/colorpicker.css befindet, ist das denn der Link den ich im HTML Widget als href eintrage?
<head>
<meta charset="utf-8">
<title>The Color Picker</title>
<link rel="stylesheet" href="/vis.0/main/colorpicker/colorpicker.css"/>
</head>So hat es leider nicht geklappt
-
@florian-2
ich schreibe das css immer in den html code - <style>...</style>, daher - noch nie so genutzt - ich nutzte auch keinen<head> usw.z.b. direkt im html widget:
beispiel:<style> div.my1test { background: conic-gradient(#eee .1turn, black, #eee 326deg); height: 50px; width: 50px; border-radius:50%; } </style> <div class="my1test rotating"> </div> -
Okay, dann werde ich es erstml auf diesem Wege probieren.
Es würde mich dennoch interesieren wie ich eine externe Css Datei in das HTML Widget einfügen kann.
-
meine vermutung ist: das es nicht funktioniert, eine solche datei einzubinden. du definierst ja in der vis keine webseite, sondern bist schon in der webseite und fügst etwas dazu
grund: https://stackoverflow.com/questions/7575384/html-multiple-heads
es sind ja möglichkeiten da - über die tabs "script" und "css" im vis editor und über das style-tag im widget selbst - mir ist das genug - aber evtl weiß jmd anders näheres oder eine lösung für deine frage
