UNPKG

@nent/core

Version:

Functional elements to add routing, data-binding, dynamic HTML, declarative actions, audio, video, and so much more. Supercharge static HTML files into web apps without script or builds.

4 lines 12.9 kB
/*! * NENT 2022 */ import{r as s,h as i,H as t,a as h}from"./index-916ca544.js";import{E as e,e as a,a as r}from"./index-f7016b94.js";import{w as n,f as o}from"./logging-5a93c8af.js";import{o as l,a as d}from"./state-27a8a5bc.js";import{r as u,a as c,g as v}from"./factory-acbf0d3d.js";import{R as p}from"./interfaces-3b78db83.js";import{D as m,A as b,a as f,b as y,c as w}from"./interfaces-13ff7aec.js";import{r as g}from"./values-ddfac998.js";import{m as k}from"./tracks-667892d6.js";import{D as j}from"./interfaces-8c5cd1b8.js";import{d as A}from"./promises-584c4ece.js";import{s as x,o as S}from"./state-627a24e0.js";import"./index-4bfabbbd.js";import"./mutex-e5645c85.js";import"./memory-0d63dacd.js";class E{constructor(){this.items=[]}isEmpty(){return 0==this.items.length}hasItems(){return this.items.length>0}findTrack(s){return this.items.find((i=>i.trackId==s))||null}stop(){this.items.forEach((s=>{s.playing()&&s.stop()}))}destroy(){this.items.forEach((s=>s.destroy()))}discard(...s){this.items=this.items.filter((i=>!s.includes(i.discard)))||null}}class N{constructor(s,i){this.discard=m.route,this.loop=!1;const{trackId:t,src:h,type:e,loop:a}=s;g(t,"trackId","n-audio: track"),g(h,"src","n-audio: track"),g(e,"type","n-audio: track"),Object.assign(this,s,{onEnd:i});const r=new Howl({src:h,loop:"music"===e&&a,onload:()=>{var s;null===(s=this.onLoad)||void 0===s||s.call(this,this)},onend:()=>{null==i||i.call(this,this)},onloaderror:(s,h)=>{n(`n-audio: An error occurred for audio track ${t}: ${h}`),null==i||i.call(this)},onplayerror:()=>{r.once("unlock",(()=>{r.play()}))},preload:!0,autoplay:!1,html5:!1});this.sound=r}playing(){return this.sound.playing()}muted(){return 0==this.sound.volume()}state(){return this.sound.state()}start(){"loaded"===this.sound.state()?this.play():"loading"===this.sound.state()&&this.sound.once(b.Loaded,(()=>{this.play()}))}play(){var s;this.sound.volume(0),this.sound.play(),this.sound.fade(0,(null===(s=window.Howler)||void 0===s?void 0:s.volume())||.5,500)}pause(){this.sound.pause()}stop(){var s;this.sound.fade((null===(s=window.Howler)||void 0===s?void 0:s.volume())||.5,0,500),this.sound.stop()}mute(s){this.sound.mute(s)}resume(){this.sound.play()}setVolume(s){this.sound.volume(s)}seek(s){this.sound.seek(s)}destroy(){this.sound.unload()}}class q extends E{load(s,i){if(this.findTrack(s.trackId))return;const t=new N(s,(()=>{t.discard!=m.none&&(null==t||t.destroy()),i()}));this.items.push(t)}}class I extends E{queueAudio(s,i){if(this.findTrack(s.trackId))return;const t=new N(s,(()=>{t.discard!=m.none&&(null==t||t.destroy()),i()}));return this.items.push(t)}insertTrack(s,i){const t=s.onEnd;return s.onEnd=()=>{null==t||t.call(s,s),i()},this.items.unshift(s)}getNext(){return this.items.shift()||null}}class M{constructor(){this.active=null}pause(){var s;null===(s=this.active)||void 0===s||s.pause()}play(){var s;null===(s=this.active)||void 0===s||s.play()}stop(){var s;null===(s=this.active)||void 0===s||s.stop()}resume(){var s;null===(s=this.active)||void 0===s||s.resume()}mute(s){var i;null===(i=this.active)||void 0===i||i.mute(s)}discard(...s){var i;this.active&&s.includes(this.active.discard)&&(null===(i=this.active)||void 0===i||i.destroy(),this.active=null)}}class O extends M{constructor(s){super(),this.changed=s,this.loader=new q,this.queue=new I}queueAudio(s){var i;this.queue.queueAudio(s,(()=>{var s;this.active=this.queue.getNext(),null===(s=this.active)||void 0===s||s.play(),this.changed()})),null==this.active&&(this.active=this.queue.getNext(),null===(i=this.active)||void 0===i||i.play()),this.changed()}load(s){this.loader.load(s,this.changed),this.changed()}async playTrack(s){var i;const t=this.loader.findTrack(s);t&&(this.loader.stop(),this.queue.insertTrack(t,(()=>{var s;this.active=this.queue.getNext(),null===(s=this.active)||void 0===s||s.play(),this.changed()})),this.discard(m.next),this.active=this.queue.getNext(),null===(i=this.active)||void 0===i||i.play(),await k(s),this.changed())}discard(...s){super.discard(...s),this.loader.discard(...s),this.queue.discard(...s),this.changed()}hasAudio(){return null!=this.active||this.loader.hasItems()||this.queue.hasItems()}destroy(){var s;null===(s=this.active)||void 0===s||s.destroy(),this.loader.destroy(),this.queue.destroy()}}class $ extends M{constructor(s){super(),this.changed=s,this.loader=new q}load(s){this.loader.load(s,(()=>{this.active=null,this.changed()})),this.changed()}async playTrack(s){const i=this.loader.findTrack(s);i&&(this.loader.stop(),this.active=null,this.discard(m.next),this.active=i,i.play(),await k(s),this.changed())}discard(...s){var i;this.active&&s.includes(this.active.discard)&&(null===(i=this.active)||void 0===i||i.destroy(),this.active=null),this.loader.discard(...s),this.changed()}hasAudio(){return null!=this.active||this.loader.hasItems()}destroy(){var s;null===(s=this.active)||void 0===s||s.destroy(),this.loader.destroy()}}class D{constructor(s){this.audioListener=s,this.changed=new e;const i=A(1e3,(()=>{this.changed.emit(j.DataChanged,{provider:"audio"})}),!0);this.listenerSubscription=this.audioListener.changed.on("changed",(()=>{i()}))}async get(s){switch(s){case"hasAudio":return this.audioListener.hasAudio().toString();case"isPlaying":return this.audioListener.isPlaying().toString();case"loadedMusic":return this.audioListener.music?JSON.stringify(this.audioListener.music.loader.items):null;case"queuedMusic":return this.audioListener.music?JSON.stringify(this.audioListener.music.queue.items):null;case"currentMusic":return this.audioListener.music.active?JSON.stringify(this.audioListener.music.active):null;case"loadedSounds":return this.audioListener.sound.loader.items?JSON.stringify(this.audioListener.sound.loader.items):null;case"currentSound":return this.audioListener.sound.active?JSON.stringify(this.audioListener.sound.active):null;default:return null}}async set(s,i){}destroy(){this.listenerSubscription()}}class J{constructor(s,i,t,h,a=!1){this.window=s,this.eventBus=i,this.actionBus=t,this.enableDataProvider=h,this.debug=a,this.muted=!1,this.volume=0,this.changed=new e,this.music=new O((()=>{this.changed.emit("changed")})),this.sound=new $((()=>{this.changed.emit("changed")})),this.volume=1,this.stateEnabledSubscription=l("audioEnabled",(s=>{s?this.subscribe():this.unsubscribe()})),d.audioEnabled&&this.subscribe()}subscribe(){const s=()=>{this.enableDataProvider&&null==this.provider&&(this.provider=new D(this),c("audio",this.provider))};d.audioEnabled&&s(),this.stateDataSubscription=l("dataEnabled",(i=>{var t;i?s():(u("audio"),null===(t=this.provider)||void 0===t||t.destroy(),this.provider=void 0)})),x.muted&&this.mute(),this.stateMutedSubscription=S("muted",(s=>{s?this.mute():this.play()})),this.actionSubscription=this.actionBus.on(f,(async s=>{var i,t;o(this.debug,`audio-listener: action received ${s.command}${(null===(i=s.data)||void 0===i?void 0:i.type)||""}:${(null===(t=s.data)||void 0===t?void 0:t.trackId)||""}`),await this.commandReceived(s.command,s.data)})),this.eventSubscription=this.eventBus.on(p.RouteChanged,(()=>{o(this.debug,"audio-listener: route changed received"),this.music.discard(m.route,m.next),this.sound.discard(m.route,m.next)})),this.changed.emit("changed")}unsubscribe(){var s,i,t,h;null===(s=this.eventSubscription)||void 0===s||s.call(this),null===(i=this.actionSubscription)||void 0===i||i.call(this),null===(t=this.stateDataSubscription)||void 0===t||t.call(this),null===(h=this.stateMutedSubscription)||void 0===h||h.call(this),this.music.destroy(),this.sound.destroy(),this.provider&&(u("audio"),this.provider.destroy()),this.changed.emit("changed")}isPlaying(){var s,i;return Boolean((null===(s=this.music.active)||void 0===s?void 0:s.playing())||(null===(i=this.sound.active)||void 0===i?void 0:i.playing())||!1)}hasAudio(){return this.music.hasAudio()||this.sound.hasAudio()}pause(){this.music.pause(),this.sound.pause(),this.changed.emit("changed")}play(){d.audioEnabled&&(this.music.play(),this.sound.play(),this.changed.emit("changed"))}stop(){this.music.stop(),this.sound.stop(),this.changed.emit("changed")}resume(){d.audioEnabled&&(this.music.resume(),this.sound.resume(),this.changed.emit("changed"))}mute(s=!this.muted){x.muted=s,this.music.mute(s),this.sound.mute(s),this.muted=s,this.changed.emit("changed")}seek(s,i,t){const h=s==w.music?this.music.active:this.sound.active;h&&h.trackId===i&&(h.seek(t),this.changed.emit("changed"))}setVolume(s){var i;null===(i=this.window.Howler)||void 0===i||i.volume(s),this.muted=0==s,this.volume=s,this.changed.emit("changed")}async commandReceived(s,i){switch(s){case y.load:{const s=i,{type:t}=s;if(t==w.sound)this.sound.load(s);else{if(t!=w.music)return;this.music.load(s)}this.eventBus.emit(f,b.Loaded,s.trackId);break}case y.play:{const s=i,{type:t,trackId:h,src:e}=s;t==w.music?(e&&this.music.load(s),this.music.playTrack(h)):(e&&this.sound.load(s),this.sound.playTrack(h)),this.eventBus.emit(f,b.Played,h);break}case y.queue:{const s=i,{type:t,trackId:h}=s;if(t!=w.music)return;this.music.queueAudio(s),this.eventBus.emit(f,b.Queued,h);break}case y.start:{const s=i,{type:t,trackId:h}=s;if(t==w.music)await this.music.playTrack(h);else{if(t!=w.sound)return;await this.sound.playTrack(h)}this.eventBus.emit(f,b.Started,h);break}case y.pause:this.pause();break;case y.resume:this.resume();break;case y.mute:{const{value:s}=i;this.mute(s);break}case y.seek:{const s=i,{type:t,trackId:h,value:e}=s;h&&this.seek(t,h,e);break}case y.stop:this.stop();break;case y.volume:{const{value:s}=i;this.setVolume(s);break}}}destroy(){this.unsubscribe(),this.stateEnabledSubscription(),this.stateMutedSubscription()}}const P=class{constructor(i){s(this,i),this.loaded=!1,this.error=null,this.stats={m:0,ml:0,mq:0,s:0,sl:0},this.howlerVersion="2.2.3",this.display=!1,this.debug=!1,this.dataProvider=!1}enableAudio(){d.audioEnabled=!0}async componentWillLoad(){if(o(this.debug,"n-audio: loading"),x.debug=this.debug,x.hasAudioComponent)this.error="Duplicate Audio Player";else if(d.dataEnabled){const s=await v("storage"),i=await(null==s?void 0:s.get("audio-enabled"));i&&(d.audioEnabled="false"!=i),x.muted="true"==await(null==s?void 0:s.get("audio-muted")),this.audioStateSubscription=S("muted",(async i=>{await(null==s?void 0:s.set("audio-muted",i.toString()))})),this.commonStateSubscription=l("audioEnabled",(async i=>{await(null==s?void 0:s.set("audio-enabled",i.toString()))}))}}registerServices(){this.loaded||(o(this.debug,"n-audio: loading listener"),this.actions=new J(window,a,r,this.dataProvider,this.debug),this.actionSubscription=this.actions.changed.on("changed",(()=>{this.updateState()})),x.hasAudioComponent=!0,this.loaded=!0)}updateState(){var s,i,t,h,e;this.stats={m:(null===(s=this.actions)||void 0===s?void 0:s.music.active)?1:0,ml:(null===(i=this.actions)||void 0===i?void 0:i.music.loader.items.length)||0,mq:(null===(t=this.actions)||void 0===t?void 0:t.music.queue.items.length)||0,s:(null===(h=this.actions)||void 0===h?void 0:h.sound.active)?1:0,sl:(null===(e=this.actions)||void 0===e?void 0:e.sound.loader.items.length)||0}}Error(){return i(t,{hidden:!this.display},i("div",null,i("p",{class:"error"},this.error)))}Disabled(){return i(t,{hidden:!this.display},i("div",null,i("p",null,"Audio Disabled"),i("button",{onClick:()=>{this.enableAudio()}},"Enable")))}Audio(){return this.display?i("div",null,i("p",null,"Audio ",this.actions.isPlaying()?"Playing":"Ready"),i("span",{title:"m=music s=sound l=loaded q=queued"},"M:",this.stats.m," MQ:",this.stats.mq," ML:",this.stats.ml," S:",this.stats.s," SL:",this.stats.sl)):null}NoAudio(){return this.display?i("div",null,i("p",null,"No Audio")):null}render(){var s;return this.error?this.Error():d.audioEnabled?i(t,{hidden:!this.display},i("n-content-reference",{inline:!0,onReferenced:()=>{this.registerServices()},"script-src":`https://cdn.jsdelivr.net/npm/howler@${this.howlerVersion}/dist/howler.core.min.js`}),(null===(s=this.actions)||void 0===s?void 0:s.hasAudio())?this.Audio():this.NoAudio()):this.Disabled()}disconnectedCallback(){var s,i,t,h,e;x.hasAudioComponent=!1,null===(s=this.stateSubscription)||void 0===s||s.call(this),null===(i=this.actionSubscription)||void 0===i||i.call(this),null===(t=this.audioStateSubscription)||void 0===t||t.call(this),null===(h=this.commonStateSubscription)||void 0===h||h.call(this),null===(e=this.actions)||void 0===e||e.destroy()}get el(){return h(this)}};P.style=":host{--display:inline-block;--width:200px;--color:white;--background-color:#000;--border:1px solid white;--fill:white;--icon-size:1rem}:host(.hidden){display:none}div{display:var(--display);max-width:var(--width);background-color:var(--background-color);border:var(--border);fill:var(--fill);padding:0.5em;color:var(--color)}.button{cursor:pointer}.button svg{display:flex;height:var(--icon-size);width:var(--icon-size)}p{margin:0}";export{P as n_audio}