Added multiple download option

app/fileManager.js

@@ -97,6 +97,13 @@ export default function(state, emitter) {
     lastRender = Date.now();
   });
 
+  emitter.on('changeLimit', async ({ file, value }) => {
+    await FileSender.changeLimit(file.id, file.ownerToken, value);
+    file.dlimit = value;
+    state.storage.writeFiles();
+    metrics.changedDownloadLimit(file);
+  });
+
   emitter.on('delete', async ({ file, location }) => {
     try {
       metrics.deletedUpload({
@@ -108,7 +115,7 @@ export default function(state, emitter) {
         location
       });
       state.storage.remove(file.id);
-      await FileSender.delete(file.id, file.deleteToken);
+      await FileSender.delete(file.id, file.ownerToken);
     } catch (e) {
       state.raven.captureException(e);
     }

app/fileReceiver.js

@@ -116,7 +116,8 @@ export default class FileReceiver extends Nanobus {
     // TODO
   }
 
-  fetchMetadata(sig) {
+  async fetchMetadata(nonce) {
+    const authHeader = await this.getAuthHeader(nonce);
     return new Promise((resolve, reject) => {
       const xhr = new XMLHttpRequest();
       xhr.onreadystatechange = () => {
@@ -132,24 +133,24 @@ export default class FileReceiver extends Nanobus {
       xhr.onerror = () => reject(new Error(0));
       xhr.ontimeout = () => reject(new Error(0));
       xhr.open('get', `/api/metadata/${this.file.id}`);
-      xhr.setRequestHeader('Authorization', `send-v1 ${arrayToB64(sig)}`);
+      xhr.setRequestHeader('Authorization', authHeader);
       xhr.responseType = 'json';
       xhr.timeout = 2000;
       xhr.send();
     });
   }
 
   async getMetadata(nonce) {
+    let data = null;
     try {
-      const authKey = await this.authKeyPromise;
-      const sig = await window.crypto.subtle.sign(
-        {
-          name: 'HMAC'
-        },
-        authKey,
-        b64ToArray(nonce)
-      );
-      const data = await this.fetchMetadata(new Uint8Array(sig));
+      try {
+        data = await this.fetchMetadata(nonce);
+      } catch (e) {
+        if (e.message === '401') {
+          // allow one retry for changed nonce
+          data = await this.fetchMetadata(e.nonce);
+        }
+      }
       const metaKey = await this.metaKeyPromise;
       const json = await window.crypto.subtle.decrypt(
         {
@@ -174,7 +175,8 @@ export default class FileReceiver extends Nanobus {
     }
   }
 
-  downloadFile(sig) {
+  async downloadFile(nonce) {
+    const authHeader = await this.getAuthHeader(nonce);
     return new Promise((resolve, reject) => {
       const xhr = new XMLHttpRequest();
 
@@ -190,9 +192,10 @@ export default class FileReceiver extends Nanobus {
           reject(new Error('notfound'));
           return;
         }
-
         if (xhr.status !== 200) {
-          return reject(new Error(xhr.status));
+          const err = new Error(xhr.status);
+          err.nonce = xhr.getResponseHeader('WWW-Authenticate').split(' ')[1];
+          return reject(err);
         }
 
         const blob = new Blob([xhr.response]);
@@ -205,26 +208,37 @@ export default class FileReceiver extends Nanobus {
       };
 
       xhr.open('get', this.url);
-      xhr.setRequestHeader('Authorization', `send-v1 ${arrayToB64(sig)}`);
+      xhr.setRequestHeader('Authorization', authHeader);
       xhr.responseType = 'blob';
       xhr.send();
     });
   }
 
+  async getAuthHeader(nonce) {
+    const authKey = await this.authKeyPromise;
+    const sig = await window.crypto.subtle.sign(
+      {
+        name: 'HMAC'
+      },
+      authKey,
+      b64ToArray(nonce)
+    );
+    return `send-v1 ${arrayToB64(new Uint8Array(sig))}`;
+  }
+
   async download(nonce) {
     this.state = 'downloading';
     this.emit('progress', this.progress);
     try {
       const encryptKey = await this.encryptKeyPromise;
-      const authKey = await this.authKeyPromise;
-      const sig = await window.crypto.subtle.sign(
-        {
-          name: 'HMAC'
-        },
-        authKey,
-        b64ToArray(nonce)
-      );
-      const ciphertext = await this.downloadFile(new Uint8Array(sig));
+      let ciphertext = null;
+      try {
+        ciphertext = await this.downloadFile(nonce);
+      } catch (e) {
+        if (e.message === '401') {
+          ciphertext = await this.downloadFile(e.nonce);
+        }
+      }
       this.msg = 'decryptingFile';
       this.emit('decrypting');
       const plaintext = await window.crypto.subtle.decrypt(

app/fileSender.js

@@ -35,7 +35,26 @@ export default class FileSender extends Nanobus {
         }
       };
 
-      xhr.send(JSON.stringify({ delete_token: token }));
+      xhr.send(JSON.stringify({ owner_token: token }));
+    });
+  }
+
+  static changeLimit(id, owner_token, dlimit) {
+    return new Promise((resolve, reject) => {
+      if (!id || !owner_token) {
+        return reject();
+      }
+      const xhr = new XMLHttpRequest();
+      xhr.open('POST', `/api/params/${id}`);
+      xhr.setRequestHeader('Content-Type', 'application/json');
+
+      xhr.onreadystatechange = () => {
+        if (xhr.readyState === XMLHttpRequest.DONE) {
+          resolve();
+        }
+      };
+
+      xhr.send(JSON.stringify({ owner_token, dlimit }));
     });
   }
 
@@ -100,7 +119,7 @@ export default class FileSender extends Nanobus {
               url: responseObj.url,
               id: responseObj.id,
               secretKey: arrayToB64(this.rawSecret),
-              deleteToken: responseObj.delete,
+              ownerToken: responseObj.owner,
               nonce
             });
           }
@@ -205,6 +224,17 @@ export default class FileSender extends Nanobus {
     return this.uploadFile(encrypted, metadata, new Uint8Array(rawAuth));
   }
 
+  async getAuthHeader(authKey, nonce) {
+    const sig = await window.crypto.subtle.sign(
+      {
+        name: 'HMAC'
+      },
+      authKey,
+      b64ToArray(nonce)
+    );
+    return `send-v1 ${arrayToB64(new Uint8Array(sig))}`;
+  }
+
   static async setPassword(password, file) {
     const encoder = new TextEncoder();
     const secretKey = await window.crypto.subtle.importKey(
@@ -229,13 +259,7 @@ export default class FileSender extends Nanobus {
       true,
       ['sign']
     );
-    const sig = await window.crypto.subtle.sign(
-      {
-        name: 'HMAC'
-      },
-      authKey,
-      b64ToArray(file.nonce)
-    );
+    const authHeader = await this.getAuthHeader(authKey, file.nonce);
     const pwdKey = await window.crypto.subtle.importKey(
       'raw',
       encoder.encode(password),
@@ -278,10 +302,7 @@ export default class FileSender extends Nanobus {
       xhr.onerror = () => reject(new Error(0));
       xhr.ontimeout = () => reject(new Error(0));
       xhr.open('post', `/api/password/${file.id}`);
-      xhr.setRequestHeader(
-        'Authorization',
-        `send-v1 ${arrayToB64(new Uint8Array(sig))}`
-      );
+      xhr.setRequestHeader('Authorization', authHeader);
       xhr.setRequestHeader('Content-Type', 'application/json');
       xhr.responseType = 'json';
       xhr.timeout = 2000;

app/main.js

@@ -1,3 +1,4 @@
+import 'fluent-intl-polyfill';
 import app from './routes';
 import locale from '../common/locales';
 import fileManager from './fileManager';

app/metrics.js

@@ -205,6 +205,16 @@ function stoppedUpload(params) {
   });
 }
 
+function changedDownloadLimit(params) {
+  return sendEvent('sender', 'download-limit-changed', {
+    cm1: params.size,
+    cm5: storage.totalUploads,
+    cm6: storage.files.length,
+    cm7: storage.totalDownloads,
+    cm8: params.dlimit
+  });
+}
+
 function completedDownload(params) {
   return sendEvent('recipient', 'download-stopped', {
     cm1: params.size,
@@ -272,6 +282,7 @@ export {
   cancelledUpload,
   stoppedUpload,
   completedUpload,
+  changedDownloadLimit,
   deletedUpload,
   startedDownload,
   cancelledDownload,

app/templates/file.js

@@ -18,7 +18,9 @@ module.exports = function(file, state, emit) {
   const remaining = timeLeft(ttl) || state.translate('linkExpiredAlt');
   const row = html`
   <tr id="${file.id}">
-    <td class="overflow-col" title="${file.name}">${file.name}</td>
+    <td class="overflow-col" title="${
+      file.name
+    }"><a class="link" href="/share/${file.id}">${file.name}</a></td>
     <td class="center-col">
       <img onclick=${copyClick} src="${assets.get(
     'copy-16.svg'

app/templates/selectbox.js

@@ -0,0 +1,56 @@
+const html = require('choo/html');
+
+module.exports = function(selected, options, translate, changed) {
+  const id = `select-${Math.random()}`;
+  let x = selected;
+
+  function close() {
+    const ul = document.getElementById(id);
+    const body = document.querySelector('body');
+    ul.classList.remove('active');
+    body.removeEventListener('click', close);
+  }
+
+  function toggle(event) {
+    event.stopPropagation();
+    const ul = document.getElementById(id);
+    if (ul.classList.contains('active')) {
+      close();
+    } else {
+      ul.classList.add('active');
+      const body = document.querySelector('body');
+      body.addEventListener('click', close);
+    }
+  }
+
+  function choose(event) {
+    event.stopPropagation();
+    const target = event.target;
+    const value = +target.dataset.value;
+    target.parentNode.previousSibling.firstElementChild.textContent = translate(
+      value
+    );
+    if (x !== value) {
+      x = value;
+      changed(value);
+    }
+    close();
+  }
+  return html`
+    <div class="selectbox">
+      <div onclick=${toggle}>
+        <span class="link">${translate(selected)}</span>
+        <svg width="32" height="32">
+          <polygon points="8 18 17 28 26 18" fill="#0094fb"/>
+        </svg>
+      </div>
+      <ul id="${id}" class="selectOptions">
+        ${options.map(
+          i =>
+            html`<li class="selectOption" onclick=${choose} data-value="${i}">${
+              i
+            }</li>`
+        )}
+      </ul>
+    </div>`;
+};

app/templates/share.js

@@ -2,6 +2,7 @@ const html = require('choo/html');
 const assets = require('../../common/assets');
 const notFound = require('./notFound');
 const uploadPassword = require('./uploadPassword');
+const selectbox = require('./selectbox');
 const { allowedCopy, delay, fadeOut } = require('../utils');
 
 function passwordComplete(state, password) {
@@ -14,6 +15,24 @@ function passwordComplete(state, password) {
   return el;
 }
 
+function expireInfo(file, translate, emit) {
+  const el = html([
+    `<div>${translate('expireInfo', {
+      downloadCount: '<select></select>',
+      timespan: translate('timespanHours', { number: 24 })
+    })}</div>`
+  ]);
+  const select = el.querySelector('select');
+  const options = [1, 2, 3, 4, 5, 20];
+  const t = number => translate('downloadCount', { number });
+  const changed = value => emit('changeLimit', { file, value });
+  select.parentNode.replaceChild(
+    selectbox(file.dlimit || 1, options, t, changed),
+    select
+  );
+  return el;
+}
+
 module.exports = function(state, emit) {
   const file = state.storage.getFileById(state.params.id);
   if (!file) {
@@ -27,7 +46,7 @@ module.exports = function(state, emit) {
     : uploadPassword(state, emit);
   const div = html`
   <div id="share-link" class="fadeIn">
-    <div class="title">${state.translate('uploadSuccessTimingHeader')}</div>
+    <div class="title">${expireInfo(file, state.translate, emit)}</div>
     <div id="share-window">
       <div id="copy-text">
         ${state.translate('copyUrlFormLabelWithName', {