[Plugin] VideoJS 7

Hi Bubblers !

Just released a video plugin based on videoJS, the leading open-source HTML5 video player, in the last version (7).

Plugin: VideoJS player
Test application: testVideoJSPlugin

Supported video:

  • Standard HML5 video file: mp4, webm…
  • YouTube URL
    (send me a mail if you need an other formats).

Customisation:

Text track in WebVTT file format: all official kinds, :

  • subtitles
  • captions
  • descriptions
  • chapters
  • metadata

Audio track: all official kinds

  • alternatives
  • descriptions
  • main
  • main-desc
  • translation
  • commentary
  • “” (undefined)

Exposed states:

  • status: playing, pause, ended
  • current time in second
  • remaining time in second

Events:

  • End
  • Start / Resume
  • Pause
  • Cue Change (based on Text track)

Actions:

  • Play
  • Pause
  • Add Remote Text Track
  • Add Video Track
  • Reset Track (list)
  • Change source
  • Add Audio Track
  • Show Text track: based on a Kind and Language search
  • Enable Audio Track: based on a Kind and Language search

If you need more actions, events, states, please contact me !

Regards,

Laurent
Scalable Studio

1 Like

Would the states/actions allow us to work out what % of the video has been viewed? This would be awesome for video watch tracking and running events based on % completed. Particularly useful in marketing.

1 Like

Yes.
And based on your comment, I have pushed a new version with two new states to avoid looking for film duration and doing math in Bubble:

  • duration: the length in time of the video in seconds
  • ratio_played: the % viewed (percentage with two digits).

These values (with current time and remaining time) are updated with the videoJS event “TimeUpdate”, fired when the current playback position has changed (play, seek…)

Regards,
Laurent

Wow! Not that is what I call responsive! Thank you.

@laurent.escalier your Test App Link https://bubble.io/page?name=index&id=testvideojsplugin&tab=tabs-1 has the permssion set incorrectly to launch. it wont get off the ground. I would suggest adding that to the plugin description too

Another question. Does it support Vimeo and Wistia files?

I use Vimeo, but I know many marketers use Wistia as well.

Thanks. I have updated the permission for the demo app.

1 Like

I am checking out the editor view. Are there actions or custom events where one can run workflows when video view has reached X % ? This would allow the bubbler to maybe updated a viewer’s thing or a video’s thing, so one can start building stats on particular videos.

Or would you be able to run a custom event when condition is true. e.g VideoPlayer ratio plays >X%

There’s a Vimeo plugin for VideoJS.
I have to check this and add it to the standard version.

Actually:
The % is exposed in state.
You can have a workflow looking for the value.
Or You can create text track (metadata kind) and use the cue change event.

Best solution:
To have an event fired with a % set within Bubble, I can work on it ( to code and check).
I suppose you prefer a list of % (dynamic list of number), set by two means, at element level and an action ?

Regards,
Laurent

Hi, Yes, it would have to be a list of % values to pick from if it cannot be a dynamically set value.

Marketers could use it to see if a viewer got to the offer and trigger automation from that. I could use it in my app to track if users are using the provided video content as they should.

Modifications on-going…

Vimeo added.
Event fired on % viewed (list of number in creation or action).

Regards,
Laurent

You’re amazing! I’ll be buying this now

Bought! Excited to see what I can do with this, but also confident seeing you are so responsive.

1 Like

wow nice job! looks great

1 Like

Thank you !

Hi, does this plugin support m3u8 files?

1 Like

it works but it depends on what kind of files (or link) are within the m3u8 playlist.

1 Like