Hi, I'm new in the community and I'm doing some tests with the framework, I would like to embed a video from vimeo through json, you have some good practice for this? I do not remember seeing in the documentation ...
Thank you for your attention and I apologize for my bad English ...
Hi Diogo,
You can do this using the responsive-iframe component from https://github.com/LearningPool/adapt-contrib-responsiveIframe (install by running the command "adapt install adapt-contrib-responsiveIframe"). In the source of your course you then need to add the JSON for the component - here's a working example from one of my courses:
{
"_id":"c-1",
"_parentId":"b-1",
"_type":"component",
"_component":"responsiveIframe",
"_layout":"full",
"title":"Introductory video",
"_setCompletionOn":"view",
"_source": "//player.vimeo.com/video/105534954",
"_width": {
"_small" : 300,
"_medium" : 500,
"_large" : 900
},
"_height": {
"_small" : 250,
"_medium" : 350,
"_large" : 506
},
"_pageLevelProgress": {
"_isEnabled": true
}
Hope that helps.
hello Ben, worked well, but his behavior towards progress bar is quite different from the other items, you had already noticed this?
I appreciate the quick turnaround!
Do you mean that the component is marked as completed immediately? This will make the progress bar advance without interacting with the video - for example, if the video is the only component on the page, the page will be instantly be marked as 100% complete. This is because the component is marked as completed once it is in view (which is fine for my purposes).
An alternative method would be to use the direct video links provided by Vimeo (which you can find in the video setting page, although I think you might need a Pro account) with the standard Adapt-contrib-media component. I haven't experimented with this, but you could try either:
"_media": { "source": "http://www.vimeo.com/XXXX", "type": "video/vimeo" }
OR
"_media": {
"mp4": "http://player.vimeo.com/external/XXXX.hd.mp4?s=YYYYYY",
}
This will use the stock video player. Sorry, I don't have a chance to test those.
Hi,
We are currently using 'adapt-contrib-media' for Vimeo videos and this appears to be working well.
"_media": {
"source": "//player.vimeo.com/video/105534954",
"type": "video/vimeo"
},
Hope this helps
Hanzs
Hello friends the best way was that Ben mentioned:
"_media": {
"mp4", "http://player.vimeo.com/external/XXXX.hd.mp4?s=YYYYYY"
}
The video interacts with the progress bar when it is triggered by the play, which to me is interesting.
Again thank you for the support.
It's because the video player used is MediaElement - which supports the YouTube and Vimeo API
I would advise that you try a protocol-less URL, as shown in Hanzs Wolfgang's post on this thread. Otherwise, if your content is run from a server that uses https you risk getting a secure/insecure content warning from some browsers.