@aidenlx/player
Version:
Headless web components that make integrating media on the a web a breeze.
2 lines (1 loc) • 6.3 kB
JavaScript
import{a as S}from"./chunk.AWJOXKSW.js";import{a as b}from"./chunk.IZOPTWJO.js";import{a as i,b as f}from"./chunk.KCC3AAG2.js";import{A as d,E as u,G as c,J as h,M as p,N as y,O as m,S as v,a as r,j as o,ja as g,m as s,s as n,t as l}from"./chunk.PWTX2M5C.js";var a=class extends g{constructor(){super();this.K=new o;this.z=void 0;this.controls=!1;this.loop=!1;this.playsinline=!1;this.loading="eager";this.re=!1;this.Ft=!0;this.$t=new S(this);this.ie=b.consume(this);this.mediaState=new Proxy(()=>this.ie.value,{get(e,t){return v(e()[t])},has(e,t){return Reflect.has(e(),t)},ownKeys(e){return Reflect.ownKeys(e())},getOwnPropertyDescriptor(e,t){return Reflect.getOwnPropertyDescriptor(e(),t)}});this.Le=y(this);this.mediaRequestQueue=new p;this.screenOrientationController=new m(this);this.fullscreenController=new c(this,this.screenOrientationController);d(this,"vds-media-provider-connect");let e=h(this,{threshold:0},t=>{if(this.loading!=="lazy"){e.hostDisconnected();return}t[0]?.isIntersecting&&(this.handleMediaCanLoad(),e.hostDisconnected())})}connectedCallback(){super.connectedCallback(),this.ds(),window.requestAnimationFrame(()=>{l(this.__canLoadPoster)&&(this.__canLoadPoster=!0)})}updated(e){super.updated(e),e.has("controls")&&this.dispatchEvent(s("vds-controls-change",{detail:this.controls??!1})),e.has("loop")&&this.dispatchEvent(s("vds-loop-change",{detail:this.loop??!1})),e.has("playsinline")&&this.dispatchEvent(s("vds-playsinline-change",{detail:this.playsinline??!1}))}firstUpdated(e){super.firstUpdated(e),this.dispatchEvent(s("vds-fullscreen-support-change",{detail:this.canFullscreen})),this.loading==="eager"&&this.handleMediaCanLoad()}disconnectedCallback(){super.disconnectedCallback(),this.mediaRequestQueue.destroy(),this.Ft=!1,this.K.empty()}ds(){}get autoplay(){return this.mediaState.autoplay}set autoplay(e){this.Le.queue("autoplay-change",()=>{if(this.autoplay!==e&&this.dispatchEvent(s("vds-autoplay-change",{detail:e})),this.canPlay&&!this.re&&e){this.re=!0;let t=()=>{this.re=!1};this.attemptAutoplay().then(t).catch(t)}})}get volume(){return this.mediaState.volume}set volume(e){this.mediaRequestQueue.queue("volume",()=>{let t=u(0,e,1);n(this.volume,t)&&(this.zr(t),this.requestUpdate("volume"))})}get paused(){return this.mediaState.paused}set paused(e){this.mediaRequestQueue.queue("paused",()=>{if(this.paused!==e){try{e?this.pause():this.play()}catch(t){this.z?.error("paused-change-fail",t)}this.requestUpdate("paused")}})}get currentTime(){return this.ls()}set currentTime(e){this.mediaRequestQueue.queue("time",()=>{n(this.currentTime,e)&&(this.Nt(e),this.requestUpdate("currentTime"))})}ls(){return Math.min(this.mediaState.currentTime,this.duration)}get muted(){return this.mediaState.muted}set muted(e){this.mediaRequestQueue.queue("muted",()=>{n(this.muted,e)&&(this.Wr(e),this.requestUpdate("muted"))})}get autoplayError(){return this.mediaState.autoplayError}get buffered(){return this.mediaState.buffered}get canPlay(){return this.mediaState.canPlay}get currentPoster(){return this.mediaState.currentPoster}get currentSrc(){return this.mediaState.currentSrc}get duration(){return this.mediaState.duration}get ended(){return this.mediaState.ended}get error(){return this.mediaState.error}get live(){return this.mediaState.mediaType==="live-video"}get mediaType(){return this.mediaState.mediaType}get played(){return this.mediaState.played}get playing(){return this.mediaState.playing}get seekable(){return this.mediaState.seekable}get seeking(){return this.mediaState.seeking}get started(){return this.mediaState.started}get viewType(){return this.mediaState.viewType}get waiting(){return this.mediaState.waiting}shouldPlayType(e){let t=this.canPlayType(e);return t==="maybe"||t==="probably"}get canLoad(){return this.mediaState.canLoad}async handleMediaCanLoad(){this.dispatchEvent(s("vds-can-load"))}Ot(){if(!this.canPlay)throw Error("Media is not ready - wait for `vds-can-play` event.")}async us(){if(!(!this.ended||this.currentTime===0))return this.Nt(0)}Un(){if(this.viewType!=="video")throw Error("Player is currently not in a video view.")}async Ut({event:e,duration:t}){this.canPlay||(this.dispatchEvent(s("vds-can-play",{triggerEvent:e,detail:{duration:t}})),await this.mediaRequestQueue.start(),await this.attemptAutoplay())}get canAttemptAutoplay(){return this.autoplay&&!this.started}async attemptAutoplay(){if(!(!this.canPlay||!this.canAttemptAutoplay)){this.re=!0;try{await this.play(),this.dispatchEvent(s("vds-autoplay",{detail:{muted:this.muted}}))}catch(e){this.dispatchEvent(s("vds-autoplay-fail",{detail:{muted:this.muted,error:e}})),this.requestUpdate()}this.re=!1}}J(e){if(this.t.currentSrc.set(e),!!this.hasUpdated){if(this.Ft){this.Ft=!1;return}this.mediaRequestQueue.stop(),this.dispatchEvent(s("vds-src-change",{detail:e}))}}get logLevel(){return this.$t.logLevel}set logLevel(e){}get idleDelay(){return this.$t.idleDelay}set idleDelay(e){this.$t.idleDelay=e}get store(){return this.ie.value}get t(){return this.ie.value}get canFullscreen(){return this.fullscreenController.isSupported}get fullscreen(){return this.mediaState.fullscreen}get fullscreenOrientation(){return this.fullscreenController.screenOrientationLock}set fullscreenOrientation(e){this.fullscreenController.screenOrientationLock=e}async requestFullscreen(){return this.fullscreenController.isRequestingNativeFullscreen?super.requestFullscreen():this.fullscreenController.requestFullscreen()}exitFullscreen(){return this.fullscreenController.exitFullscreen()}};r([i({type:Boolean,reflect:!0})],a.prototype,"autoplay",1),r([i({type:Boolean,reflect:!0})],a.prototype,"controls",2),r([i({type:Boolean,reflect:!0})],a.prototype,"loop",2),r([i({type:Boolean,reflect:!0})],a.prototype,"playsinline",2),r([i({type:Number,reflect:!0})],a.prototype,"volume",1),r([i({type:Boolean,reflect:!0})],a.prototype,"paused",1),r([i({attribute:"current-time",type:Number})],a.prototype,"currentTime",1),r([i({type:Boolean,reflect:!0})],a.prototype,"muted",1),r([f()],a.prototype,"__canLoadPoster",2),r([i({attribute:"loading"})],a.prototype,"loading",2),r([i({attribute:"log-level"})],a.prototype,"logLevel",1),r([i({attribute:"idle-delay",type:Number})],a.prototype,"idleDelay",1),r([i({attribute:"fullscreen-orientation"})],a.prototype,"fullscreenOrientation",1);export{a};