2b:null 2c:["$","title",null,{"children":"epiPeer [code][YouTube] | Jonas Almeida | Observable"}] 31:[] 2f:{"id":"4cd2de24ffff8db8","slug":"peer","title":"epiPeer [code][YouTube]","thumbnail":"6eb165a18796dbe546df6e82a7defed416321d4a72cfa6c3e2d89ccfaf12a476","access_level":"public","create_time":"$D2022-08-31T20:02:59.588Z","update_time":"$D2022-09-09T03:26:05.130Z","view_time":null,"first_public_time":"$D2022-08-31T20:03:10.798Z","fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"0f2e596d5bd6ef6e","login":"episphere","name":"Jonas Almeida","avatar_url":"https://avatars-next.observableusercontent.com/3a0ff5abff6da0cdbd100da305ba323e12d43c8fcb7604275e6c72591db9dc69","tier":"starter_2024"},"version":145,"publish_version":145,"role":null,"authored":false,"authors":[{"type":"individual","id":"4355fe13cb71b11d","login":"episphere","name":"Jonas Almeida","avatar_url":"https://avatars-next.observableusercontent.com/3a0ff5abff6da0cdbd100da305ba323e12d43c8fcb7604275e6c72591db9dc69","tier":null}],"members":[{"type":"individual","id":"4355fe13cb71b11d","login":"episphere","name":"Jonas Almeida","avatar_url":"https://avatars-next.observableusercontent.com/3a0ff5abff6da0cdbd100da305ba323e12d43c8fcb7604275e6c72591db9dc69","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"epiPeer [code][YouTube]","cells":[{"id":0,"value":"\n

epiPeer ^{[code][YouTube]}

\n ...\n

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":45,"value":"### Libraries\nWe'll be loading this project's epiPeer.js library, which uses peerJS to operate WebRTC. Note this library inserts itself in the scope (not cool) which can be activated by epiPeer.insertPeerjs.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":21,"value":"//epiPeer = import(\"http://localhost:8000/peer/methods.js\")\nepiPeer = import(\"https://episphere.github.io/peer/methods.js\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"epiPeer.insertPeerjs()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":56,"value":"

Following peerJS instructions:

\nNote example queue system.\n

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":71,"value":"

1. Include the Javascript client

\n\n

https://unpkg.com/peerjs@1.3.2/dist/peerjs.min.js script tag loaded, peerjs:

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":102,"value":"PeerJS = require(\"https://unpkg.com/peerjs@1.3.2/dist/peerjs.min.js\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":118,"value":"Peer = PeerJS.peerjs.Peer","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":87,"value":"#### 2. Create the Peer object","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":90,"value":"peer = new Peer()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":92,"value":"#### 3. Usage","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":96,"value":"peer.on(\"open\", function (id) {\n console.log(\"My peer ID is: \" + id);\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"#### 4. Data Connections\n---\n##### 4.1. Connect to self","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":128,"value":"conn = peer.connect(peer._id)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":132,"value":"peer.on(\"connection\", function (conn) {\n console.log(\"conn:\", conn);\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":130,"value":"conn.on(\"open\", function () {\n // Receive messages\n conn.on(\"data\", function (data) {\n console.log(\"Received\", data);\n });\n\n // Send messages\n conn.send(\"Hello!\");\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":134,"value":"## simplePeer","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":136,"value":"","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 30:"$2f:body"