generativefm / generative.fm

A platform for playing generative music in the browser.
https://generative.fm
MIT License
1.59k stars 86 forks source link

Add "Cast" button for Chromecast #26

Closed alexbainter closed 5 years ago

alexbainter commented 5 years ago

Suggestion from email.

Casting Instructions

Google Chrome Desktop users: Please see here for instructions for casting any tab (including generative.fm).

Android Users: Please see here for instructions for casting your Android device's audio. You can do this and then play generative.fm from the device.

cdtinney commented 5 years ago

I'd like to grab this issue if possible!

alexbainter commented 5 years ago

@cdtinney I really appreciate that. I considered marking this one as "help wanted" but I have to admit I'm very selfishly interested in doing this myself because I've never added a Cast button to a site before.

cdtinney commented 5 years ago

@metalex9 I totally understand. That's the reason I wanted to do it too. If you remember, tag me in the commit so I can dig through it!

alexbainter commented 5 years ago

Bad news, it looks like this is going to be much more difficult than I'd expected.

I thought I would be able to stream audio data straight from the browser to the receiving device but it appears that's not how casting works. The cast api expects a MediaInfo object for specifying data to play and I'm not seeing a way to use this to send audio data from the web app. Notice how this SO answer and this example app both work by sending an external URL for the media to be played rather than sending raw audio data straight to the receiver. This wouldn't be a problem if the site hosted streams of the audio data, but that's probably not going to happen anytime soon (see #59 and #34).

Since this doesn't appear to be easy, I'm going to abandon it for now but mark it as "help wanted" in case someone smarter than me wants to take a stab at it. I've also added links to instructions for casting from Google Chrome for desktop and Android devices.

alexbainter commented 5 years ago

I'm tentatively planning on making this and #59 my top priority after v1.0.0 is released.

alexbainter commented 5 years ago

This will be ready for work once stream.generative.fm is done and publicly hosted somewhere.

alexbainter commented 5 years ago

Good news this time, turns out I'm dumb (a lesson I'll never stop relearning) and completely neglected the option of building a Custom Receiver for Chromecast, which is a web app that runs on the receiver device.

Long story short, with a custom receiver I can set up a WebRTC connection between Generative.fm and the cast device and stream the audio directly from Generative.fm to the device, without me hosting streams anywhere - so this is unrelated to #59 after all. Chromecast even has a custom messaging system I can use for WebRTC signaling.

I built a quick proof of concept and successfully casted from the site to a Chromecast. This still needs a ton of work to flesh out the implementation, but at least I know it will work without having to host streams myself.

5310 commented 5 years ago

This is excellent news! (Although I have been using your Spotify listings a lot lately:) One question though: this means a tab has to be active on the Casting device, yes? Does it work if the tab is in the background or on a mobile device?

alexbainter commented 5 years ago

@5310 Yes, you have to initiate the casting from Chrome (mobile or otherwise). Once it's started you can leave the tab in the background and it should continue to stream.