Hi Paul. Another thing I noticed:
In order to play private Vimeo links (Following the format https://vimeo.com/12345678/abcdefg9) I have to enable ‘use vimeo player’ but then I lose a lot of the functionality of the plugin (Being able to trigger play / unmute video etc) - throws the following error:
Do you have a workaround for this?
Thanks!
Josh
There’s no workaround for that right now I’m afraid. It can be fixed for sure but that one will take me a bit of time to figure out. I’ll get around to doing but I’m swamped right now. It’s on my list though!
Can you give us a Vimeo link that won’t play without having to use the Vimeo player? I can try to make it work unless the reason is because it’s marked as private or something?
Thanks Paul, indeed, this only happens with private links that have the extra component in the URL after the slash
Here’s an example: https://vimeo.com/552560258/6c446f002b
While a public video, like the following WILL play: https://vimeo.com/25579023
Josh
Ok, tomorrow’s a new day I shall take a look at these issues then for you
Much appreciated, thanks Paul!
No probs. Did you see the PM I sent you?
Anyone experiencing delays with Vimeo videos, you can now do this which is a lot quicker.
Where you would normally specify the URL to load a Vimeo file, try the following.
This request retrieves information on a Vimeo file and pulls a list of various quality URL’s.
When you use the API request called “Get data (vimeo)” it will want the ID of the Vimeo file. Pass that into the request then navigate to “request files progressive” which will be a list. Sort that by quality (desc = yes), get the first item and return the URL.
If you also set the MIME type to video/vimeo it will skip the auto detection in the code .
Paul
Fluid mode has now been removed since Bubble handles this nicely and the CSS Object-fit attribute has been added within the player fields.
It’s a dropdown comprising of 5 options that look like this…
The default is None so it shouldn’t affect anyone.
contain
The replaced content is scaled to maintain its aspect ratio while fitting within the element’s content box. The entire object is made to fill the box, while preserving its aspect ratio, so the object will be “letterboxed” if its aspect ratio does not match the aspect ratio of the box.
cover
The replaced content is sized to maintain its aspect ratio while filling the element’s entire content box. If the object’s aspect ratio does not match the aspect ratio of its box, then the object will be clipped to fit.
fill
The replaced content is sized to fill the element’s content box. The entire object will completely fill the box. If the object’s aspect ratio does not match the aspect ratio of its box, then the object will be stretched to fit.
none
The replaced content is not resized.
scale-down
The content is sized as if none or contain were specified, whichever would result in a smaller concrete object size.
Hey, love the plugin! Is there a way to integrate ffmpeg to convert .mov to .mp4 videos in the backend?
Hi and thanks!
I’m not sure, perhaps, but I’m quite busy with other things at the moment so maybe in future updates I’ll get around to doing something like that. Have you tried playing .mov files through it? A version of ffmpeg is actually included but it handles generating images to form thumbnails etc which is a standard client side action.
I had played with it on a server side action but it didn’t seem to play too well with bubble, I’ll end up revisiting that at some point to figure it out I’m sure.
You’re right, it does work. So maybe I’m just having trouble with the viewport play/pause feature. I noticed there is an option to do this on the element, how does this work in conjunction with the workflows? I’m trying to get it to work in a similar way to instagram’s/tiktok’s.
Ah yes, you mean this option here? the “viewport autoplay” ?
When that is set to “yes” the video should just play as soon as it comes into viewport (appears on the page) and it stops when it goes out of the page.
If the video player appears in view on page load, then it will play as soon as you scroll down
Yes, for some reason it’s not playing and if I turn on autoplay it just plays without regard for if it’s in the viewport. I’ve tried to do this with the workflows and it doesn’t appear to help. Thoughts?
Mmm ok, can I take a look at it through your editor? You can PM me the editor link if you prefer, I’ll figure out the problem for you. Maybe some other control interfering with it. Make sure you’re also on the latest version too as there was an issue with that which had been fixed sometime back. The play is activated on scroll.
MUX uploads now support multiple file uploading…
Here’s some additional information.
FYI
@jj11 (details about multiple uploads)
@marcus2 (full screen events for you)
For a demo on how this works, please see:
Paul-testing-4 | Bubble Editor
The current action called Upload media to MUX works with single files. It has a couple of new options put into it that allow you to disable the file selection dialog and feed a file into it.
When the “Use file selection” option is set to Yes, you see the standard file selection dialog appear in the normal way and that will accept a single file. Although it’s possible to modify the selection dialog to accept multiple files and iterate through each one, it’s not been possible to modify the action in such a way to make a new request for the upload endpoint URL for each file. That request unfortunately needs to come from a server action for which this isn’t, and since this action also populates a number of states given information about that selected file, I didn’t want to loose any of that functionality.
What you can do is the following.
When the “Use file selection” option is set to No, you don’t see the file selection dialog appear anymore. Instead, the action will now rely on an array of files to be fed into it. These come from a new action called “Select files” and that needs to be run before hand.
See the demo above for how this works.
The Select files action allows you to select multiple files. A count of these files is populated in the “Files selected count”. Selecting 5 files will return a value of 5.
Using this number value, you can now setup a JavascriptToBubble loop.
In addition to this update, there was an incorrectly returned file size which didn’t make the “Max file size” option work correctly, this is now fixed and there are 2 new events included which fire upon entering / exiting full screen mode when a video is playing.
New details below:
EVENTS
A videoJSplayer entered full screen
Fired when the player enters full screen mode.
A videoJSplayer exited full screen
Fired when the player exits full screen mode.
A videoJSplayer files have been selected
Fired after files have been selected and the file selection dialog has closed when running the "Select files" action.
ACTIONS
Specify a maximum file size which can be uploaded in kilobytes, or leave empty to set no limit.EXPOSED STATES
Here is also a list of supported file extensions and mime types.
State called Media type can have the following values once something has been loaded in the player only.
All supported file extensions and their mime types where applicable.
Image formats
svg
jpg
jpeg
bmp
png
gif
Audio formats
mp3 - audio/mp3
wav - audio/wav
aac - audio/aac
m3u - audio/x-mpegURL
flac - audio/flac
Video formats
m3u8 - application/x-mpegURL
mpd - application/dash+xml
mov - video/mp4
mp4 - video/mp4
mkv - video.mp4 (matroska files in this plugin use the mp4 mime type as it seems more reliable!)
f4m - application/adobe-f4m
webm - video/webm
ogg - video/ogg
flv - video/flv
Other supported formats as detailed in this list and most CDN links should also play, given the correct mime type has been entered into the player, if it cannot be determined by the URL that is. Uploadcare CDN’s do work although not stated below.
Wistia
using wistia player (yes) - video/wistia
using wistia player (no) - application/x-mpegURL (as m3u8)
Youtube - video/youtube
Vimeo
using vimeo player (yes) - video/vimeo
using vimeo player (no) - video/mp4
Hi Guys,
Is it possible to have emoji reaction on the player (like facebook live / instagram)?
thanks
Hi @contato7
Unfortunately that isn’t included with this plug-in but you could probably create your own type of emoji thing like that which sits on top of the player using Bubbles own elements actions etc.
Yeah, I think you can create your own emjoi reactions based on all of the events this player includes in it.
Hi @noahser,
It does yes, but on mobile the muted option needs to be set in order for autoplay to work. Autoplay for mobile devices (especially iPhones) won’t start playing automatically unless they’re muted to begin with.
This was also the case with Chrome for some time apparently, but videos seem to autoplay with sound just fine when using desktop browsers.