vicowa-web-components
Version:
2 lines • 2.25 kB
JavaScript
import{WebComponentBaseClass as e}from"/third_party/web-component-base-class/dist/web-component-base-class.js";import{COMMANDS as t,SIGNALING_EVENTS as n,WebRTCHandler as a}from"../utilities/webrtc.js";import{uuidv4 as i}from"../utilities/utilities.js";import{createQuickAccess as r}from"web-component-base-class/src/tools.js";window.customElements.define("vicowa-p2pconnect",class VicowaP2PConnect extends e{#e;constructor(){super(),this.#e={webRTC:null,signaling:null,channelGuid:null}}static get properties(){return{signalingServer:{type:String,value:"",reflectToAttribute:!0,observer:handleSignalingChange},peerId:{type:String,value:"",reflectToAttribute:!0,observer:handleIdChange}}}set signalingHandler(e){this.#e.webRTC=new a(e),e.addObserver(n.PEER_LIST,(e=>{e.forEach((e=>{createPeer(this,e)}))})),e.addObserver(n.PEER_UPDATE,(e=>{switch(e.update){case"add":createPeer(this,e.data);break;case"remove":removePeer(this,e.data.id)}})),this.#e.signaling=e,this.#e.signaling.send({command:t.peerList})}detached(){}attached(){const e=this.#e;this.addAutoEventListener(this.$.connect,"click",(()=>{e.channelGuid=i(),e.signaling.send({command:t.inviteChannel,channel:e.channelGuid,peers:[]})}))}#t(){}#n(){}#a(e){if(!Array.from(this.$.peers.children).find((t=>t.peerId===e.id))){const t=document.createElement("div");t.classList.add("peer");const n=(this.$.peerTemplate.assignedNodes().length?this.$.peerTemplate.assignedNodes():this.$.peerTemplate.children)[0].content.cloneNode(!0);r(n,"name").peer.textContent=e.displayName,t.appendChild(n),this.$.peers.appendChild(t),t.peerId=e.id}}#i(e){const t=Array.from(this.$.peers.children).find((t=>t.peerId===e));t.parentNode.removeChild(t)}static get template(){return'\n\t\t<style>\n\t\t\t:host {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t}\n\t\t\n\t\t\t.peer {\n\t\t\t\t\tcursor: pointer;\n\t\t\t\t}\n\t\t\t.peer:hover,\n\t\t\t.peer.selected {\n\t\t\t\t\tbackground: blue;\n\t\t\t\t\tcolor: white;\n\t\t\t\t}\n\t\t</style>\n\t\t<div id="peers"></div>\n\t\t<vicowa-button id="connect" string="Connect"><slot name="custom-connect"></slot></vicowa-button>\n\t\t<slot id="peer-template" name="peer-template"><template><div name="peer"></div></template></slot>'}});
//# sourceMappingURL=vicowa-p2pconnect.js.map