Switch direction of link sharing

This commit is contained in:
Fabian Stamm 2022-06-20 20:03:55 +02:00
parent a9767da606
commit 3ab6fc97e9
3 changed files with 62 additions and 43 deletions

View File

@ -1,16 +1,16 @@
{ {
"name": "ScreenSharingThing", "name": "ScreenSharingThing",
"packageManager": "yarn@3.1.1", "packageManager": "yarn@3.1.1",
"scripts": { "scripts": {
"start": "ts-node src/index.ts" "dev": "ts-node src/index.ts"
}, },
"devDependencies": { "devDependencies": {
"@types/node": "^16.11.11", "@types/node": "^16.11.11",
"ts-node": "^10.4.0", "ts-node": "^10.4.0",
"typescript": "^4.5.2" "typescript": "^4.5.2"
}, },
"dependencies": { "dependencies": {
"express": "^4.17.1", "express": "^4.17.1",
"peer": "^0.6.1" "peer": "^0.6.1"
} }
} }

View File

@ -26,14 +26,14 @@
<h2>Your ID: <span id="streamId"></span></h2> <h2>Your ID: <span id="streamId"></span></h2>
<div id="streamURLCont"> <div id="streamURLCont">
<h2>Connect URL: <a id="streamURL"></a></h2> <h2>Connect URL: <a id="streamURL"></a></h2>
<button id="startStramBTN">Start Stream</button>
</div> </div>
<div id="connectToCont"> <div id="connectToCont">
<h2>Connecting to: <span id="connectToID"></span></h2> <h2>Connecting to: <span id="connectToID"></span></h2>
<button id="startStramBTN">Start Stream</button>
</div> </div>
</div> </div>
</div> </div>
<video id="localVideo" style="width: 100%" controls></video> <video id="localVideo" style="width: 100%" controls muted></video>
</div> </div>
@ -42,4 +42,4 @@
</script> </script>
</body> </body>
</html> </html>

View File

@ -78,6 +78,7 @@ var peer = new Peer({
}); });
function bitrateTransform(sdp) { function bitrateTransform(sdp) {
// return sdp;
var arr = sdp.split("\r\n"); var arr = sdp.split("\r\n");
arr.forEach((str, i) => { arr.forEach((str, i) => {
if (/^a=fmtp:\d*/.test(str)) { if (/^a=fmtp:\d*/.test(str)) {
@ -96,47 +97,65 @@ function bitrateTransform(sdp) {
return res; return res;
} }
let currentStream = undefined; let currentStream = undefined;
let connections = [];
function sendStream(id) {
const conn = peer.call(id, currentStream, {
sdpTransform: bitrateTransform,
});
conn.on("stream", console.log);
conn.on("close", console.log);
conn.on("error", console.log);
}
if (!connectToId) {
sf.startStramBTN_click = () => {
navigator.mediaDevices
.getDisplayMedia({
video: true,
})
.then((stream) => {
if (currentStream) {
currentStream.getTracks().forEach((track) => track.stop());
}
currentStream = stream;
let v = sf.localVideo;
v.srcObject = stream;
v.play();
connections.forEach((id) => {
sendStream(id);
});
});
};
}
peer.on("open", (id) => { peer.on("open", (id) => {
console.log("ID", id); console.log("ID", id);
sf.streamId_text = id; sf.streamId_text = id;
let url = new URL(window.location.href); let url = new URL(window.location.href);
url.searchParams.set("id", id); url.searchParams.set("id", id);
sf.streamURL_text = url.href; sf.streamURL_text = url.href;
sf.streamURL_href = url.href; sf.streamURL_href = url.href;
let con = peer.connect(connectToId);
con.on("data", console.log);
con.on("open", () => con.send("Hello"));
if (connectToId) { if (connectToId) {
sf.startStramBTN_click = () => { let con = peer.connect(connectToId);
navigator.mediaDevices con.on("data", console.log);
.getDisplayMedia({ con.on("open", () => con.send("Hello"));
video: true,
})
.then((stream) => {
if(currentStream) {
currentStream.getTracks().forEach(track => track.stop())
}
currentStream = stream;
let v = sf.localVideo;
v.srcObject = stream;
v.play();
const conn = peer.call(connectToId, stream, {
sdpTransform: bitrateTransform,
});
conn.on("stream", console.log);
conn.on("close", console.log);
conn.on("error", console.log);
});
};
} }
}); });
peer.on("connection", (conn) => { peer.on("connection", (conn) => {
console.log("connection", conn); console.log("connection", conn);
conn.on("data", console.log); conn.on("data", console.log);
connections.push(conn.peer);
if (currentStream) {
sendStream(conn.peer);
}
}); });
peer.on("error", console.error); peer.on("error", console.error);