Chapril/drop.chapril.org-firefoxsend
Chapril/drop.chapril.org-firefoxsend
25
1
Fork 0
Code Issues Releases Activity

Merge pull request #285 from mozilla/phases

Browse Source 
added messages for processing phases
This commit is contained in:
Danny Coates 2017-07-24 09:53:45 -07:00 committed by GitHub
commit 62989ee2c9
3 changed files with 99 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
frontend/src/download.js
View File

@ -46,7 +46,7 @@ $(document).ready(function() {
storage.referrer = 'errored-download'; storage.referrer = 'errored-download';
}); });
const filename = $('#dl-filename').html(); const filename = $('#dl-filename').text();
const bytelength = Number($('#dl-bytelength').text()); const bytelength = Number($('#dl-bytelength').text());
const timeToExpiry = Number($('#dl-ttl').text()); const timeToExpiry = Number($('#dl-ttl').text());
@ -83,31 +83,24 @@ $(document).ready(function() {
const percent = progress[0] / progress[1]; const percent = progress[0] / progress[1];
// update progress bar // update progress bar
$('#dl-progress').circleProgress('value', percent); $('#dl-progress').circleProgress('value', percent);
$('.percent-number').html(`${Math.floor(percent * 100)}`); $('.percent-number').text(`${Math.floor(percent * 100)}`);
$('.progress-text').text( $('.progress-text').text(
`${filename} (${bytes(progress[0], { `${filename} (${bytes(progress[0], {
decimalPlaces: 1, decimalPlaces: 1,
fixedDecimals: true fixedDecimals: true
})} of ${bytes(progress[1], { decimalPlaces: 1 })})` })} of ${bytes(progress[1], { decimalPlaces: 1 })})`
); );
//on complete
if (percent === 1) {
fileReceiver.removeAllListeners('progress');
document.l10n
.formatValues('downloadNotification', 'downloadFinish')
.then(translated => {
notify(translated[0]);
$('.title').html(translated[1]);
});
window.onunload = null;
}
}); });
let downloadEnd; let downloadEnd;
fileReceiver.on('decrypting', isStillDecrypting => { fileReceiver.on('decrypting', isStillDecrypting => {
// The file is being decrypted // The file is being decrypted
if (isStillDecrypting) { if (isStillDecrypting) {
console.log('Decrypting'); fileReceiver.removeAllListeners('progress');
window.onunload = null;
document.l10n.formatValue('decryptingFile').then(decryptingFile => {
$('.progress-text').text(decryptingFile);
});
} else { } else {
console.log('Done decrypting'); console.log('Done decrypting');
downloadEnd = Date.now(); downloadEnd = Date.now();
@ -117,9 +110,17 @@ $(document).ready(function() {
fileReceiver.on('hashing', isStillHashing => { fileReceiver.on('hashing', isStillHashing => {
// The file is being hashed to make sure a malicious user hasn't tampered with it // The file is being hashed to make sure a malicious user hasn't tampered with it
if (isStillHashing) { if (isStillHashing) {
console.log('Checking file integrity'); document.l10n.formatValue('verifyingFile').then(verifyingFile => {
$('.progress-text').text(verifyingFile);
});
} else { } else {
console.log('Integrity check done'); $('.progress-text').text(' ');
document.l10n
.formatValues('downloadNotification', 'downloadFinish')
.then(translated => {
notify(translated[0]);
$('.title').text(translated[1]);
});
} }
}); });

156
frontend/src/upload.js
View File

@ -77,7 +77,6 @@ $(document).ready(function() {
$copyBtn.attr('data-l10n-id', 'copyUrlFormButton'); $copyBtn.attr('data-l10n-id', 'copyUrlFormButton');
const files = storage.files; const files = storage.files;
console.log(files);
if (files.length === 0) { if (files.length === 0) {
toggleHeader(); toggleHeader();
} else { } else {
@ -134,7 +133,6 @@ $(document).ready(function() {
// on file upload by browse or drag & drop // on file upload by browse or drag & drop
function onUpload(event) { function onUpload(event) {
event.preventDefault(); event.preventDefault();
storage.totalUploads += 1; storage.totalUploads += 1;
let file = ''; let file = '';
@ -163,9 +161,11 @@ $(document).ready(function() {
$('#page-one').attr('hidden', true); $('#page-one').attr('hidden', true);
$('#upload-error').attr('hidden', true); $('#upload-error').attr('hidden', true);
$('#upload-progress').removeAttr('hidden'); $('#upload-progress').removeAttr('hidden');
document.l10n.formatValue('importingFile').then(importingFile => {
$('.progress-text').text(importingFile);
});
//don't allow drag and drop when not on page-one //don't allow drag and drop when not on page-one
$('body').off('drop', onUpload); $('body').off('drop', onUpload);
const expiration = 24 * 60 * 60 * 1000; //will eventually come from a field
const fileSender = new FileSender(file); const fileSender = new FileSender(file);
$('#cancel-upload').click(() => { $('#cancel-upload').click(() => {
@ -192,7 +192,7 @@ $(document).ready(function() {
// update progress bar // update progress bar
$('#ul-progress').circleProgress('value', percent); $('#ul-progress').circleProgress('value', percent);
$('#ul-progress').circleProgress().on('circle-animation-end', function() { $('#ul-progress').circleProgress().on('circle-animation-end', function() {
$('.percent-number').html(`${Math.floor(percent * 100)}`); $('.percent-number').text(`${Math.floor(percent * 100)}`);
}); });
$('.progress-text').text( $('.progress-text').text(
`${file.name} (${bytes(progress[0], { `${file.name} (${bytes(progress[0], {
@ -202,19 +202,12 @@ $(document).ready(function() {
); );
}); });
fileSender.on('loading', isStillLoading => {
// The file is loading into Firefox at this stage
if (isStillLoading) {
console.log('Processing');
} else {
console.log('Finished processing');
}
});
fileSender.on('hashing', isStillHashing => { fileSender.on('hashing', isStillHashing => {
// The file is being hashed // The file is being hashed
if (isStillHashing) { if (isStillHashing) {
console.log('Hashing'); document.l10n.formatValue('verifyingFile').then(verifyingFile => {
$('.progress-text').text(verifyingFile);
});
} else { } else {
console.log('Finished hashing'); console.log('Finished hashing');
} }
@ -224,7 +217,9 @@ $(document).ready(function() {
fileSender.on('encrypting', isStillEncrypting => { fileSender.on('encrypting', isStillEncrypting => {
// The file is being encrypted // The file is being encrypted
if (isStillEncrypting) { if (isStillEncrypting) {
console.log('Encrypting'); document.l10n.formatValue('encryptingFile').then(encryptingFile => {
$('.progress-text').text(encryptingFile);
});
} else { } else {
console.log('Finished encrypting'); console.log('Finished encrypting');
uploadStart = Date.now(); uploadStart = Date.now();
@ -245,76 +240,81 @@ $(document).ready(function() {
cd5: window.referrer cd5: window.referrer
}); });
fileSender // For large files we need to give the ui a tick to breathe and update
.upload() // before we kick off the FileSender
.then(info => { setTimeout(() => {
const endTime = Date.now(); fileSender
const totalTime = endTime - startTime; .upload()
const uploadTime = endTime - uploadStart; .then(info => {
const uploadSpeed = file.size / (uploadTime / 1000); const endTime = Date.now();
const totalTime = endTime - startTime;
const uploadTime = endTime - uploadStart;
const uploadSpeed = file.size / (uploadTime / 1000);
const expiration = 24 * 60 * 60 * 1000; //will eventually come from a field
// record upload-stopped (completed) by sender // record upload-stopped (completed) by sender
sendEvent('sender', 'upload-stopped', { sendEvent('sender', 'upload-stopped', {
cm1: file.size, cm1: file.size,
cm2: totalTime, cm2: totalTime,
cm3: uploadSpeed, cm3: uploadSpeed,
cm5: storage.totalUploads, cm5: storage.totalUploads,
cm6: unexpiredFiles, cm6: unexpiredFiles,
cm7: storage.totalDownloads, cm7: storage.totalDownloads,
cd1: event.type === 'drop' ? 'drop' : 'click', cd1: event.type === 'drop' ? 'drop' : 'click',
cd2: 'completed' cd2: 'completed'
}); });
const fileData = { const fileData = {
name: file.name, name: file.name,
size: file.size, size: file.size,
fileId: info.fileId, fileId: info.fileId,
url: info.url, url: info.url,
secretKey: info.secretKey, secretKey: info.secretKey,
deleteToken: info.deleteToken, deleteToken: info.deleteToken,
creationDate: new Date(), creationDate: new Date(),
expiry: expiration, expiry: expiration,
totalTime: totalTime, totalTime: totalTime,
typeOfUpload: event.type === 'drop' ? 'drop' : 'click', typeOfUpload: event.type === 'drop' ? 'drop' : 'click',
uploadSpeed: uploadSpeed uploadSpeed: uploadSpeed
}; };
storage.addFile(info.fileId, fileData); storage.addFile(info.fileId, fileData);
$('#upload-filename').attr( $('#upload-filename').attr(
'data-l10n-id', 'data-l10n-id',
'uploadSuccessConfirmHeader' 'uploadSuccessConfirmHeader'
); );
t = window.setTimeout(() => { t = window.setTimeout(() => {
$('#page-one').attr('hidden', true);
$('#upload-progress').attr('hidden', true);
$('#upload-error').attr('hidden', true);
$('#share-link').removeAttr('hidden');
}, 1000);
populateFileList(fileData);
document.l10n.formatValue('notifyUploadDone').then(str => {
notify(str);
});
})
.catch(err => {
Raven.captureException(err);
console.log(err);
$('#page-one').attr('hidden', true); $('#page-one').attr('hidden', true);
$('#upload-progress').attr('hidden', true); $('#upload-progress').attr('hidden', true);
$('#upload-error').attr('hidden', true); $('#upload-error').removeAttr('hidden');
$('#share-link').removeAttr('hidden'); window.clearTimeout(t);
}, 1000);
populateFileList(fileData); // record upload-stopped (errored) by sender
document.l10n.formatValue('notifyUploadDone').then(str => { sendEvent('sender', 'upload-stopped', {
notify(str); cm1: file.size,
cm5: storage.totalUploads,
cm6: unexpiredFiles,
cm7: storage.totalDownloads,
cd1: event.type === 'drop' ? 'drop' : 'click',
cd2: 'errored',
cd6: err
});
}); });
}) }, 10);
.catch(err => {
Raven.captureException(err);
console.log(err);
$('#page-one').attr('hidden', true);
$('#upload-progress').attr('hidden', true);
$('#upload-error').removeAttr('hidden');
window.clearTimeout(t);
// record upload-stopped (errored) by sender
sendEvent('sender', 'upload-stopped', {
cm1: file.size,
cm5: storage.totalUploads,
cm6: unexpiredFiles,
cm7: storage.totalDownloads,
cd1: event.type === 'drop' ? 'drop' : 'click',
cd2: 'errored',
cd6: err
});
});
} }
function allowDrop(ev) { function allowDrop(ev) {

4
public/locales/send.en-US.ftl
View File

@ -15,6 +15,10 @@ uploadPageMultipleFilesAlert = Uploading multiple files or a folder is currently
uploadPageBrowseButtonTitle = Upload file uploadPageBrowseButtonTitle = Upload file
uploadingPageHeader = Uploading Your File uploadingPageHeader = Uploading Your File
importingFile = Importing...
verifyingFile = Verifying...
encryptingFile = Encrypting...
decryptingFile = Decrypting...
notifyUploadDone = Your upload has finished. notifyUploadDone = Your upload has finished.