vlitejs
Version:
vLitejs is a fast and lightweight Javascript library for customizing video and audio player in Javascript with a minimalist theme (HTML5, Youtube, Vimeo, Dailymotion)
8 lines (7 loc) • 8.52 kB
JavaScript
/*!
* @license MIT
* @name vlitejs
* @version 7.4.0
* @copyright 2025 Yoriiis
*/
class e{constructor({player:e,options:t={}}){this.providers=["html5"],this.types=["video"],this.player=e,this.options=t,this.subtitles=[],this.backupAutoHide=!1,this.onCastStateChange=this.onCastStateChange.bind(this),this.onCurrentTimeChanged=this.onCurrentTimeChanged.bind(this),this.isMediaLoadedChanged=this.isMediaLoadedChanged.bind(this),this.onClickOnCastButton=this.onClickOnCastButton.bind(this),this.updateSubtitle=this.updateSubtitle.bind(this),this.onMediaPlay=this.onMediaPlay.bind(this),this.onMediaPause=this.onMediaPause.bind(this),this.onMediaVolumeChange=this.onMediaVolumeChange.bind(this),this.onMediaTimeupdate=this.onMediaTimeupdate.bind(this)}init(){this.isCastFrameworkAlreadyAvailable()?this.initCastApi():(window.__onGCastApiAvailable=e=>{e&&window.chrome.cast&&this.initCastApi()},this.loadWebSenderApi())}isCastFrameworkAlreadyAvailable(){var e;return!!((null===(e=window.cast)||void 0===e?void 0:e.framework)&&customElements.get&&customElements.get("google-cast-button"))}loadWebSenderApi(){const e=document.createElement("script");e.defer=!0,e.type="text/javascript",e.src="//www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1",document.getElementsByTagName("body")[0].appendChild(e)}initCastApi(){var e;this.castContext=window.cast.framework.CastContext.getInstance(),this.castContext.setOptions({receiverApplicationId:window.chrome.cast.media.DEFAULT_MEDIA_RECEIVER_APP_ID,autoJoinPolicy:window.chrome.cast.AutoJoinPolicy.ORIGIN_SCOPED}),this.remotePlayer=new window.cast.framework.RemotePlayer,this.remotePlayerController=new window.cast.framework.RemotePlayerController(this.remotePlayer),this.render();this.player.elements.container.querySelector(".v-castButton")&&(this.castButton=null===(e=this.player.elements.container)||void 0===e?void 0:e.querySelector(".v-castButton"),this.subtitles=this.getSubtitles(),this.addEvents())}render(){const e=this.player.elements.container.querySelector(".v-controlBar"),t=this.player.elements.container.querySelector(".v-fullscreenButton"),s='<button class="v-castButton v-controlButton"><svg viewBox="0 0 470 384" xmlns="http://www.w3.org/2000/svg"><path d="M426.5 0H42.7C19.1 0 0 19.1 0 42.7v63.9h42.7V42.7h383.8v298.6H277.3V384h149.4c23.6 0 42.7-19.1 42.7-42.7V42.7c0-23.6-19.3-42.7-42.9-42.7ZM0 319.6v63.9h63.9c0-35.3-28.6-63.9-63.9-63.9Zm0-85V277c58.9 0 106.6 48.1 106.6 107h42.7c.1-82.4-66.9-149.3-149.3-149.4ZM192.1 384h42.7C234.3 254.5 129.5 149.7 0 149.4v42.4c106-.2 192 86.2 192.1 192.2Z"/></svg></button>';e&&(t?t.insertAdjacentHTML("beforebegin",s):e.insertAdjacentHTML("beforeend",s))}addEvents(){this.castContext.addEventListener(window.cast.framework.CastContextEventType.SESSION_STATE_CHANGED,this.onCastStateChange),this.remotePlayerController.addEventListener(window.cast.framework.RemotePlayerEventType.CURRENT_TIME_CHANGED,this.onCurrentTimeChanged),this.remotePlayerController.addEventListener(window.cast.framework.RemotePlayerEventType.IS_MEDIA_LOADED_CHANGED,this.isMediaLoadedChanged),this.castButton.addEventListener("click",this.onClickOnCastButton),this.player.on("trackdisabled",this.updateSubtitle),this.player.on("trackenabled",this.updateSubtitle)}onCastStateChange(e){switch(e.sessionState){case window.cast.framework.SessionState.SESSION_STARTED:this.onSessionStart();break;case window.cast.framework.SessionState.SESSION_RESUMED:this.castContext.endCurrentSession(!0);break;case window.cast.framework.SessionState.SESSION_ENDED:this.onSessionStop()}}onCurrentTimeChanged(){this.player.updateProgressBar({seconds:this.remotePlayer.currentTime,duration:this.remotePlayer.duration,isRemote:!0})}onClickOnCastButton(e){e.preventDefault(),this.castContext.requestSession()}updateSubtitle(){if(!this.remotePlayer.isMediaLoaded)return;const e=this.player.plugins.subtitle.subtitlesList.querySelector(".v-trackButton.v-active").getAttribute("data-language");let t=[];if("off"===e)t=[];else{const s=this.subtitles.find((({language:t})=>t===e));s&&(t=[s.index])}const s=new window.chrome.cast.media.EditTracksInfoRequest(t);this.getSession().getMediaSession().editTracksInfo(s)}onSessionStart(){this.player.elements.container.focus(),this.player.methodPause(),this.backupAutoHide=this.player.Vlitejs.autoHideGranted,this.player.Vlitejs.autoHideGranted=!1,this.player.Vlitejs.stopAutoHideTimer(),this.player.elements.outerContainer.classList.add("v-remote"),this.castButton.classList.add("v-active"),this.player.isCast=!0;const e=this.getSession().getCastDevice().deviceName||"Chromecast";this.player.media.insertAdjacentHTML("afterend",`<span class="v-deviceName">Cast on ${e}</span>`),this.loadMedia(),this.player.dispatchEvent("castsessionstarted")}onSessionStop(){var e;this.player.Vlitejs.autoHideGranted=this.backupAutoHide,this.backupAutoHide&&this.player.Vlitejs.startAutoHideTimer(),this.player.elements.outerContainer.classList.remove("v-remote"),this.castButton.classList.remove("v-active"),this.player.isCast=!1,null===(e=this.player.elements.container.querySelector(".v-deviceName"))||void 0===e||e.remove(),this.player.isPaused||(this.player.methodPlay(),this.player.afterPlayPause()),this.player.dispatchEvent("castsessionended")}getSubtitles(){return Array.from(this.player.media.querySelectorAll("track")).map(((e,t)=>{var s,a,i,o;return{index:t,url:null!==(s=e.getAttribute("src"))&&void 0!==s?s:"",label:null!==(a=e.getAttribute("label"))&&void 0!==a?a:"",language:null!==(i=e.getAttribute("srclang"))&&void 0!==i?i:"",isDefault:null!==(o=e.hasAttribute("default"))&&void 0!==o?o:""}}))}getSession(){return this.castContext.getCurrentSession()}loadMedia(){const e=this.getSession();if(!e)return;const t=new window.chrome.cast.media.MediaInfo(this.player.media.src,"video/mp4");this.subtitles.length&&(t.tracks=this.getCastTracks());const s=new window.chrome.cast.media.TextTrackStyle;s.backgroundColor="#ffffff00",s.edgeColor="#00000016",s.edgeType="DROP_SHADOW",s.fontFamily="CASUAL",s.fontScale=1,s.foregroundColor="#ffffffff",t.textTrackStyle=Object.assign(Object.assign({},s),this.options.textTrackStyle||{});const a=new window.chrome.cast.media.GenericMediaMetadata;this.player.options.poster&&(a.images=[new window.chrome.cast.Image(this.player.options.poster)]),t.metadata=Object.assign(Object.assign({},a),this.options.metadata||{});const i=new window.chrome.cast.media.LoadRequest(t);i.autoplay=!1===this.player.isPaused,i.currentTime=this.player.media.currentTime,this.subtitles.length&&(i.activeTrackIds=[this.getActiveTrack().index]),e.loadMedia(i)}getCastTracks(){return this.subtitles.map((({url:e,label:t,language:s},a)=>{const i=new window.chrome.cast.media.Track(a,window.chrome.cast.media.TrackType.TEXT);return i.trackContentId=e,i.trackContentType="text/vtt",i.subtype=window.chrome.cast.media.TextTrackType.SUBTITLES,i.name=t,i.language=s,i}))}getActiveTrack(){return this.subtitles.find((e=>e.isDefault))||this.subtitles[0]}isMediaLoadedChanged(){this.player.on("play",this.onMediaPlay),this.player.on("pause",this.onMediaPause),this.player.on("volumechange",this.onMediaVolumeChange),this.player.on("timeupdate",this.onMediaTimeupdate)}onMediaPlay(){this.remotePlayer.isMediaLoaded&&this.remotePlayerController.playOrPause()}onMediaPause(){this.remotePlayer.isMediaLoaded&&this.remotePlayerController.playOrPause()}onMediaVolumeChange(){this.remotePlayer.isMediaLoaded&&this.player.getVolume().then((e=>{this.remotePlayer.volumeLevel=this.player.isMuted?0:e,this.remotePlayerController.setVolumeLevel()}))}onMediaTimeupdate(){this.remotePlayer.isMediaLoaded&&this.player.getCurrentTime().then((e=>{this.remotePlayer.currentTime=e,this.remotePlayerController.seek()}))}destroy(){this.castContext.removeEventListener(window.cast.framework.CastContextEventType.SESSION_STATE_CHANGED,this.onCastStateChange),this.remotePlayerController.removeEventListener(window.cast.framework.RemotePlayerEventType.CURRENT_TIME_CHANGED,this.onCurrentTimeChanged),this.remotePlayerController.removeEventListener(window.cast.framework.RemotePlayerEventType.IS_MEDIA_LOADED_CHANGED,this.isMediaLoadedChanged),this.castButton.removeEventListener("click",this.onClickOnCastButton),this.player.off("trackdisabled",this.updateSubtitle),this.player.off("trackenabled",this.updateSubtitle),this.player.off("play",this.onMediaPlay),this.player.off("pause",this.onMediaPause),this.player.off("volumechange",this.onMediaVolumeChange),this.player.off("timeupdate",this.onMediaTimeupdate)}}export{e as default};