Plopdown Video: A web extension to Annotate Netflix/Youtube/Amazon/Vimeo videos

[spaceribs]

Hey Friends,

Long time lurker, second time poster. I'd really like to get some feedback from you guys on a project I've been working on for the past few months, it's a web extension called Plopdown: https://plopdown.video/

The idea is that you'd be able to press a button in your toolbar and inject special plopdown tracks into any sort of video. This demo shows off the current capabilities, but I'd really like to inject/sync MP3s (ahem, rifftrax), do drinking games with counters "How many times does character say X", red circles around all the hidden ghosts in haunting of hill house, that sort of thing.

Biggest thing currently missing is an editor and I'm working on that now. If you have any thoughts, criticisms, ideas or suggestions, please let me know here!

Thanks,
-spaceribs

[Quirk]

If you can get audio working, this could be a game-changer for independent riffs. I am very excited about this. Please keep us updated.

[spaceribs]

If you can get audio working, this could be a game-changer for independent riffs. I am very excited about this. Please keep us updated.

So there are a few options within this that I could look at, let me know which one you think is the most useful for independent riffers:

1. Youtube PIP: Put a small youtube video in a corner of the screen, syncronize timestamps with the video that's currently playing via Youtube's API.
2. Local Audio: I'd need to somehow figure out a way to package an audio file, or multiple audio files alongside the track file.
3. Another Audio Provider: Use the API from something like SoundCloud to embed/sync sounds.

Do you guys have any preferences? Also, are there good examples I could maybe do some tests with?

[Quirk]

I am talking with the rest of the team to figure out what it absolutely needs to do and what we can get to you for testing. By the way, I'm seeing huge potential in the visual overlay ideas, too.

[spaceribs]

I am talking with the rest of the team to figure out what it absolutely needs to do and what we can get to you for testing. By the way, I'm seeing huge potential in the visual overlay ideas, too.

Great! I sent your developer an email introducing myself, let me know what you come up with

[spaceribs]

I spent some time just working on audio cues today, works surprisingly well! I think the right way to go about associating external audio files with a plopdown track will end up looking something like this:

• User adds a track which references external files.
• After submitting the track file, it will show which external dependencies are missing.
• It's up to the user to upload the correct "riff.mp3" to the list of dependencies that appears.
• User goes to Netflix and initializes the track on the video.

The audio cue will show up as a volume icon so people can temporary mute whatever is playing.

[spaceribs]

Big update:

Got audio cues fully tested/working/syncing on a Netflix video! I'll describe the circuitous process needed to achieve loading audio cues into Netflix:

• Save all audio to the plugin locally, in this case an MP3.
• When a matching domain is detected, pass the track file along with the audio files to the content script via messages.
• Generate a website specific BlobURL to host/play the audio from.
• Sync the audio and the video

Netflix has some pretty strict CSP settings (https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP), loading anything remotely is near impossible. In order for Netflix's DRM to function, it provides a BlobURL to load the video from, the same approach we can use to load Audio into the page. Thanks to Quirk and his team, I should be close to providing an independent riff https://orderoftheleague.com/products/equilibrium?_pos=1&_sid=fd18209b5&_ss=r on top of the hosted Netflix version for them to test out and get back to me.

This is the work I see that's left for audio cues:

• Need a visual indicator that lets users mute/unmute the sound, indicates issues with the loaded audio, and shows progress.
• Need audio transforms! One of the things I noticed with the example audio from Quirk was that there was an extended intro which was longer than the start of the movie, as well as a lot of instructions on how to sync up your audio/video. I see audio cues having something like a subtrack, which allow some basic editing to trim/pause the audio, and stillframe the video with the audio still playing. A big feature I need to spend some time exploring is being able to adjust the volume of the audio and the video.

Thanks guys, that's my weekend update!

EDIT: Indicator came out great! https://imgur.com/a/HHyOhZh

[Quirk]

Yes, we need some kind of solution for intros/outros. What you described sounds like a good one. We would definitely prefer to allow the intro to play somehow. However, we could also create special plopdown versions of our tracks that eliminate or update the sync instructions (In fact, we probably would want to). Would we be able to host the tracks and eliminate some steps, or is that what Netflix has made nearly impossible? Also, if you could CC Kevin on these updates via email, that would be very much appreciated.

Can't wait to see an example of this running.

[spaceribs]

Hey Friends,

Getting close to release, just need to finish the boring stuff. I've finished the track manager, the video reference manager, and the information editors for each. Here's the full album: https://imgur.com/a/qhIghHj

Some Previews:

[spaceribs]

The alpha is now live! https://addons.mozilla.org/en-US/firefox/addon/plopdown-video/

I should be able to post up some example tracks soon, next is creating the shortcut links to send plopdown tracks to other people!

[spaceribs]

Hey Folks,

After a bit of an hiatus, I've got a proof of concept for you guys to try with an actual Rifftrax track! Here are the steps for playing an entirely automatically sync'd Rifftrax on top of Netflix's Stranger Things Episode 1:

1. Install the Firefox addon: https://addons.mozilla.org/en-US/firefox/addon/plopdown-video/
2. Buy or download the Rifftrax from here: https://www.rifftrax.com/node/4019516/play
3. Download the cover art: https://www.rifftrax.com/sites/default/files/styles/poster_medium/public/images/posters/StrangerThings_PosterA.jpg
4. Download the Plopdown track which provides all the synchronization information: https://gist.github.com/spaceribs/aec82c20b2b6a68ce4c79063437f16d6
5. Go to the tracks section of Plopdown and add the "stranger-things-1.1.vtt" plopdown track file (top righthand corner)
6. It should prompt you to add the cover art and mp3.
7. Go to https://www.netflix.com/watch/80077368?trackId=200257859
8. Press the extension button and click "Request Access" to Netflix.
9. Refresh the page, the audio should automatically play on top of the playing video!

These steps might be a little bit technical, but in the worst case scenario you may need to restart Firefox to get it to work.