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

Merge 880e8bd195 into 50539ed485

Browse source
This commit is contained in:
schlagmichdoch 2024-08-31 14:25:24 +02:00 • committed by GitHub
commit 70f4ea06c9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 111 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

55
public/scripts/ui.js
View file

@ -25,7 +25,7 @@ class PeersUI {
this.shareMode.text = "";
Events.on('peer-joined', e => this._onPeerJoined(e.detail.peer, e.detail.roomType, e.detail.roomId));
Events.on('peer-connected', e => this._onPeerConnected(e.detail.peerId, e.detail.connectionHash));
Events.on('peer-connected', e => this._onPeerConnected(e.detail.peerId, e.detail.connectionHash, e.detail.connectionType));
Events.on('peer-connecting', e => this._onPeerConnecting(e.detail));
Events.on('peer-disconnected', e => this._onPeerDisconnected(e.detail));
Events.on('peers', e => this._onPeers(e.detail));
@ -110,12 +110,12 @@ class PeersUI {
this.peerUIs[peer.id] = peerUI;
}
_onPeerConnected(peerId, connectionHash) {
_onPeerConnected(peerId, connectionHash, connectionType) {
const peerUI = this.peerUIs[peerId];
if (!peerUI) return;
peerUI._peerConnected(true, connectionHash);
peerUI._peerConnected(true, connectionHash, connectionType);
this._addPeerUIIfMissing(peerUI);
}
@ -462,7 +462,9 @@ class PeerUI {
this.$displayName.textContent = this._displayName();
this.$deviceName.textContent = this._deviceName();
this.updateTypesClassList();
this._updateRoomTypeClasses();
this._updateSameBrowserClass();
this._updateWsPeerClass();
this._evaluateShareMode();
this._bindListeners();
@ -473,14 +475,18 @@ class PeerUI {
}
html() {
let title= Localization.getTranslation("peer-ui.click-to-send");
const titleLabelTranslation= Localization.getTranslation("peer-ui.click-to-send");
const titleTurnTranslation= Localization.getTranslation("peer-ui.turn-indicator");
this.$el.innerHTML = `
<label class="column center pointer" title="${title}">
<label class="column center pointer" title="${titleLabelTranslation}">
<input type="file" multiple/>
<x-icon>
<div class="icon-wrapper" shadow="1">
<svg class="icon"><use xlink:href="#"/></svg>
<div class="turn-indicator-wrapper center" title="${titleTurnTranslation}">
<svg class="turn-indicator"><use xlink:href="#turn-indicator"/></svg>
</div>
</div>
<div class="highlight-wrapper center">
<div class="highlight highlight-room-ip" shadow="1"></div>
@ -500,30 +506,49 @@ class PeerUI {
</label>`;
}
updateTypesClassList() {
_updateRoomTypeClasses() {
// Remove all classes
this.$el.classList.remove('type-ip', 'type-secret', 'type-public-id', 'type-same-browser', 'ws-peer');
this.$el.classList.remove('type-ip', 'type-secret', 'type-public-id');
// Add classes accordingly
Object.keys(this._roomIds).forEach(roomType => this.$el.classList.add(`type-${roomType}`));
}
_updateSameBrowserClass() {
if (BrowserTabsConnector.peerIsSameBrowser(this._peer.id)) {
this.$el.classList.add(`type-same-browser`);
this.$el.classList.add('same-browser');
}
else {
this.$el.classList.remove('same-browser');
}
}
_updateWsPeerClass() {
if (!this._peer.rtcSupported || !window.isRtcSupported) {
this.$el.classList.add('ws-peer');
}
else {
this.$el.classList.remove('ws-peer');
}
}
_updateTurnClass() {
if (this._connectionType === "relay") {
this.$el.classList.add('turn');
}
else {
this.$el.classList.remove('turn');
}
}
_addRoomId(roomType, roomId) {
this._roomIds[roomType] = roomId;
this.updateTypesClassList();
this._updateRoomTypeClasses();
}
_removeRoomId(roomType) {
delete this._roomIds[roomType];
this.updateTypesClassList();
this._updateRoomTypeClasses();
}
_onShareModeChanged(active = false, descriptor = "") {
@ -599,7 +624,7 @@ class PeerUI {
});
}
_peerConnected(connected = true, connectionHash = "") {
_peerConnected(connected, connectionHash = "", connectionType = "") {
if (connected) {
this._connected = true;
@ -608,6 +633,11 @@ class PeerUI {
this._oldStatus = 'idle';
this._connectionHash = connectionHash;
this._connectionType = connectionType;
this._updateSameBrowserClass();
this._updateWsPeerClass();
this._updateTurnClass();
}
else {
this._connected = false;
@ -619,6 +649,7 @@ class PeerUI {
this.queueProgressStatus(null, "connect");
this._connectionHash = "";
this._connectionType = "";
}
}