@mux/studio-embed - npm Package Compare versions

Comparing version 1.0.4 to 1.1.0-rc2

dist/index.cjs.js

@@ -1,1 +0,1 @@
-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.allow="camera; microphone; fullscreen; display-capture; autoplay",this.autoSize&&(e.style.width="100%",e.style.height="768px"),e.style.display="block",e.style.border="none";let t=`https://1.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,c,h;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=(c=n==null?void 0:n.autoSize)!=null?c:!0,this.theme=(h=n==null?void 0:n.theme)!=null?h:{};let i=r.map(l=>[l,new Set]);this.eventCallbacks=Object.fromEntries(i),this._setupIframe()}off(e,t){t?this.eventCallbacks[e].delete(t):this.eventCallbacks[e].clear()}};
+var _=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var H=Object.prototype.hasOwnProperty;var I=(r,e)=>{for(var t in e)_(r,t,{get:e[t],enumerable:!0})},L=(r,e,t,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of U(e))!H.call(r,s)&&s!==t&&_(r,s,{get:()=>e[s],enumerable:!(a=b(e,s))||a.enumerable});return r};var w=r=>L(_({},"__esModule",{value:!0}),r);var M=(r,e,t)=>{if(!e.has(r))throw TypeError("Cannot "+t)};var n=(r,e,t)=>(M(r,e,"read from private field"),t?t.call(r):e.get(r)),i=(r,e,t)=>{if(e.has(r))throw TypeError("Cannot add the same private member more than once");e instanceof WeakSet?e.add(r):e.set(r,t)},o=(r,e,t,a)=>(M(r,e,"write to private field"),a?a.call(r,t):e.set(r,t),t);var B={};I(B,{createStudio:()=>G});module.exports=w(B);var T=["BROADCAST_STARTED","BROADCAST_ENDED","PARTICIPANT_JOINED","PARTICIPANT_LEFT","CAMERA_STARTED","CAMERA_STOPPED","MIC_STARTED","MIC_STOPPED","NAME_CHANGED"],k=["HEIGHT_CHANGED","REQUEST_THEME"],q=[...T,...k];var G=async(r,e,t)=>{if(typeof r!="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 C(r,a,t!=null?t:{})},v,c,E,d,m,l,p,u,h,A,N,x,g,f,S,D,C=class{constructor(e,t,a){i(this,v,void 0);i(this,c,void 0);i(this,E,void 0);i(this,d,void 0);i(this,m,void 0);i(this,l,void 0);i(this,p,void 0);i(this,u,!0);i(this,h,void 0);i(this,A,()=>{if(n(this,E)===null)return;let e=n(this,E);e.title="Mux Studio Embed",e.id="mux-studio-embed",e.allow="camera; microphone; fullscreen; display-capture; autoplay",n(this,u)&&(e.style.width="100%",e.style.height="768px"),e.style.display="block",e.style.border="none";let t=`https://1-1-0-rc2.studio.mux.dev/iframe?token=${n(this,v)}`;n(this,l)&&(t+=`&bg=${encodeURIComponent(n(this,l))}`),n(this,p)&&(t+=`&ov=${encodeURIComponent(n(this,p))}`),t+=`&as=${n(this,u)?"1":"0"}`,e.src=t,e.onload=n(this,N).bind(this),n(this,c).appendChild(e)});i(this,N,()=>{var e;n(this,E)!==null&&((e=n(this,E).contentWindow)==null||e.postMessage("PORT_TRANSFER","*",[n(this,m).port2]),n(this,m).port1.onmessage=n(this,x))});i(this,x,e=>{var a;let{name:t}=e.data;switch(t){case"HEIGHT_CHANGED":let{data:s}=e.data;n(this,g).call(this,s.height);break;case"REQUEST_THEME":n(this,f).call(this);break}(a=n(this,d)[t])==null||a.forEach(s=>{s(e.data)})});i(this,g,e=>{n(this,E)===null||!n(this,u)||(n(this,E).style.height=e.toString(10)+"px")});i(this,f,()=>{n(this,S).call(this,{name:"THEME_UPDATE",data:{theme:n(this,h)}})});i(this,S,e=>{n(this,m).port1.postMessage(e)});i(this,D,e=>{T.forEach(t=>{this.on(t,e)})});this.on=(e,t)=>{n(this,d)[e].has(t)||n(this,d)[e].add(t)};this.off=(e,t)=>{t?n(this,d)[e].delete(t):n(this,d)[e].clear()};this.offAll=()=>{T.forEach(e=>n(this,d)[e].clear())};this.updateTheme=e=>{o(this,h,{...n(this,h),...e}),n(this,f).call(this)};this.updateOverlay=e=>{n(this,S).call(this,{name:"OVERLAY_UPDATE_EVENT",data:{url:e}})};this.updateBackground=e=>{n(this,S).call(this,{name:"BACKGROUND_UPDATE_EVENT",data:{url:e}})};this.remove=()=>{var e;this.offAll(),(e=n(this,E))==null||e.remove(),o(this,E,null)};var y,F,R,O;o(this,v,e),o(this,c,t),o(this,E,document.createElement("iframe")),o(this,m,new MessageChannel),o(this,l,(y=a==null?void 0:a.background)!=null?y:null),o(this,p,(F=a==null?void 0:a.overlay)!=null?F:null),o(this,u,(R=a==null?void 0:a.autoSize)!=null?R:!0),o(this,h,(O=a==null?void 0:a.theme)!=null?O:{});let s=T.map(P=>[P,new Set]);o(this,d,Object.fromEntries(s)),n(this,A).call(this)}};v=new WeakMap,c=new WeakMap,E=new WeakMap,d=new WeakMap,m=new WeakMap,l=new WeakMap,p=new WeakMap,u=new WeakMap,h=new WeakMap,A=new WeakMap,N=new WeakMap,x=new WeakMap,g=new WeakMap,f=new WeakMap,S=new WeakMap,D=new WeakMap;

dist/mux-studio-embed.js

@@ -1,1 +0,1 @@
-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.allow="camera; microphone; fullscreen; display-capture; autoplay",this.autoSize&&(e.style.width="100%",e.style.height="768px"),e.style.display="block",e.style.border="none";let t=`https://1.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,c,h;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=(c=n==null?void 0:n.autoSize)!=null?c:!0,this.theme=(h=n==null?void 0:n.theme)!=null?h:{};let i=r.map(l=>[l,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);})();
+var muxStudioEmbed=(()=>{var _=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var H=Object.prototype.hasOwnProperty;var I=(r,e)=>{for(var t in e)_(r,t,{get:e[t],enumerable:!0})},L=(r,e,t,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of U(e))!H.call(r,s)&&s!==t&&_(r,s,{get:()=>e[s],enumerable:!(a=b(e,s))||a.enumerable});return r};var w=r=>L(_({},"__esModule",{value:!0}),r);var M=(r,e,t)=>{if(!e.has(r))throw TypeError("Cannot "+t)};var n=(r,e,t)=>(M(r,e,"read from private field"),t?t.call(r):e.get(r)),i=(r,e,t)=>{if(e.has(r))throw TypeError("Cannot add the same private member more than once");e instanceof WeakSet?e.add(r):e.set(r,t)},o=(r,e,t,a)=>(M(r,e,"write to private field"),a?a.call(r,t):e.set(r,t),t);var B={};I(B,{createStudio:()=>G});var T=["BROADCAST_STARTED","BROADCAST_ENDED","PARTICIPANT_JOINED","PARTICIPANT_LEFT","CAMERA_STARTED","CAMERA_STOPPED","MIC_STARTED","MIC_STOPPED","NAME_CHANGED"],k=["HEIGHT_CHANGED","REQUEST_THEME"],q=[...T,...k];var G=async(r,e,t)=>{if(typeof r!="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 C(r,a,t!=null?t:{})},v,c,E,d,m,l,p,u,h,A,N,x,g,f,S,D,C=class{constructor(e,t,a){i(this,v,void 0);i(this,c,void 0);i(this,E,void 0);i(this,d,void 0);i(this,m,void 0);i(this,l,void 0);i(this,p,void 0);i(this,u,!0);i(this,h,void 0);i(this,A,()=>{if(n(this,E)===null)return;let e=n(this,E);e.title="Mux Studio Embed",e.id="mux-studio-embed",e.allow="camera; microphone; fullscreen; display-capture; autoplay",n(this,u)&&(e.style.width="100%",e.style.height="768px"),e.style.display="block",e.style.border="none";let t=`https://1-1-0-rc2.studio.mux.dev/iframe?token=${n(this,v)}`;n(this,l)&&(t+=`&bg=${encodeURIComponent(n(this,l))}`),n(this,p)&&(t+=`&ov=${encodeURIComponent(n(this,p))}`),t+=`&as=${n(this,u)?"1":"0"}`,e.src=t,e.onload=n(this,N).bind(this),n(this,c).appendChild(e)});i(this,N,()=>{var e;n(this,E)!==null&&((e=n(this,E).contentWindow)==null||e.postMessage("PORT_TRANSFER","*",[n(this,m).port2]),n(this,m).port1.onmessage=n(this,x))});i(this,x,e=>{var a;let{name:t}=e.data;switch(t){case"HEIGHT_CHANGED":let{data:s}=e.data;n(this,g).call(this,s.height);break;case"REQUEST_THEME":n(this,f).call(this);break}(a=n(this,d)[t])==null||a.forEach(s=>{s(e.data)})});i(this,g,e=>{n(this,E)===null||!n(this,u)||(n(this,E).style.height=e.toString(10)+"px")});i(this,f,()=>{n(this,S).call(this,{name:"THEME_UPDATE",data:{theme:n(this,h)}})});i(this,S,e=>{n(this,m).port1.postMessage(e)});i(this,D,e=>{T.forEach(t=>{this.on(t,e)})});this.on=(e,t)=>{n(this,d)[e].has(t)||n(this,d)[e].add(t)};this.off=(e,t)=>{t?n(this,d)[e].delete(t):n(this,d)[e].clear()};this.offAll=()=>{T.forEach(e=>n(this,d)[e].clear())};this.updateTheme=e=>{o(this,h,{...n(this,h),...e}),n(this,f).call(this)};this.updateOverlay=e=>{n(this,S).call(this,{name:"OVERLAY_UPDATE_EVENT",data:{url:e}})};this.updateBackground=e=>{n(this,S).call(this,{name:"BACKGROUND_UPDATE_EVENT",data:{url:e}})};this.remove=()=>{var e;this.offAll(),(e=n(this,E))==null||e.remove(),o(this,E,null)};var y,F,R,O;o(this,v,e),o(this,c,t),o(this,E,document.createElement("iframe")),o(this,m,new MessageChannel),o(this,l,(y=a==null?void 0:a.background)!=null?y:null),o(this,p,(F=a==null?void 0:a.overlay)!=null?F:null),o(this,u,(R=a==null?void 0:a.autoSize)!=null?R:!0),o(this,h,(O=a==null?void 0:a.theme)!=null?O:{});let s=T.map(P=>[P,new Set]);o(this,d,Object.fromEntries(s)),n(this,A).call(this)}};v=new WeakMap,c=new WeakMap,E=new WeakMap,d=new WeakMap,m=new WeakMap,l=new WeakMap,p=new WeakMap,u=new WeakMap,h=new WeakMap,A=new WeakMap,N=new WeakMap,x=new WeakMap,g=new WeakMap,f=new WeakMap,S=new WeakMap,D=new WeakMap;return w(B);})();

dist/types/index.d.ts

@@ -1,2 +0,2 @@
-import { AllIncomingEventName, EventName, IncomingEvent, OutgoingEvent } from 'shared';
+import { EventName } from 'shared';
 import { ThemeOptions } from 'shared';
@@ -17,43 +17,5 @@ interface Options {
 declare class Studio {
-    token: string;
-    target: HTMLElement;
-    iframe: HTMLIFrameElement | null;
-    eventCallbacks: {
-        [key in AllIncomingEventName]: Set<Function>;
-    };
-    channel: MessageChannel;
-    background: string | null;
-    overlay: string | null;
-    autoSize: boolean;
-    theme: ThemeOptions;
+    #private;
     constructor(token: string, target: HTMLElement, options: Options);
     /**
-     * Internal
-     * Embeds iframe into the target dom node after setting it up
-     */
-    _setupIframe: () => void;
-    /**
-     * Internal
-     * This doesn't mean the studio itself is loaded, just the page context
-     */
-    _iframeLoaded: () => 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
@@ -66,4 +28,3 @@ */
      */
-    off(eventName: EventName): void;
-    off(eventName: EventName, callback: Function): void;
+    off: (eventName: EventName, callback?: Function | undefined) => void;
     /**
@@ -79,2 +40,12 @@ * Remove all event listeners for all events
     /**
+     * Updates the overlay of the broadcast.
+     * @param url The new overlay
+     */
+    updateOverlay: (url: string) => void;
+    /**
+     * Updates the background of the broadcast.
+     * @param url The new overlay
+     */
+    updateBackground: (url: string) => void;
+    /**
      * Removes the iframe from the DOM and destroys it
@@ -81,0 +52,0 @@ */

package.json

 {
     "name": "@mux/studio-embed",
-    "version": "1.0.4",
+    "version": "1.1.0-rc2",
     "description": "",
@@ -5,0 +5,0 @@ "license": "UNLICENSED",

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

18364

increased by12.45%

Worsened metrics

Lines of code

117

decreased by-12.69%

Number of low quality alerts

2

increased by100%

No dependency changes