Fix drag and drop to upload PGP public key not working on Firefox and Chromium (but working on Safari) (#1658)
* Fix pgp file drag and drop only worked on Safari * Minor UI improvement of pgp public key text area * add dashed outline only during dragover event
This commit is contained in:
parent
2a014f0e4b
commit
1c65094da8
|
@ -8,7 +8,8 @@ function enableDragDropForPGPKeys(inputID) {
|
|||
let files = event.dataTransfer.files;
|
||||
for (let i = 0; i < files.length; i++) {
|
||||
let file = files[i];
|
||||
if(file.type !== 'text/plain'){
|
||||
const isValidPgpFile = file.type === 'text/plain' || file.name.endsWith('.asc') || file.name.endsWith('.pub') || file.name.endsWith('.pgp') || file.name.endsWith('.key');
|
||||
if (!isValidPgpFile) {
|
||||
toastr.warning(`File ${file.name} is not a public key file`);
|
||||
continue;
|
||||
}
|
||||
|
@ -16,6 +17,7 @@ function enableDragDropForPGPKeys(inputID) {
|
|||
reader.onloadend = onFileLoaded;
|
||||
reader.readAsBinaryString(file);
|
||||
}
|
||||
dropArea.classList.remove("dashed-outline");
|
||||
}
|
||||
|
||||
function onFileLoaded(event) {
|
||||
|
@ -24,5 +26,20 @@ function enableDragDropForPGPKeys(inputID) {
|
|||
}
|
||||
|
||||
const dropArea = $(inputID).get(0);
|
||||
dropArea.addEventListener("dragenter", (event) => {
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
dropArea.classList.add("dashed-outline");
|
||||
});
|
||||
dropArea.addEventListener("dragover", (event) => {
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
dropArea.classList.add("dashed-outline");
|
||||
});
|
||||
dropArea.addEventListener("dragleave", (event) => {
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
dropArea.classList.remove("dashed-outline");
|
||||
});
|
||||
dropArea.addEventListener("drop", drop, false);
|
||||
}
|
|
@ -218,3 +218,8 @@ textarea.parsley-error {
|
|||
.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* dashed outline to indicate droppable area */
|
||||
.dashed-outline {
|
||||
outline: 4px dashed gray;
|
||||
}
|
|
@ -43,7 +43,7 @@
|
|||
{% endif %}
|
||||
<div class="form-group">
|
||||
<label class="form-label">PGP Public Key</label>
|
||||
<textarea name="pgp" {% if not current_user.is_premium() %} disabled {% endif %} class="form-control" rows=10 id="pgp-public-key" placeholder="-----BEGIN PGP PUBLIC KEY BLOCK-----">{{ contact.pgp_public_key or "" }}</textarea>
|
||||
<textarea name="pgp" {% if not current_user.is_premium() %} disabled {% endif %} class="form-control" rows=10 id="pgp-public-key" placeholder="(Drag and drop or paste your pgp public key here) -----BEGIN PGP PUBLIC KEY BLOCK-----">{{ contact.pgp_public_key or "" }}</textarea>
|
||||
</div>
|
||||
<button class="btn btn-primary" name="action" {% if not current_user.is_premium() %}
|
||||
disabled {% endif %} value="save">
|
||||
|
|
|
@ -112,7 +112,7 @@
|
|||
{{ csrf_form.csrf_token }}
|
||||
<div class="form-group">
|
||||
<label class="form-label">PGP Public Key</label>
|
||||
<textarea name="pgp" {% if not current_user.is_premium() %} disabled {% endif %} class="form-control" rows=10 id="pgp-public-key" placeholder="-----BEGIN PGP PUBLIC KEY BLOCK-----">{{ mailbox.pgp_public_key or "" }}</textarea>
|
||||
<textarea name="pgp" {% if not current_user.is_premium() %} disabled {% endif %} class="form-control" rows=10 id="pgp-public-key" placeholder="(Drag and drop or paste your pgp public key here) -----BEGIN PGP PUBLIC KEY BLOCK-----">{{ mailbox.pgp_public_key or "" }}</textarea>
|
||||
</div>
|
||||
<input type="hidden" name="form-name" value="pgp">
|
||||
<button class="btn btn-primary" name="action" {% if not current_user.is_premium() %}
|
||||
|
|
Loading…
Reference in New Issue