Popup Video Player In Anvil?

Is there video player in Anvil? I’m trying to get functionality where if you click on a link in a form, a popup video player will start playing a video from YouTube…

Can you use the YouTube video component?

YouTube coupled with an Alert() should do it. The button click should raise an alert, and the trick is alerts can accept components as their content. Something like this:

def button_click(self, **event_args):
    alert(YouTubeVideo(youtube_id='qb_hqexKkw8', autoplay=True), large=True)
1 Like

Kevin, that “mostly” works, though, it seems that there is something wrong with the video player. It popups up after clicking the link text, acts like it’s going to start playing, and then gives a “Video unavailable” message:

@nathanguyette

It seems to work on my end (except for the auto play). Here is a clone:

https://anvil.works/build#clone:GAIV2T4PIH2SBPTV=SBGUQLSQAS6BEH5APSLMCGQS

com-crop

Can you watch that video outside of Anvil on YouTube?

1 Like

Seems I’m having the same problem as @nathanguyette when I put into an app - “Video unavailable.” I tried it with the Anvil YouTubeVideo component and also as an embed in a Custom HTML form, but no luck. I don’t think it’s a rights issue because I can embed it elsewhere without a problem, so I’m at a bit of a dead end.

I also got the same result after cloning @alcampopiano’s app with the different video and no autoplay - “video unavailable.” Pretty strange.

Some videos don’t allow embedding.
I tried a rick roll in anvil and found the video is not embeddable, I think Rick Astley might have made his video unEmbeddable :upside_down_face:

A quick way to check is to change the URL from

https://www.youtube.com/watch?v=qb_hqexKkw8

to

https://www.youtube.com/embed/qb_hqexKkw8

You’ll see it won’t play

Instead of the original rick roll try this:

https://www.youtube.com/watch?v=bW-OLcZ4tGY

@alcampopiano, I tried cloning your app but I’m still getting errors…
This is what I get if I click the button:

When I go to “Learn More” it takes me to:
https://support.google.com/youtube/answer/3037019?visit_id=637105978698259930-468670179&p=player_error1&hl=en&rd=1

Which is just a bunch of generic crap.

In the Cloned version code use the commented out id - not the Rick roll id that is there - but the pink fluffy unicorn id.

That’s a sentence you don’t say every day.

6 Likes

lool. That did work but… how am I supposed to know ahead of time if I can use a video as embedded?

A quick way to check is to change the URL from

https://www.youtube.com/watch?v=qb_hqexKkw8

to

https://www.youtube.com/embed/qb_hqexKkw8

Put the link above into the address bar - hit play - and you’ll see you get an error.
Try one of the other videos and you’ll see it will play.

There is also a youtube search api
use the parameters: part: snippet, q: rick roll, type: video, videoSyndicated: True
Unfortunately you won’t get any useful hits for this search just a bunch of ‘youtubers react to…’ videos.

(videoSyndicated implies emebddable but videoEmbeddable doesn’t imply embedable)

Here’s my RickRoll app - mathsjam.anvil.app
I used this custom html - found the website a while ago!

<video controls="" autoplay="" name="media"><source src="https://www.sneakytime.com/rr/rickroll.webm" type="video/webm"></video>

1 Like

By what I have experienced, if you use autoplay or use the play() command, the video always show as unavailable. Instead it is best to just let the user play it.

1 Like

Okay I take back my words. Apparently, even without autoplay, it’s not working. I wanted users to be able to paste youtube URLs which will play. But apparently, every single video shows up unavailable.

Alternatively, is there a way to play spotify links in anvil? Because that will work well with me as well.

Edit: Apparently, I didn’t look harder. Spotify songs can easily be added using the embed option on them. Just make a new HTML template and insert the song link.

Pretty easy stuff

UPDATE: I found this mentioned in some site- “Apparently, YouTube forbids embedding some videos in a localhost environment without a public domain, but your video can be embedded with no issue whatsoever through a public domain/subdomain”

I will upgrade my plan once my website is ready but can anyone with a custom domain try to see if this video plays https://youtu.be/aw_cfy1P8f8

1 Like