dylan.derr/Send
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

finished metrics

Browse source
This commit is contained in:
Abhinav Adduri 2017-07-20 15:16:00 -07:00
parent 76a6f02eb7
commit 99477774cf
9 changed files with 542 additions and 173 deletions
Download patch file Download diff file Expand all files Collapse all files

125
frontend/src/download.js
View file

@ -1,20 +1,53 @@
const FileReceiver = require('./fileReceiver');
const { notify } = require('./utils');
const { notify, findMetric } = require('./utils');
const $ = require('jquery');
require('jquery-circle-progress');
const Raven = window.Raven;
if (!localStorage.hasOwnProperty('totalDownloads')) {
localStorage.setItem('totalDownloads', 0);
}
$(document).ready(function() {
//link back to homepage
$('.send-new').attr('href', window.location.origin);
$('.send-new').click(function() {
window.analytics
.sendEvent('recipient', 'restarted', {
cd2: 'completed'
});
})
if (location.pathname.toString().includes('download')) {
$('.send-new').click(function(target) {
target.preventDefault();
window.analytics
.sendEvent('recipient', 'restarted', {
cd2: 'completed'
})
.then(() => {
location.href = target.currentTarget.href;
});
})
$('.legal-links a, .social-links a, #dl-firefox').click(function(target) {
target.preventDefault();
let metric = findMetric(target.currentTarget.href);
// record exited event by recipient
window.analytics
.sendEvent('recipient', 'exited', {
cd3: metric
})
.then(() => {
location.href = target.currentTarget.href;
});
})
$('#expired-send-new').click(function() {
localStorage.setItem('referrer', 'errored-download');
})
}
const filename = $('#dl-filename').html();
const bytelength = $('#dl-bytelength').html();
const timeToExpiry = $('#dl-ttl').html();
//initiate progress bar
$('#dl-progress').circleProgress({
@ -26,9 +59,41 @@ $(document).ready(function() {
});
$('#download-btn').click(download);
function download() {
let totalDownloads = localStorage.getItem('totalDownloads');
localStorage.setItem('totalDownloads', Number(totalDownloads) + 1);
const fileReceiver = new FileReceiver();
let unexpiredFiles = 0;
for (let i = 0; i < localStorage.length; i++) {
const id = localStorage.key(i);
if (id != 'totalUploads' &&
id != 'totalDownloads' &&
id != 'referrer') {
unexpiredFiles += 1;
}
}
let totalUploads = 0;
if (localStorage.hasOwnProperty('totalUploads')) {
totalUploads = localStorage.getItem('totalUploads');
}
fileReceiver.on('progress', progress => {
window.onunload = function() {
localStorage.setItem('referrer', 'cancelled-download');
// record download-stopped (cancelled by tab close or reload)
window.analytics
.sendEvent('recipient', 'download-stopped', {
cm1: bytelength,
cm5: totalUploads,
cm6: unexpiredFiles,
cm7: localStorage.getItem('totalDownloads'),
cd2: 'cancelled'
})
}
$('#download-page-one').attr('hidden', true);
$('#download-progress').removeAttr('hidden');
const percent = progress[0] / progress[1];
@ -57,15 +122,18 @@ $(document).ready(function() {
notify(translated[0]);
$('.title').html(translated[1]);
});
window.onunload = null;
}
});
let downloadEnd;
fileReceiver.on('decrypting', isStillDecrypting => {
// The file is being decrypted
if (isStillDecrypting) {
console.log('Decrypting');
} else {
console.log('Done decrypting');
downloadEnd = new Date().getTime();
}
});
@ -78,9 +146,32 @@ $(document).ready(function() {
}
});
const startTime = new Date().getTime();
// record download-started by recipient
window.analytics
.sendEvent('recipient', 'download-started', {
cm1: bytelength,
cm4: timeToExpiry,
cm5: totalUploads,
cm6: unexpiredFiles,
cm7: localStorage.getItem('totalDownloads')
});
fileReceiver
.download()
.catch(() => {
.catch(err => {
// record download-stopped (errored) by recipient
window.analytics
.sendEvent('recipient', 'download-stopped', {
cm1: bytelength,
cm5: totalUploads,
cm6: unexpiredFiles,
cm7: localStorage.getItem('totalDownloads'),
cd2: 'errored',
cd6: err
});
document.l10n.formatValue('expiredPageHeader')
.then(translated => {
$('.title').text(translated);
@ -91,6 +182,24 @@ $(document).ready(function() {
return;
})
.then(([decrypted, fname]) => {
const endTime = new Date().getTime();
const totalTime = endTime - startTime;
const downloadTime = endTime - downloadEnd;
const downloadSpeed = bytelength / (downloadTime / 1000);
localStorage.setItem('referrer', 'completed-download');
// record download-stopped (completed) by recipient
window.analytics
.sendEvent('recipient', 'download-stopped', {
cm1: bytelength,
cm2: totalTime,
cm3: downloadSpeed,
cm5: totalUploads,
cm6: unexpiredFiles,
cm7: localStorage.getItem('totalDownloads'),
cd2: 'completed'
});
const dataView = new DataView(decrypted);
const blob = new Blob([dataView]);
const downloadUrl = URL.createObjectURL(blob);

338
frontend/src/upload.js
View file

@ -1,98 +1,142 @@
const FileSender = require('./fileSender');
const { notify, gcmCompliant } = require('./utils');
const { notify, gcmCompliant, findMetric } = require('./utils');
const $ = require('jquery');
require('jquery-circle-progress');
const Raven = window.Raven;
if (!localStorage.hasOwnProperty('totalUploads')) {
localStorage.setItem('totalUploads', 0);
}
if (localStorage.hasOwnProperty('referrer')) {
window.referrer = localStorage.getItem('referrer');
localStorage.removeItem('referrer');
} else {
window.referrer = 'external';
}
$(document).ready(function() {
gcmCompliant()
.catch(err => {
$('#page-one').attr('hidden', true);
$('#unsupported-browser').removeAttr('hidden');
if (!location.pathname.toString().includes('download')) {
gcmCompliant()
.catch(err => {
$('#page-one').attr('hidden', true);
$('#unsupported-browser').removeAttr('hidden');
// record unsupported event
window.analytics
.sendEvent('sender', 'unsupported', {
cd6: err
});
});
$('#file-upload').change(onUpload);
$('.legal-links a, .social-links a, #dl-firefox').click(function(target) {
target.preventDefault();
let metric = findMetric(target.currentTarget.href);
// record exited event by recipient
window.analytics
.sendEvent('sender', 'unsupported', {
cd7: err
.sendEvent('sender', 'exited', {
cd3: metric
})
.then(() => {
location.href = target.currentTarget.href;
});
});
})
$('#file-upload').change(onUpload);
$('#send-new-completed').click(function(target) {
target.preventDefault();
// record restarted event
window.analytics
.sendEvent('sender', 'restarted', {
cd2: 'completed'
})
.then(() => {
localStorage.setItem('referrer', 'completed-upload');
location.href = target.currentTarget.href;
});
})
$('#send-new-completed').click(function() {
window.analytics
.sendEvent('sender', 'restarted', {
cd2: 'completed'
});
})
$('#send-new-error').click(function(target) {
target.preventDefault();
// record restarted event
window.analytics
.sendEvent('sender', 'restarted', {
cd2: 'errored'
})
.then(() => {
localStorage.setItem('referrer', 'errored-upload');
location.href = target.currentTarget.href;
});
})
$('#send-new-error').click(function() {
window.analytics
.sendEvent('sender', 'restarted', {
cd2: 'errored'
});
})
$('body').on('dragover', allowDrop).on('drop', onUpload);
// reset copy button
const $copyBtn = $('#copy-btn');
$copyBtn.attr('disabled', false);
$('#link').attr('disabled', false);
$copyBtn.attr('data-l10n-id', 'copyUrlFormButton');
$('body').on('dragover', allowDrop).on('drop', onUpload);
// reset copy button
const $copyBtn = $('#copy-btn');
$copyBtn.attr('disabled', false);
$('#link').attr('disabled', false);
$copyBtn.attr('data-l10n-id', 'copyUrlFormButton');
if (localStorage.length === 0) {
toggleHeader();
} else {
for (let i = 0; i < localStorage.length; i++) {
const id = localStorage.key(i);
//check if file exists before adding to list
checkExistence(id, true);
if (localStorage.length === 0) {
toggleHeader();
} else {
for (let i = 0; i < localStorage.length; i++) {
const id = localStorage.key(i);
//check if file exists before adding to list
checkExistence(id, true);
}
}
// copy link to clipboard
$copyBtn.click(() => {
// record copied event from success screen
window.analytics
.sendEvent('sender', 'copied', {
cd4: 'success-screen'
});
const aux = document.createElement('input');
aux.setAttribute('value', $('#link').attr('value'));
document.body.appendChild(aux);
aux.select();
document.execCommand('copy');
document.body.removeChild(aux);
//disable button for 3s
$copyBtn.attr('disabled', true);
$('#link').attr('disabled', true);
$copyBtn.html('<img src="/resources/check-16.svg" class="icon-check"></img>');
window.setTimeout(() => {
$copyBtn.attr('disabled', false);
$('#link').attr('disabled', false);
$copyBtn.attr('data-l10n-id', 'copyUrlFormButton');
}, 3000);
});
$('.upload-window').on('dragover', () => {
$('.upload-window').addClass('ondrag');
});
$('.upload-window').on('dragleave', () => {
$('.upload-window').removeClass('ondrag');
});
//initiate progress bar
$('#ul-progress').circleProgress({
value: 0.0,
startAngle: -Math.PI / 2,
fill: '#3B9DFF',
size: 158,
animation: { duration: 300 }
});
}
// copy link to clipboard
$copyBtn.click(() => {
window.analytics
.sendEvent('sender', 'copied', {
cd6: 'success-screen'
});
const aux = document.createElement('input');
aux.setAttribute('value', $('#link').attr('value'));
document.body.appendChild(aux);
aux.select();
document.execCommand('copy');
document.body.removeChild(aux);
//disable button for 3s
$copyBtn.attr('disabled', true);
$('#link').attr('disabled', true);
$copyBtn.html('<img src="/resources/check-16.svg" class="icon-check"></img>');
window.setTimeout(() => {
$copyBtn.attr('disabled', false);
$('#link').attr('disabled', false);
$copyBtn.attr('data-l10n-id', 'copyUrlFormButton');
}, 3000);
});
$('.upload-window').on('dragover', () => {
$('.upload-window').addClass('ondrag');
});
$('.upload-window').on('dragleave', () => {
$('.upload-window').removeClass('ondrag');
});
//initiate progress bar
$('#ul-progress').circleProgress({
value: 0.0,
startAngle: -Math.PI / 2,
fill: '#3B9DFF',
size: 158,
animation: { duration: 300 }
});
//link back to homepage
$('.send-new').attr('href', window.location);
// on file upload by browse or drag & drop
function onUpload(event) {
event.preventDefault();
let totalUploads = localStorage.getItem('totalUploads');
localStorage.setItem('totalUploads', Number(totalUploads) + 1);
let file = '';
if (event.type === 'drop') {
if (event.originalEvent.dataTransfer.files.length > 1 || event.originalEvent.dataTransfer.files[0].size === 0){
@ -123,6 +167,18 @@ $(document).ready(function() {
.then(str => {
notify(str);
});
localStorage.setItem('referrer', 'cancelled-upload');
// record upload-stopped (cancelled) by sender
window.analytics
.sendEvent('sender', 'upload-stopped', {
cm1: file.size,
cm5: localStorage.getItem('totalUploads'),
cm6: unexpiredFiles,
cm7: totalDownloads,
cd1: event.type === 'drop' ? 'drop' : 'click',
cd2: 'cancelled'
});
});
fileSender.on('progress', progress => {
@ -165,27 +221,82 @@ $(document).ready(function() {
}
});
let uploadStart;
fileSender.on('encrypting', isStillEncrypting => {
// The file is being encrypted
if (isStillEncrypting) {
console.log('Encrypting');
} else {
console.log('Finished encrypting');
uploadStart = new Date().getTime();
}
});
let t = '';
let t;
const startTime = new Date().getTime();
let unexpiredFiles = 0;
for (let i = 0; i < localStorage.length; i++) {
const id = localStorage.key(i);
if (id != 'totalUploads' &&
id != 'totalDownloads' &&
id != 'referrer') {
unexpiredFiles += 1;
}
}
let totalDownloads = 0;
if (localStorage.hasOwnProperty('totalDownloads')) {
totalDownloads = localStorage.getItem('totalDownloads');
}
// record upload-started event by sender
window.analytics
.sendEvent('sender', 'upload-started', {
cm1: file.size,
cm5: localStorage.getItem('totalUploads'),
cm6: unexpiredFiles,
cm7: totalDownloads,
cd1: event.type === 'drop' ? 'drop' : 'click',
cd5: window.referrer
});
fileSender
.upload()
.then(info => {
const endTime = new Date().getTime();
const totalTime = endTime - startTime;
const uploadTime = endTime - uploadStart;
const uploadSpeed = file.size / (uploadTime / 1000);
// record upload-stopped (completed) by sender
window.analytics
.sendEvent('sender', 'upload-stopped', {
cm1: file.size,
cm2: totalTime,
cm3: uploadSpeed,
cm5: localStorage.getItem('totalUploads'),
cm6: unexpiredFiles,
cm7: totalDownloads,
cd1: event.type === 'drop' ? 'drop' : 'click',
cd2: 'completed'
});
const fileData = {
name: file.name,
size: file.size,
fileId: info.fileId,
url: info.url,
secretKey: info.secretKey,
deleteToken: info.deleteToken,
creationDate: new Date(),
expiry: expiration
expiry: expiration,
totalTime: totalTime,
typeOfUpload: event.type === 'drop' ? 'drop' : 'click',
uploadSpeed: uploadSpeed
};
localStorage.setItem(info.fileId, JSON.stringify(fileData));
$('#upload-filename').attr('data-l10n-id', 'uploadSuccessConfirmHeader');
t = window.setTimeout(() => {
@ -208,6 +319,18 @@ $(document).ready(function() {
$('#upload-progress').attr('hidden', true);
$('#upload-error').removeAttr('hidden');
window.clearTimeout(t);
// record upload-stopped (errored) by sender
window.analytics
.sendEvent('sender', 'upload-stopped', {
cm1: file.size,
cm5: localStorage.getItem('totalUploads'),
cm6: unexpiredFiles,
cm7: totalDownloads,
cd1: event.type === 'drop' ? 'drop' : 'click',
cd2: 'errored',
cd6: err
});
});
}
@ -224,7 +347,11 @@ $(document).ready(function() {
populateFileList(localStorage.getItem(id));
}
} else if (xhr.status === 404) {
localStorage.removeItem(id);
if (id != 'totalUploads' &&
id != 'totalDownloads' &&
id != 'referrer') {
localStorage.removeItem(id);
}
}
}
};
@ -282,9 +409,10 @@ $(document).ready(function() {
//copy link to clipboard when icon clicked
$copyIcon.click(function() {
// record copied event from upload list
window.analytics
.sendEvent('sender', 'copied', {
cd6: 'upload-list'
cd4: 'upload-list'
});
const aux = document.createElement('input');
aux.setAttribute('value', url);
@ -362,7 +490,6 @@ $(document).ready(function() {
popupNvmSpan
]);
// add data cells to table row
row.appendChild(name);
$(link).append($copyIcon);
@ -374,18 +501,67 @@ $(document).ready(function() {
row.appendChild(del);
$('tbody').append(row); //add row to table
let unexpiredFiles = 0;
for (let i = 0; i < localStorage.length; i++) {
const id = localStorage.key(i);
if (id != 'totalUploads' &&
id != 'totalDownloads' &&
id != 'referrer') {
unexpiredFiles += 1;
}
}
let totalDownloads = 0;
if (localStorage.hasOwnProperty('totalDownloads')) {
totalDownloads = localStorage.getItem('totalDownloads');
}
// delete file
$popupText.find('.del-file').click(e => {
FileSender.delete(file.fileId, file.deleteToken).then(() => {
$(e.target).parents('tr').remove();
localStorage.removeItem(file.fileId);
const timeToExpiry = 86400000 - (new Date().getTime() - file.creationDate.getTime());
// record upload-deleted from file list
window.analytics
.sendEvent('sender', 'upload-deleted', {
cm1: file.size,
cm2: file.totalTime,
cm3: file.uploadSpeed,
cm4: timeToExpiry,
cm5: localStorage.getItem('totalUploads'),
cm6: unexpiredFiles,
cm7: totalDownloads,
cd1: file.typeOfUpload,
cd4: 'upload-list'
})
.then(() => {
localStorage.removeItem(file.fileId);
})
toggleHeader();
});
});
document.getElementById('delete-file').onclick = () => {
FileSender.delete(file.fileId, file.deleteToken).then(() => {
localStorage.removeItem(file.fileId);
location.reload();
const timeToExpiry = 86400000 - (new Date().getTime() - file.creationDate.getTime());
// record upload-deleted from success screen
window.analytics
.sendEvent('sender', 'upload-deleted', {
cm1: file.size,
cm2: file.totalTime,
cm3: file.uploadSpeed,
cm4: timeToExpiry,
cm5: localStorage.getItem('totalUploads'),
cm6: unexpiredFiles,
cm7: totalDownloads,
cd1: file.typeOfUpload,
cd4: 'success-screen'
})
.then(() => {
localStorage.removeItem(file.fileId);
location.reload();
})
});
};
// show popup

28
frontend/src/utils.js
View file

@ -69,9 +69,35 @@ function gcmCompliant() {
}
}
function findMetric(href) {
switch(href) {
case 'https://www.mozilla.org/':
return 'mozilla';
case 'https://www.mozilla.org/about/legal':
return 'legal';
case 'https://testpilot.firefox.com/about':
return 'about';
case 'https://testpilot.firefox.com/privacy':
return 'privacy';
case 'https://testpilot.firefox.com/terms':
return 'terms';
case 'https://www.mozilla.org/en-US/privacy/websites/#cookies':
return 'cookies';
case 'https://github.com/mozilla/send':
return 'github';
case 'https://twitter.com/FxTestPilot':
return 'twitter';
case 'https://www.mozilla.org/firefox/new/?scene=2':
return 'download-firefox';
default:
return 'other';
}
}
module.exports = {
arrayToHex,
hexToArray,
notify,
gcmCompliant
gcmCompliant,
findMetric
};