mirrors/PairDrop
1
0
Fork 0
mirror of https://github.com/schlagmichdoch/PairDrop.git synced 2025-04-20 15:06:15 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix problem of multiple creation of PeerUI when peer has joined mutliple times without successfully creating a p2p connection

Browse source
This commit is contained in:
schlagmichdoch 2022-12-22 22:41:26 +01:00
parent 75846f4de1
commit e5a2c6326e
2 changed files with 26 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/scripts/network.js
View file

@ -311,7 +311,7 @@ class RTCPeer extends Peer {
_onChannelClosed() { _onChannelClosed() {
console.log('RTC: channel closed', this._peerId); console.log('RTC: channel closed', this._peerId);
Events.fire('peer-left', this._peerId); Events.fire('peer-disconnected', this._peerId);
if (!this._isCaller) return; if (!this._isCaller) return;
this._connect(this._peerId, true); // reopen the channel this._connect(this._peerId, true); // reopen the channel
} }

46
client/scripts/ui.js
View file

@ -18,14 +18,21 @@ class PeersUI {
constructor() { constructor() {
Events.on('peer-joined', e => this._onPeerJoined(e.detail)); Events.on('peer-joined', e => this._onPeerJoined(e.detail));
Events.on('peer-left', e => this._onPeerLeft(e.detail)); Events.on('peer-left', e => this._onPeerLeft(e.detail));
Events.on('peer-connected', e => this._onPeerConnected(e.detail));
Events.on('peer-disconnected', e => this._onPeerDisconnected(e.detail));
Events.on('peers', e => this._onPeers(e.detail)); Events.on('peers', e => this._onPeers(e.detail));
Events.on('file-progress', e => this._onFileProgress(e.detail)); Events.on('file-progress', e => this._onFileProgress(e.detail));
Events.on('paste', e => this._onPaste(e)); Events.on('paste', e => this._onPaste(e));
this.peers = {};
} }
_onPeerJoined(peer) { _onPeerJoined(peer) {
if ($(peer.id)) return; // peer already exists if (this.peers[peer.id]) return; // peer already exists
const peerUI = new PeerUI(peer); this.peers[peer.id] = peer;
}
_onPeerConnected(peerId) {
new PeerUI(this.peers[peerId]);
} }
_onPeers(peers) { _onPeers(peers) {
@ -33,12 +40,16 @@ class PeersUI {
peers.forEach(peer => this._onPeerJoined(peer)); peers.forEach(peer => this._onPeerJoined(peer));
} }
_onPeerLeft(peerId) { _onPeerDisconnected(peerId) {
const $peer = $(peerId); const $peer = $(peerId);
if (!$peer) return; if (!$peer) return;
$peer.remove(); $peer.remove();
} }
_onPeerLeft(peerId) {
delete this.peers[peerId];
}
_onFileProgress(progress) { _onFileProgress(progress) {
const peerId = progress.sender || progress.recipient; const peerId = progress.sender || progress.recipient;
const $peer = $(peerId); const $peer = $(peerId);
@ -48,6 +59,7 @@ class PeersUI {
_clearPeers() { _clearPeers() {
const $peers = $$('x-peers').innerHTML = ''; const $peers = $$('x-peers').innerHTML = '';
Object.keys(this.peers).forEach(key => delete this.peers[key]);
} }
_onPaste(e) { _onPaste(e) {
@ -89,18 +101,10 @@ class PeerUI {
constructor(peer) { constructor(peer) {
this._peer = peer; this._peer = peer;
this.callbackFunction = (e) => this._onPeerConnected(e.detail); this._initDom();
Events.on('peer-connected', this.callbackFunction); this._bindListeners(this.$el);
} $$('x-peers').appendChild(this.$el);
setTimeout(e => window.animateBackground(false), 1750); // Stop animation
_onPeerConnected(peerId) {
if (peerId === this._peer.id) {
Events.off('peer-connected', this.callbackFunction)
this._initDom();
this._bindListeners(this.$el);
$$('x-peers').appendChild(this.$el);
setTimeout(e => window.animateBackground(false), 1750); // Stop animation
}
} }
_initDom() { _initDom() {
@ -443,12 +447,12 @@ class Notifications {
} }
// Notification is persistent on Android. We have to close it manually // Notification is persistent on Android. We have to close it manually
const visibilitychangeHandler = () => { const visibilitychangeHandler = () => {
if (document.visibilityState === 'visible') { if (document.visibilityState === 'visible') {
notification.close(); notification.close();
Events.off('visibilitychange', visibilitychangeHandler); Events.off('visibilitychange', visibilitychangeHandler);
} }
}; };
Events.on('visibilitychange', visibilitychangeHandler); Events.on('visibilitychange', visibilitychangeHandler);
return notification; return notification;
@ -500,8 +504,8 @@ class Notifications {
class NetworkStatusUI { class NetworkStatusUI {
constructor() { constructor() {
window.addEventListener('offline', e => this._showOfflineMessage(), false); Events.on('offline', e => this._showOfflineMessage());
window.addEventListener('online', e => this._showOnlineMessage(), false); Events.on('online', e => this._showOnlineMessage());
if (!navigator.onLine) this._showOfflineMessage(); if (!navigator.onLine) this._showOfflineMessage();
} }