As defined in Wikipedia:

Social viewing (also known as Watch Party or GroupWatch) describes a recently developed practice revolving around the ability for multiple users to aggregate from multiple sources and view online videos together in a synchronized viewing experience. Typically the experience also involves some form of instant messaging or communication to facilitate discussion pertaining to the common viewing experience.

Goals

This project was made exactly for this experience with some goals in mind:

1. Allowing both the host and the viewers to watch the same screen (whereas usually the host controls the video without actually seeing it).
2. Relying on pure HTML5 <video> usage.
3. Supporting SRT subtitles/captions (known in HTML5 videos as tracks).
4. Supporting (foreign) non Unicode subtitles.
5. Only relying on client side Vanilla JS code, so anybody could use it without installing anything.
6. Allowing to choose a margin for the subtitles, as some TVs cut them off if they're stuck to the default bottom.
7. Including a 1 sided chat (to be shown over Chromecast) plus a bot.

Usage

1. Choose a local video.
2. (Optionally) Choose local subtitles/captions.
3. (Optionally) Choose a margin subtitles/captions. Negative means from the player's bottom and Positive means from the player's top.
4. (Optionally) set the host's name for the chat.
5. (Optionally) Cast the tab or screen to Chromecast (keep in mind in Chromecast only the host has control).
6. Enjoy the social viewing!

History

Goals 2-5 goals clashed because track not only doesn't support non Unicode, it only supports VTT subtitles and not local ones. In other words, you have to both convert your regular SRT subtitles into Unicode, then into VTT, then upload them and use online links instead of just your computer files.

Goal 3 was specifically challenging as track seemingly doesn't have a built-in way to set margin.

Goal 4 was problematic because practically almost all chats out rely on servers, while int this case it's a complete overkill if only the host gets to chat anyway (as the rest just see it over Chromecast).

These challenges were handled by:

1. Using URL.createObjectURL to convert the subtitles into blobs and thus bypass track's server requirement.
2. Combining SRT-Support-for-HTML5-videos with Detect-File-Encoding-And-Language.
3. Running a loop to modify each textTracks' cues' line in the subtitles/captions' margin.
4. Designing an upgraded version of Simple Chat UI to make it more dynamic, support embedding/integrating through an iframe and include a bot.

These actions are all event driven to allow the user to change the video, subtitles/captions and margin setting at all times.

Notes

This project can't compete with this watchparty project which has many other features. However, the project here also has advanages:

1. It's new whereas the aforementioned project died somewhere in 2021.
2. It supports Play/Pause when clicking the central video without Clicking Pause causes a mute (but clicking Play doesn't cause an unmute) - both fixed in their source code by now, but not in their official release yet.
3. There's no white overlay after subtitles/captions were uploaded - in fact, there's no uploading!
4. It supports Control subtitle/caption line position/margin.

Screenshot