Hallo zusammen,
ich bastele aktuell an einem Live-Scoreboard für einen Sport-Livestream auf Basis von HTML, CSS und Javascript. In OBS (Open Broadcaster Software) kann ich eine "Admin-Panel"-HTML-Datei in das Interface integrieren, weshalb diese Lösung mir sehr entgegen kommt und recht simpel ist.
Das Scoreboard ist auch soweit funktionabel. Punkte, Sätze und Gesamtspielstand (es geht hier um Badminton) kann ich per Button-Klick im Admin-Panel direkt in OBS steuern. Allerdings muss ich aktuell noch die Spieler- und Teamnamen händisch in den Code einpflegen. Das funktioniert nicht so super, da OBS die hinterlegten Dateien in seinem eigenen integrierten Browser öffnet, aber nicht aktualisiert, sollte die Datei verändert worden sein. Das ist natürlich sehr ärgerlich, da ich während einem Spiel, das ich übertrage, 8x die jeweilige Begegnung neu eingeben muss.
Um ein manuelles aktualisieren (mit eventuellen OBS-Browser-Problemen dabei) zu verhindern, sodass der Livestream jederzeit über einen aktuellen Spielstand verfügt, wollte ich nun auch mehrere <input>'s ins Admin-Panel einfügen, in denen man die jeweiligen Felder direkt in OBS kurz vor der Übertragung eintragen kann.
Bei den Buttons war das auch kein Problem. Die Umsetzung mit dem Input macht mir allerdings große Probleme. Ich bekomme den eingegebenen Text einfach nicht in die andere Datei rein. Ich habe das ganze schon auf mehrere Arten versucht (unter anderem auf die gleiche wie mit den Buttons zur Erhöhung des Punktestands), aber es hat bisher nichts geholfen. Nach 20 Stunden des Herumprobierens wende ich mich nun doch an andere Javascript-Kennende (ich bin übrigens ein recht blutiger Anfänger mit einiger Web-Vorerfahrung von vor 15 Jahren in u.a. PHP, CSS, HTML. D.h. ich verstehe evtl nicht alles, aber kann es mir durchaus erarbeiten), da ich sonst aufgebe.
Ich habe den zuletzt verwendeten Code versucht zu vereinfachen, um mir die Logik klarzumachen und es dann in meinen Code einzufügen. Deshalb habe ich mir 2 Dateien erstellt: 1.) Die Datei mit dem Text, der verändert werden soll und 2.) die Datei mit dem Input-Feld, das den Text für die Übertragung in die andere Datei stellt. Beide Dateien enthalten auch zumindest ein wenig Javascript-Code. Ich arbeite mit localStorage, um die Informationen auf die andere Seite zu bringen.
So sieht der (vereinfachte) Code aus (den ich in genau dieser vereinfachten Variante erstmal zum Laufen bringen möchte): ----sorry, kann den Code hier wegen einem Fehler im Board bei der Übermittlung nicht als Code ausweisen. Deshalb angehängt als Dateien über den (allseits bekannten?) Filehoster Filehorst :P ----- Und vergesst die Dateinamen und Überschriften. Ich wollte lediglich mal irgendwas ausprobieren, nachdem ich im Originalcode die Übersicht nicht zerstören wollte. Dateinamen machen also nicht soviel Sinn:
Datei von filehorst.de laden
Datei von filehorst.de laden
Könnt ihr mir helfen ? Was mache ich falsch, bzw gibt es etwas besonderes zu beachten bei input-Feldern ?
LG Marius
ich bastele aktuell an einem Live-Scoreboard für einen Sport-Livestream auf Basis von HTML, CSS und Javascript. In OBS (Open Broadcaster Software) kann ich eine "Admin-Panel"-HTML-Datei in das Interface integrieren, weshalb diese Lösung mir sehr entgegen kommt und recht simpel ist.
Das Scoreboard ist auch soweit funktionabel. Punkte, Sätze und Gesamtspielstand (es geht hier um Badminton) kann ich per Button-Klick im Admin-Panel direkt in OBS steuern. Allerdings muss ich aktuell noch die Spieler- und Teamnamen händisch in den Code einpflegen. Das funktioniert nicht so super, da OBS die hinterlegten Dateien in seinem eigenen integrierten Browser öffnet, aber nicht aktualisiert, sollte die Datei verändert worden sein. Das ist natürlich sehr ärgerlich, da ich während einem Spiel, das ich übertrage, 8x die jeweilige Begegnung neu eingeben muss.
Um ein manuelles aktualisieren (mit eventuellen OBS-Browser-Problemen dabei) zu verhindern, sodass der Livestream jederzeit über einen aktuellen Spielstand verfügt, wollte ich nun auch mehrere <input>'s ins Admin-Panel einfügen, in denen man die jeweiligen Felder direkt in OBS kurz vor der Übertragung eintragen kann.
Bei den Buttons war das auch kein Problem. Die Umsetzung mit dem Input macht mir allerdings große Probleme. Ich bekomme den eingegebenen Text einfach nicht in die andere Datei rein. Ich habe das ganze schon auf mehrere Arten versucht (unter anderem auf die gleiche wie mit den Buttons zur Erhöhung des Punktestands), aber es hat bisher nichts geholfen. Nach 20 Stunden des Herumprobierens wende ich mich nun doch an andere Javascript-Kennende (ich bin übrigens ein recht blutiger Anfänger mit einiger Web-Vorerfahrung von vor 15 Jahren in u.a. PHP, CSS, HTML. D.h. ich verstehe evtl nicht alles, aber kann es mir durchaus erarbeiten), da ich sonst aufgebe.
Ich habe den zuletzt verwendeten Code versucht zu vereinfachen, um mir die Logik klarzumachen und es dann in meinen Code einzufügen. Deshalb habe ich mir 2 Dateien erstellt: 1.) Die Datei mit dem Text, der verändert werden soll und 2.) die Datei mit dem Input-Feld, das den Text für die Übertragung in die andere Datei stellt. Beide Dateien enthalten auch zumindest ein wenig Javascript-Code. Ich arbeite mit localStorage, um die Informationen auf die andere Seite zu bringen.
So sieht der (vereinfachte) Code aus (den ich in genau dieser vereinfachten Variante erstmal zum Laufen bringen möchte): ----sorry, kann den Code hier wegen einem Fehler im Board bei der Übermittlung nicht als Code ausweisen. Deshalb angehängt als Dateien über den (allseits bekannten?) Filehoster Filehorst :P ----- Und vergesst die Dateinamen und Überschriften. Ich wollte lediglich mal irgendwas ausprobieren, nachdem ich im Originalcode die Übersicht nicht zerstören wollte. Dateinamen machen also nicht soviel Sinn:
Datei von filehorst.de laden
Datei von filehorst.de laden
Könnt ihr mir helfen ? Was mache ich falsch, bzw gibt es etwas besonderes zu beachten bei input-Feldern ?
LG Marius
Comment