diff options
Diffstat (limited to 'src/js/plugins/vimeo.js')
-rw-r--r-- | src/js/plugins/vimeo.js | 61 |
1 files changed, 40 insertions, 21 deletions
diff --git a/src/js/plugins/vimeo.js b/src/js/plugins/vimeo.js index 18ef1d38..10c0fc62 100644 --- a/src/js/plugins/vimeo.js +++ b/src/js/plugins/vimeo.js @@ -37,7 +37,8 @@ const vimeo = { setAspectRatio(input) { const ratio = utils.is.string(input) ? input.split(':') : this.config.ratio.split(':'); const padding = 100 / ratio[0] * ratio[1]; - const offset = (300 - padding) / 6; + const height = 200; + const offset = (height - padding) / (height / 50); this.elements.wrapper.style.paddingBottom = `${padding}%`; this.media.style.transform = `translateY(-${offset}%)`; }, @@ -55,6 +56,7 @@ const vimeo = { title: false, speed: true, transparent: 0, + gesture: 'media', }; const params = utils.buildUrlParameters(options); const id = utils.parseVimeoId(player.embedId); @@ -70,23 +72,27 @@ const vimeo = { // https://github.com/vimeo/player.js player.embed = new window.Vimeo.Player(iframe); + player.media.paused = true; + player.media.currentTime = 0; + // Create a faux HTML5 API using the Vimeo API player.media.play = () => { - player.embed.play(); - player.media.paused = false; + player.embed.play().then(() => { + player.media.paused = false; + }); }; player.media.pause = () => { - player.embed.pause(); - player.media.paused = true; + player.embed.pause().then(() => { + player.media.paused = true; + }); }; player.media.stop = () => { - player.embed.stop(); - player.media.paused = true; + player.embed.stop().then(() => { + player.media.paused = true; + player.currentTime = 0; + }); }; - player.media.paused = true; - player.media.currentTime = 0; - // Seeking let { currentTime } = player.media; Object.defineProperty(player.media, 'currentTime', { @@ -121,9 +127,10 @@ const vimeo = { return speed; }, set(input) { - speed = input; - player.embed.setPlaybackRate(input); - utils.dispatchEvent.call(player, player.media, 'ratechange'); + player.embed.setPlaybackRate(input).then(() => { + speed = input; + utils.dispatchEvent.call(player, player.media, 'ratechange'); + }); }, }); @@ -134,9 +141,10 @@ const vimeo = { return volume; }, set(input) { - volume = input; - player.embed.setVolume(input); - utils.dispatchEvent.call(player, player.media, 'volumechange'); + player.embed.setVolume(input).then(() => { + volume = input; + utils.dispatchEvent.call(player, player.media, 'volumechange'); + }); }, }); @@ -148,9 +156,11 @@ const vimeo = { }, set(input) { const toggle = utils.is.boolean(input) ? input : false; - muted = toggle; - player.embed.setVolume(toggle ? 0 : player.config.volume); - utils.dispatchEvent.call(player, player.media, 'volumechange'); + + player.embed.setVolume(toggle ? 0 : player.config.volume).then(() => { + muted = toggle; + utils.dispatchEvent.call(player, player.media, 'volumechange'); + }); }, }); @@ -161,8 +171,11 @@ const vimeo = { return loop; }, set(input) { - loop = utils.is.boolean(input) ? input : player.config.loop.active; - player.embed.setLoop(loop); + const toggle = utils.is.boolean(input) ? input : player.config.loop.active; + + player.embed.setLoop(toggle).then(() => { + loop = toggle; + }); }, }); @@ -191,6 +204,7 @@ const vimeo = { // Get title player.embed.getVideoTitle().then(title => { player.config.title = title; + ui.setTitle.call(this); }); // Get current time @@ -269,6 +283,11 @@ const vimeo = { utils.dispatchEvent.call(player, player.media, 'ended'); }); + player.embed.on('error', detail => { + player.media.error = detail; + utils.dispatchEvent.call(player, player.media, 'error'); + }); + // Rebuild UI window.setTimeout(() => ui.build.call(player), 0); }, |