fixes #76. 'File received' dialog not showing on iOS when big videos are sent.

This commit is contained in:
schlagmichdoch 2023-03-13 00:04:48 +01:00
parent 1093f4d246
commit 028752a809
2 changed files with 90 additions and 54 deletions

View file

@ -632,26 +632,34 @@ class ReceiveFileDialog extends ReceiveDialog {
createPreviewElement(file) { createPreviewElement(file) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
let mime = file.type.split('/')[0] try {
let previewElement = { let mime = file.type.split('/')[0]
image: 'img', let previewElement = {
audio: 'audio', image: 'img',
video: 'video' audio: 'audio',
} video: 'video'
}
if (Object.keys(previewElement).indexOf(mime) === -1) { if (Object.keys(previewElement).indexOf(mime) === -1) {
resolve(false); resolve(false);
} else { } else {
console.log('the file is able to preview'); let element = document.createElement(previewElement[mime]);
let element = document.createElement(previewElement[mime]); element.controls = true;
element.src = URL.createObjectURL(file); element.onload = _ => {
element.controls = true; this.$previewBox.appendChild(element);
element.onload = _ => { resolve(true);
this.$previewBox.appendChild(element); };
resolve(true) element.onloadeddata = _ => {
}; this.$previewBox.appendChild(element);
element.addEventListener('loadeddata', _ => resolve(true)); resolve(true);
element.onerror = _ => reject(`${mime} preview could not be loaded from type ${file.type}`); };
element.onerror = _ => {
reject(`${mime} preview could not be loaded from type ${file.type}`);
};
element.src = URL.createObjectURL(file);
}
} catch (e) {
reject(`preview could not be loaded from type ${file.type}`);
} }
}); });
} }
@ -734,20 +742,30 @@ class ReceiveFileDialog extends ReceiveDialog {
setTimeout(_ => this.$downloadBtn.style.pointerEvents = "unset", 2000); setTimeout(_ => this.$downloadBtn.style.pointerEvents = "unset", 2000);
}; };
this.createPreviewElement(files[0]).finally(_ => { document.title = files.length === 1
document.title = files.length === 1 ? 'File received - PairDrop'
? 'File received - PairDrop' : `${files.length} Files received - PairDrop`;
: `${files.length} Files received - PairDrop`; document.changeFavicon("images/favicon-96x96-notification.png");
document.changeFavicon("images/favicon-96x96-notification.png"); Events.fire('set-progress', {peerId: peerId, progress: 1, status: 'process'})
Events.fire('set-progress', {peerId: peerId, progress: 1, status: 'process'}) this.show();
this.show();
setTimeout(_ => {
if (canShare) { if (canShare) {
this.$shareBtn.click(); this.$shareBtn.click();
} else { } else {
this.$downloadBtn.click(); this.$downloadBtn.click();
} }
}).catch(r => console.error(r)); }, 500);
this.createPreviewElement(files[0])
.then(canPreview => {
if (canPreview) {
console.log('the file is able to preview');
} else {
console.log('the file is not able to preview');
}
})
.catch(r => console.error(r));
} }
_downloadFilesIndividually(files) { _downloadFilesIndividually(files) {

View file

@ -633,26 +633,34 @@ class ReceiveFileDialog extends ReceiveDialog {
createPreviewElement(file) { createPreviewElement(file) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
let mime = file.type.split('/')[0] try {
let previewElement = { let mime = file.type.split('/')[0]
image: 'img', let previewElement = {
audio: 'audio', image: 'img',
video: 'video' audio: 'audio',
} video: 'video'
}
if (Object.keys(previewElement).indexOf(mime) === -1) { if (Object.keys(previewElement).indexOf(mime) === -1) {
resolve(false); resolve(false);
} else { } else {
console.log('the file is able to preview'); let element = document.createElement(previewElement[mime]);
let element = document.createElement(previewElement[mime]); element.controls = true;
element.src = URL.createObjectURL(file); element.onload = _ => {
element.controls = true; this.$previewBox.appendChild(element);
element.onload = _ => { resolve(true);
this.$previewBox.appendChild(element); };
resolve(true) element.onloadeddata = _ => {
}; this.$previewBox.appendChild(element);
element.addEventListener('loadeddata', _ => resolve(true)); resolve(true);
element.onerror = _ => reject(`${mime} preview could not be loaded from type ${file.type}`); };
element.onerror = _ => {
reject(`${mime} preview could not be loaded from type ${file.type}`);
};
element.src = URL.createObjectURL(file);
}
} catch (e) {
reject(`preview could not be loaded from type ${file.type}`);
} }
}); });
} }
@ -735,20 +743,30 @@ class ReceiveFileDialog extends ReceiveDialog {
setTimeout(_ => this.$downloadBtn.style.pointerEvents = "unset", 2000); setTimeout(_ => this.$downloadBtn.style.pointerEvents = "unset", 2000);
}; };
this.createPreviewElement(files[0]).finally(_ => { document.title = files.length === 1
document.title = files.length === 1 ? 'File received - PairDrop'
? 'File received - PairDrop' : `${files.length} Files received - PairDrop`;
: `${files.length} Files received - PairDrop`; document.changeFavicon("images/favicon-96x96-notification.png");
document.changeFavicon("images/favicon-96x96-notification.png"); Events.fire('set-progress', {peerId: peerId, progress: 1, status: 'process'})
Events.fire('set-progress', {peerId: peerId, progress: 1, status: 'process'}) this.show();
this.show();
setTimeout(_ => {
if (canShare) { if (canShare) {
this.$shareBtn.click(); this.$shareBtn.click();
} else { } else {
this.$downloadBtn.click(); this.$downloadBtn.click();
} }
}).catch(r => console.error(r)); }, 500);
this.createPreviewElement(files[0])
.then(canPreview => {
if (canPreview) {
console.log('the file is able to preview');
} else {
console.log('the file is not able to preview');
}
})
.catch(r => console.error(r));
} }
_downloadFilesIndividually(files) { _downloadFilesIndividually(files) {