mirror of
https://github.com/schlagmichdoch/PairDrop.git
synced 2025-04-20 15:06:15 -04:00
Show placeholder when paired device is removed to prevent removing multiple devices
This commit is contained in:
parent
b5535c7ace
commit
2a97a8e5d9
3 changed files with 16 additions and 17 deletions
|
@ -60,6 +60,7 @@
|
||||||
"cancel": "Cancel",
|
"cancel": "Cancel",
|
||||||
"edit-paired-devices-title": "Edit Paired Devices",
|
"edit-paired-devices-title": "Edit Paired Devices",
|
||||||
"unpair": "Unpair",
|
"unpair": "Unpair",
|
||||||
|
"paired-device-removed": "Paired device removed.",
|
||||||
"paired-devices-wrapper_data-empty": "No paired devices.",
|
"paired-devices-wrapper_data-empty": "No paired devices.",
|
||||||
"auto-accept-instructions-1": "Activate",
|
"auto-accept-instructions-1": "Activate",
|
||||||
"auto-accept": "auto-accept",
|
"auto-accept": "auto-accept",
|
||||||
|
|
|
@ -1545,6 +1545,7 @@ class EditPairedDevicesDialog extends Dialog {
|
||||||
}
|
}
|
||||||
|
|
||||||
async _initDOM() {
|
async _initDOM() {
|
||||||
|
const pairedDeviceRemovedString = Localization.getTranslation("dialogs.paired-device-removed");
|
||||||
const unpairString = Localization.getTranslation("dialogs.unpair").toUpperCase();
|
const unpairString = Localization.getTranslation("dialogs.unpair").toUpperCase();
|
||||||
const autoAcceptString = Localization.getTranslation("dialogs.auto-accept").toLowerCase();
|
const autoAcceptString = Localization.getTranslation("dialogs.auto-accept").toLowerCase();
|
||||||
const roomSecretsEntries = await PersistentStorage.getAllRoomSecretEntries();
|
const roomSecretsEntries = await PersistentStorage.getAllRoomSecretEntries();
|
||||||
|
@ -1553,6 +1554,7 @@ class EditPairedDevicesDialog extends Dialog {
|
||||||
.forEach(roomSecretsEntry => {
|
.forEach(roomSecretsEntry => {
|
||||||
let $pairedDevice = document.createElement('div');
|
let $pairedDevice = document.createElement('div');
|
||||||
$pairedDevice.classList.add("paired-device");
|
$pairedDevice.classList.add("paired-device");
|
||||||
|
$pairedDevice.setAttribute('placeholder', pairedDeviceRemovedString);
|
||||||
|
|
||||||
$pairedDevice.innerHTML = `
|
$pairedDevice.innerHTML = `
|
||||||
<div class="display-name">
|
<div class="display-name">
|
||||||
|
@ -1565,17 +1567,17 @@ class EditPairedDevicesDialog extends Dialog {
|
||||||
${roomSecretsEntry.device_name}
|
${roomSecretsEntry.device_name}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="button-wrapper">
|
<div class="button-wrapper row fw center wrap">
|
||||||
<div class="row center">
|
<div class="center grow">
|
||||||
<span class="p1">
|
<span class="center wrap">
|
||||||
${autoAcceptString}
|
${autoAcceptString}
|
||||||
</span>
|
</span>
|
||||||
<label class="auto-accept pointer switch">
|
<label class="auto-accept switch pointer m1">
|
||||||
<input type="checkbox" ${roomSecretsEntry.auto_accept ? "checked" : ""}>
|
<input type="checkbox" ${roomSecretsEntry.auto_accept ? "checked" : ""}>
|
||||||
<div class="slider round"></div>
|
<div class="slider round"></div>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<button class="btn" type="button">${unpairString}</button>
|
<button class="btn grow" type="button">${unpairString}</button>
|
||||||
</div>`
|
</div>`
|
||||||
|
|
||||||
$pairedDevice
|
$pairedDevice
|
||||||
|
@ -1599,11 +1601,10 @@ class EditPairedDevicesDialog extends Dialog {
|
||||||
.then(roomSecret => {
|
.then(roomSecret => {
|
||||||
Events.fire('room-secrets-deleted', [roomSecret]);
|
Events.fire('room-secrets-deleted', [roomSecret]);
|
||||||
Events.fire('evaluate-number-room-secrets');
|
Events.fire('evaluate-number-room-secrets');
|
||||||
e.target.parentNode.parentNode.remove();
|
$pairedDevice.innerText = "";
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
|
|
||||||
this.$pairedDevicesWrapper.html = "";
|
|
||||||
this.$pairedDevicesWrapper.appendChild($pairedDevice)
|
this.$pairedDevicesWrapper.appendChild($pairedDevice)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
|
@ -505,6 +505,10 @@ x-dialog hr {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.paired-device:empty {
|
||||||
|
padding: 47px;
|
||||||
|
}
|
||||||
|
|
||||||
.paired-device:not(:last-child) {
|
.paired-device:not(:last-child) {
|
||||||
border-bottom: solid 4px var(--paired-device-color);
|
border-bottom: solid 4px var(--paired-device-color);
|
||||||
}
|
}
|
||||||
|
@ -521,17 +525,10 @@ x-dialog hr {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.paired-device > .button-wrapper {
|
|
||||||
display: flex;
|
|
||||||
height: 36px;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.paired-device > .button-wrapper > * {
|
.paired-device > .button-wrapper > * {
|
||||||
width: 50%;
|
min-height: 38px;
|
||||||
padding-left: 6px;
|
padding-left: 5px;
|
||||||
padding-right: 6px;
|
padding-right: 5px;
|
||||||
height: 36px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.paired-device > .button-wrapper > :not(:last-child) {
|
.paired-device > .button-wrapper > :not(:last-child) {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue