Flowplayer Demo
Video recommendations
Show related videos after the playback is finished.
const player = flowplayer("#player", {
src: "56058953-2cbd-4858-a915-1253bf7ef7b2/69891ec1-2d90-423c-9892-5a9ee87b6d86",
poster: "/resources/demos/images/work/black-skyscraper-big.jpg",
recommendations: false
})
// Trigger recommendations on player - you can also get this directly from the platform if you wish
player.on("loadstart", function () {
player.emit("recommendationsready", { "playlist": [
{
"poster": "//flowplayer.com/demos/images/work/black-skyscraper.jpg",
"src": [ "//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/532915a5-28d8-43c0-a6d4-f142ad47b486/playlist.m3u8" ],
"title": "A black skyscraper"
},
{
"poster": "//flowplayer.com/demos/images/work/people-at-work.jpg",
"src": [ "//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/fa1758b4-251c-4296-ad6c-a7366e3dfc41/playlist.m3u8"],
"title": "People not doing much at work"
},
{
"poster": "//flowplayer.com/demos/images/work/camera-shooting.jpg",
"src": [ "//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/334510c0-8e0f-4b09-becd-a247d9df9691/playlist.m3u8"],
"title": "Taking a shoot with a camera"
},
{
"poster": "//flowplayer.com/demos/images/work/person-on-laptop.jpg",
"src": [ "//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/63248edb-a884-4952-9eca-a64c0002cb18/playlist.m3u8"],
"title": "Someone typing on a laptop"
},
{
"poster": "//flowplayer.com/demos/images/agency/1-thumb.jpeg",
"src": [ "//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/63248edb-a884-4952-9eca-a64c0002cb18/playlist.m3u8"],
"title": "Random UI sketching on paper"
},
{
"poster": "//flowplayer.com/demos/images/agency/2-thumb.jpeg",
"src": [ "//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/fa1758b4-251c-4296-ad6c-a7366e3dfc41/playlist.m3u8"],
"title": "Our office space without lights on"
},
{
"poster": "//flowplayer.com/demos/images/agency/3-thumb.jpeg",
"src": [ "//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/334510c0-8e0f-4b09-becd-a247d9df9691/playlist.m3u8"],
"title": "A normal, boring day at work typing stuff"
},
{
"poster": "//flowplayer.com/demos/images/agency/5-thumb.jpeg",
"src": ["//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/532915a5-28d8-43c0-a6d4-f142ad47b486/playlist.m3u8"],
"title": "Hey, we have a pile of useless startup swag!"
},
{
"poster": "//flowplayer.com/demos/images/fashion/1.jpeg",
"src": [ "//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/334510c0-8e0f-4b09-becd-a247d9df9691/playlist.m3u8"],
"title": "T-shirts hanging in black/white tone"
},
{
"poster": "//flowplayer.com/demos/images/fashion/3.jpeg",
"src": ["//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/532915a5-28d8-43c0-a6d4-f142ad47b486/playlist.m3u8"],
"title": "Making our selection tempting for people"
},
{
"poster": "//flowplayer.com/demos/images/fashion/4.jpeg",
"src": [ "//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/334510c0-8e0f-4b09-becd-a247d9df9691/playlist.m3u8"],
"title": "We try that too with a nicer camera angle"
},
{
"poster": "//flowplayer.com/demos/images/fashion/6.jpeg",
"src": ["//cdn.flowplayer.com/ee6c914d-25d5-4703-935e-c8797b2275a8/hls/532915a5-28d8-43c0-a6d4-f142ad47b486/playlist.m3u8"],
"title": "We think less is more and simplicity wins"
},
]})
})
