1. Touch Portal runterladen und Installieren
Ladet das Programm erstmal an eurem Rechner (Windows/Mac) herunter und installiert es erstmal, anschließend solltet Ihr die App auch auf eurem Smartphone/Tablet herunterladen und dort dann auch die Vollversion EINMALIG kaufen, da Ihr diese für die Event-Funktion benötigt, welche wir wiederum für das heutige Tutorial benötigen.
2. Touch Portal Verbinden
Als erstes solltet Ihr die App auf dem Smartphone mit dem Programm auf dem PC verknüpfen, dazu solltet Ihr am besten im selben Netzwerk sein, oder einfach Manuell, denn am PC steht unten Links die IP-Adresse die Ihr dann in der App eingeben müsst um das ganze miteinander zu verbinden. Dadurch wird auch auf eurem PC die Vollversion der Software Freigeschaltet, also auch die Event-Funktion.
Danach ist es wichtig Touch Portal noch mit Twitch zu verbinden, schließlich wollen wir ja von dort die Steuerung, also den "Trigger" uns zukommen lassen, der dann bei uns etwas steuert, egal ob das jetzt nun das Licht, Musik, eine bestimmte Kamera Szene in OBS, oder oder oder ist....
Dafür gehen wir in die Einstellungen in Touch Portal und dort dann auf "Twitch" wir wir 2 Tokens hinzufügen müssen, hier finde ich es übrigens auch sehr Angenehm gelöst das man hier keine Login Daten hinterlegen muss, sondern eben mit Tokens gearbeitet wird, das ist meiner Meinung nach wesentlich Sicherer und Vertrauenswürdiger. Wenn Ihr bereits im Browser auf Twitch eingeloggt seid, braucht Ihr nur kurz die beiden Button im Programm zu klicken, woraufhin der Browser sich mit einem Token öffnet, welches Ihr nur kopieren und einfügen müsst.
3. Verbindung zu ioBroker (Falls Ihr damit euer SmartHome steuert)
Hier müsst Ihr als erstes den "simple-api" Adapter installieren und die Instanz auch aktivieren damit euer ioBroker dadurch mit Touch Portal über den Port 8087 kommunizieren kann, wo Ihr dann die verschiedenen Befehle via HTTP-Request rein schicken könnt.
4. Objekt anlegen/auswählen welches gesteuert werden soll
Falls Ihr direkt ein Status eines Objektes (z.b. Einer Lampe) steuern möchtet dann braucht Ihr natürlich kein neues Objekt anlegen, da ich aber mehrere Objekte gleichzeitig steuern möchte, oder eben auch mehrere Befehle ausführen möchte wenn etwas angesteuert wird, lege ich ein separates Objekt an welches ich dann später in einem Blockly Skript verwenden kann und mit dem Status (true/false) des erzeugten Objektes, dann den Status weiterer Objekte ansteuern kann.
Zum Anlegen des Objektes müsst ihr oben den Experten Modus einschalten (oben auf den Kopf neben dem ioBroker Logo) und ich lege die Objekte immer in dem Instanz Verzeichnis an welche unmittelbar mit der Steuerung der Geräte zutun hat, also in diesem Fall im Unterverzeichnis "simple-api/admin/". Dort klickt Ihr dann drauf um genau dort das neue Objekt zu erzeugen und dann oben auf das "+" dann bei Typ einfach auf "Datenpunkt" bei Zustandstyp auf "object" und bei Name einfach den Namen eintragen, dann sollte das Objekt auch richtig funktionieren wie es soll. ansonsten könnt Ihr auch hier nochmal schauen ob euer Objekt von den Einstellungen mit meinem Exemplarischen übereinstimmt...
{
"common": {
"name": "Twitch_Sub",
"desc": "Manuell erzeugt",
"role": "state",
"type": "object",
"read": true,
"write": true
},
"type": "state",
"from": "system.adapter.admin.0",
"user": "system.user.admin",
"ts": 1626364289070,
"_id": "simple-api.admin.Twitch_Sub",
"acl": {
"object": 1636,
"state": 1636,
"owner": "system.user.admin",
"ownerGroup": "system.group.administrator"
}
}5. Blockly Skript erzeugen
Für das Blockly Skript wählt Ihr in der Steuerung natürlich erstmal euer erzeugest Objekt aus und dann die Geräte die angesteuert werden sollen mit "true" oder "false". Hierfür könnt Ihr einfach meine Blöcke importieren und entsprechend anpassen, dafür einfach folgendes kopieren und bei ioBroker auf "Blöcke importieren...
<xml xmlns="https://developers.google.com/blockly/xml">
<block type="on_ext" id="T9bGVBbB*.@kFu5]?jQN" x="-987" y="88">
<mutation xmlns="http://www.w3.org/1999/xhtml" items="1"></mutation>
<field name="CONDITION">ne</field>
<field name="ACK_CONDITION"></field>
<value name="OID0">
<shadow type="field_oid" id="oj_0pWLpC+O,cjg+EVjB">
<field name="oid">simple-api.admin.Studiolicht_Twitch</field>
</shadow>
</value>
<statement name="STATEMENT">
<block type="controls_if" id="i4Jsexh?C8`ZoBNxJ.g[">
<value name="IF0">
<block type="logic_compare" id="_h~}LPhI,Qcc|Kc*w)o0">
<field name="OP">EQ</field>
<value name="A">
<block type="get_value" id="(Kli_$2K/*veJ;?-L!.S">
<field name="ATTR">val</field>
<field name="OID">simple-api.admin.Studiolicht_Twitch</field>
</block>
</value>
<value name="B">
<block type="logic_boolean" id="*!1pTt)8]nEO(KK_t*Up">
<field name="BOOL">TRUE</field>
</block>
</value>
</block>
</value>
<statement name="DO0">
<block type="control" id="u]Mlm[RzrHGFek+g`2LD">
<mutation xmlns="http://www.w3.org/1999/xhtml" delay_input="false"></mutation>
<field name="OID">sonoff.0.Sonoff-Studio-Licht.POWER</field>
<field name="WITH_DELAY">FALSE</field>
<value name="VALUE">
<block type="logic_boolean" id="9Ogv669%IhRcwR%zN6X*">
<field name="BOOL">TRUE</field>
</block>
</value>
<next>
<block type="control" id=":.yp~Ggvu8A]zN=lvvh!">
<mutation xmlns="http://www.w3.org/1999/xhtml" delay_input="false"></mutation>
<field name="OID">yeelight-2.0.ct_bulb-0x000000000531b076.control.power</field>
<field name="WITH_DELAY">FALSE</field>
<value name="VALUE">
<block type="logic_boolean" id="HqA~kGfFBO5xt{j,P|-O">
<field name="BOOL">TRUE</field>
</block>
</value>
<next>
<block type="control" id=",ZJcXm?G[gw$3gOcBjA5">
<mutation xmlns="http://www.w3.org/1999/xhtml" delay_input="false"></mutation>
<field name="OID">yeelight-2.0.stripe-0x0000000004cdb91c.control.power</field>
<field name="WITH_DELAY">FALSE</field>
<value name="VALUE">
<block type="logic_boolean" id="*],H%oiYyvRn)5h1`Mqi">
<field name="BOOL">TRUE</field>
</block>
</value>
</block>
</next>
</block>
</next>
</block>
</statement>
<next>
<block type="controls_if" id="2%!ujj$8MvyY}wlS|9vH">
<value name="IF0">
<block type="logic_compare" id="4_db#)B}@*DcWC$|n#Y6">
<field name="OP">EQ</field>
<value name="A">
<block type="get_value" id="J6z%.{1sGhE#nb`ANz2a">
<field name="ATTR">val</field>
<field name="OID">simple-api.admin.Studiolicht_Twitch</field>
</block>
</value>
<value name="B">
<block type="logic_boolean" id="pR.2=J-f1u@E1sp:N.AQ">
<field name="BOOL">FALSE</field>
</block>
</value>
</block>
</value>
<statement name="DO0">
<block type="control" id="z/;@WbU$=!FV_Dz4stFO">
<mutation xmlns="http://www.w3.org/1999/xhtml" delay_input="false"></mutation>
<field name="OID">sonoff.0.Sonoff-Studio-Licht.POWER</field>
<field name="WITH_DELAY">FALSE</field>
<value name="VALUE">
<block type="logic_boolean" id="#$b^^ya:ls0*zwq%te*s">
<field name="BOOL">FALSE</field>
</block>
</value>
<next>
<block type="control" id="4Uqj8^@=C`O8Aa*@JM}7">
<mutation xmlns="http://www.w3.org/1999/xhtml" delay_input="false"></mutation>
<field name="OID">yeelight-2.0.ct_bulb-0x000000000531b076.control.power</field>
<field name="WITH_DELAY">FALSE</field>
<value name="VALUE">
<block type="logic_boolean" id="%FbQ|o:FH%wBN6XS#LOW">
<field name="BOOL">FALSE</field>
</block>
</value>
<next>
<block type="control" id="vWP$Mfy]I#dJY~?xxZ#L">
<mutation xmlns="http://www.w3.org/1999/xhtml" delay_input="false"></mutation>
<field name="OID">yeelight-2.0.stripe-0x0000000004cdb91c.control.power</field>
<field name="WITH_DELAY">FALSE</field>
<value name="VALUE">
<block type="logic_boolean" id="E7~ML^J?f`eDN%KJ?%nB">
<field name="BOOL">FALSE</field>
</block>
</value>
</block>
</next>
</block>
</next>
</block>
</statement>
</block>
</next>
</block>
</statement>
</block>
</xml>6. Twitch Belohnung für Kanalpunkte erstellen
Einfach im Twitch Creator-Dashboard links an der Seite auf "Zuschauer Belohnungen" und dann dort auf kanalpunkte klicken wo Ihr die entsprechenden Sachen einstellen könnt so wie ich es im Video zeige. Wichtig ist hierbei das Ihr den Namen exakt so vergebt wie Ihr ihn dann später auch in Touch Portal eintragt. Wichtig ist der Haken bei "Warteschlange für Belohnungsanfragen überspringen" damit das ganze am ende auch automatisch funktioniert wenn jemand Kanalpunkte einlöst.
7. Event bei Touch Portal hinzufügen
Dafür einfach am Rechner im Programm links an der Seite auf "Events" klicken und dann dort oben über "Event hinzufügen", ein neues Event hinzufügen welches Ihr für die Einlösung der Kanalpunkte dann wie folgt einstellen müsst. Beim "Namen" empfehle ich euch schon direkt den gleichen Namen zu verwenden wie die Belohnung für die Kanalpunkte auch bei Twitch heißt (für Sub/Rain/Host ist es eigentlich egal), bei "Event" wählt Ihr in der Liste "Twitch - Wenn Kanalpunkte eingelöst", Abklingzeig und Ablaufspur sind eigentlich egal und dadurch das Ihr bei "Event" das mit den kanalpunkten Eingestellt habt ist nun ein neues grünes Feld dazu gekommen wo Ihr hinten auf die etwas dunklere Fläche klicken müsst und dort dann exakt den selben Namen eintragen müsst wie Ihr auch die Individuelle Belohnung im Twitch Creator-Dashboard" benannt habt.
Nachdem Ihr das dann gemacht habt, könnt Ihr links auf der Seite dann die entsprechende Aktion auswählen. In unserem Fall, da wir ja den ioBroker ansteuern möchten, ist das dann unter "Http" die Aktion "Http Get". Wenn Ihr da links an der Seite in der Liste drauf klickt öffnet sich ein Fenster "HTTP GET ACTION" wo Ihr dann die folgende URL (Angepasst auf eueren ioBroker & Objekt und die Value true oder false) eintragen müsst, die anderen beiden Punkte sind hierfür irelevant.
http://192.168.178.21:8087/set/simple-api.admin.Studiolicht_Twitch?value=trueHier nochmal die gleiche URL aber mit Erklährung
http://ioBroker-IP:8087/set/Objekt_Pfad.Erzeugtes_Objekt?value=true/fals (An oder Aus)Dann auf "Hinzufügen" klicken damit der HTTP-Request auch als Aktion hinzugefügt wird und dann unten Rechts das Event Speichern damit es auch aktiv ist.
Sobald Ihr dann streamt und das Programm im Hintergrund offen habt, wird die Aktion auch funktionieren 
