wip
This commit is contained in:
+1
-1
@@ -51,7 +51,7 @@
|
|||||||
<br>
|
<br>
|
||||||
<input type="file" @change="fileChange" />
|
<input type="file" @change="fileChange" />
|
||||||
<br>
|
<br>
|
||||||
<input type="submit" @click.prevent="start" :disabled="!data || !remoteId" />
|
<input type="submit" @click.prevent="start" :disabled="!data || !remoteId || !connectionOpen" />
|
||||||
</div>
|
</div>
|
||||||
<br />
|
<br />
|
||||||
<small class="footer">
|
<small class="footer">
|
||||||
|
|||||||
@@ -44,7 +44,7 @@ const app = createApp({
|
|||||||
},
|
},
|
||||||
connect() {
|
connect() {
|
||||||
if (this.remoteId) {
|
if (this.remoteId) {
|
||||||
this.connection = this.peer.connect(this.remoteId);
|
this.initConnection(this.peer.connect(this.remoteId));
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
initPeer() {
|
initPeer() {
|
||||||
@@ -52,11 +52,11 @@ const app = createApp({
|
|||||||
config: {
|
config: {
|
||||||
iceServers: [
|
iceServers: [
|
||||||
{ urls: "stun:stun.l.google.com:19302" },
|
{ urls: "stun:stun.l.google.com:19302" },
|
||||||
{
|
// {
|
||||||
urls: [`turn:127.0.0.1:3478`, `turns:127.0.0.1:5349`],
|
// urls: [`turn:127.0.0.1:3478`, `turns:127.0.0.1:5349`],
|
||||||
username: "user",
|
// username: "user",
|
||||||
credential: "pass",
|
// credential: "pass",
|
||||||
},
|
// },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@@ -66,24 +66,40 @@ const app = createApp({
|
|||||||
this.peer.on("disconnected", this.peerDisconnected);
|
this.peer.on("disconnected", this.peerDisconnected);
|
||||||
this.peer.on("error", this.peerError);
|
this.peer.on("error", this.peerError);
|
||||||
},
|
},
|
||||||
|
initConnection(conn) {
|
||||||
|
conn.on("open", () => {
|
||||||
|
console.log("connOpen");
|
||||||
|
this.connection = conn;
|
||||||
|
this.connection.on("close", this.connClose);
|
||||||
|
this.connection.on("error", this.connError);
|
||||||
|
this.connection.on("data", this.connData);
|
||||||
|
});
|
||||||
|
},
|
||||||
peerOpen(id) {
|
peerOpen(id) {
|
||||||
|
console.log("peerOpen", id);
|
||||||
this.localId = id;
|
this.localId = id;
|
||||||
},
|
},
|
||||||
peerConnection(conn) {
|
peerConnection(conn) {
|
||||||
this.connection = conn;
|
console.log("peerConnection");
|
||||||
|
this.initConnection(conn);
|
||||||
this.remoteId = conn.peer;
|
this.remoteId = conn.peer;
|
||||||
},
|
},
|
||||||
peerClose() {
|
peerClose() {
|
||||||
|
console.log("peerClose");
|
||||||
this.peer = null;
|
this.peer = null;
|
||||||
setTimeout(this.initPeer);
|
setTimeout(this.initPeer);
|
||||||
},
|
},
|
||||||
peerDisconnected() {
|
peerDisconnected() {
|
||||||
|
console.log("peerDisconnected");
|
||||||
this.peer.reconnect();
|
this.peer.reconnect();
|
||||||
},
|
},
|
||||||
peerError(err) {
|
peerError(err) {
|
||||||
|
console.log("peerError", err);
|
||||||
// TODO handle error
|
// TODO handle error
|
||||||
},
|
},
|
||||||
connData(data) {
|
connData(data) {
|
||||||
|
console.log("connData");
|
||||||
|
console.log(data.type);
|
||||||
switch (data.type) {
|
switch (data.type) {
|
||||||
case "start":
|
case "start":
|
||||||
ReadableStream({
|
ReadableStream({
|
||||||
@@ -107,14 +123,14 @@ const app = createApp({
|
|||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
connOpen() {
|
|
||||||
// TODO handle conn open
|
|
||||||
},
|
|
||||||
connClose() {
|
connClose() {
|
||||||
|
console.log("connClose");
|
||||||
this.connection = null;
|
this.connection = null;
|
||||||
|
this.connectionOpen = false;
|
||||||
// TODO handle conn close
|
// TODO handle conn close
|
||||||
},
|
},
|
||||||
connError() {
|
connError(err) {
|
||||||
|
console.log("connError", err);
|
||||||
// TODO handle error
|
// TODO handle error
|
||||||
},
|
},
|
||||||
fileChange(event) {
|
fileChange(event) {
|
||||||
@@ -143,11 +159,13 @@ const app = createApp({
|
|||||||
this.connection.send({
|
this.connection.send({
|
||||||
type: "start",
|
type: "start",
|
||||||
});
|
});
|
||||||
|
console.log("start");
|
||||||
for (
|
for (
|
||||||
let index = 0;
|
let index = 0;
|
||||||
index < this.data.byteLength;
|
index < this.data.byteLength;
|
||||||
index += MAX_CHUNK_SIZE
|
index += MAX_CHUNK_SIZE
|
||||||
) {
|
) {
|
||||||
|
console.log("chunk");
|
||||||
this.connection.send({
|
this.connection.send({
|
||||||
type: "chunk",
|
type: "chunk",
|
||||||
bytes: this.data.slice(
|
bytes: this.data.slice(
|
||||||
@@ -156,6 +174,7 @@ const app = createApp({
|
|||||||
),
|
),
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
console.log("end");
|
||||||
this.connection.send({
|
this.connection.send({
|
||||||
type: "end",
|
type: "end",
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user