UNPKG

@vime/core

Version:

Customizable, extensible, accessible and framework agnostic media player.

1 lines 9.06 kB
import{r as t,c as i,h as s}from"./p-aa8acb66.js";import{a as e}from"./p-e3b0430a.js";import{c as h,k as o,u as a,e as n,h as r}from"./p-b018976f.js";import{M as d}from"./p-8b74fa0e.js";import{V as c}from"./p-415151d7.js";import{w as u,c as l}from"./p-17652948.js";import{w as m}from"./p-ad08a3bd.js";import"./p-d84b1c8a.js";import"./p-121aab6e.js";import"./p-8acb8eb5.js";import"./p-cbbce638.js";import"./p-152748b8.js";var p;!function(t){t.Play="play",t.Pause="pause",t.Seeking="seeking",t.Seeked="seeked",t.TimeUpdate="timeupdate",t.VolumeChange="volumechange",t.DurationChange="durationchange",t.FullscreenChange="fullscreenchange",t.CueChange="cuechange",t.Progress="progress",t.Error="error",t.PlaybackRateChange="playbackratechange",t.Loaded="loaded",t.BufferStart="bufferstart",t.BufferEnd="bufferend",t.TextTrackChange="texttrackchange",t.Waiting="waiting",t.Ended="ended"}(p||(p={}));var v=function(t,i,s,e){return new(s||(s=Promise))((function(h,o){function a(t){try{r(e.next(t))}catch(t){o(t)}}function n(t){try{r(e.throw(t))}catch(t){o(t)}}function r(t){var i;t.done?h(t.value):(i=t.value,i instanceof s?i:new s((function(t){t(i)}))).then(a,n)}r((e=e.apply(t,i||[])).next())}))};const b=new Map,f=class{constructor(s){t(this,s),this.vmLoadStart=i(this,"vmLoadStart",7),this.vmError=i(this,"vmError",7),this.defaultInternalState={},this.volume=50,this.hasLoaded=!1,this.internalState={paused:!0,playing:!1,seeking:!1,currentTime:0,buffered:0,playbackStarted:!1,playRequest:!1},this.embedSrc="",this.mediaTitle="",this.byline=!0,this.portrait=!0,this.noAutoAspectRatio=!1,this.cookies=!0,this.language="en",this.aspectRatio="16:9",this.autoplay=!1,this.controls=!1,this.loop=!1,this.muted=!1,this.playsinline=!1,h(this),u(this),m(this)}onVideoIdChange(){this.cancelTimeUpdates(),this.videoId?(this.embedSrc=`${this.getOrigin()}/video/${this.videoId}`,this.pendingDurationCall=o(),this.pendingMediaTitleCall=o(),this.fetchVideoInfo=this.getVideoInfo()):this.embedSrc=""}onCustomPosterChange(){this.dispatch("currentPoster",this.poster)}connectedCallback(){this.dispatch=l(this),this.dispatch("viewType",c.Video),this.onVideoIdChange(),this.defaultInternalState=Object.assign({},this.internalState)}componentWillLoad(){this.initialMuted=this.muted}disconnectedCallback(){this.cancelTimeUpdates(),this.pendingPlayRequest=void 0}getOrigin(){return"https://player.vimeo.com"}getPreconnections(){return[this.getOrigin(),"https://i.vimeocdn.com","https://f.vimeocdn.com","https://fresnel.vimeocdn.com"]}remoteControl(t,i){return this.embed.postMessage({method:t,value:i})}buildParams(){return{byline:this.byline,color:this.color,portrait:this.portrait,autopause:!1,transparent:!1,autoplay:this.autoplay,muted:this.initialMuted,playsinline:this.playsinline,dnt:!this.cookies}}getVideoInfo(){return v(this,void 0,void 0,(function*(){return b.has(this.videoId)?b.get(this.videoId):window.fetch(`https://vimeo.com/api/oembed.json?url=${this.embedSrc}`).then((t=>t.json())).then((t=>{var i;const s={poster:`https://i.vimeocdn.com/video/${null===(i=null==t?void 0:t.thumbnail_url)||void 0===i?void 0:i.match(/vimeocdn.com\/video\/(.*)?_/)[1]}_1920x1080.jpg`,width:null==t?void 0:t.width,height:null==t?void 0:t.height};return b.set(this.videoId,s),s}))}))}onTimeChange(t){this.internalState.currentTime!==t&&(this.dispatch("currentTime",t),Math.abs(this.internalState.currentTime-t)>1.5&&(this.internalState.seeking=!0,this.dispatch("seeking",!0),this.internalState.playing&&this.internalState.buffered<t&&this.dispatch("buffering",!0),window.clearTimeout(this.pendingPlayRequest),this.internalState.paused||(this.internalState.playRequest=!0),this.remoteControl(this.internalState.playbackStarted?"pause":"play")),this.internalState.currentTime=t)}cancelTimeUpdates(){a(this.timeRAF)&&window.cancelAnimationFrame(this.timeRAF)}requestTimeUpdates(){this.remoteControl("getCurrentTime"),this.timeRAF=window.requestAnimationFrame((()=>{this.requestTimeUpdates()}))}onSeeked(){this.internalState.seeking&&(this.dispatch("seeking",!1),this.internalState.seeking=!1,this.internalState.playRequest&&window.setTimeout((()=>{this.remoteControl("play")}),150))}onVimeoMethod(t,i){var s,e;switch(t){case"getCurrentTime":this.internalState.seeking||this.onTimeChange(i);break;case"getDuration":null===(s=this.pendingDurationCall)||void 0===s||s.resolve(i);break;case"getVideoTitle":null===(e=this.pendingMediaTitleCall)||void 0===e||e.resolve(i)}}onLoaded(){var t,i;this.hasLoaded||(this.pendingPlayRequest=void 0,this.internalState=Object.assign({},this.defaultInternalState),this.dispatch("currentSrc",this.embedSrc),this.dispatch("mediaType",d.Video),this.remoteControl("getDuration"),this.remoteControl("getVideoTitle"),Promise.all([this.fetchVideoInfo,null===(t=this.pendingDurationCall)||void 0===t?void 0:t.promise,null===(i=this.pendingMediaTitleCall)||void 0===i?void 0:i.promise]).then((([t,i,s])=>{var e,h,o;this.requestTimeUpdates(),this.dispatch("aspectRatio",`${null!==(e=null==t?void 0:t.width)&&void 0!==e?e:16}:${null!==(h=null==t?void 0:t.height)&&void 0!==h?h:9}`),this.dispatch("currentPoster",null!==(o=this.poster)&&void 0!==o?o:null==t?void 0:t.poster),this.dispatch("duration",null!=i?i:-1),this.dispatch("mediaTitle",s),this.dispatch("playbackReady",!0)})),this.hasLoaded=!0)}onVimeoEvent(t,i){switch(t){case"ready":Object.values(p).forEach((t=>{this.remoteControl("addEventListener",t)}));break;case"loaded":this.onLoaded();break;case"play":this.onLoaded(),this.internalState.paused=!1,this.dispatch("paused",!1);break;case"playProgress":this.internalState.playing||(this.dispatch("playing",!0),this.internalState.playing=!0,this.internalState.playbackStarted=!0,this.pendingPlayRequest=window.setTimeout((()=>{this.internalState.playRequest=!1,this.pendingPlayRequest=void 0}),1e3)),this.dispatch("buffering",!1),this.onSeeked();break;case"pause":this.internalState.paused=!0,this.internalState.playing=!1,this.dispatch("paused",!0),this.dispatch("buffering",!1);break;case"loadProgress":this.internalState.buffered=i.seconds,this.dispatch("buffered",i.seconds);break;case"bufferstart":this.dispatch("buffering",!0),this.internalState.paused&&(this.internalState.paused=!1,this.dispatch("paused",!1),this.dispatch("playbackStarted",!0));break;case"bufferend":this.dispatch("buffering",!1),this.internalState.paused&&this.onSeeked();break;case"volumechange":if(i.volume>0){const t=Math.floor(100*i.volume);this.dispatch("muted",!1),this.volume!==t&&(this.volume=t,this.dispatch("volume",this.volume))}else this.dispatch("muted",!0);break;case"durationchange":this.dispatch("duration",i.duration);break;case"playbackratechange":this.dispatch("playbackRate",i.playbackRate);break;case"fullscreenchange":this.dispatch("isFullscreenActive",i.fullscreen);break;case"finish":this.loop?(this.remoteControl("setCurrentTime",0),setTimeout((()=>{this.remoteControl("play")}),200)):this.dispatch("playbackEnded",!0);break;case"error":this.vmError.emit(i)}}onEmbedSrcChange(){this.hasLoaded=!1,this.vmLoadStart.emit(),this.dispatch("viewType",c.Video)}onEmbedMessage(t){const i=t.detail;n(i.event)||this.onVimeoEvent(i.event,i.data),n(i.method)||this.onVimeoMethod(i.method,i.value)}adjustPosition(){if(this.controls)return{};const[t,i]=this.aspectRatio.split(":").map((t=>parseInt(t,10)));return{paddingBottom:"240%",transform:`translateY(-${(240-100/t*i)/4.8+.02}%)`}}getAdapter(){return v(this,void 0,void 0,(function*(){const t=/vimeo(?:\.com|)\/([0-9]{9,})/,i=/vimeo\.com\/external\/[0-9]+\..+/;return{getInternalPlayer:()=>v(this,void 0,void 0,(function*(){return this.embed})),play:()=>v(this,void 0,void 0,(function*(){this.remoteControl("play")})),pause:()=>v(this,void 0,void 0,(function*(){this.remoteControl("pause")})),canPlay:s=>v(this,void 0,void 0,(function*(){return r(s)&&!i.test(s)&&t.test(s)})),setCurrentTime:t=>v(this,void 0,void 0,(function*(){t!==this.internalState.currentTime&&this.remoteControl("setCurrentTime",t)})),setMuted:t=>v(this,void 0,void 0,(function*(){t||(this.volume=this.volume>0?this.volume:30),this.remoteControl("setVolume",t?0:this.volume/100)})),setVolume:t=>v(this,void 0,void 0,(function*(){this.muted?this.dispatch("volume",t):this.remoteControl("setVolume",t/100)})),canSetPlaybackRate:()=>v(this,void 0,void 0,(function*(){return!1})),setPlaybackRate:t=>v(this,void 0,void 0,(function*(){this.remoteControl("setPlaybackRate",t)}))}}))}render(){return s("vm-embed",{class:{hideControls:!this.controls},style:this.adjustPosition(),embedSrc:this.embedSrc,mediaTitle:this.mediaTitle,origin:this.getOrigin(),params:this.buildParams(),decoder:e,preconnections:this.getPreconnections(),onVmEmbedMessage:this.onEmbedMessage.bind(this),onVmEmbedSrcChange:this.onEmbedSrcChange.bind(this),ref:t=>{this.embed=t}})}static get watchers(){return{videoId:["onVideoIdChange"],poster:["onCustomPosterChange"]}}};f.style=":host{z-index:var(--vm-media-z-index)}vm-embed{position:absolute;top:0;left:0;width:100%;height:100%}vm-embed.hideControls{display:block;width:100%;height:auto;position:relative}";export{f as vm_vimeo}