@mux/studio-embed - npm Package Compare versions

Comparing version 0.4.5 to 0.4.6

dist/index.cjs.js

@@ -1,1 +0,1 @@
-var s=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var T=(n,e)=>{for(var t in e)s(n,t,{get:e[t],enumerable:!0})},v=(n,e,t,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of u(e))!f.call(n,r)&&r!==t&&s(n,r,{get:()=>e[r],enumerable:!(a=d(e,r))||a.enumerable});return n};var p=n=>v(s({},"__esModule",{value:!0}),n);var b={};T(b,{createStudio:()=>g});module.exports=p(b);var i=["ERROR","LIVESTREAM_STARTED","LIVESTREAM_ENDED","PARTICIPANT_JOINED","PARTICIPANT_LEFT","LOADING_STATUS_CHANGED","CAMERA_STARTED","CAMERA_STOPPED","MIC_STARTED","MIC_STOPPED","CONNECTION_QUALITY_CHANGED","HEIGHT_CHANGED","REQUEST_THEME"];var g=async(n,e,t)=>{if(typeof n!="string")throw new Error("Token must be provided and be a string");if(document.querySelector("#mux-studio-embed")!==null)throw new Error("Studio already embedded. Only one studio can be embedded at a time");let a=null;if(e instanceof HTMLElement?a=e:typeof e=="string"&&(a=document.querySelector(e)),!a)throw new Error("Invalid target element supplied");return new l(n,a,t!=null?t:{})},l=class{constructor(e,t,a){this.autoSize=!0;this._setupIframe=()=>{if(this.iframe===null)return;let e=this.iframe;e.title="Mux Studio Embed",e.id="mux-studio-embed",e.allowFullscreen=!0,e.allow="camera; microphone; fullscreen; display-capture; allow-same-origin; allow-presentation",this.autoSize&&(e.style.width="100%",e.style.height="768px"),e.style.display="block",e.style.border="none";let t=`https://0-4-5.studio.mux.dev/iframe?token=${this.token}`;this.background&&(t+=`&bg=${encodeURIComponent(this.background)}`),this.overlay&&(t+=`&ov=${encodeURIComponent(this.overlay)}`),t+=`&as=${this.autoSize?"1":"0"}`,e.src=t,e.onload=this._iframeLoaded.bind(this),this.target.appendChild(e)};this._iframeLoaded=()=>{var e;this.iframe!==null&&((e=this.iframe.contentWindow)==null||e.postMessage("PORT_TRANSFER","*",[this.channel.port2]),this.channel.port1.onmessage=this._onRecieveMessage)};this._onRecieveMessage=e=>{let{name:t,data:a}=e.data;switch(t){case"HEIGHT_CHANGED":this._updateIframeHeight(a.height);break;case"REQUEST_THEME":this._sendTheme();break}this.eventCallbacks[t].forEach(r=>r(a))};this._updateIframeHeight=e=>{this.iframe===null||!this.autoSize||(this.iframe.style.height=e.toString(10)+"px")};this._sendTheme=()=>{let e={name:"THEME_UPDATE",theme:this.theme};this.channel.port1.postMessage(e)};this.on=(e,t)=>{this.eventCallbacks[e].has(t)||this.eventCallbacks[e].add(t)};this.offAll=()=>{i.forEach(e=>this.eventCallbacks[e].clear())};this.updateTheme=e=>{this.theme={...this.theme,...e},this._sendTheme()};this.remove=()=>{var e;this.offAll(),(e=this.iframe)==null||e.remove(),this.iframe=null};var m,h,o,E;this.token=e,this.target=t,this.iframe=document.createElement("iframe"),this.channel=new MessageChannel,this.background=(m=a==null?void 0:a.background)!=null?m:null,this.overlay=(h=a==null?void 0:a.overlay)!=null?h:null,this.autoSize=(o=a==null?void 0:a.autoSize)!=null?o:!0,this.theme=(E=a==null?void 0:a.theme)!=null?E:{};let r=i.map(c=>[c,new Set]);this.eventCallbacks=Object.fromEntries(r),this._setupIframe()}off(e,t){t?this.eventCallbacks[e].delete(t):this.eventCallbacks[e].clear()}};
+var m=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var p=(a,e)=>{for(var t in e)m(a,t,{get:e[t],enumerable:!0})},u=(a,e,t,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of v(e))!g.call(a,i)&&i!==t&&m(a,i,{get:()=>e[i],enumerable:!(n=d(e,i))||n.enumerable});return a};var T=a=>u(m({},"__esModule",{value:!0}),a);var I={};p(I,{createStudio:()=>S});module.exports=T(I);var r=["BROADCAST_STARTED","BROADCAST_ENDED","PARTICIPANT_JOINED","PARTICIPANT_LEFT","CAMERA_STARTED","CAMERA_STOPPED","MIC_STARTED","MIC_STOPPED","NAME_CHANGED"],f=["HEIGHT_CHANGED","REQUEST_THEME"],N=[...r,...f];var S=async(a,e,t)=>{if(typeof a!="string")throw new Error("Token must be provided and be a string");if(document.querySelector("#mux-studio-embed")!==null)throw new Error("Studio already embedded. Only one studio can be embedded at a time");let n=null;if(e instanceof HTMLElement?n=e:typeof e=="string"&&(n=document.querySelector(e)),!n)throw new Error("Invalid target element supplied");return new s(a,n,t!=null?t:{})},s=class{constructor(e,t,n){this.autoSize=!0;this._setupIframe=()=>{if(this.iframe===null)return;let e=this.iframe;e.title="Mux Studio Embed",e.id="mux-studio-embed",e.allowFullscreen=!0,e.allow="camera; microphone; fullscreen; display-capture; allow-same-origin; allow-presentation",this.autoSize&&(e.style.width="100%",e.style.height="768px"),e.style.display="block",e.style.border="none";let t=`https://0-4-6.studio.mux.dev/iframe?token=${this.token}`;this.background&&(t+=`&bg=${encodeURIComponent(this.background)}`),this.overlay&&(t+=`&ov=${encodeURIComponent(this.overlay)}`),t+=`&as=${this.autoSize?"1":"0"}`,e.src=t,e.onload=this._iframeLoaded.bind(this),this.target.appendChild(e)};this._iframeLoaded=()=>{var e;this.iframe!==null&&((e=this.iframe.contentWindow)==null||e.postMessage("PORT_TRANSFER","*",[this.channel.port2]),this.channel.port1.onmessage=this._onRecieveMessage)};this._onRecieveMessage=e=>{var n;let{name:t}=e.data;switch(t){case"HEIGHT_CHANGED":let{data:i}=e.data;this._updateIframeHeight(i.height);break;case"REQUEST_THEME":this._sendTheme();break}(n=this.eventCallbacks[t])==null||n.forEach(i=>{i(e.data)})};this._updateIframeHeight=e=>{this.iframe===null||!this.autoSize||(this.iframe.style.height=e.toString(10)+"px")};this._sendTheme=()=>{this._sendEvent({name:"THEME_UPDATE",data:{theme:this.theme}})};this._sendEvent=e=>{this.channel.port1.postMessage(e)};this._onAny=e=>{r.forEach(t=>{this.on(t,e)})};this.on=(e,t)=>{this.eventCallbacks[e].has(t)||this.eventCallbacks[e].add(t)};this.offAll=()=>{r.forEach(e=>this.eventCallbacks[e].clear())};this.updateTheme=e=>{this.theme={...this.theme,...e},this._sendTheme()};this.remove=()=>{var e;this.offAll(),(e=this.iframe)==null||e.remove(),this.iframe=null};var o,E,l,c;this.token=e,this.target=t,this.iframe=document.createElement("iframe"),this.channel=new MessageChannel,this.background=(o=n==null?void 0:n.background)!=null?o:null,this.overlay=(E=n==null?void 0:n.overlay)!=null?E:null,this.autoSize=(l=n==null?void 0:n.autoSize)!=null?l:!0,this.theme=(c=n==null?void 0:n.theme)!=null?c:{};let i=r.map(h=>[h,new Set]);this.eventCallbacks=Object.fromEntries(i),this._setupIframe()}off(e,t){t?this.eventCallbacks[e].delete(t):this.eventCallbacks[e].clear()}};

dist/mux-studio-embed.js

@@ -1,1 +0,1 @@
-var muxStudioEmbed=(()=>{var s=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var T=(n,e)=>{for(var t in e)s(n,t,{get:e[t],enumerable:!0})},v=(n,e,t,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of u(e))!f.call(n,r)&&r!==t&&s(n,r,{get:()=>e[r],enumerable:!(a=d(e,r))||a.enumerable});return n};var p=n=>v(s({},"__esModule",{value:!0}),n);var b={};T(b,{createStudio:()=>g});var i=["ERROR","LIVESTREAM_STARTED","LIVESTREAM_ENDED","PARTICIPANT_JOINED","PARTICIPANT_LEFT","LOADING_STATUS_CHANGED","CAMERA_STARTED","CAMERA_STOPPED","MIC_STARTED","MIC_STOPPED","CONNECTION_QUALITY_CHANGED","HEIGHT_CHANGED","REQUEST_THEME"];var g=async(n,e,t)=>{if(typeof n!="string")throw new Error("Token must be provided and be a string");if(document.querySelector("#mux-studio-embed")!==null)throw new Error("Studio already embedded. Only one studio can be embedded at a time");let a=null;if(e instanceof HTMLElement?a=e:typeof e=="string"&&(a=document.querySelector(e)),!a)throw new Error("Invalid target element supplied");return new l(n,a,t!=null?t:{})},l=class{constructor(e,t,a){this.autoSize=!0;this._setupIframe=()=>{if(this.iframe===null)return;let e=this.iframe;e.title="Mux Studio Embed",e.id="mux-studio-embed",e.allowFullscreen=!0,e.allow="camera; microphone; fullscreen; display-capture; allow-same-origin; allow-presentation",this.autoSize&&(e.style.width="100%",e.style.height="768px"),e.style.display="block",e.style.border="none";let t=`https://0-4-5.studio.mux.dev/iframe?token=${this.token}`;this.background&&(t+=`&bg=${encodeURIComponent(this.background)}`),this.overlay&&(t+=`&ov=${encodeURIComponent(this.overlay)}`),t+=`&as=${this.autoSize?"1":"0"}`,e.src=t,e.onload=this._iframeLoaded.bind(this),this.target.appendChild(e)};this._iframeLoaded=()=>{var e;this.iframe!==null&&((e=this.iframe.contentWindow)==null||e.postMessage("PORT_TRANSFER","*",[this.channel.port2]),this.channel.port1.onmessage=this._onRecieveMessage)};this._onRecieveMessage=e=>{let{name:t,data:a}=e.data;switch(t){case"HEIGHT_CHANGED":this._updateIframeHeight(a.height);break;case"REQUEST_THEME":this._sendTheme();break}this.eventCallbacks[t].forEach(r=>r(a))};this._updateIframeHeight=e=>{this.iframe===null||!this.autoSize||(this.iframe.style.height=e.toString(10)+"px")};this._sendTheme=()=>{let e={name:"THEME_UPDATE",theme:this.theme};this.channel.port1.postMessage(e)};this.on=(e,t)=>{this.eventCallbacks[e].has(t)||this.eventCallbacks[e].add(t)};this.offAll=()=>{i.forEach(e=>this.eventCallbacks[e].clear())};this.updateTheme=e=>{this.theme={...this.theme,...e},this._sendTheme()};this.remove=()=>{var e;this.offAll(),(e=this.iframe)==null||e.remove(),this.iframe=null};var m,h,o,E;this.token=e,this.target=t,this.iframe=document.createElement("iframe"),this.channel=new MessageChannel,this.background=(m=a==null?void 0:a.background)!=null?m:null,this.overlay=(h=a==null?void 0:a.overlay)!=null?h:null,this.autoSize=(o=a==null?void 0:a.autoSize)!=null?o:!0,this.theme=(E=a==null?void 0:a.theme)!=null?E:{};let r=i.map(c=>[c,new Set]);this.eventCallbacks=Object.fromEntries(r),this._setupIframe()}off(e,t){t?this.eventCallbacks[e].delete(t):this.eventCallbacks[e].clear()}};return p(b);})();
+var muxStudioEmbed=(()=>{var m=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var p=(a,e)=>{for(var t in e)m(a,t,{get:e[t],enumerable:!0})},u=(a,e,t,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of v(e))!g.call(a,i)&&i!==t&&m(a,i,{get:()=>e[i],enumerable:!(n=d(e,i))||n.enumerable});return a};var T=a=>u(m({},"__esModule",{value:!0}),a);var I={};p(I,{createStudio:()=>S});var r=["BROADCAST_STARTED","BROADCAST_ENDED","PARTICIPANT_JOINED","PARTICIPANT_LEFT","CAMERA_STARTED","CAMERA_STOPPED","MIC_STARTED","MIC_STOPPED","NAME_CHANGED"],f=["HEIGHT_CHANGED","REQUEST_THEME"],N=[...r,...f];var S=async(a,e,t)=>{if(typeof a!="string")throw new Error("Token must be provided and be a string");if(document.querySelector("#mux-studio-embed")!==null)throw new Error("Studio already embedded. Only one studio can be embedded at a time");let n=null;if(e instanceof HTMLElement?n=e:typeof e=="string"&&(n=document.querySelector(e)),!n)throw new Error("Invalid target element supplied");return new s(a,n,t!=null?t:{})},s=class{constructor(e,t,n){this.autoSize=!0;this._setupIframe=()=>{if(this.iframe===null)return;let e=this.iframe;e.title="Mux Studio Embed",e.id="mux-studio-embed",e.allowFullscreen=!0,e.allow="camera; microphone; fullscreen; display-capture; allow-same-origin; allow-presentation",this.autoSize&&(e.style.width="100%",e.style.height="768px"),e.style.display="block",e.style.border="none";let t=`https://0-4-6.studio.mux.dev/iframe?token=${this.token}`;this.background&&(t+=`&bg=${encodeURIComponent(this.background)}`),this.overlay&&(t+=`&ov=${encodeURIComponent(this.overlay)}`),t+=`&as=${this.autoSize?"1":"0"}`,e.src=t,e.onload=this._iframeLoaded.bind(this),this.target.appendChild(e)};this._iframeLoaded=()=>{var e;this.iframe!==null&&((e=this.iframe.contentWindow)==null||e.postMessage("PORT_TRANSFER","*",[this.channel.port2]),this.channel.port1.onmessage=this._onRecieveMessage)};this._onRecieveMessage=e=>{var n;let{name:t}=e.data;switch(t){case"HEIGHT_CHANGED":let{data:i}=e.data;this._updateIframeHeight(i.height);break;case"REQUEST_THEME":this._sendTheme();break}(n=this.eventCallbacks[t])==null||n.forEach(i=>{i(e.data)})};this._updateIframeHeight=e=>{this.iframe===null||!this.autoSize||(this.iframe.style.height=e.toString(10)+"px")};this._sendTheme=()=>{this._sendEvent({name:"THEME_UPDATE",data:{theme:this.theme}})};this._sendEvent=e=>{this.channel.port1.postMessage(e)};this._onAny=e=>{r.forEach(t=>{this.on(t,e)})};this.on=(e,t)=>{this.eventCallbacks[e].has(t)||this.eventCallbacks[e].add(t)};this.offAll=()=>{r.forEach(e=>this.eventCallbacks[e].clear())};this.updateTheme=e=>{this.theme={...this.theme,...e},this._sendTheme()};this.remove=()=>{var e;this.offAll(),(e=this.iframe)==null||e.remove(),this.iframe=null};var o,E,l,c;this.token=e,this.target=t,this.iframe=document.createElement("iframe"),this.channel=new MessageChannel,this.background=(o=n==null?void 0:n.background)!=null?o:null,this.overlay=(E=n==null?void 0:n.overlay)!=null?E:null,this.autoSize=(l=n==null?void 0:n.autoSize)!=null?l:!0,this.theme=(c=n==null?void 0:n.theme)!=null?c:{};let i=r.map(h=>[h,new Set]);this.eventCallbacks=Object.fromEntries(i),this._setupIframe()}off(e,t){t?this.eventCallbacks[e].delete(t):this.eventCallbacks[e].clear()}};return T(I);})();

dist/types/index.d.ts

@@ -1,2 +0,2 @@
-import { EventName } from 'shared';
+import { AllIncomingEventName, EventName, IncomingEvent, OutgoingEvent } from 'shared';
 import { ThemeOptions } from 'shared';
@@ -21,3 +21,3 @@ interface Options {
     eventCallbacks: {
-        [key in EventName]: Set<Function>;
+        [key in AllIncomingEventName]: Set<Function>;
     };
@@ -31,2 +31,3 @@ channel: MessageChannel;
     /**
+     * Internal
      * Embeds iframe into the target dom node after setting it up
@@ -36,12 +37,25 @@ */
     /**
+     * Internal
      * This doesn't mean the studio itself is loaded, just the page context
      */
     _iframeLoaded: () => void;
-    _onRecieveMessage: (event: MessageEvent<{
-        name: EventName;
-        data: any;
-    }>) => void;
+    /**
+     * Internal
+     */
+    _onRecieveMessage: (event: MessageEvent<IncomingEvent>) => void;
+    /**
+     * Internal
+     */
     _updateIframeHeight: (height: number) => void;
+    /**
+     * Internal
+     */
     _sendTheme: () => void;
+    _sendEvent: (event: OutgoingEvent) => void;
     /**
+     * Internal
+     * Register a callback for all possible events
+     */
+    _onAny: (callback: Function) => void;
+    /**
      * Register an event listener
@@ -48,0 +62,0 @@ */

package.json

 {
     "name": "@mux/studio-embed",
-    "version": "0.4.5",
+    "version": "0.4.6",
     "description": "",
@@ -5,0 +5,0 @@ "license": "UNLICENSED",

No alert changes

Improved metrics

Total package byte prevSize

16551

increased by4.38%

Lines of code

136

increased by13.33%

No dependency changes