frank/streamertool
Watch
1
0
Fork
You've already forked streamertool
 0
Code Issues 62 Pull requests 6 Projects Releases Packages Wiki Activity Actions

Custom Widget API: HTML/CSS/JS-Widgets und Overlay-Galerie #38

New issue
Open
opened 2026-07-15 18:55:33 +02:00 by frank · 0 comments
frank commented 2026-07-15 18:55:33 +02:00
Owner
Copy link

Kontext

Streamlabs, StreamElements und Meld Studio erlauben benutzerdefinierte Widgets (HTML/CSS/JS). Streamertool hat nur gebündelte Overlays und Extensions.

Eine Widget-API ermöglicht der Community, eigene Overlays, Alerts und Interaktionen zu bauen.

Ziel

  • Widget-API: Benutzerdefinierte HTML/CSS/JS-Widgets via Overlay-Server
    • Zugriff auf Event-Bus (WS/SSE)
    • Eigene Konfiguration via URL-Parameter
    • Keine Extension-ZIP nötig (einfacher als #4)
  • Widget-Manager in Admin-UI: Widgets hinzufügen, konfigurieren, aktivieren/deaktivieren
  • Widget-Galerie: Öffentliche Sammlung von Widgets zum Download
  • Vorlagen: Starter-Templates für eigene Widgets
  • Beispiel-Widgets: Countdown, Stream Labels, Now Playing, Viewer Count

Technische Leitplanken

  • Widgets sind einfache HTML-Dateien im Overlay-Verzeichnis
  • Event-Bus-Zugriff via integriertem WS-Client im Widget-Sandkasten
  • Sicherheit: Widgets laufen in isoliertem IFrame (Sandbox-Attribut)
  • Doku: Widget API Reference in docs/

Akzeptanz

  • Benutzerdefiniertes HTML-Widget kann im Overlay geladen werden
  • Widget hat Zugriff auf Event-Bus (WS/SSE)
  • Widget-Manager erlaubt Hinzufügen und Konfigurieren
  • Mindestens 2 Beispiel-Widgets liegen bei
  • Widget-Sandbox verhindert schädlichen Code
## Kontext Streamlabs, StreamElements und Meld Studio erlauben benutzerdefinierte Widgets (HTML/CSS/JS). Streamertool hat nur gebündelte Overlays und Extensions. Eine Widget-API ermöglicht der Community, eigene Overlays, Alerts und Interaktionen zu bauen. ## Ziel - **Widget-API**: Benutzerdefinierte HTML/CSS/JS-Widgets via Overlay-Server - Zugriff auf Event-Bus (WS/SSE) - Eigene Konfiguration via URL-Parameter - Keine Extension-ZIP nötig (einfacher als #4) - **Widget-Manager in Admin-UI**: Widgets hinzufügen, konfigurieren, aktivieren/deaktivieren - **Widget-Galerie**: Öffentliche Sammlung von Widgets zum Download - **Vorlagen**: Starter-Templates für eigene Widgets - **Beispiel-Widgets**: Countdown, Stream Labels, Now Playing, Viewer Count ## Technische Leitplanken - Widgets sind einfache HTML-Dateien im Overlay-Verzeichnis - Event-Bus-Zugriff via integriertem WS-Client im Widget-Sandkasten - Sicherheit: Widgets laufen in isoliertem IFrame (Sandbox-Attribut) - Doku: Widget API Reference in docs/ ## Akzeptanz - [ ] Benutzerdefiniertes HTML-Widget kann im Overlay geladen werden - [ ] Widget hat Zugriff auf Event-Bus (WS/SSE) - [ ] Widget-Manager erlaubt Hinzufügen und Konfigurieren - [ ] Mindestens 2 Beispiel-Widgets liegen bei - [ ] Widget-Sandbox verhindert schädlichen Code
Sign in to join this conversation.
No Branch/Tag specified
Branches Tags
main
agent/issue-83-sub-alert-mit-prime-sub-gift-sub-bomb-va
agent/issue-81-follow-alert-konfiguration-mit-text-medi
agent/issue-86-alert-enable-disable-toggle-volume-steue
agent/issue-80-alert-medien-verwaltung-upload-zuweisung
agent/issue-79-alert-text-vorlagen-system-mit-variablen
agent/issue-87-standard-textvorlagen-bibliothek-für-tw
agent/issue-20-assistent-links-öffnen-keinen-browser
feat/twitch-eventsub-1
No results found.
Labels
Clear labels   
agent:done
Managed by forge agent

  
agent:ready
Managed by forge agent

  
agent:working
Managed by forge agent

  
area:analytics
Analytics, Goals, Sentiment, Reports, Chat Analytics

  
area:chatbot
Chatbot, Moderation, Minispiele, AI-Integration

  
area:community
Community, Loyalty, Multi-Chat, Polls, Guest Streams

  
area:content
Clips, Video, AI Clip Creation, Social Media Posting

  
area:hardware
Stream Deck, MIDI, Beleuchtung, Kameras, Capture Cards

  
area:health
Bio-Sensor, Health & Wellness, Accessibility, Captions

  
area:media
Audio, Musik, SFX, TTS, Voice Changer, Song Requests

  
area:monetization
Monetarisierung, Donations, Tips, Interactive Cards

  
area:overlays
Widgets, Overlays, Media Loop, Custom Widgets

  
area:productivity
Stream Planning, Content Calendar, Show Runner

  
area:streaming
Multi-Platform, Streaming-Infrastruktur, Restream

  
bug
Something is not working

  
duplicate
This issue or pull request already exists

  
effort:large
Großer Aufwand – mehrere Tage bis Wochen

  
effort:medium
Mittlerer Aufwand – wenige Tage

  
effort:small
Geringer Aufwand – wenige Stunden

  
enhancement
New feature

  
good-first-issue
Guter Einstieg – für neue Mitwirkende geeignet

  
help wanted
Need some help

  
invalid
Something is wrong

  
priority:backlog
Backlog – kann warten, keine zeitliche Dringlichkeit

  
priority:critical
Kritisch – muss sofort bearbeitet werden

  
priority:high
Hohe Priorität – sollte bald bearbeitet werden

  
priority:low
Niedrige Priorität

  
priority:medium
Mittlere Priorität

  
question
More information is needed

  
quick-win
Schnell umsetzbar, hoher Nutzen – lohnt sich sofort

  
wontfix
This won't be fixed

No labels
agent:done
agent:ready
agent:working
area:analytics
area:chatbot
area:community
area:content
area:hardware
area:health
area:media
area:monetization
area:overlays
area:productivity
area:streaming
bug
duplicate
effort:large
effort:medium
effort:small
enhancement
good-first-issue
help wanted
invalid
priority:backlog
priority:critical
priority:high
priority:low
priority:medium
question
quick-win
wontfix
Milestone
Clear milestone
No items
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
frank/streamertool#38
No description provided.