Initial commit

2026-09-12 23:26:07 +02:00
commit a180fe4b52
35 changed files with 4921 additions and 0 deletions
@@ -0,0 +1,242 @@
+// Progressive enhancement for the upload form. With JavaScript off the plain
+// multipart POST still works; everything here is additive.
+(function () {
+  'use strict';
+
+  var base = document.body.dataset.base || '/';
+  var form = document.getElementById('upload');
+  if (!form) return;
+
+  var fileInput = document.getElementById('file');
+  var tokenInput = document.getElementById('token');
+  var drop = document.getElementById('drop');
+  var dropHint = document.getElementById('drop-hint');
+  var progress = document.getElementById('progress');
+  var barFill = document.getElementById('bar-fill');
+  var progressText = document.getElementById('progress-text');
+  var submit = document.getElementById('submit');
+  var errorBox = document.getElementById('error');
+
+  // Limits as rendered for an anonymous caller; refreshed when a token is typed.
+  var limits = { max_size: null, allow_vanity: false };
+
+  function formatSize(n) {
+    if (n === null || n === undefined) return 'unlimited';
+    var units = ['B', 'KiB', 'MiB', 'GiB', 'TiB'], i = 0;
+    while (n >= 1024 && i < units.length - 1) { n /= 1024; i++; }
+    return (i === 0 ? n : n.toFixed(2).replace(/\.00$/, '')) + ' ' + units[i];
+  }
+
+  function showError(msg) {
+    errorBox.textContent = msg;
+    errorBox.hidden = !msg;
+  }
+
+  // --- token memory -------------------------------------------------------
+  // Kept in localStorage only so the field survives a reload; it is never sent
+  // anywhere but this origin's upload endpoint.
+  try {
+    var saved = localStorage.getItem('send.token');
+    if (saved && tokenInput) tokenInput.value = saved;
+  } catch (e) { /* private mode; not important */ }
+
+  function refreshLimits() {
+    var token = tokenInput ? tokenInput.value.trim() : '';
+    try {
+      if (token) localStorage.setItem('send.token', token);
+      else localStorage.removeItem('send.token');
+    } catch (e) { /* ignore */ }
+
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', base + 'api/limits');
+    xhr.setRequestHeader('Accept', 'application/json');
+    if (token) xhr.setRequestHeader('Authorization', 'Bearer ' + token);
+    xhr.onload = function () {
+      if (xhr.status !== 200) return;
+      var l;
+      try { l = JSON.parse(xhr.responseText); } catch (e) { return; }
+      limits = l;
+      set('limit-size', l.max_size === null ? 'unlimited' : formatSize(l.max_size));
+      set('limit-expiry', l.max_expiry || 'never');
+      set('limit-default', l.default_expiry || 'never');
+      set('limit-vanity', l.allow_vanity ? 'allowed' : 'requires a token');
+      var vanity = document.getElementById('vanity');
+      if (vanity) vanity.disabled = !l.allow_vanity;
+      var expiry = document.getElementById('expiry');
+      if (expiry) expiry.placeholder = l.default_expiry || 'never';
+    };
+    xhr.send();
+  }
+
+  function set(id, text) {
+    var el = document.getElementById(id);
+    if (el) el.textContent = text;
+  }
+
+  if (tokenInput) {
+    var debounce;
+    tokenInput.addEventListener('input', function () {
+      clearTimeout(debounce);
+      debounce = setTimeout(refreshLimits, 400);
+    });
+  }
+  refreshLimits();
+
+  // --- drag and drop ------------------------------------------------------
+  function describeSelection() {
+    var f = fileInput.files[0];
+    dropHint.textContent = f ? f.name + ' — ' + formatSize(f.size)
+                             : 'Choose a file, or drop one here.';
+  }
+
+  ['dragenter', 'dragover'].forEach(function (name) {
+    drop.addEventListener(name, function (e) {
+      e.preventDefault();
+      drop.classList.add('over');
+    });
+  });
+  ['dragleave', 'drop'].forEach(function (name) {
+    drop.addEventListener(name, function () { drop.classList.remove('over'); });
+  });
+  drop.addEventListener('drop', function (e) {
+    e.preventDefault();
+    if (!e.dataTransfer.files.length) return;
+    // DataTransfer is the only way to put a dropped file into a file input.
+    var dt = new DataTransfer();
+    dt.items.add(e.dataTransfer.files[0]);
+    fileInput.files = dt.files;
+    describeSelection();
+  });
+  fileInput.addEventListener('change', describeSelection);
+
+  // --- upload -------------------------------------------------------------
+  form.addEventListener('submit', function (e) {
+    var file = fileInput.files[0];
+    if (!file) return; // let the browser's own validation speak
+
+    if (limits.max_size && file.size > limits.max_size) {
+      e.preventDefault();
+      showError('That file is ' + formatSize(file.size) + '; the limit is ' +
+                formatSize(limits.max_size) + '.');
+      return;
+    }
+
+    e.preventDefault();
+    showError('');
+    submit.disabled = true;
+    progress.hidden = false;
+
+    // FormData follows DOM order, so the token, expiry and vanity fields all
+    // precede the file part — which is exactly what the server requires.
+    var data = new FormData(form);
+    var started = Date.now();
+
+    var xhr = new XMLHttpRequest();
+    xhr.open('POST', form.action);
+    xhr.setRequestHeader('Accept', 'application/json');
+
+    xhr.upload.onprogress = function (ev) {
+      if (!ev.lengthComputable) return;
+      var pct = ev.loaded / ev.total;
+      barFill.style.width = (pct * 100).toFixed(1) + '%';
+      var elapsed = (Date.now() - started) / 1000;
+      var rate = elapsed > 0 ? ev.loaded / elapsed : 0;
+      var eta = rate > 0 ? (ev.total - ev.loaded) / rate : 0;
+      progressText.textContent =
+        (pct * 100).toFixed(0) + '% — ' + formatSize(ev.loaded) + ' of ' +
+        formatSize(ev.total) + ' — ' + formatSize(rate) + '/s' +
+        (eta > 1 ? ', ' + formatTime(eta) + ' left' : '');
+    };
+
+    xhr.onload = function () {
+      submit.disabled = false;
+      var body;
+      try { body = JSON.parse(xhr.responseText); } catch (err) { body = null; }
+      if (xhr.status >= 200 && xhr.status < 300 && body) {
+        showResult(body);
+      } else {
+        progress.hidden = true;
+        showError(body && body.error ? body.error : 'Upload failed (' + xhr.status + ').');
+      }
+    };
+    xhr.onerror = function () {
+      submit.disabled = false;
+      progress.hidden = true;
+      showError('Upload failed: the connection was lost.');
+    };
+
+    xhr.send(data);
+  });
+
+  function formatTime(s) {
+    s = Math.round(s);
+    if (s < 60) return s + 's';
+    var m = Math.floor(s / 60);
+    if (m < 60) return m + 'm ' + (s % 60) + 's';
+    return Math.floor(m / 60) + 'h ' + (m % 60) + 'm';
+  }
+
+  function showResult(r) {
+    var card = document.createElement('section');
+    card.className = 'card result';
+
+    var h = document.createElement('h1');
+    h.textContent = 'Uploaded';
+    card.appendChild(h);
+
+    var field = document.createElement('label');
+    field.className = 'field';
+    var span = document.createElement('span');
+    span.textContent = 'Download link';
+    var input = document.createElement('input');
+    input.type = 'text';
+    input.readOnly = true;
+    input.value = r.url;
+    field.appendChild(span);
+    field.appendChild(input);
+    card.appendChild(field);
+
+    var copy = document.createElement('button');
+    copy.type = 'button';
+    copy.textContent = 'Copy link';
+    copy.addEventListener('click', function () {
+      input.select();
+      var done = function () { copy.textContent = 'Copied'; };
+      if (navigator.clipboard) navigator.clipboard.writeText(r.url).then(done, function () {});
+      else { document.execCommand('copy'); done(); }
+    });
+    card.appendChild(copy);
+
+    var dl = document.createElement('dl');
+    addRow(dl, 'Expires', r.expires || 'never');
+    addRow(dl, 'SHA-256', r.sha256, 'mono wrap');
+    card.appendChild(dl);
+
+    var warn = document.createElement('div');
+    warn.className = 'warn';
+    var wh = document.createElement('h2');
+    wh.textContent = 'Delete token';
+    var wp = document.createElement('p');
+    wp.textContent = 'Shown once. Keep it if you want to remove the file early.';
+    var wt = document.createElement('p');
+    wt.className = 'mono wrap';
+    wt.textContent = r.delete_token;
+    warn.appendChild(wh);
+    warn.appendChild(wp);
+    warn.appendChild(wt);
+    card.appendChild(warn);
+
+    form.parentNode.insertBefore(card, form);
+    form.hidden = true;
+  }
+
+  function addRow(dl, label, value, cls) {
+    var dt = document.createElement('dt');
+    dt.textContent = label;
+    var dd = document.createElement('dd');
+    dd.textContent = value;
+    if (cls) dd.className = cls;
+    dl.appendChild(dt);
+    dl.appendChild(dd);
+  }
+})();