Skip to content
Snippets Groups Projects
Commit eb83ae48 authored by Moritz Langenstein's avatar Moritz Langenstein
Browse files

(ml5717) Added simple UI for connections

parent df61bda4
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
public/index.html
+ 12
− 0
View file @ eb83ae48
...@@ -4,6 +4,18 @@ ...@@ -4,6 +4,18 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
</head> </head>
<body> <body>
<div>
Your client ID: <input id="user-id" type="text" value="" readonly="" />
</div>
<div>
Enter peer ID: <input id="peer-id" type="text" value="" />
<button id="peer-connect">Connect</button>
</div>
<div>
Connected peers:
<ul id="connected-peers"></ul>
</div>
<textarea style="width: 100%; height: 500px" id="textfield"></textarea> <textarea style="width: 100%; height: 500px" id="textfield"></textarea>
<script src="js/app.js"></script> <script src="js/app.js"></script>
......
src/app.js
+ 37
− 2
View file @ eb83ae48
...@@ -20,7 +20,42 @@ Y({ ...@@ -20,7 +20,42 @@ Y({
}).then(y => { }).then(y => {
y.share.textfield.bind(document.getElementById("textfield")) y.share.textfield.bind(document.getElementById("textfield"))
global.connectToPeer = function(uid) { const userIDElem = document.getElementById("user-id")
y.connector.connectToPeer(uid) const peerIDElem = document.getElementById("peer-id")
const peerButton = document.getElementById("peer-connect")
const connectedP = document.getElementById("connected-peers")
userIDElem.value = y.db.userId
y.connector.onUserEvent(function(event) {
switch (event.action) {
case "userID":
userIDElem.value = event.id
break
case "userJoined":
var peerElem = document.createElement("li")
peerElem.innerHTML = event.user
connectedP.appendChild(peerElem)
break
case "userLeft":
for (var peer of connectedP.children) {
if (peer.innerHTML == event.user) {
connectedP.removeChild(peer)
}
}
break
}
})
peerButton.onclick = function() {
const peerID = peerIDElem.value
if (peerID == "") {
return
}
y.connector.connectToPeer(peerID)
peerIDElem.value = ""
} }
}) })
src/y-webrtc/index.js
+ 4
− 0
View file @ eb83ae48
...@@ -33,6 +33,10 @@ function extend(Y) { ...@@ -33,6 +33,10 @@ function extend(Y) {
peer.on("open", function(id) { peer.on("open", function(id) {
console.log("My peer ID is: " + id) console.log("My peer ID is: " + id)
for (var f of self.userEventListeners) {
f({ action: "userID", id: id })
}
self.setUserId(id) self.setUserId(id)
}) })
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment