• If you need help or want to discuss things, you now can also join us on our Discord Server!
SyncWatch

TS3 SyncWatch 1.4-1

No permission to download
Required SinusBot Version
1.0
Compatible Backends
TeamSpeak 3
INTRO
Da ich nun mit der Entwicklung recht weit vorangeschritten bin, wollte ich nun mein Ergebnis mal präsentieren:

Es ist ein Webinterface für den Sinusbot, das den Sinn hat, Youtube-Videos gemeinsam und zeitgleich (Latenz < 100ms) ansehen zu können. Das Video bzw. der Player wird dazu synchron mit dem aktuell abgespeilten Track des Sinusbot gehalten.

Wenn ein Video mal auf youtube nicht gefunden wird oder die Rechte fehlen, wird ein Audio-Stream aufgemacht.

Auf der Weboberfläche gibt es in der Sidebar einige Möglichkeiten den Bot zu steuern - sofern man die entsprechenden Rechte dafür vergibt. Eingeloggt muss man dazu auch sein.

Wenn was nicht direkt klappt, einfach mal die Seite neu laden oder neu aus- und einloggen - ich werde weiter an Fixes arbeiten, um sowas in Zukunft auszumerzen.

Kritik, Verbesserungsvorschläge oder sonstige Anmerkungen werden immer gerne gesehen! Bugs natürlich nicht, aber bringt sie mir bitte, wenn ihr welche findet :)
Since I have progressed with the development quite far, I wanted to present my results now:

A web interface for the Sinusbot, which enables you to watch the currently playing title (has to be loaded per !ytdl or !yt) synchronized to the bot in a youtube window with a latency of less than 100ms.
Also, there is webstream support now for audio-files that cannot be located on youtube and a fallback for tracks that have been played via !yt.

Just have a look at the webinterface, especially the sidebar that you can open up after logging in to see what you can do.

Criticism, suggestions for improvement or other comments are always welcome! Bugs of course not, but bring me please if you find some :)

HOWTO
Install
1. Install the script like any other by dropping the script *.js file and the folder from the archive into your sinusbot/scripts folder.

a. Edit the server configuration file (config.ini) and edit/set the following values:
IsProxied = true // depends on your use-case
EnableWebStream = true // if you want to use it, otherwise leave it
[Scripts]
AllowReload = true // optional, but can be used via !ytr-chatcommand
EnableTimer = true // was required once, not sure about it now
DisableLegacyEvents = false // not sure if needed

2. Create a user for the webinterface so the sinusbot-script is able to generate a token from it. This step is optional because you can use the login dialog on the webinterface.

a. Give permissions: You basically only need to give [LOGIN] permission for the script to work, but if you want to control the bot via UI you also have to allow [PLAYBACK] and [MANAGE INSTANCES]. If you specify admin credentials or a user with full permissions, you have to be careful, since advanced users could read out the token and control your bot with it (or maybe worse).

chrome_2018-07-12_11-56-53.png


b. let your bot listen to commands if you want to use them

chrome_2018-07-12_11-41-19.png


c. If no token is given and you try to login to the webinterface, then the webinterface will ask for username and password to store until the token invalidates or you log out.

3. Activate the script in your sinusbot script settings and configure the script settings. Save.

chrome_2018-07-12_11-58-26.png

The custom chat message option may not be available to you yet! Just wait for a new release.

4. Enjoy!



Basic Usage
- Write !sw to the ts3-bot via teamspeak private message and you will get back an authenticated Link to the web interface.
- Write !swc and everyone in bot channel will get a link
Note: If that does not work, you can go also open it via your sinusbot script settings by clicking the name of the script or navigate to /scripts/syncwatch manually.

Public URL (re-)routing (optional)
If you provided a custom url via config, you will most probably need to setup your routing for it to work. I can provide you with my apache virtualhost config at least:

ProxyPass /api http://localhost:8087/api
ProxyPassReverse /api http://localhost:8087/api

ProxyPass / http://localhost:8087/scripts/syncwatch/
ProxyPassReverse / http://localhost:8087/scripts/syncwatch/

FEATURES
Webinterface
  • Login via Username and Password or URL parameters (generated through text-chat command !sw or !swc)
  • Instance-Selection
  • Media-Player that is being synchronized to the sinusbot instance
    • !ytdl and !yt supported
    • WebStream-fallback for titles not found on youtube (audio only)
  • Sidebar with bot-controls, tools and settings
    • Search for tracks in library
    • Play/Pause/Stop/Previous controls
    • Add new download or streaming job
    • TS3-Channel-list with possibility to navigate through channels and see whos online
Chatcommands
  • see below

COMMANDS
You can use these chatcommands on sinusbot that listens to chatcommands via teamspeak.
  • !sw: returns a link to SyncWatch in private chat
  • !swc : posts the link in channel chat
  • !swr : reloads all scripts

TASKS
TODO
- html5-player-theme
- volume controls
- instance respawn buttons (start, stop instance)
- chatroom on webinterface?
- handle yt-(player-)errors in a more efficient way

DONE
- added possibility to download and stream new tracks via webinterface
- better fallback mechanism in case of media errors (e.g. youtube-permissions)
- added support for streaming tracks played via !yt
- improved overall layout, style and stability
- migrated code and configs for compatibility with sinusbot 1.0a6
- verified sinusbot 1.0 integration
- added progress-stepper
- re-implemented mediaplayers
- re-implemented player-controls
- re-implemented instance-selection
- re-implemented login interface
- re-implemented sidebar
- re-integrated job-list
- re-integrated ts-list
- refactored and refurbished components: mediaplayer, trackinfo, bot-controls, login, instance-selection
- moved from vue to react
- added teamspeak3 channel list in sidebar
- upgrade to sinusbot 0.13.37
- adjustable syncing intervals
- implement web-streaming
- moved controls to sidebar
- added overlay when in sync mode
- moved to vue
- minified most parts for performance
- fix sync when running in background (to prevent lagging)
- improve prev play stop track control
- fix ui bugs when using controls too much
- add instance selection
- finish login
- implemented en-/disabling of some sections in certain contexts
- implemented authorization via web interface
- added dropdown for better track selection
- added an input field for playing already loaded tracks on submit
- added play, stop, prev buttons for controlling the sinusbot instance
- added currently running track info
- implemented url routing for authorization via teamspeak-link
- implemented synchronization from sinusbot (server) to youtube-player (client) for !ytdl-title
- embedded youtube player
- added seconds parameter
- added configuration parameters for username and password to be used by the script
- created sinusbot script for generating link to the youtube title running

Again, please report bugs! Thanks!
Bitte bringt mir alle eure Käfer. Vielen Dank!


chrome_2019-04-26_21-30-13.png
  • Like
Reactions: Roflmate and flyth
Author
vincolus
Downloads
538
Views
1,410
First release
Last update
Rating
4.60 star(s) 15 ratings

Latest updates

  1. Minor bugs fixed, compatibility with other scripts increased

    - used event "track" for parsing and storing url information - limited maximum width - fixed a...
  2. !yt-support finally done

    yt-support-preview-release After I finished the react refactoring, I was finally able to...
  3. Syncwatch React Refurbish

    Syncwatch has now completely moved to react! I had a hard time refactoring from vanilla js to...

Latest reviews

Great script, can't wait for future development. And personal thanks to vincolus for ironing out an issue i had.
vincolus
vincolus
That's nice to hear! :) Thanks for pointing out the issue!
Das Script an sich ist funktionstüchtig. Jedoch zwei kleine Anmerkungen / Verbesserungsvorschläge:
1. Beim Klicken auf "Stop" über die GUI erhält man eine Loop des Videos / Sounds (und nicht wie eigentlich zu erwarten, dass das Video stoppt).
2. Ändere doch bitte in der index.html Datei den Type der Passworteingabe von "text" zu "password", damit das Passwort bei der Eingabe nicht im Klartext sichtbar ist.
vincolus
vincolus
Hi SecureIM,

ich sehe zu, dass ich das noch mit dem nächsten Update fixe.
Danke für das Review!
Gutes Script!
vincolus
vincolus
Danke, nett von dir! Update kommt demnächst.
Finde die Idee und das Script super. Doch leider bekomme ich es nicht installiert. Es funktioniert immer irgendetwas nicht. Sobald ich es hinbekomme gibt es auch 5 Sterne :D
vincolus
vincolus
Wie kann ich helfen? Und was genau versuchst du?
LG vincolus
Works! i hope you finish !yt support soon :D
vincolus
vincolus
Thanks! Currently I am having lots of unfinished projects that I am also working on, but I got it working locally a few weeks earlier.
I could provide a test-release, but since I recreated almost the whole webinterface using a templating engine there are quite a few bugs left that I currently cannot care about...
Great script man. So far everyone on my server seems to get a kick out of it. maybe for the next update let use change the out going message for each command and custom them.
vincolus
vincolus
Hey, that's really nice to hear! What kind of messages would you like to customize? Can you give an example, please?
I really support your script and your script is the best for me
vincolus
vincolus
thanks, that's nice to hear! :)
Add-Youtube-Download ist ausgegraut, was kann ich tun?
vincolus
vincolus
Diese Funktion ist ausgegraut, weil sie mit der nächsten Version kommen sollte. Also alles normal - außer, dass es noch nicht funktioniert ;)
Gucke zusammen mit anderen in echtzeit Videos, ganz einfach und ohne Probleme. Ein großartiges Script für alle, die gerne mal zusammen mit anderen Videos gucken möchten. Einfache Installation, ein grandioses kostenloses und funktionierendes Script und schnellen Support per Nachricht vom Autor, was möchte man mehr? Watch2Gether und ähnliche Plattformen werden mit dem Script nicht mehr benötigt, alles wichtige könnt ihr ab sofort über das Script mit dem Sinusbot machen.
vincolus
vincolus
Ein Traum von einem Review. Danke ;)
very good addon! :) great job
but i'm getting Sorry, but SyncWatch has insufficient permission to do this. and i give playback and login perm on bot
vincolus
vincolus
that's strange. do you authenticate via teamspeak? can you post more details? thanks
Top