Rise video player customization

Is possible to customize the video embed code so that the video player can show a control for Playback Speed? I have hosted a video on an external video site (similar to YouTube) and the player on the site does not show controls for changing the video playback speed like YouTube does. The embed code generated from that site works within my Rise course and I am able to play the video  - but I'm trying to explore if it is possible to add some additional code to the video embed code within Rise to enable the playback speed. 

 

12 Replies
Joseph Vincent

Hi Karl,

Thanks for your response. I understood that the Rise video player will not be used for playback when we insert embed code from another video hosting site. 

The embed code provided by the 3rd party video hosting site has two options:

Embed video with player - which shows the standard player from that video service within the Rise course and plays ok. The issue is that this player does not have playback speed controls. 

Embed video without player - when I try to use this code within the Embed option in Rise - it shows an error that says 'Please enter valid URL or Iframe.' 

As I presume that Rise is designed on the basis of HTML5 standards, I was wondering if there is a way to wrap the embed code (without player) in some HTML5 code so that it can play within a generic HTML5-generated video player in Rise with the potential to control playback speed of the video. 

I am not an expert in HTML or web coding - so, I am not sure if this is even a practical request. Just thought no harm in checking.   

Joseph Vincent

Lea,

Following on from your request to share the iframe code for test, I'd like to share it here. Please see below - the embed code generated from the video hosting system (Widen) that we use. 

Embed code with Player: this code works in Rise within the Multimedia block >Embed  - but the player does not have controls for playback speed

<div style="position:relative;width:100%;height:0;padding-bottom:56.25%;"><iframe src="https://aai.widen.net/view/video/ih89ggbljr/Sample-Video.mp4?u=fmtlib" webkitallowfullscreen mozallowfullscreen allowfullscreen title="Video for &quot;Sample Video.mp4&quot;" frameborder="0" allowtransparency="true" scrolling="no" style="position:absolute;top:0;left:0;width:100%;height:100%;" ></iframe></div>

Embed code without Player: this code does not work in Rise within the embed field. My request is to check whether this code can be modified a little bit to make it work within Rise such that the video can play in a generic HTML video player

<video controls><source src="https://aai.widen.net/content/ih89ggbljr/mp4/Sample-Video.mp4?quality=hd&u=fmtlib" type="video/mp4"></video>

We were able to get the playback speed functionality working on a generic HTML page using this code. Please see the attached zip file containing the output HTML file and the text file with the HTML source code. Just not sure how to make it do the same within Rise. 

Joseph Vincent

Lea,

This is great! Thanks so much for trying out the embed code and providing the iframe code that works within Rise.

A follow-on request: Is there any way to show the control for Closed Caption (cc) as part of this code? I have uploaded a .srt file as part of the video. The captions are shown when the video is played in the native Widen player. 

Joseph Vincent

Hi Alyssa,

It looks like the links to the original video were altered at some point in the last few days due to  updates to the video hosting system. 

I'm reposting the updated links:

URL:
https://aai.widen.net/s/qgmhqr8wvr/sample-video

Embed code (With native Widen player)
<div style="position:relative;width:100%;height:0;padding-bottom:56.25%;"><iframe src="https://aai.widen.net/view/video/qsuoz6epgz/Sample-Video.mp4?u=fmtlib" webkitallowfullscreen mozallowfullscreen allowfullscreen title="Video for &quot;Sample Video.mp4&quot;" frameborder="0" allowtransparency="true" scrolling="no" style="position:absolute;top:0;left:0;width:100%;height:100%;" ></iframe></div>

Embed code (without player)
<video controls><source src="https://aai.widen.net/content/qsuoz6epgz/mp4/Sample-Video.mp4?quality=hd&u=fmtlib" type="video/mp4"></video>

Based on Lea's last response - the above embed code (without player) can be wrapped in an iframe code as follows and it works in Rise. It shows the playback speed control. I want to check if it is possible to also show the closed caption (cc) controls along with it. 

<iframe src="https://aai.widen.net/content/qsuoz6epgz/mp4/Sample-Video.mp4?quality=hd&u=fmtlib" allowfullscreen frameborder="0" scrolling="no"></iframe>

Many thanks for your continued support. 

Joseph Vincent

Hi Hazel, thanks for the response. The video already has closed captioning. The query is if there is a way to enable the closed caption control for the following iframe code when it is used in Rise. 

<iframe src="https://aai.widen.net/content/qsuoz6epgz/mp4/Sample-Video.mp4?quality=hd&u=fmtlib" allowfullscreen frameborder="0" scrolling="no"></iframe>

Joe Tansengco

Hello Joseph,

Happy to chime in! 

There isn't an iframe attribute that can toggle the Closed Captioning of a video file, but I found this helpful technical article which explains how to add captions and subtitles to an HTML5 video. If you're familiar with HTML5, or know someone who does, we recommend checking it out!