Ethically fair react streaming platform

Bobsiboo · November 20, 2023

After the recent drama in streamer world about stealing content/viewers by reacting,

And also after hearing Linus mention this a few times in the WAN show that he is looking for a just way to to this got me thinking about a way to do this,
However my developing skills are not developed enough to work this out on my own.

I did some research on the topic and it seems doable (at least for YouTube) but i would need some people with backend knowledge to help out here.

So the general layout would be to redirect people to a separate page where the stream would happen (can not be done on platform) and having a master page for the streamer with controlls.

On this page would be two embedded video's

One is the commentary, and the other is video that we are reacting to what i found we could use the Youtube Data API (you need to request a key to test this here) to poll the master page to see where they are in the video. As i understand this it will never be 100% correct because of network delays but unless you are way off grid it should be close enough.

For example (please forgive me if the code has errors, i am quickly trying to make a mock-up and I asked GPT for help) something like this should be ran in the backend.

from flask import Flask, request, jsonify

app = Flask(__name__)

# The current playback position of the video
currentPlaybackPosition = 0

@app.route('/api/setPlaybackPosition', methods=['POST'])
def setPlaybackPosition():
    # Get the current playback position from the request
    global currentPlaybackPosition
    currentPlaybackPosition = request.json['currentTime']

    return 'OK'

@app.route('/api/getPlaybackPosition', methods=['GET'])
def getPlaybackPosition():
    # Return the current playback position of the video
    return jsonify({
        'currentTime': currentPlaybackPosition
    })

if __name__ == '__main__':
    app.run()

The frontend would have the master page have something like this:

<!DOCTYPE html>
<html>
<head>
    <title>YouTube Video Sync</title>
</head>
<body>
    <div id="player"></div>

    <script src="https://apis.google.com/js/platform.js"></script>
    <script>
        // Replace the video ID with your own
        var videoId = 'VIDEO_ID';

        // Replace the start time with your own
        var startTime = 00;

        // Create the player object
        var player;

        // Load the YouTube IFrame Player API
        var tag = document.createElement('script');
        tag.src = 'https://www.youtube.com/iframe_api';
        var firstScriptTag = document.getElementsByTagName('script')[0];
        firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

        // Create the player object when the API is ready
        function onYouTubeIframeAPIReady() {
            player = new YT.Player('player', {
                height: '360',
                width: '640',
                videoId: videoId,
                playerVars: {
                    start: startTime
                },
                events: {
                    'onStateChange': onPlayerStateChange
                }
            });
        }

        // Listen for changes in the player state
        function onPlayerStateChange(event) {
            if (event.data == YT.PlayerState.PLAYING) {
                // Get the current playback position
                var currentTime = player.getCurrentTime();

                // Send the current playback position to the server
                var xhr = new XMLHttpRequest();
                xhr.open('POST', '/api/setPlaybackPosition');
                xhr.setRequestHeader('Content-Type', 'application/json');
                xhr.send(JSON.stringify({
                    'currentTime': currentTime
                }));
            }
        }
    </script>
</body>
</html>

where the player sends its info to the backend to see where we are in the video

and lastly on the client side we should have this script (or at least a working version of it i didn't test this yet)

// Replace the video ID with your own
var videoId = 'VIDEO_ID';

// Replace the start time with your own
var startTime = 0;

// The maximum difference between the current playback position and the master data
var maxDifference = 1;

// Create the player object
var player;

// Load the YouTube IFrame Player API
var tag = document.createElement('script');
tag.src = 'https://www.youtube.com/iframe_api';
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

// Create the player object when the API is ready
function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
        height: '360',
        width: '640',
        videoId: videoId,
        playerVars: {
            start: startTime
        },
        events: {
            'onStateChange': onPlayerStateChange
        }
    });
}

// Listen for changes in the player state
function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING) {
        // Poll the server for the current playback position every second
        setInterval(function() {
            var xhr = new XMLHttpRequest();
            xhr.open('GET', '/api/getPlaybackPosition');
            xhr.onload = function() {
                // Get the current playback position from the server
                var currentPlaybackPosition = JSON.parse(xhr.responseText)['currentTime'];

                // Get the current playback position of the video
                var currentTime = player.getCurrentTime();

                // Calculate the difference between the current playback position and the master data
                var difference = Math.abs(currentPlaybackPosition - currentTime);

                // If the difference is greater than the maximum difference, seek to the master data
                if (difference > maxDifference) {
                    player.seekTo(currentPlaybackPosition);
                }
            };
            xhr.send();
        }, 1000);
    }
}

So the working Theory is that the streamer would have his master video open where he can scroll thought the video and this gets polled and sent to a backend script while everyone watching polls the same backend script and their player will scrub until the time is in sync.

although to make this a usable project. there would probably need to be a portal where you can drop video's on the fly and they would be synced to all the other pages etc so as you see i have a project that is way beyond me in skill and size.

Would love to get some people together to opensource this as it would in my opinion be a great solution the the whole "your re leeching my viewers" problem as everyone will be watching the video in his own window and getting their own adds. etc.

Would love to hear your initial thoughts.

Quote

Yes i did GPT all this code as I wanted to get something on "paper" and didn't want to sped 4 days working on a project that might die right after this post.

Sauron · November 20, 2023

7 hours ago, Bobsiboo said:

Would love to get some people together to opensource this as it would in my opinion be a great solution the the whole "your re leeching my viewers" problem as everyone will be watching the video in his own window and getting their own adds. etc.

You mean... get some people to develop and maintain an entire streaming website based on a dozen lines of chatgpt python?

There's no real technical challenge to major streaming services implementing what you want if they chose to, it's mostly a policy problem.

Youtube doesn't really care if where your view goes as long as you keep watching youtube, plus the ads would get in the way of just playing the "reacted" video side by side with the "reactor" and youtube certainly doesn't want to remove those. Twitch doesn't care about giving youtube views and you'd run into the same problem with ads playing differently for different people, as well as having to deal with youtube's terrible API and their call limits.

Bobsiboo · November 20, 2023

4 hours ago, Sauron said:

You mean... get some people to develop and maintain an entire streaming website based on a dozen lines of chatgpt python?

There's no real technical challenge to major streaming services implementing what you want if they chose to, it's mostly a policy problem.

Youtube doesn't really care if where your view goes as long as you keep watching youtube, plus the ads would get in the way of just playing the "reacted" video side by side with the "reactor" and youtube certainly doesn't want to remove those. Twitch doesn't care about giving youtube views and you'd run into the same problem with ads playing differently for different people, as well as having to deal with youtube's terrible API and their call limits.

No actually, as it will just use the embeded youtube players the entire streaming and video feed are handled there. I am just looking for a way to sync up the feeds. Have a sync pulse be sent to all clients and if required their players seek to the correct timestamp.

Also i do not really care about what youtube or twitch think. i know they just want their platform used. But the creators that are being reacted to might care that everyone actually watches their video.

Also.I was hoping to keep this a positive conversation instead of just saying gpt was used in a quick write up so the entire project must be shit.

You know what. I m done with the internet for today. I m done with people just striking things down after they read two words they don't like in a page filling post without even reading the rest and immediately striking it down.

Thank you for making me realize i don't want to be on this platform.

Sauron · November 20, 2023

2 hours ago, Bobsiboo said:

No actually, as it will just use the embeded youtube players the entire streaming and video feed are handled there. I am just looking for a way to sync up the feeds. Have a sync pulse be sent to all clients and if required their players seek to the correct timestamp.

That's why you need the API, which again is really bad, and ads remain an issue. It might actually be easier to do this with a browser addon but it would still require a central server with some serious bandwidth and ddos protection if you expect more than a handful of people to be doing this.

2 hours ago, Bobsiboo said:

Also.I was hoping to keep this a positive conversation instead of just saying gpt was used in a quick write up so the entire project must be shit.

I didn't say that at all. I'm trying to explain that there are issues with the concept and also that you're asking for someone to do a sizeable amount of work (and likely pay for hosting) based on a vague idea that might not work out as you think.

Avocado Diaboli · November 20, 2023

You mean Watch2Gether? https://w2g.tv/en/

Sign In

Ethically fair react streaming platform

Link to comment

Share on other sites

Link to post

Share on other sites

Link to comment

Share on other sites

Link to post

Share on other sites

Link to comment

Share on other sites

Link to post

Share on other sites

Link to comment

Share on other sites

Link to post

Share on other sites

Link to comment

Share on other sites

Link to post

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Featured Topics

Topics

Latest From Linus Tech Tips:

I Was Never Meant to Have This Prototype CPU

Latest From Tech Quickie:

Why Do Speakers Hiss?

Latest From TechLinked:

Yep, it’s an App

Latest From GameLinked:

Bethesda Knows It’s Broken

Latest From ShortCircuit:

How is this even handheld?! - OneXPlayer X1

Latest From Mac Address:

Why did you buy an Apple Vision Pro?

Latest From Channel Super Fun:

I Swapped the CEO's Assistant For a Day!

My Activity Streams