X-Git-Url: https://jfr.im/git/uguu.git/blobdiff_plain/2057341d8f6beb79fdaa034619c4030b86baecf3:/static/js/app.js..e480c0e52fadac2ffac84c751cb7b0f606e93efc:/src/static/js/uguu.js

diff --git a/static/js/app.js b/src/static/js/uguu.js
similarity index 74%
rename from static/js/app.js
rename to src/static/js/uguu.js
index 23a50b2..9da0742 100644
--- a/static/js/app.js
+++ b/src/static/js/uguu.js
@@ -24,18 +24,19 @@ document.addEventListener('DOMContentLoaded', function () {
      * @param {File} file
      * @return {HTMLLIElement} row
      */
-    function addRow(file) {
-        var row = document.createElement('li');
+    function addRow(file)
+    {
+        const row = document.createElement('li');
 
-        var name = document.createElement('span');
+        const name = document.createElement('span');
         name.textContent = file.name;
         name.className = 'file-name';
 
-        var progressIndicator = document.createElement('span');
+        const progressIndicator = document.createElement('span');
         progressIndicator.className = 'progress-percent';
         progressIndicator.textContent = '0%';
 
-        var progressBar = document.createElement('progress');
+        const progressBar = document.createElement('progress');
         progressBar.className = 'file-progress';
         progressBar.setAttribute('max', '100');
         progressBar.setAttribute('value', '0');
@@ -53,15 +54,16 @@ document.addEventListener('DOMContentLoaded', function () {
      *
      * @param {ProgressEvent} evt
      */
-    function handleUploadProgress(evt) {
-        var xhr = evt.target;
-        var bar = xhr.bar;
-        var percentIndicator = xhr.percent;
+    function handleUploadProgress(evt)
+    {
+        let xhr = evt.target;
+        let bar = xhr.bar;
+        let percentIndicator = xhr.percent;
 
         /* If we have amounts of work done/left that we can calculate with
            (which, unless we're uploading dynamically resizing data, is always), calculate the percentage. */
         if (evt.lengthComputable) {
-            var progressPercent = Math.floor((evt.loaded / evt.total) * 100);
+            let progressPercent = Math.floor((evt.loaded / evt.total) * 100);
             bar.setAttribute('value', progressPercent);
             percentIndicator.textContent = progressPercent + '%';
         }
@@ -74,36 +76,37 @@ document.addEventListener('DOMContentLoaded', function () {
      *
      * @param {ProgressEvent} evt
      */
-    function handleUploadComplete(evt) {
-        var xhr = evt.target;
-        var bar = xhr.bar;
-        var row = xhr.row;
-        var percentIndicator = xhr.percent;
+    function handleUploadComplete(evt)
+    {
+        let xhr = evt.target;
+        let bar = xhr.bar;
+        let row = xhr.row;
+        let percentIndicator = xhr.percent;
 
         percentIndicator.style.visibility = 'hidden';
         bar.style.visibility = 'hidden';
         row.removeChild(bar);
         row.removeChild(percentIndicator);
-        var respStatus = xhr.status;
+        let respStatus = xhr.status;
 
-        var url = document.createElement('span');
+        let url = document.createElement('span');
         url.className = 'file-url';
         row.appendChild(url);
 
-        var link = document.createElement('a');
+        let link = document.createElement('a');
         if (respStatus === 200) {
-            var response = JSON.parse(xhr.responseText);
+            let response = JSON.parse(xhr.responseText);
             if (response.success) {
                 link.textContent = response.files[0].url.replace(/.*?:\/\//g, '');
                 link.href = response.files[0].url;
                 url.appendChild(link);
-                var copy = document.createElement('button');
+                const copy = document.createElement('button');
                 copy.className = 'upload-clipboard-btn';
-                var glyph = document.createElement('img');
+                const glyph = document.createElement('img');
                 glyph.src = 'img/glyphicons-512-copy.png';
                 copy.appendChild(glyph);
                 url.appendChild(copy);
-                copy.addEventListener("click", function (event) {
+                copy.addEventListener("click", function () {
                     /* Why create an element?  The text needs to be on screen to be
                        selected and thus copied. The only text we have on-screen is the link
                        without the http[s]:// part. So, this creates an element with the
@@ -111,10 +114,10 @@ document.addEventListener('DOMContentLoaded', function () {
 
                        See the "Complex Example: Copy to clipboard without displaying
                        input" section at: https://stackoverflow.com/a/30810322 */
-                    var element = document.createElement('a');
+                    const element = document.createElement('a');
                     element.textContent = response.files[0].url;
                     link.appendChild(element);
-                    var range = document.createRange();
+                    let range = document.createRange();
                     range.selectNode(element);
                     window.getSelection().removeAllRanges();
                     window.getSelection().addRange(range);
@@ -128,7 +131,7 @@ document.addEventListener('DOMContentLoaded', function () {
             link.textContent = 'File too big!';
             url.appendChild(link);
         } else {
-            var response = JSON.parse(xhr.responseText);
+            let response = JSON.parse(xhr.responseText);
             link.textContent = response.description;
             url.appendChild(link);
         }
@@ -140,10 +143,11 @@ document.addEventListener('DOMContentLoaded', function () {
      * @param {File} file
      * @param {HTMLLIElement} row
      */
-    function uploadFile(file, row) {
-        var bar = row.querySelector('.file-progress');
-        var percentIndicator = row.querySelector('.progress-percent');
-        var xhr = new XMLHttpRequest();
+    function uploadFile(file, row)
+    {
+        let bar = row.querySelector('.file-progress');
+        let percentIndicator = row.querySelector('.progress-percent');
+        let xhr = new XMLHttpRequest();
         xhr.open('POST', 'upload.php');
 
         xhr['row'] = row;
@@ -155,7 +159,7 @@ document.addEventListener('DOMContentLoaded', function () {
         xhr.addEventListener('load', handleUploadComplete, false);
         xhr.upload.onprogress = handleUploadProgress;
 
-        var form = new FormData();
+        let form = new FormData();
         form.append('files[]', file);
         xhr.send(form);
     }
@@ -167,7 +171,8 @@ document.addEventListener('DOMContentLoaded', function () {
      *
      * @param {Event} evt
      */
-    function stopDefaultEvent(evt) {
+    function stopDefaultEvent(evt)
+    {
         evt.stopPropagation();
         evt.preventDefault();
     }
@@ -179,9 +184,10 @@ document.addEventListener('DOMContentLoaded', function () {
      * @param {HTMLButtonElement} element
      * @param {DragEvent} evt
      */
-    function handleDrag(state, element, evt) {
+    function handleDrag(state, element, evt)
+    {
         stopDefaultEvent(evt);
-        if (state.dragCount == 1) {
+        if (state.dragCount === 1) {
             element.textContent = 'Drop it here~';
         }
         state.dragCount += 1;
@@ -194,10 +200,11 @@ document.addEventListener('DOMContentLoaded', function () {
      * @param {HTMLButtonElement} element
      * @param {DragEvent} evt
      */
-    function handleDragAway(state, element, evt) {
+    function handleDragAway(state, element, evt)
+    {
         stopDefaultEvent(evt);
         state.dragCount -= 1;
-        if (state.dragCount == 0) {
+        if (state.dragCount === 0) {
             element.textContent = 'Select or drop file(s)';
         }
     }
@@ -209,13 +216,14 @@ document.addEventListener('DOMContentLoaded', function () {
      * @param {HTMLButtonElement} element
      * @param {DragEvent} evt
      */
-    function handleDragDrop(state, element, evt) {
+    function handleDragDrop(state, element, evt)
+    {
         stopDefaultEvent(evt);
         handleDragAway(state, element, evt);
-        var len = evt.dataTransfer.files.length;
-        for (var i = 0; i < len; i++) {
-            var file = evt.dataTransfer.files[i];
-            var row = addRow(file);
+        let len = evt.dataTransfer.files.length;
+        for (let i = 0; i < len; i++) {
+            let file = evt.dataTransfer.files[i];
+            let row = addRow(file);
             uploadFile(file, row);
         }
     }
@@ -225,12 +233,13 @@ document.addEventListener('DOMContentLoaded', function () {
      *
      * @param {InputEvent} evt
      */
-    function uploadFiles(evt) {
-        var len = evt.target.files.length;
+    function uploadFiles(evt)
+    {
+        let len = evt.target.files.length;
         // For each file, make a row, and upload the file.
-        for (var i = 0; i < len; i++) {
-            var file = evt.target.files[i];
-            var row = addRow(file);
+        for (let i = 0; i < len; i++) {
+            let file = evt.target.files[i];
+            let row = addRow(file);
             uploadFile(file, row);
         }
     }
@@ -241,34 +250,35 @@ document.addEventListener('DOMContentLoaded', function () {
      * @param {HTMLInputElement} target
      * @param {InputEvent} evt
      */
-    function selectFiles(target, evt) {
+    function selectFiles(target, evt)
+    {
         stopDefaultEvent(evt);
         target.click();
     }
 
     /* Handles the pasting function */
     window.addEventListener("paste", e => {
-        var len = e.clipboardData.files.length;
-        for (var i = 0; i < len; i++) {
-            var file = e.clipboardData.files[i];
-            var row = addRow(file);
+        let len = e.clipboardData.files.length;
+        for (let i = 0; i < len; i++) {
+            let file = e.clipboardData.files[i];
+            let row = addRow(file);
             uploadFile(file, row);
         }
     });
 
 
-    /* Set-up the event handlers for the <button>, <input> and the window itself
+    /* Set up the event handlers for the <button>, <input> and the window itself
        and also set the "js" class on selector "#upload-form", presumably to
        allow custom styles for clients running javascript. */
-    var state = {dragCount: 0};
-    var uploadButton = document.getElementById('upload-btn');
+    let state = {dragCount: 0};
+    let uploadButton = document.getElementById('upload-btn');
     window.addEventListener('dragenter', handleDrag.bind(this, state, uploadButton), false);
     window.addEventListener('dragleave', handleDragAway.bind(this, state, uploadButton), false);
     window.addEventListener('drop', handleDragAway.bind(this, state, uploadButton), false);
     window.addEventListener('dragover', stopDefaultEvent, false);
 
 
-    var uploadInput = document.getElementById('upload-input');
+    let uploadInput = document.getElementById('upload-input');
     uploadInput.addEventListener('change', uploadFiles);
     uploadButton.addEventListener('click', selectFiles.bind(this, uploadInput));
     uploadButton.addEventListener('drop', handleDragDrop.bind(this, state, uploadButton), false);