(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[741],{84116:function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/viewers",function(){return n(22555)}])},22555:function(e,t,n){"use strict";n.r(t);var s=n(85893),u=n(67294),a=n(53920);n(74581);var i=n(83454);let r=(0,a.ZP)(i.env.NEXT_PUBLIC_SOCKET_URL);t.default=()=>{let[e,t]=(0,u.useState)(null),[a,c]=(0,u.useState)(null),[l,o]=(0,u.useState)(!1),[f,d]=(0,u.useState)("");(0,u.useRef)();let m=(0,u.useRef)(),_=(0,u.useRef)(),streamStatusFunc=e=>{console.log(e),"Disconnect"===e&&(_.current.srcObject=null)},streamClientRequestFunc=e=>{let{clientPeerId:t,message:n}=e;t===a&&"Accept"===n&&o(!0)};return(0,u.useEffect)(()=>{let initializePeer=async()=>{let e=(await n.e(7623).then(n.bind(n,67623))).default;await t(new e(void 0,{host:i.env.NEXT_PUBLIC_HOST,port:3014,path:"/peerjs"}))};initializePeer()},[]),(0,u.useEffect)(()=>{if(e)return e.on("open",function(e){c(e)}),e.on("call",function(e){e.answer(),e.on("stream",function(e){l&&(_.current.srcObject=e)})}),()=>{e.off("open"),e.off("call")}},[e,l]),(0,u.useEffect)(()=>(r.on("stream-client-request",streamClientRequestFunc),r.on("stream-status",streamStatusFunc),r.emit("stream",a),()=>{r.off("stream-client-request",streamClientRequestFunc),r.off("stream-status",streamStatusFunc)}),[a]),(0,s.jsxs)("div",{className:"container",children:[(0,s.jsx)("button",{onClick:()=>r.emit("stream",a),className:"buttonclass",style:{display:l?"block":"none"},children:"Join Stream"}),(0,s.jsx)("div",{id:"videoContainer"}),(0,s.jsx)("div",{children:(0,s.jsx)("video",{ref:m,autoPlay:!0,muted:!0})}),(0,s.jsx)("div",{children:(0,s.jsx)("video",{ref:_,autoPlay:!0})})]})}}},function(e){e.O(0,[3920,9774,2888,179],function(){return e(e.s=84116)}),_N_E=e.O()}]);