diff --git a/static/web/404.html b/static/web/404.html index bec4a9e8a..0711b42ff 100644 --- a/static/web/404.html +++ b/static/web/404.html @@ -1,4 +1,4 @@ -404: This page could not be found

404

This page could not be found.

\ No newline at end of file + }

404

This page could not be found.

\ No newline at end of file diff --git a/static/web/404/index.html b/static/web/404/index.html index bec4a9e8a..0711b42ff 100644 --- a/static/web/404/index.html +++ b/static/web/404/index.html @@ -1,4 +1,4 @@ -404: This page could not be found

404

This page could not be found.

\ No newline at end of file + }

404

This page could not be found.

\ No newline at end of file diff --git a/static/web/_next/static/chunks/2239-74b7904476fd13ad.js b/static/web/_next/static/chunks/2239-74b7904476fd13ad.js new file mode 100644 index 000000000..5c0fbc705 --- /dev/null +++ b/static/web/_next/static/chunks/2239-74b7904476fd13ad.js @@ -0,0 +1 @@ +(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[2239],{8888:function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{OwncastPlayer:function(){return OwncastPlayer},default:function(){return OwncastPlayer_OwncastPlayer}});var jsx_runtime=__webpack_require__(85893),react=__webpack_require__(67294),es=__webpack_require__(4480),react_hotkeys_hook_esm=__webpack_require__(49218),video_es=__webpack_require__(85215),VideoJS_module=__webpack_require__(76161),VideoJS_module_default=__webpack_require__.n(VideoJS_module);__webpack_require__(27901);let VideoJS=param=>{let{options,onReady}=param,videoRef=react.useRef(null),playerRef=react.useRef(null);return react.useEffect(()=>{if(!playerRef.current){let videoElement=videoRef.current,player=playerRef.current=(0,video_es.Z)(videoElement,options,()=>(console.debug("player is ready"),onReady&&onReady(player,video_es.Z)));player.autoplay(options.autoplay),player.src(options.sources)}video_es.Z.Vhs.xhr.beforeRequest=o=>{if(console.log("beforeRequest"),o.uri.match("m3u8")){let cachebuster=Math.random().toString(16).substr(2,8);o.uri="".concat(o.uri,"?cachebust=").concat(cachebuster)}return o}},[options,videoRef]),(0,jsx_runtime.jsx)("div",{"data-vjs-player":!0,children:(0,jsx_runtime.jsx)("video",{ref:videoRef,className:"video-js vjs-big-play-centered vjs-show-big-play-button-on-pause ".concat(VideoJS_module_default().player," vjs-owncast")})})},imgStyle={position:"absolute",width:"100%",height:"100%"},CrossfadeImage=param=>{let{src="",width,height,objectFit="fill",duration="1s"}=param,spanStyle=(0,react.useMemo)(()=>({display:"inline-block",position:"relative",width,height}),[width,height]),imgStyles=(0,react.useMemo)(()=>[{...imgStyle,objectFit,opacity:0,transition:"opacity ".concat(duration)},{...imgStyle,objectFit,opacity:1,transition:"opacity ".concat(duration)},{...imgStyle,objectFit,opacity:0}],[objectFit,duration]),[key,setKey]=(0,react.useState)(0),[srcs,setSrcs]=(0,react.useState)(["",""]),nextSrc=src!==srcs[1]?src:"",onLoadImg=()=>{setKey((key+1)%3),setSrcs([srcs[1],nextSrc])};return(0,jsx_runtime.jsx)("span",{style:spanStyle,children:[...srcs,nextSrc].map((singleSrc,index)=>""!==singleSrc&&(0,jsx_runtime.jsx)("img",{src:singleSrc,alt:"",style:imgStyles[index],onLoad:2===index?onLoadImg:void 0},singleSrc))})};CrossfadeImage.defaultProps={objectFit:"fill",duration:"3s"};var VideoPoster_module=__webpack_require__(70034),VideoPoster_module_default=__webpack_require__.n(VideoPoster_module);let VideoPoster=param=>{let timer,{online,initialSrc,src:base}=param,[src,setSrc]=(0,react.useState)(initialSrc),[duration,setDuration]=(0,react.useState)("0s");return(0,react.useEffect)(()=>{clearInterval(timer),timer=setInterval(()=>{"0s"===duration&&setDuration("3s"),setSrc("".concat(base,"?").concat(Date.now()))},2e4)},[]),(0,jsx_runtime.jsxs)("div",{className:VideoPoster_module_default().poster,children:[!online&&(0,jsx_runtime.jsx)("img",{src:initialSrc,alt:"logo"}),online&&(0,jsx_runtime.jsx)(CrossfadeImage,{src:src,duration:duration,objectFit:"cover",width:"100%",height:"100%"})]})};var localStorage=__webpack_require__(72581),ClientConfigStore=__webpack_require__(77466),playback=class{stop(){clearInterval(this.sendMetricsTimer),this.player.off()}setClockSkew(skewMs){this.clockSkewMs=skewMs}videoJSReady(){let tech=this.player.tech({IWillNotUseThisInPlugins:!0});this.supportsDetailedMetrics=!!tech,tech.on("usage",e=>{"vhs-unknown-waiting"===e.name&&this.setIsBuffering(!0),"vhs-rendition-change-abr"===e.name&&this.incrementQualityVariantChanges()});let trackElements=this.player.textTracks();trackElements.addEventListener("cuechange",()=>{this.incrementQualityVariantChanges()})}handlePlaying(){clearInterval(this.collectPlaybackMetricsTimer),this.collectPlaybackMetricsTimer=setInterval(()=>{this.collectPlaybackMetrics()},5e3)}handleEnded(){clearInterval(this.collectPlaybackMetricsTimer)}handleBuffering(){this.incrementErrorCount(1),this.setIsBuffering(!0)}handleNoLongerBuffering(){this.setIsBuffering(!1)}handleError(){this.incrementErrorCount(1)}incrementErrorCount(count){this.errors+=count}incrementQualityVariantChanges(){if(!this.hasPerformedInitialVariantChange){this.hasPerformedInitialVariantChange=!0;return}this.qualityVariantChanges++}setIsBuffering(isBuffering){if(this.isBuffering=isBuffering,!isBuffering){clearTimeout(this.bufferingDurationTimer);return}this.bufferingDurationTimer=setTimeout(()=>{this.incrementErrorCount(1)},500)}trackSegmentDownloadTime(seconds){this.segmentDownloadTime.push(seconds)}trackBandwidth(bps){this.bandwidthTracking.push(bps)}trackLatency(latency){this.latencyTracking.push(latency)}collectPlaybackMetrics(){let tech=this.player.tech({IWillNotUseThisInPlugins:!0});if(!tech||!tech.vhs||this.player.paused())return;let networkState=this.player.networkState();if(2!==networkState)return;let bandwidth=tech.vhs.systemBandwidth;this.trackBandwidth(bandwidth);try{let segment=function(tech){let segment;let targetMedia=tech.vhs.playlists.media(),snapshotTime=tech.currentTime();for(let i=0,l=targetMedia.segments.length;i=40)return;this.trackLatency(latency)}catch(err){console.warn(err)}}async send(){let data;if(0===this.segmentDownloadTime.length||!this.player||this.player.paused())return;let errorCount=this.errors;if(this.supportsDetailedMetrics){let average=arr=>arr.reduce((p,c)=>p+c,0)/arr.length,averageDownloadDuration=average(this.segmentDownloadTime)/1e3,averageBandwidth=average(this.bandwidthTracking)/1e3,averageLatency=average(this.latencyTracking)/1e3;data={bandwidth:Math.round(1e3*averageBandwidth)/1e3,latency:Math.round(1e3*averageLatency)/1e3,downloadDuration:Math.round(1e3*averageDownloadDuration)/1e3,errors:errorCount+(this.isBuffering?1:0),qualityVariantChanges:this.qualityVariantChanges}}else data={errors:errorCount+(this.isBuffering?1:0)};this.errors=0,this.qualityVariantChanges=0,this.segmentDownloadTime=[],this.bandwidthTracking=[],this.latencyTracking=[];let options={method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(data)};try{await fetch("/api/metrics/playback",options)}catch(e){console.error(e)}}constructor(player,videojs){var _this=this;this.player=player,this.supportsDetailedMetrics=!1,this.hasPerformedInitialVariantChange=!1,this.clockSkewMs=0,this.segmentDownloadTime=[],this.bandwidthTracking=[],this.latencyTracking=[],this.errors=0,this.qualityVariantChanges=0,this.isBuffering=!1,this.bufferingDurationTimer=0,this.collectPlaybackMetricsTimer=0,this.videoJSReady=this.videoJSReady.bind(this),this.handlePlaying=this.handlePlaying.bind(this),this.handleBuffering=this.handleBuffering.bind(this),this.handleEnded=this.handleEnded.bind(this),this.handleError=this.handleError.bind(this),this.send=this.send.bind(this),this.collectPlaybackMetrics=this.collectPlaybackMetrics.bind(this),this.handleNoLongerBuffering=this.handleNoLongerBuffering.bind(this),this.sendMetricsTimer=0,this.player.on("canplaythrough",this.handleNoLongerBuffering),this.player.on("error",this.handleError),this.player.on("stalled",this.handleBuffering),this.player.on("waiting",this.handleBuffering),this.player.on("playing",this.handlePlaying),this.player.on("ended",this.handleEnded);let oldVjsXhrCallback=videojs.xhr;videojs.Vhs.xhr=function(){for(var _len=arguments.length,args=Array(_len),_key=0;_key<_len;_key++)args[_key]=arguments[_key];if(args[0].uri.match(".ts")){let start=new Date,cb=args[1];args[1]=(request,error,response)=>{let end=new Date,delta=end.getTime()-start.getTime();_this.trackSegmentDownloadTime(delta),cb(request,error,response)}}return oldVjsXhrCallback(...args)},this.videoJSReady(),this.sendMetricsTimer=setInterval(()=>{this.send()},1e4)}},settings_menu=function(player,videojs,qualities,latencyItemPressed){let VjsMenuItem=videojs.getComponent("MenuItem"),MenuItem=videojs.getComponent("MenuItem"),MenuButtonClass=videojs.getComponent("MenuButton"),lowLatencyItem=new MenuItem(player,{selectable:!0});lowLatencyItem.setAttribute("class","latency-toggle-item"),lowLatencyItem.on("click",()=>{latencyItemPressed()});let separator=new class extends VjsMenuItem{createEl(){let tag=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"button",props=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},attributes=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},el=super.createEl(tag,props,attributes);return el.innerHTML='
',el}constructor(p,options){super(p,options)}}(player,{selectable:!1});class MenuButton extends MenuButtonClass{createItems(){let tech=player.tech({IWillNotUseThisInPlugins:!0}),defaultAutoItem=new MenuItem(player,{selectable:!0,label:"Auto"}),items=qualities.map(item=>{let newMenuItem=new MenuItem(player,{selectable:!0,label:item.name});return newMenuItem.on("click",()=>{if(!tech){console.warn("Invalid attempt to access null player tech");return}tech.vhs.representations().forEach((rep,index)=>{rep.enabled(index===item.index)}),newMenuItem.selected(!1)}),newMenuItem});defaultAutoItem.on("click",()=>{tech.vhs.representations().forEach(rep=>{rep.enabled(!0)}),defaultAutoItem.selected(!1)});let supportsLatencyCompensator=!!tech&&!!tech.vhs;return qualities.length<2&&supportsLatencyCompensator?[lowLatencyItem]:qualities.length>1&&supportsLatencyCompensator?[defaultAutoItem,...items,separator,lowLatencyItem]:supportsLatencyCompensator||1!==qualities.length?[defaultAutoItem,...items]:[]}constructor(){super(player)}}let tech=player.tech({IWillNotUseThisInPlugins:!0});if(qualities.length<2&&(!tech||!tech.vhs))return;videojs.registerComponent("MenuButton",MenuButton);let menuButton=new MenuButton;return menuButton.addClass("vjs-quality-selector"),menuButton},latencyCompensator=class{setClockSkew(skewMs){this.clockSkewMs=skewMs}check(){if(new Date().getTime()-this.startupTime.getTime()<1e4||this.player.paused()||this.player.seeking()||this.inTimeout||!this.enabled)return;let tech=this.player.tech({IWillNotUseThisInPlugins:!0});if(!tech||!tech.vhs)return;let networkState=this.player.networkState();if(2!==networkState)return;let totalBuffered=0;try{if(0===tech.vhs.stats.buffered.length){this.timeout();return}tech.vhs.stats.buffered.forEach(buffer=>{totalBuffered+=buffer.end-buffer.start})}catch(e){console.error(e)}let currentPlaylist=tech.vhs.playlists.media(),currentPlaylistBandwidth=currentPlaylist.attributes.BANDWIDTH,playerBandwidth=tech.vhs.systemBandwidth,bandwidthRatio=playerBandwidth/currentPlaylistBandwidth;try{let segment=function(tech){let segment;let targetMedia=tech.vhs.playlists.media(),snapshotTime=tech.currentTime();for(let i=0,l=targetMedia.segments.length;isum+current,0)/targetLatencies.length,maxLatencyThreshold=Math.max(1.4*minLatencyThreshold,Math.min(1e3*segment.duration*2.6,15e3));minLatencyThreshold>=maxLatencyThreshold&&(maxLatencyThreshold=minLatencyThreshold+3e3);let segmentTime=segment.dateTimeObject.getTime(),now=new Date().getTime()+this.clockSkewMs,latency=now-segmentTime;if(this.currentLatency=latency,Math.abs(latency)>8e4){this.timeout();return}if(latency>maxLatencyThreshold){if(this.shouldJumpToLive()&&latency>maxLatencyThreshold+5e3){let jumpAmount=latency/1e3-3*segment.duration,seekPosition=this.player.currentTime()+jumpAmount;console.info("latency",latency/1e3,"jumping",jumpAmount,"to live from ",this.player.currentTime()," to ",seekPosition);let availableBufferedTimeEnd=tech.vhs.stats.buffered[0].end,availableBufferedTimeStart=tech.vhs.stats.buffered[0].start;if(seekPosition>availableBufferedTimeStartthis.playbackRate+.02&&(proposedPlaybackRate=this.playbackRate+.02),proposedPlaybackRate=Math.round(1e3*proposedPlaybackRate)/1e3,this.start(proposedPlaybackRate)}else latency<=minLatencyThreshold&&this.stop();console.info("latency",latency/1e3,"min",minLatencyThreshold/1e3,"max",maxLatencyThreshold/1e3,"playback rate",this.playbackRate,"enabled:",this.enabled,"running: ",this.running,"skew: ",this.clockSkewMs,"rebuffer events: ",this.bufferingCounter)}catch(err){}}shouldJumpToLive(){if(this.bufferingCounter>1)return!1;let now=new Date().getTime(),delta=now-this.lastJumpOccurred;return delta>2e4}jump(seekPosition){this.jumpingToLiveIgnoreBuffer=!0,this.performedInitialLiveJump=!0,this.lastJumpOccurred=new Date,console.info("current time",this.player.currentTime(),"seeking to",seekPosition),this.player.currentTime(seekPosition),setTimeout(()=>{this.jumpingToLiveIgnoreBuffer=!1},5e3)}setPlaybackRate(rate){this.playbackRate=rate,this.player.playbackRate(rate)}start(){let rate=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1;!this.inTimeout&&this.enabled&&rate!==this.playbackRate&&(this.running=!0,this.setPlaybackRate(rate))}stop(){this.running&&console.log("stopping latency compensator..."),this.running=!1,this.setPlaybackRate(1)}enable(){this.enabled=!0,clearInterval(this.checkTimer),clearTimeout(this.bufferingTimer),this.checkTimer=setInterval(()=>{this.check()},3e3)}disable(){clearInterval(this.checkTimer),clearTimeout(this.timeoutTimer),this.stop(),this.enabled=!1}timeout(){this.jumpingToLiveIgnoreBuffer||(this.inTimeout=!0,this.stop(),clearTimeout(this.timeoutTimer),this.timeoutTimer=setTimeout(()=>{this.endTimeout()},3e4))}endTimeout(){clearTimeout(this.timeoutTimer),this.inTimeout=!1}handlePlaying(){let wasPreviouslyPlaying=this.playing;this.playing=!0,clearTimeout(this.bufferingTimer),this.enabled&&this.shouldJumpToLive()&&(wasPreviouslyPlaying||(this.jumpingToLiveIgnoreBuffer=!0,this.player.liveTracker.seekToLiveEdge(),this.lastJumpOccurred=new Date))}handlePause(){this.playing=!1}handleEnded(){this.enabled&&this.disable()}handleError(){this.enabled&&this.timeout()}countBufferingEvent(){if(this.bufferingCounter+=1,this.bufferingCounter>4){this.disable();return}this.bufferedAtLatency.push(this.currentLatency),console.log("latency compensation timeout due to buffering:",this.bufferingCounter,"buffering events of",4),setTimeout(()=>{this.bufferingCounter>0&&(this.bufferingCounter-=1)},18e4)}handleBuffering(){if(this.enabled&&!this.inTimeout){if(this.jumpingToLiveIgnoreBuffer){this.jumpingToLiveIgnoreBuffer=!1;return}this.timeout(),clearTimeout(this.bufferingTimer),this.bufferingTimer=setTimeout(()=>{this.countBufferingEvent()},200)}}constructor(player){this.player=player,this.playing=!1,this.enabled=!1,this.running=!1,this.inTimeout=!1,this.jumpingToLiveIgnoreBuffer=!1,this.timeoutTimer=0,this.checkTimer=0,this.bufferingCounter=0,this.bufferingTimer=0,this.playbackRate=1,this.lastJumpOccurred=null,this.startupTime=new Date,this.clockSkewMs=0,this.currentLatency=null,this.bufferedAtLatency=[],this.player.on("playing",this.handlePlaying.bind(this)),this.player.on("pause",this.handlePause.bind(this)),this.player.on("error",this.handleError.bind(this)),this.player.on("waiting",this.handleBuffering.bind(this)),this.player.on("stalled",this.handleBuffering.bind(this)),this.player.on("ended",this.handleEnded.bind(this)),this.player.on("canplaythrough",this.handlePlaying.bind(this)),this.player.on("canplay",this.handlePlaying.bind(this)),this.check=this.check.bind(this),this.start=this.start.bind(this),this.enable=this.enable.bind(this),this.countBufferingEvent=this.countBufferingEvent.bind(this)}};let PLAYER_VOLUME="owncast_volume",LATENCY_COMPENSATION_ENABLED="latencyCompensatorEnabled",OwncastPlayer_ping=new class{start(){this.stop(),this.timer=setInterval(()=>{!function(){try{fetch("/api/ping")}catch(e){console.error(e)}}()},4e3)}stop(){clearInterval(this.timer)}},playbackMetrics=null,OwncastPlayer_latencyCompensator=null,latencyCompensatorEnabled=!1;async function getVideoSettings(){let qualities=[];try{let response=await fetch("/api/video/variants");qualities=await response.json()}catch(e){console.error(e)}return qualities}let OwncastPlayer=param=>{let{source,online}=param,playerRef=react.useRef(null),[videoPlaying,setVideoPlaying]=(0,es.FV)(ClientConfigStore.We),clockSkew=(0,es.sJ)(ClientConfigStore.g8),setSavedVolume=()=>{try{playerRef.current.volume((0,localStorage.$o)(PLAYER_VOLUME)||1)}catch(err){console.warn(err)}},handleVolume=()=>{(0,localStorage.qQ)(PLAYER_VOLUME,playerRef.current.muted()?0:playerRef.current.volume())},togglePlayback=()=>{playerRef.current.paused()?playerRef.current.play():playerRef.current.pause()},toggleMute=()=>{playerRef.current.muted()||0===playerRef.current.volume()?playerRef.current.volume(.7):playerRef.current.volume(0)},toggleFullScreen=()=>{playerRef.current.isFullscreen()?playerRef.current.exitFullscreen():playerRef.current.requestFullscreen()},setLatencyCompensatorItemTitle=title=>{let item=document.querySelector(".latency-toggle-item > .vjs-menu-item-text");item&&(item.innerHTML=title)},startLatencyCompensator=()=>{OwncastPlayer_latencyCompensator&&OwncastPlayer_latencyCompensator.stop(),latencyCompensatorEnabled=!0,(OwncastPlayer_latencyCompensator=new latencyCompensator(playerRef.current)).setClockSkew(clockSkew),OwncastPlayer_latencyCompensator.enable(),(0,localStorage.qQ)(LATENCY_COMPENSATION_ENABLED,!0),setLatencyCompensatorItemTitle("disable minimized latency")},stopLatencyCompensator=()=>{OwncastPlayer_latencyCompensator&&OwncastPlayer_latencyCompensator.disable(),OwncastPlayer_latencyCompensator=null,latencyCompensatorEnabled=!1,(0,localStorage.qQ)(LATENCY_COMPENSATION_ENABLED,!1),setLatencyCompensatorItemTitle('enable minimized latency (experimental)')},toggleLatencyCompensator=()=>{latencyCompensatorEnabled?stopLatencyCompensator():startLatencyCompensator()},setupLatencyCompensator=player=>{let tech=player.tech({IWillNotUseThisInPlugins:!0});if(!tech||!tech.vhs)return;let latencyCompensatorEnabledSaved=(0,localStorage.$o)(LATENCY_COMPENSATION_ENABLED);"true"===latencyCompensatorEnabledSaved&&tech&&tech.vhs?startLatencyCompensator():stopLatencyCompensator()},createSettings=async(player,videojs)=>{let videoQualities=await getVideoSettings(),menuButton=settings_menu(player,videojs,videoQualities,toggleLatencyCompensator);player.controlBar.addChild(menuButton,{},player.controlBar.children_.length-2),setupLatencyCompensator(player)},setupAirplay=(player,videojs)=>{if(window.hasOwnProperty("WebKitPlaybackTargetAvailabilityEvent")){let videoJsButtonClass=videojs.getComponent("Button"),ConcreteButtonClass=videojs.extend(videoJsButtonClass,{constructor(){videoJsButtonClass.call(this,player)},handleClick(){try{let videoElement=document.getElementsByTagName("video")[0];videoElement.webkitShowPlaybackTargetPicker()}catch(e){console.error(e)}}}),concreteButtonInstance=player.controlBar.addChild(new ConcreteButtonClass);concreteButtonInstance.addClass("vjs-airplay")}};(0,react_hotkeys_hook_esm.y1)("space",e=>{e.preventDefault(),togglePlayback()}),(0,react_hotkeys_hook_esm.y1)("f",toggleFullScreen,{enableOnContentEditable:!1}),(0,react_hotkeys_hook_esm.y1)("m",toggleMute,{enableOnContentEditable:!1}),(0,react_hotkeys_hook_esm.y1)("0",()=>playerRef.current.volume(playerRef.current.volume()+.1),{enableOnContentEditable:!1}),(0,react_hotkeys_hook_esm.y1)("9",()=>playerRef.current.volume(playerRef.current.volume()-.1),{enableOnContentEditable:!1});let handlePlayerReady=(player,videojs)=>{playerRef.current=player,setSavedVolume(),setupAirplay(player,videojs),player.on("waiting",()=>{console.debug("player is waiting")}),player.on("dispose",()=>{console.debug("player will dispose"),OwncastPlayer_ping.stop()}),player.on("playing",()=>{console.debug("player is playing"),OwncastPlayer_ping.start(),setVideoPlaying(!0)}),player.on("pause",()=>{console.debug("player is paused"),OwncastPlayer_ping.stop(),setVideoPlaying(!1)}),player.on("ended",()=>{console.debug("player is ended"),OwncastPlayer_ping.stop(),setVideoPlaying(!1)}),videojs.hookOnce(),player.on("volumechange",handleVolume),(playbackMetrics=new playback(player,videojs)).setClockSkew(clockSkew),createSettings(player,videojs)};return(0,react.useEffect)(()=>{playbackMetrics&&playbackMetrics.setClockSkew(clockSkew)},[clockSkew]),(0,react.useEffect)(()=>()=>{stopLatencyCompensator(),null==playbackMetrics||playbackMetrics.stop()},[]),(0,jsx_runtime.jsxs)("div",{style:{display:"grid",width:"100% !important",aspectRatio:"16/9"},children:[online&&(0,jsx_runtime.jsx)("div",{style:{gridColumn:1,gridRow:1},children:(0,jsx_runtime.jsx)(VideoJS,{options:{autoplay:!1,controls:!0,responsive:!0,fluid:!1,playsinline:!0,liveui:!0,preload:"auto",controlBar:{progressControl:{seekBar:!1}},html5:{vhs:{enableLowInitialPlaylist:!0,experimentalBufferBasedABR:!0,useNetworkInformationApi:!0,maxPlaylistRetries:30}},liveTracker:{trackingThreshold:0,liveTolerance:15},sources:[{src:source,type:"application/x-mpegURL"}]},onReady:handlePlayerReady})}),(0,jsx_runtime.jsx)("div",{style:{gridColumn:1,gridRow:1},children:!videoPlaying&&(0,jsx_runtime.jsx)(VideoPoster,{online:online,initialSrc:"/thumbnail.jpg",src:"/thumbnail.jpg"})})]})};var OwncastPlayer_OwncastPlayer=OwncastPlayer},76161:function(module){module.exports={player:"VideoJS_player__GT8FN",poster:"VideoJS_poster__nlmqm"}},70034:function(module){module.exports={poster:"VideoPoster_poster__RDkSk"}},25893:function(){}}]); \ No newline at end of file diff --git a/static/web/_next/static/chunks/2239-e43a7d36407cd91e.js b/static/web/_next/static/chunks/2239-e43a7d36407cd91e.js deleted file mode 100644 index 49ab8b6bc..000000000 --- a/static/web/_next/static/chunks/2239-e43a7d36407cd91e.js +++ /dev/null @@ -1 +0,0 @@ -(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[2239],{8888:function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{OwncastPlayer:function(){return OwncastPlayer},default:function(){return OwncastPlayer_OwncastPlayer}});var jsx_runtime=__webpack_require__(85893),react=__webpack_require__(67294),es=__webpack_require__(4480),react_hotkeys_hook_esm=__webpack_require__(49218),video_es=__webpack_require__(85215),VideoJS_module=__webpack_require__(76161),VideoJS_module_default=__webpack_require__.n(VideoJS_module);__webpack_require__(27901);let VideoJS=param=>{let{options,onReady}=param,videoRef=react.useRef(null),playerRef=react.useRef(null);return react.useEffect(()=>{if(!playerRef.current){let videoElement=videoRef.current,player=playerRef.current=(0,video_es.Z)(videoElement,options,()=>(console.debug("player is ready"),onReady&&onReady(player,video_es.Z)));player.autoplay(options.autoplay),player.src(options.sources)}},[options,videoRef]),(0,jsx_runtime.jsx)("div",{"data-vjs-player":!0,children:(0,jsx_runtime.jsx)("video",{ref:videoRef,className:"video-js vjs-big-play-centered vjs-show-big-play-button-on-pause ".concat(VideoJS_module_default().player," vjs-owncast")})})},imgStyle={position:"absolute",width:"100%",height:"100%"},CrossfadeImage=param=>{let{src="",width,height,objectFit="fill",duration="1s"}=param,spanStyle=(0,react.useMemo)(()=>({display:"inline-block",position:"relative",width,height}),[width,height]),imgStyles=(0,react.useMemo)(()=>[{...imgStyle,objectFit,opacity:0,transition:"opacity ".concat(duration)},{...imgStyle,objectFit,opacity:1,transition:"opacity ".concat(duration)},{...imgStyle,objectFit,opacity:0}],[objectFit,duration]),[key,setKey]=(0,react.useState)(0),[srcs,setSrcs]=(0,react.useState)(["",""]),nextSrc=src!==srcs[1]?src:"",onLoadImg=()=>{setKey((key+1)%3),setSrcs([srcs[1],nextSrc])};return(0,jsx_runtime.jsx)("span",{style:spanStyle,children:[...srcs,nextSrc].map((singleSrc,index)=>""!==singleSrc&&(0,jsx_runtime.jsx)("img",{src:singleSrc,alt:"",style:imgStyles[index],onLoad:2===index?onLoadImg:void 0},singleSrc))})};CrossfadeImage.defaultProps={objectFit:"fill",duration:"3s"};var VideoPoster_module=__webpack_require__(70034),VideoPoster_module_default=__webpack_require__.n(VideoPoster_module);let VideoPoster=param=>{let timer,{online,initialSrc,src:base}=param,[src,setSrc]=(0,react.useState)(initialSrc),[duration,setDuration]=(0,react.useState)("0s");return(0,react.useEffect)(()=>{clearInterval(timer),timer=setInterval(()=>{"0s"===duration&&setDuration("3s"),setSrc("".concat(base,"?").concat(Date.now()))},2e4)},[]),(0,jsx_runtime.jsxs)("div",{className:VideoPoster_module_default().poster,children:[!online&&(0,jsx_runtime.jsx)("img",{src:initialSrc,alt:"logo"}),online&&(0,jsx_runtime.jsx)(CrossfadeImage,{src:src,duration:duration,objectFit:"cover",width:"100%",height:"100%"})]})};var localStorage=__webpack_require__(72581),ClientConfigStore=__webpack_require__(77466),playback=class{stop(){clearInterval(this.sendMetricsTimer),this.player.off()}setClockSkew(skewMs){this.clockSkewMs=skewMs}videoJSReady(){let tech=this.player.tech({IWillNotUseThisInPlugins:!0});this.supportsDetailedMetrics=!!tech,tech.on("usage",e=>{"vhs-unknown-waiting"===e.name&&this.setIsBuffering(!0),"vhs-rendition-change-abr"===e.name&&this.incrementQualityVariantChanges()});let trackElements=this.player.textTracks();trackElements.addEventListener("cuechange",()=>{this.incrementQualityVariantChanges()})}handlePlaying(){clearInterval(this.collectPlaybackMetricsTimer),this.collectPlaybackMetricsTimer=setInterval(()=>{this.collectPlaybackMetrics()},5e3)}handleEnded(){clearInterval(this.collectPlaybackMetricsTimer)}handleBuffering(){this.incrementErrorCount(1),this.setIsBuffering(!0)}handleNoLongerBuffering(){this.setIsBuffering(!1)}handleError(){this.incrementErrorCount(1)}incrementErrorCount(count){this.errors+=count}incrementQualityVariantChanges(){if(!this.hasPerformedInitialVariantChange){this.hasPerformedInitialVariantChange=!0;return}this.qualityVariantChanges++}setIsBuffering(isBuffering){if(this.isBuffering=isBuffering,!isBuffering){clearTimeout(this.bufferingDurationTimer);return}this.bufferingDurationTimer=setTimeout(()=>{this.incrementErrorCount(1)},500)}trackSegmentDownloadTime(seconds){this.segmentDownloadTime.push(seconds)}trackBandwidth(bps){this.bandwidthTracking.push(bps)}trackLatency(latency){this.latencyTracking.push(latency)}collectPlaybackMetrics(){let tech=this.player.tech({IWillNotUseThisInPlugins:!0});if(!tech||!tech.vhs||this.player.paused())return;let networkState=this.player.networkState();if(2!==networkState)return;let bandwidth=tech.vhs.systemBandwidth;this.trackBandwidth(bandwidth);try{let segment=function(tech){let segment;let targetMedia=tech.vhs.playlists.media(),snapshotTime=tech.currentTime();for(let i=0,l=targetMedia.segments.length;i=40)return;this.trackLatency(latency)}catch(err){console.warn(err)}}async send(){let data;if(0===this.segmentDownloadTime.length||!this.player||this.player.paused())return;let errorCount=this.errors;if(this.supportsDetailedMetrics){let average=arr=>arr.reduce((p,c)=>p+c,0)/arr.length,averageDownloadDuration=average(this.segmentDownloadTime)/1e3,averageBandwidth=average(this.bandwidthTracking)/1e3,averageLatency=average(this.latencyTracking)/1e3;data={bandwidth:Math.round(1e3*averageBandwidth)/1e3,latency:Math.round(1e3*averageLatency)/1e3,downloadDuration:Math.round(1e3*averageDownloadDuration)/1e3,errors:errorCount+(this.isBuffering?1:0),qualityVariantChanges:this.qualityVariantChanges}}else data={errors:errorCount+(this.isBuffering?1:0)};this.errors=0,this.qualityVariantChanges=0,this.segmentDownloadTime=[],this.bandwidthTracking=[],this.latencyTracking=[];let options={method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(data)};try{await fetch("/api/metrics/playback",options)}catch(e){console.error(e)}}constructor(player,videojs){var _this=this;this.player=player,this.supportsDetailedMetrics=!1,this.hasPerformedInitialVariantChange=!1,this.clockSkewMs=0,this.segmentDownloadTime=[],this.bandwidthTracking=[],this.latencyTracking=[],this.errors=0,this.qualityVariantChanges=0,this.isBuffering=!1,this.bufferingDurationTimer=0,this.collectPlaybackMetricsTimer=0,this.videoJSReady=this.videoJSReady.bind(this),this.handlePlaying=this.handlePlaying.bind(this),this.handleBuffering=this.handleBuffering.bind(this),this.handleEnded=this.handleEnded.bind(this),this.handleError=this.handleError.bind(this),this.send=this.send.bind(this),this.collectPlaybackMetrics=this.collectPlaybackMetrics.bind(this),this.handleNoLongerBuffering=this.handleNoLongerBuffering.bind(this),this.sendMetricsTimer=0,this.player.on("canplaythrough",this.handleNoLongerBuffering),this.player.on("error",this.handleError),this.player.on("stalled",this.handleBuffering),this.player.on("waiting",this.handleBuffering),this.player.on("playing",this.handlePlaying),this.player.on("ended",this.handleEnded);let oldVjsXhrCallback=videojs.xhr;videojs.Vhs.xhr=function(){for(var _len=arguments.length,args=Array(_len),_key=0;_key<_len;_key++)args[_key]=arguments[_key];if(args[0].uri.match(".ts")){let start=new Date,cb=args[1];args[1]=(request,error,response)=>{let end=new Date,delta=end.getTime()-start.getTime();_this.trackSegmentDownloadTime(delta),cb(request,error,response)}}return oldVjsXhrCallback(...args)},this.videoJSReady(),this.sendMetricsTimer=setInterval(()=>{this.send()},1e4)}},settings_menu=function(player,videojs,qualities,latencyItemPressed){let VjsMenuItem=videojs.getComponent("MenuItem"),MenuItem=videojs.getComponent("MenuItem"),MenuButtonClass=videojs.getComponent("MenuButton"),lowLatencyItem=new MenuItem(player,{selectable:!0});lowLatencyItem.setAttribute("class","latency-toggle-item"),lowLatencyItem.on("click",()=>{latencyItemPressed()});let separator=new class extends VjsMenuItem{createEl(){let tag=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"button",props=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},attributes=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},el=super.createEl(tag,props,attributes);return el.innerHTML='
',el}constructor(p,options){super(p,options)}}(player,{selectable:!1});class MenuButton extends MenuButtonClass{createItems(){let tech=player.tech({IWillNotUseThisInPlugins:!0}),defaultAutoItem=new MenuItem(player,{selectable:!0,label:"Auto"}),items=qualities.map(item=>{let newMenuItem=new MenuItem(player,{selectable:!0,label:item.name});return newMenuItem.on("click",()=>{if(!tech){console.warn("Invalid attempt to access null player tech");return}tech.vhs.representations().forEach((rep,index)=>{rep.enabled(index===item.index)}),newMenuItem.selected(!1)}),newMenuItem});defaultAutoItem.on("click",()=>{tech.vhs.representations().forEach(rep=>{rep.enabled(!0)}),defaultAutoItem.selected(!1)});let supportsLatencyCompensator=!!tech&&!!tech.vhs;return qualities.length<2&&supportsLatencyCompensator?[lowLatencyItem]:qualities.length>1&&supportsLatencyCompensator?[defaultAutoItem,...items,separator,lowLatencyItem]:supportsLatencyCompensator||1!==qualities.length?[defaultAutoItem,...items]:[]}constructor(){super(player)}}let tech=player.tech({IWillNotUseThisInPlugins:!0});if(qualities.length<2&&(!tech||!tech.vhs))return;videojs.registerComponent("MenuButton",MenuButton);let menuButton=new MenuButton;return menuButton.addClass("vjs-quality-selector"),menuButton},latencyCompensator=class{setClockSkew(skewMs){this.clockSkewMs=skewMs}check(){if(new Date().getTime()-this.startupTime.getTime()<1e4||this.player.paused()||this.player.seeking()||this.inTimeout||!this.enabled)return;let tech=this.player.tech({IWillNotUseThisInPlugins:!0});if(!tech||!tech.vhs)return;let networkState=this.player.networkState();if(2!==networkState)return;let totalBuffered=0;try{if(0===tech.vhs.stats.buffered.length){this.timeout();return}tech.vhs.stats.buffered.forEach(buffer=>{totalBuffered+=buffer.end-buffer.start})}catch(e){console.error(e)}let currentPlaylist=tech.vhs.playlists.media(),currentPlaylistBandwidth=currentPlaylist.attributes.BANDWIDTH,playerBandwidth=tech.vhs.systemBandwidth,bandwidthRatio=playerBandwidth/currentPlaylistBandwidth;try{let segment=function(tech){let segment;let targetMedia=tech.vhs.playlists.media(),snapshotTime=tech.currentTime();for(let i=0,l=targetMedia.segments.length;isum+current,0)/targetLatencies.length,maxLatencyThreshold=Math.max(1.4*minLatencyThreshold,Math.min(1e3*segment.duration*2.6,15e3));minLatencyThreshold>=maxLatencyThreshold&&(maxLatencyThreshold=minLatencyThreshold+3e3);let segmentTime=segment.dateTimeObject.getTime(),now=new Date().getTime()+this.clockSkewMs,latency=now-segmentTime;if(this.currentLatency=latency,Math.abs(latency)>8e4){this.timeout();return}if(latency>maxLatencyThreshold){if(this.shouldJumpToLive()&&latency>maxLatencyThreshold+5e3){let jumpAmount=latency/1e3-3*segment.duration,seekPosition=this.player.currentTime()+jumpAmount;console.info("latency",latency/1e3,"jumping",jumpAmount,"to live from ",this.player.currentTime()," to ",seekPosition);let availableBufferedTimeEnd=tech.vhs.stats.buffered[0].end,availableBufferedTimeStart=tech.vhs.stats.buffered[0].start;if(seekPosition>availableBufferedTimeStartthis.playbackRate+.02&&(proposedPlaybackRate=this.playbackRate+.02),proposedPlaybackRate=Math.round(1e3*proposedPlaybackRate)/1e3,this.start(proposedPlaybackRate)}else latency<=minLatencyThreshold&&this.stop();console.info("latency",latency/1e3,"min",minLatencyThreshold/1e3,"max",maxLatencyThreshold/1e3,"playback rate",this.playbackRate,"enabled:",this.enabled,"running: ",this.running,"skew: ",this.clockSkewMs,"rebuffer events: ",this.bufferingCounter)}catch(err){}}shouldJumpToLive(){if(this.bufferingCounter>1)return!1;let now=new Date().getTime(),delta=now-this.lastJumpOccurred;return delta>2e4}jump(seekPosition){this.jumpingToLiveIgnoreBuffer=!0,this.performedInitialLiveJump=!0,this.lastJumpOccurred=new Date,console.info("current time",this.player.currentTime(),"seeking to",seekPosition),this.player.currentTime(seekPosition),setTimeout(()=>{this.jumpingToLiveIgnoreBuffer=!1},5e3)}setPlaybackRate(rate){this.playbackRate=rate,this.player.playbackRate(rate)}start(){let rate=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1;!this.inTimeout&&this.enabled&&rate!==this.playbackRate&&(this.running=!0,this.setPlaybackRate(rate))}stop(){this.running&&console.log("stopping latency compensator..."),this.running=!1,this.setPlaybackRate(1)}enable(){this.enabled=!0,clearInterval(this.checkTimer),clearTimeout(this.bufferingTimer),this.checkTimer=setInterval(()=>{this.check()},3e3)}disable(){clearInterval(this.checkTimer),clearTimeout(this.timeoutTimer),this.stop(),this.enabled=!1}timeout(){this.jumpingToLiveIgnoreBuffer||(this.inTimeout=!0,this.stop(),clearTimeout(this.timeoutTimer),this.timeoutTimer=setTimeout(()=>{this.endTimeout()},3e4))}endTimeout(){clearTimeout(this.timeoutTimer),this.inTimeout=!1}handlePlaying(){let wasPreviouslyPlaying=this.playing;this.playing=!0,clearTimeout(this.bufferingTimer),this.enabled&&this.shouldJumpToLive()&&(wasPreviouslyPlaying||(this.jumpingToLiveIgnoreBuffer=!0,this.player.liveTracker.seekToLiveEdge(),this.lastJumpOccurred=new Date))}handlePause(){this.playing=!1}handleEnded(){this.enabled&&this.disable()}handleError(){this.enabled&&this.timeout()}countBufferingEvent(){if(this.bufferingCounter+=1,this.bufferingCounter>4){this.disable();return}this.bufferedAtLatency.push(this.currentLatency),console.log("latency compensation timeout due to buffering:",this.bufferingCounter,"buffering events of",4),setTimeout(()=>{this.bufferingCounter>0&&(this.bufferingCounter-=1)},18e4)}handleBuffering(){if(this.enabled&&!this.inTimeout){if(this.jumpingToLiveIgnoreBuffer){this.jumpingToLiveIgnoreBuffer=!1;return}this.timeout(),clearTimeout(this.bufferingTimer),this.bufferingTimer=setTimeout(()=>{this.countBufferingEvent()},200)}}constructor(player){this.player=player,this.playing=!1,this.enabled=!1,this.running=!1,this.inTimeout=!1,this.jumpingToLiveIgnoreBuffer=!1,this.timeoutTimer=0,this.checkTimer=0,this.bufferingCounter=0,this.bufferingTimer=0,this.playbackRate=1,this.lastJumpOccurred=null,this.startupTime=new Date,this.clockSkewMs=0,this.currentLatency=null,this.bufferedAtLatency=[],this.player.on("playing",this.handlePlaying.bind(this)),this.player.on("pause",this.handlePause.bind(this)),this.player.on("error",this.handleError.bind(this)),this.player.on("waiting",this.handleBuffering.bind(this)),this.player.on("stalled",this.handleBuffering.bind(this)),this.player.on("ended",this.handleEnded.bind(this)),this.player.on("canplaythrough",this.handlePlaying.bind(this)),this.player.on("canplay",this.handlePlaying.bind(this)),this.check=this.check.bind(this),this.start=this.start.bind(this),this.enable=this.enable.bind(this),this.countBufferingEvent=this.countBufferingEvent.bind(this)}};let PLAYER_VOLUME="owncast_volume",LATENCY_COMPENSATION_ENABLED="latencyCompensatorEnabled",OwncastPlayer_ping=new class{start(){this.stop(),this.timer=setInterval(()=>{!function(){try{fetch("/api/ping")}catch(e){console.error(e)}}()},4e3)}stop(){clearInterval(this.timer)}},playbackMetrics=null,OwncastPlayer_latencyCompensator=null,latencyCompensatorEnabled=!1;async function getVideoSettings(){let qualities=[];try{let response=await fetch("/api/video/variants");qualities=await response.json()}catch(e){console.error(e)}return qualities}let OwncastPlayer=param=>{let{source,online}=param,playerRef=react.useRef(null),[videoPlaying,setVideoPlaying]=(0,es.FV)(ClientConfigStore.We),clockSkew=(0,es.sJ)(ClientConfigStore.g8),setSavedVolume=()=>{try{playerRef.current.volume((0,localStorage.$o)(PLAYER_VOLUME)||1)}catch(err){console.warn(err)}},handleVolume=()=>{(0,localStorage.qQ)(PLAYER_VOLUME,playerRef.current.muted()?0:playerRef.current.volume())},togglePlayback=()=>{playerRef.current.paused()?playerRef.current.play():playerRef.current.pause()},toggleMute=()=>{playerRef.current.muted()||0===playerRef.current.volume()?playerRef.current.volume(.7):playerRef.current.volume(0)},toggleFullScreen=()=>{playerRef.current.isFullscreen()?playerRef.current.exitFullscreen():playerRef.current.requestFullscreen()},setLatencyCompensatorItemTitle=title=>{let item=document.querySelector(".latency-toggle-item > .vjs-menu-item-text");item&&(item.innerHTML=title)},startLatencyCompensator=()=>{OwncastPlayer_latencyCompensator&&OwncastPlayer_latencyCompensator.stop(),latencyCompensatorEnabled=!0,(OwncastPlayer_latencyCompensator=new latencyCompensator(playerRef.current)).setClockSkew(clockSkew),OwncastPlayer_latencyCompensator.enable(),(0,localStorage.qQ)(LATENCY_COMPENSATION_ENABLED,!0),setLatencyCompensatorItemTitle("disable minimized latency")},stopLatencyCompensator=()=>{OwncastPlayer_latencyCompensator&&OwncastPlayer_latencyCompensator.disable(),OwncastPlayer_latencyCompensator=null,latencyCompensatorEnabled=!1,(0,localStorage.qQ)(LATENCY_COMPENSATION_ENABLED,!1),setLatencyCompensatorItemTitle('enable minimized latency (experimental)')},toggleLatencyCompensator=()=>{latencyCompensatorEnabled?stopLatencyCompensator():startLatencyCompensator()},setupLatencyCompensator=player=>{let tech=player.tech({IWillNotUseThisInPlugins:!0});if(!tech||!tech.vhs)return;let latencyCompensatorEnabledSaved=(0,localStorage.$o)(LATENCY_COMPENSATION_ENABLED);"true"===latencyCompensatorEnabledSaved&&tech&&tech.vhs?startLatencyCompensator():stopLatencyCompensator()},createSettings=async(player,videojs)=>{let videoQualities=await getVideoSettings(),menuButton=settings_menu(player,videojs,videoQualities,toggleLatencyCompensator);player.controlBar.addChild(menuButton,{},player.controlBar.children_.length-2),setupLatencyCompensator(player)},setupAirplay=(player,videojs)=>{if(window.hasOwnProperty("WebKitPlaybackTargetAvailabilityEvent")){let videoJsButtonClass=videojs.getComponent("Button"),ConcreteButtonClass=videojs.extend(videoJsButtonClass,{constructor(){videoJsButtonClass.call(this,player)},handleClick(){try{let videoElement=document.getElementsByTagName("video")[0];videoElement.webkitShowPlaybackTargetPicker()}catch(e){console.error(e)}}}),concreteButtonInstance=player.controlBar.addChild(new ConcreteButtonClass);concreteButtonInstance.addClass("vjs-airplay")}};(0,react_hotkeys_hook_esm.y1)("space",e=>{e.preventDefault(),togglePlayback()}),(0,react_hotkeys_hook_esm.y1)("f",toggleFullScreen,{enableOnContentEditable:!1}),(0,react_hotkeys_hook_esm.y1)("m",toggleMute,{enableOnContentEditable:!1}),(0,react_hotkeys_hook_esm.y1)("0",()=>playerRef.current.volume(playerRef.current.volume()+.1),{enableOnContentEditable:!1}),(0,react_hotkeys_hook_esm.y1)("9",()=>playerRef.current.volume(playerRef.current.volume()-.1),{enableOnContentEditable:!1});let handlePlayerReady=(player,videojs)=>{playerRef.current=player,setSavedVolume(),setupAirplay(player,videojs),player.on("waiting",()=>{console.debug("player is waiting")}),player.on("dispose",()=>{console.debug("player will dispose"),OwncastPlayer_ping.stop()}),player.on("playing",()=>{console.debug("player is playing"),OwncastPlayer_ping.start(),setVideoPlaying(!0)}),player.on("pause",()=>{console.debug("player is paused"),OwncastPlayer_ping.stop(),setVideoPlaying(!1)}),player.on("ended",()=>{console.debug("player is ended"),OwncastPlayer_ping.stop(),setVideoPlaying(!1)}),videojs.hookOnce(),player.on("volumechange",handleVolume),(playbackMetrics=new playback(player,videojs)).setClockSkew(clockSkew),createSettings(player,videojs)};return(0,react.useEffect)(()=>{playbackMetrics&&playbackMetrics.setClockSkew(clockSkew)},[clockSkew]),(0,react.useEffect)(()=>()=>{stopLatencyCompensator(),null==playbackMetrics||playbackMetrics.stop()},[]),(0,jsx_runtime.jsxs)("div",{style:{display:"grid",width:"100% !important",aspectRatio:"16/9"},children:[online&&(0,jsx_runtime.jsx)("div",{style:{gridColumn:1,gridRow:1},children:(0,jsx_runtime.jsx)(VideoJS,{options:{autoplay:!1,controls:!0,responsive:!0,fluid:!1,playsinline:!0,liveui:!0,preload:"auto",controlBar:{progressControl:{seekBar:!1}},html5:{vhs:{enableLowInitialPlaylist:!0,experimentalBufferBasedABR:!0,useNetworkInformationApi:!0,maxPlaylistRetries:30}},liveTracker:{trackingThreshold:0,liveTolerance:15},sources:[{src:source,type:"application/x-mpegURL"}]},onReady:handlePlayerReady})}),(0,jsx_runtime.jsx)("div",{style:{gridColumn:1,gridRow:1},children:!videoPlaying&&(0,jsx_runtime.jsx)(VideoPoster,{online:online,initialSrc:"/thumbnail.jpg",src:"/thumbnail.jpg"})})]})};var OwncastPlayer_OwncastPlayer=OwncastPlayer},76161:function(module){module.exports={player:"VideoJS_player__GT8FN",poster:"VideoJS_poster__nlmqm"}},70034:function(module){module.exports={poster:"VideoPoster_poster__RDkSk"}},25893:function(){}}]); \ No newline at end of file diff --git a/static/web/_next/static/chunks/webpack-9dc50f38fd018b1f.js b/static/web/_next/static/chunks/webpack-18044398ddbee78f.js similarity index 99% rename from static/web/_next/static/chunks/webpack-9dc50f38fd018b1f.js rename to static/web/_next/static/chunks/webpack-18044398ddbee78f.js index cfa324dbb..3ea51716a 100644 --- a/static/web/_next/static/chunks/webpack-9dc50f38fd018b1f.js +++ b/static/web/_next/static/chunks/webpack-18044398ddbee78f.js @@ -1 +1 @@ -!function(){"use strict";var deferred,leafPrototypes,getProto,inProgress,dataWebpackPrefix,policy,createStylesheet,findStylesheet,installedCssChunks,installedChunks,webpackJsonpCallback,chunkLoadingGlobal,__webpack_modules__={},__webpack_module_cache__={};function __webpack_require__(moduleId){var cachedModule=__webpack_module_cache__[moduleId];if(void 0!==cachedModule)return cachedModule.exports;var module=__webpack_module_cache__[moduleId]={id:moduleId,loaded:!1,exports:{}},threw=!0;try{__webpack_modules__[moduleId].call(module.exports,module,module.exports,__webpack_require__),threw=!1}finally{threw&&delete __webpack_module_cache__[moduleId]}return module.loaded=!0,module.exports}__webpack_require__.m=__webpack_modules__,__webpack_require__.amdO={},deferred=[],__webpack_require__.O=function(result,chunkIds,fn,priority){if(chunkIds){priority=priority||0;for(var i=deferred.length;i>0&&deferred[i-1][2]>priority;i--)deferred[i]=deferred[i-1];deferred[i]=[chunkIds,fn,priority];return}for(var notFulfilled=1/0,i=0;i=priority&&Object.keys(__webpack_require__.O).every(function(key){return __webpack_require__.O[key](chunkIds[j])})?chunkIds.splice(j--,1):(fulfilled=!1,priority0&&deferred[i-1][2]>priority;i--)deferred[i]=deferred[i-1];deferred[i]=[chunkIds,fn,priority];return}for(var notFulfilled=1/0,i=0;i=priority&&Object.keys(__webpack_require__.O).every(function(key){return __webpack_require__.O[key](chunkIds[j])})?chunkIds.splice(j--,1):(fulfilled=!1,priorityOwncast Admin

What is your stream about today?

What is your stream about today?
Offline

Access Tokens

Access tokens are used to allow external, 3rd party tools to perform specific actions on your Owncast server. They should be kept secure and never included in client code, instead they should be kept on a server that you control.
Read more about how to use these tokens, with examples, at our documentation.
NameTokenScopesLast Used
No data

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Access Tokens

Access tokens are used to allow external, 3rd party tools to perform specific actions on your Owncast server. They should be kept secure and never included in client code, instead they should be kept on a server that you control.
Read more about how to use these tokens, with examples, at our documentation.
NameTokenScopesLast Used
No data

\ No newline at end of file diff --git a/static/web/admin/actions/index.html b/static/web/admin/actions/index.html index d78ce8ed1..d8b5573d7 100644 --- a/static/web/admin/actions/index.html +++ b/static/web/admin/actions/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

External Actions

External action URLs are 3rd party UI you can display, embedded, into your Owncast page when a user clicks on a button to launch your action.
Read more about how to use actions, with examples, at our documentation.
NameDescriptionURLIconColorOpens
No data

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

External Actions

External action URLs are 3rd party UI you can display, embedded, into your Owncast page when a user clicks on a button to launch your action.
Read more about how to use actions, with examples, at our documentation.
NameDescriptionURLIconColorOpens
No data

\ No newline at end of file diff --git a/static/web/admin/chat/messages/index.html b/static/web/admin/chat/messages/index.html index 3d1e33520..557d6f08d 100644 --- a/static/web/admin/chat/messages/index.html +++ b/static/web/admin/chat/messages/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Chat Messages

Manage the messages from viewers that show up on your stream.

Check multiple messages to change their visibility to:
Time
User
Message
No data
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Chat Messages

Manage the messages from viewers that show up on your stream.

Check multiple messages to change their visibility to:
Time
User
Message
No data
\ No newline at end of file diff --git a/static/web/admin/chat/users/index.html b/static/web/admin/chat/users/index.html index f417720ef..ccbfe71f4 100644 --- a/static/web/admin/chat/users/index.html +++ b/static/web/admin/chat/users/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

When a stream is active and chat is enabled, connected chat clients will be displayed here.

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

When a stream is active and chat is enabled, connected chat clients will be displayed here.

\ No newline at end of file diff --git a/static/web/admin/config-chat/index.html b/static/web/admin/config-chat/index.html index be8fe7231..6784a114b 100644 --- a/static/web/admin/config-chat/index.html +++ b/static/web/admin/config-chat/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline
\ No newline at end of file diff --git a/static/web/admin/config-federation/index.html b/static/web/admin/config-federation/index.html index 6dc1b3173..0644f9b2c 100644 --- a/static/web/admin/config-federation/index.html +++ b/static/web/admin/config-federation/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline
\ No newline at end of file diff --git a/static/web/admin/config-notify/index.html b/static/web/admin/config-notify/index.html index 5dc437fed..538a63fde 100644 --- a/static/web/admin/config-notify/index.html +++ b/static/web/admin/config-notify/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Notifications

Let your viewers know when you go live by supporting any of the below notification channels. Learn more about live notifications.


The full url to your Owncast server is required to enable social features. Must use SSL (https). Once people start following your instance you should not change this.

The full url to your Owncast server is required to enable social features. Must use SSL (https). Once people start following your instance you should not change this.

Browser Alerts

Viewers can opt into being notified when you go live with their browser.

Not all browsers support this.

Enable browser notifications

The text to send when you go live.

Twitter

Let your Twitter followers know each time you go live.

Enable Twitter

The text to send when you go live.

Discord

Let your Discord channel know each time you go live.

Create a webhook under Edit Channel / Integrations on your Discord channel and provide it below.

Enable Discord

The webhook assigned to your channel.

The text to send when you go live.

Fediverse Social

Enabling the Fediverse social features will not just alert people to when you go live, but also enable other functionality.

Fediverse social features: Disabled

Custom

Build your own notifications by using custom webhooks.

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Notifications

Let your viewers know when you go live by supporting any of the below notification channels. Learn more about live notifications.


The full url to your Owncast server is required to enable social features. Must use SSL (https). Once people start following your instance you should not change this.

The full url to your Owncast server is required to enable social features. Must use SSL (https). Once people start following your instance you should not change this.

Browser Alerts

Viewers can opt into being notified when you go live with their browser.

Not all browsers support this.

Enable browser notifications

The text to send when you go live.

Twitter

Let your Twitter followers know each time you go live.

Enable Twitter

The text to send when you go live.

Discord

Let your Discord channel know each time you go live.

Create a webhook under Edit Channel / Integrations on your Discord channel and provide it below.

Enable Discord

The webhook assigned to your channel.

The text to send when you go live.

Fediverse Social

Enabling the Fediverse social features will not just alert people to when you go live, but also enable other functionality.

Fediverse social features: Disabled

Custom

Build your own notifications by using custom webhooks.

\ No newline at end of file diff --git a/static/web/admin/config-public-details/index.html b/static/web/admin/config-public-details/index.html index 1f3e75f37..a72540461 100644 --- a/static/web/admin/config-public-details/index.html +++ b/static/web/admin/config-public-details/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

General Settings

The following are displayed on your site to describe your stream and its content. Learn more.

Custom Page Content

Edit the content of your page by using simple Markdown syntax.


\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

General Settings

The following are displayed on your site to describe your stream and its content. Learn more.

Custom Page Content

Edit the content of your page by using simple Markdown syntax.


\ No newline at end of file diff --git a/static/web/admin/config-server-details/index.html b/static/web/admin/config-server-details/index.html index 395bbeb37..021ccebfb 100644 --- a/static/web/admin/config-server-details/index.html +++ b/static/web/admin/config-server-details/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Server Settings

You should change your stream key from the default and keep it safe. For most people it's likely the other settings will not need to be changed.

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Server Settings

You should change your stream key from the default and keep it safe. For most people it's likely the other settings will not need to be changed.

\ No newline at end of file diff --git a/static/web/admin/config-social-items/index.html b/static/web/admin/config-social-items/index.html index cbdc6fa75..a22ff6888 100644 --- a/static/web/admin/config-social-items/index.html +++ b/static/web/admin/config-social-items/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Social Items

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Social Items

\ No newline at end of file diff --git a/static/web/admin/config-storage/index.html b/static/web/admin/config-storage/index.html index 94d489740..48fc6e347 100644 --- a/static/web/admin/config-storage/index.html +++ b/static/web/admin/config-storage/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Storage

Owncast supports optionally using external storage providers to stream your video. Learn more about this by visiting our Storage Documentation.

Configuring this incorrectly will likely cause your video to be unplayable. Double check the documentation for your storage provider on how to configure the bucket you created for Owncast.

Keep in mind this is for live streaming, not for archival, recording or VOD purposes.

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Storage

Owncast supports optionally using external storage providers to stream your video. Learn more about this by visiting our Storage Documentation.

Configuring this incorrectly will likely cause your video to be unplayable. Double check the documentation for your storage provider on how to configure the bucket you created for Owncast.

Keep in mind this is for live streaming, not for archival, recording or VOD purposes.

\ No newline at end of file diff --git a/static/web/admin/config-video/index.html b/static/web/admin/config-video/index.html index adac0c746..d23afa67d 100644 --- a/static/web/admin/config-video/index.html +++ b/static/web/admin/config-video/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Video configuration

Before changing your video configuration visit the video documentation to learn how it impacts your stream performance. The general rule is to start conservatively by having one middle quality stream output variant and experiment with adding more of varied qualities.

Stream output

NameVideo bitrateCPU Usage
No name800 kbpsMedium

Latency Buffer

While it's natural to want to keep your latency as low as possible, you may experience reduced error tolerance and stability the lower you go. The lowest setting is not recommended.

For interactive live streams you may want to experiment with a lower latency, for non-interactive broadcasts you may want to increase it. Read to learn more.

LowestHighest

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Video configuration

Before changing your video configuration visit the video documentation to learn how it impacts your stream performance. The general rule is to start conservatively by having one middle quality stream output variant and experiment with adding more of varied qualities.

Stream output

NameVideo bitrateCPU Usage
No name800 kbpsMedium

Latency Buffer

While it's natural to want to keep your latency as low as possible, you may experience reduced error tolerance and stability the lower you go. The lowest setting is not recommended.

For interactive live streams you may want to experiment with a lower latency, for non-interactive broadcasts you may want to increase it. Read to learn more.

LowestHighest

\ No newline at end of file diff --git a/static/web/admin/config/appearance/index.html b/static/web/admin/config/appearance/index.html index aed7b3d81..6fdb76dc9 100644 --- a/static/web/admin/config/appearance/index.html +++ b/static/web/admin/config/appearance/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline
Loading...
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline
Loading...
\ No newline at end of file diff --git a/static/web/admin/federation/actions/index.html b/static/web/admin/federation/actions/index.html index 876bffbad..033cd420c 100644 --- a/static/web/admin/federation/actions/index.html +++ b/static/web/admin/federation/actions/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Fediverse Actions

Below is a list of actions that were taken by others in response to your posts as well as people who requested to follow you.
ActionFromWhen
No data
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Fediverse Actions

Below is a list of actions that were taken by others in response to your posts as well as people who requested to follow you.
ActionFromWhen
No data
\ No newline at end of file diff --git a/static/web/admin/federation/followers/index.html b/static/web/admin/federation/followers/index.html index 897e3fdca..51988de94 100644 --- a/static/web/admin/federation/followers/index.html +++ b/static/web/admin/federation/followers/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

The following accounts get notified when you go live or send a post.

NameURL
Added
Remove
No data
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

The following accounts get notified when you go live or send a post.

NameURL
Added
Remove
No data
\ No newline at end of file diff --git a/static/web/admin/hardware-info/index.html b/static/web/admin/hardware-info/index.html index 39c7681d5..ec1d8821f 100644 --- a/static/web/admin/hardware-info/index.html +++ b/static/web/admin/hardware-info/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Hardware Info


CPU
0%
Memory
0%
Disk
0%
Loading...
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Hardware Info


CPU
0%
Memory
0%
Disk
0%
Loading...
\ No newline at end of file diff --git a/static/web/admin/help/index.html b/static/web/admin/help/index.html index df011d8a2..5e19b15e7 100644 --- a/static/web/admin/help/index.html +++ b/static/web/admin/help/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

How can we help you?

Troubleshooting

Fix your problems

Documentation

Read the Docs

Common tasks

I want to configure my owncast instance
Help configuring my broadcasting software
I want to embed my stream into another site
I want to customize my website
I want to tweak my video output
I want to use an external storage provider

Other

I found a bug
If you found a bug, then please let us know
I have a general question
Most general questions are answered in our FAQ or exist in our discussions
I want to build add-ons for Owncast
You can build your own bots, overlays, tools and add-ons with our developer APIs. 
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

How can we help you?

Troubleshooting

Fix your problems

Documentation

Read the Docs

Common tasks

I want to configure my owncast instance
Help configuring my broadcasting software
I want to embed my stream into another site
I want to customize my website
I want to tweak my video output
I want to use an external storage provider

Other

I found a bug
If you found a bug, then please let us know
I have a general question
Most general questions are answered in our FAQ or exist in our discussions
I want to build add-ons for Owncast
You can build your own bots, overlays, tools and add-ons with our developer APIs. 
\ No newline at end of file diff --git a/static/web/admin/index.html b/static/web/admin/index.html index 1e41b14fc..677582d77 100644 --- a/static/web/admin/index.html +++ b/static/web/admin/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

No stream is active

You should start one.

Use your broadcasting software
Chat is disabled
Chat will continue to be disabled until you begin a live stream.
Find an audience on the Owncast Directory
List yourself in the Owncast Directory and show off your stream. Enable it in settings.
fediverse
Add your Owncast instance to the Fediverse
Enable Owncast social features to have your instance join the Fediverse, allowing people to follow, share and engage with your live stream.

News & Updates from Owncast

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

No stream is active

You should start one.

Use your broadcasting software
Chat is disabled
Chat will continue to be disabled until you begin a live stream.
Find an audience on the Owncast Directory
List yourself in the Owncast Directory and show off your stream. Enable it in settings.
fediverse
Add your Owncast instance to the Fediverse
Enable Owncast social features to have your instance join the Fediverse, allowing people to follow, share and engage with your live stream.

News & Updates from Owncast

\ No newline at end of file diff --git a/static/web/admin/logs/index.html b/static/web/admin/logs/index.html index 14f0389d5..ef60cc27b 100644 --- a/static/web/admin/logs/index.html +++ b/static/web/admin/logs/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline
\ No newline at end of file diff --git a/static/web/admin/stream-health/index.html b/static/web/admin/stream-health/index.html index cd4717fbf..bef65f895 100644 --- a/static/web/admin/stream-health/index.html +++ b/static/web/admin/stream-health/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Stream Performance

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Stream Performance

\ No newline at end of file diff --git a/static/web/admin/upgrade/index.html b/static/web/admin/upgrade/index.html index 45bf6c3b3..73ad38eac 100644 --- a/static/web/admin/upgrade/index.html +++ b/static/web/admin/upgrade/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Thu Jan 01 1970

Downloads

NameSize
No data
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Thu Jan 01 1970

Downloads

NameSize
No data
\ No newline at end of file diff --git a/static/web/admin/viewer-info/index.html b/static/web/admin/viewer-info/index.html index 9d38e608d..c12b11b32 100644 --- a/static/web/admin/viewer-info/index.html +++ b/static/web/admin/viewer-info/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Viewer Info


Max viewers last stream
0
All-time max viewers
0
User AgentLocation
Watch Time
No data
\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Viewer Info


Max viewers last stream
0
All-time max viewers
0
User AgentLocation
Watch Time
No data
\ No newline at end of file diff --git a/static/web/admin/webhooks/index.html b/static/web/admin/webhooks/index.html index e114d78cc..763888624 100644 --- a/static/web/admin/webhooks/index.html +++ b/static/web/admin/webhooks/index.html @@ -1 +1 @@ -Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Webhooks

A webhook is a callback made to an external API in response to an event that takes place within Owncast. This can be used to build chat bots or sending automatic notifications that you've started streaming.
Read more about how to use webhooks, with examples, at our documentation.
URLEvents
No data

\ No newline at end of file +Owncast Admin

What is your stream about today?

What is your stream about today?
Offline

Webhooks

A webhook is a callback made to an external API in response to an event that takes place within Owncast. This can be used to build chat bots or sending automatic notifications that you've started streaming.
Read more about how to use webhooks, with examples, at our documentation.
URLEvents
No data

\ No newline at end of file diff --git a/static/web/embed/chat/readonly/index.html b/static/web/embed/chat/readonly/index.html index fa66e4a7b..ed33d887b 100644 --- a/static/web/embed/chat/readonly/index.html +++ b/static/web/embed/chat/readonly/index.html @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file diff --git a/static/web/embed/chat/readwrite/index.html b/static/web/embed/chat/readwrite/index.html index 9b73fb465..44480f7a4 100644 --- a/static/web/embed/chat/readwrite/index.html +++ b/static/web/embed/chat/readwrite/index.html @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file diff --git a/static/web/embed/video/index.html b/static/web/embed/video/index.html index 41ef80752..775101d52 100644 --- a/static/web/embed/video/index.html +++ b/static/web/embed/video/index.html @@ -1 +1 @@ -
This stream is offline. Check back soon!
\ No newline at end of file +
This stream is offline. Check back soon!
\ No newline at end of file diff --git a/static/web/index.html b/static/web/index.html index 9e8dba34d..e8ff5cb8f 100644 --- a/static/web/index.html +++ b/static/web/index.html @@ -1,9 +1,9 @@ {{.Name}}
{{.Name}}
Logo
Preview
\ No newline at end of file +
Logo
Preview
\ No newline at end of file