Looks like you’re a night owl too. (Scratch that, didn’t see you were in the UK! Morning to you!)
It works perfectly in all browsers, it’s only when you download the app from the App Store that I run into the issue. Here is the link to the App if you’d like to download it. It requires a login, but I’ll just give you the one I gave to the App Store Connect and Google for review.
When you log in and you get to the home page, Click the menu icon in the top right, and select the link from the floating menu that says “Earn Points.” You’ll see what I mean as soon as the video loads and you hit the play button.
Ok I’ll take a look, thanks. I can’t make any promises here because it could be an app setting causing it, or even overriding some of the web stuff but will try and find out. I suspect the playsinline option could be the culprit. If that’s a setting you have control over through the app process, make sure it’s being set.
Yep I reakon that’s definitley an iOS setting there. So how are uploading the app to the app store? I’m unfamiliar with Code Academy but in the past I’ve done a similiar thing using Xcode and I’ve found that the allowsInlineMediaPlayback value needs to be set to true.
That goes along with what I’ve been researching in the meantime. They did the XCode build, I’m a PC guy and certainly lower than novice with respect to code. I’ll reach out to the Code Academy folks and see what I can do about a rebuild noting the “allowsInlineMediaPlayback” value being set to true.
New actions and API endpoints have been added to support the upload of assets into a MUX environment. For anyone interested in this and for the purpose of documentation, details are below.
NEW STATES
MUX upload progress
Shows the file upload progress value when uploading a media file to MUX.
The value can be used with a progress bar.
MUX upload error
Shows the error message of a MUX upload.
MUX upload attempt failure
Shows the attempt failure message of a MUX upload.
MUX upload completed
Shows true when a MUX upload has completed.
MUX selected file size
Shows the file size for a selected file (in bytes) to be uploaded to MUX.
MUX selected file name
Shows the file name for a selected video file to be uploaded to MUX.
MUX selected file duration
Shows the duration (in seconds) for a selected video file to be uploaded to MUX.
MUX selected file poster
Shows the poster for a selected video file to be uploaded to MUX.
MUX upload paused
Shows Yes when the upload process to a MUX account has been paused.
NEW EVENTS
MUX upload has errored Fired when a MUX upload has errored.
MUX upload has completed Fired when a MUX upload has completed.
Fired when a MUX upload has completed. Fired when a MUX upload has started.
NEW ACTIONS
Upload media to MUX
This action uploads a media file to MUX. -Endpoint URL This needs to be the result of running the "Create upload URL (MUX)" endpoint. You need the URL in this field. -Chunk size This is the chunk size (in bytes) which determines how much data to upload (in chunks) which is better suited for handling large media files. The default is 10mb.
Splits the file into chunks that are a multiple of 256KB (256 1024 bytes). For example, if you wanted to have 20MB chunks, you’d want each one to be 20,971,520 bytes (20 1024 * 1024). The exception is the final chunk, which can just be the remainder of the file. Bigger chunks will be a faster upload, but think about each one as its own upload in the sense of needing to restart that one if it fails, but needing to upload fewer chunks can be faster.
Pause MUX upload
Pauses the upload process to MUX.
Resume MUX upload
Resumes the upload process to MUX if paused.
NEW DATA CELLS - (API endpoints)
These requests require Basic authorization to connect. To generate the correct base64 authorization key, you’ll need your Token ID and Token Secret which you get through MUX, and then you will probably need to follow this…
Create upload URL (MUX) Creates an authenticated MUX URL which is required before uploading any video files, or more specifically before running the new upload action above since you need to supply the endpoint URL. Create Direct Upload reference | Mux
Check asset status (MUX) Returns various information on assets. Typically used to return playback ID's, duration and other information. Requires an asset ID Get Asset reference | Mux
Check upload URL (MUX) Can be used to check the progress of the create upload URL. Most of the time you won't need this as a new URL is created straight away. This requires the ID in the response from running the upload URL above. Get Direct Upload reference | Mux
Note 1: There is an API request for uploading files which isn’t included at the moment. The reason for creating an Action to do this was because it handles large media files in a better way. If the connection goes offline for a period of time, the upload will not stop, instead it will pause and then resume when the connection comes online again. Attempting to upload potentially large media files through their API request is doable but if it fails the process needs to restart.
Note 2: For anyone interested in generating thumbnails, it’s an area being worked on now. There is now a new action called “Generating thumbnails” which does everything that my original CodePen does. It’s being worked on at the moment to improve it but it is included.
One more feature included, it enables a scrubber on top of the video, which when hovered does as shown below. It requires a sprite sheet (image) to be loaded into the video player with the correct settings to work.
In order to create the sprite image, you can run the action called “Generate video thumbnails” then either save the output as a file download so you can upload to your database perhaps, or see the resulting image within the custom state called “Thumbnails sprite sheet”. This is more of an admin type of action since it can take some time to run.
It’s been a bit, hit and miss with various formats so it may need further work in the future, but for now, it seems to work well with MP4 and other standard web formats of videos. If you can get the sprite file generated then you should be fine loading it.
Image widths and heights when generated need to match the size of your video player if you’re going to use this. It’s not really a feature designed to be dynamic at the moment. The video player should be at a fixed with since the images within the sprite sheet are loaded but not resized (yet)…
Great thanks very much.
I spotted that control bug the other day, I’ll put a fix in place for it soon. In the meantime you can make that playback rate control disappear by putting the controls action into a workflow like this…
I’ve added a buffering percentage value into the demo as seen in the following image. Do you just want to check it against a few videos first before I publish the update? I’ve run a few tests and it seems to do the job fine.
I’m currently using the plugin, it’s great! But i can’t seem to work out how to Show/Hide Text/Button when the Video Player reaches a specific time.
For example:
at 0:03 show button
at 0:05 hide button
Here’s a screenshot of my workflow
I can Show/Hide the Button/Text when I click Play and Pause only. I’m quite new to Bubble, still trying to figure things out. I’ve looked through the Bubble forum but can’t seem to figure it out
So it will probably be because the “current time” state is something like a 5 or 6 point decimal number and you’re referencing it at exactly 3 which I doubt will be caught in time to satsfy the condition.
Try making it a round number like this and see if it works.
Greetings, @pork1977gm. Just noticed you added all kinds of new Mux interactions. Sorry for my delayed response before regarding Cloudinary. Been trying to research viable solutions but am thinking Mux looks more appealing now.
Out of curiosity, does your plugin support any sort of restrictions from the Bubble side on playback of Mux content? To clarify, I’m needing that private video scenario we discovered previously where I want to “expire” access to Mux videos after X number of days in Bubble. Basically, I’m needing a solution that securely prevents users from accessing Mux URLs directly unless approved via my app.
I know MUX have a ‘Secure video playback’ section which involves using Signed URL’s that can control how long a video can be played back for (and expiration I think). I’ve not implemented any of this into the plugin yet, it only deals with ‘public’ playback methods.
Makes sense, and thanks for the prompt response. I’m definitely interested in that and am trying to get it to work on my end. Really wanting to use your plugin; just need to figure out how to make videos private before investing.
Currently, trying to figure out how to incorporate the Mux SDK into Bubble, which is the “gateway” to private access: Forum Link
