Merge branch 'fix-eslint-warnings-2' of wubthecaptain/pomf

Lint our spaghetti JavaScript code to be at least slightly more
readable. Configuration used is ESLint 1.7.x and airbnb/legacy.

It's been so long I cannot remember every change that was done, but long
story short: all the ESLint errors are now gone, at least at the date of
last commit.

moep contributed some ideas for patches: some were implemented, some
were discarded as the time and patience for merging this ran out. Thus,
there are still ESLint warnings about anonymous functions.

I don't feel like spending much more time on this. The future Pomf 2.1
development branch will replace the JavaScript code in its entirety,
courtesy of luminarys@.

Suggested-by: moep
Tested-by: Eliot Whalan <ewhal@pantsu.cat>

OK ewhal@, maybe a vague OK from luminarys@ a long time ago

3 files changed, 200 insertions, 179 deletions

diff --git a/js/cabinet.js b/js/cabinet.js
index f1ff071..ba28a33 100644
--- a/js/cabinet.js
+++ b/js/cabinet.js
@@ -20,37 +20,37 @@
  * SOFTWARE.
  */
 
-(function($) {
-  $.hasFileAPI = function hasFileAPI() {
-    return (window.FormData !== undefined);
+(function(cabinet) {
+  cabinet.hasFileAPI = function hasFileAPI() {
+    return Boolean(window.FormData);
   };
 
-  $.fn.cabinet = function(input) {
-    input = $(input);
+  $.fn.cabinet = function(uploadInput) {
+    var $input = $(uploadInput);
 
     var _this = this;
     var passthrough = function(outer, inner, prevent, fn) {
-      _this.on(outer, function(e) {
+      _this.on(outer, function(evt) {
         if (inner === 'click') {
-          input[0].click();
+          $input[0].click();
         } else {
-          input.trigger(inner);
+          $input.trigger(inner);
         }
 
         if (prevent) {
-          e.preventDefault();
+          evt.preventDefault();
         }
 
         if (fn) {
-          fn(e);
+          fn(evt);
         }
       }, false);
     };
 
-    input[0].filelist = Object.create(FileList);
+    $input[0].filelist = Object.create(FileList);
 
-    input.on('change', function(e) {
-      this.filelist = e.target.files;
+    $input.on('change', function(evt) {
+      this.filelist = evt.target.files;
       _this.change();
     });
 
@@ -58,8 +58,8 @@
     passthrough('dragover', 'dragover', true);
     passthrough('dragleave', 'dragleave', true);
     passthrough('click', 'click', false);
-    passthrough('drop', 'dragleave', true, function(e) {
-      input[0].filelist = e.dataTransfer.files;
+    passthrough('drop', 'dragleave', true, function(evt) {
+      $input[0].filelist = evt.dataTransfer.files;
       _this.change();
     });
   };
diff --git a/js/cheesesteak.js b/js/cheesesteak.js
index 8f3b489..6e20880 100644
--- a/js/cheesesteak.js
+++ b/js/cheesesteak.js
@@ -22,7 +22,52 @@
 
 (function() {
   // Lightweight EventEmitter implementation
-  EventEmitter = function() {};
+  var EventEmitter = function() {};
+
+  // Utility to convert bytes into human units
+  var humanSize = {
+    get: function humanSize() {
+      var units = [
+        'B', 'KiB', 'MiB', 'GiB', 'TiB', 'PiB', 'EiB', 'ZiB', 'YiB',
+      ];
+      var base = Math.floor(Math.log(this.size) / Math.log(1024));
+      return (this.size / Math.pow(1024, base)).toFixed(2) + ' ' + units[base];
+    },
+  };
+
+  var percentUploaded = {
+    get: function percentUploaded() {
+      return this.uploadedSize / this.size;
+    },
+  };
+
+  // b gets merged as defaults for a
+  var merge = function merge(base, overlay) {
+    var out = base;
+    var key;
+
+    for (key in overlay) {
+      if (typeof overlay[key] === 'object') {
+        out[key] = merge(base[key], overlay[key]);
+      } else {
+        out[key] = overlay[key];
+      }
+    }
+
+    return out;
+  };
+
+  var FileListUploader = function(url, files, opts) {
+    var request = opts || {};
+
+    this.url = url;
+    this.files = files;
+    this.opts = merge({
+      field: 'files[]',
+      method: 'POST',
+      data: {},
+    }, request);
+  };
 
   EventEmitter.prototype.on = function(evt, fn) {
     this._events = this._events || {};
@@ -39,11 +84,18 @@
   };
 
   EventEmitter.prototype.emit = function(evt) {
+    var i;
+    var len;
+
+    // Check whether the event we want to emit actually exists
     if (!this.hasOwnProperty('_events') || evt in this._events === false) {
       return;
     }
 
-    for (var i = 0, l = this._events[evt].length; i < l; i++) {
+    len = this._events[evt].length;
+
+    // Call all functions that are bound to the event
+    for (i = 0; i < len; i++) {
       this._events[evt][i].apply(this, Array.prototype.slice.call(arguments,
         1));
     }
@@ -63,27 +115,12 @@
       return this.reduce(function(prev, curr) {
         return prev + curr.size;
       }, 0);
-    }
+    },
   });
 
-  // Utility to convert bytes into human units
-  var humanSize = {
-    get: function humanSize() {
-      var units = [
-        'B', 'KiB', 'MiB', 'GiB', 'TiB', 'PiB', 'EiB', 'ZiB', 'YiB'
-      ];
-      var e = Math.floor(Math.log(this.size) / Math.log(1024));
-      return (this.size / Math.pow(1024, e)).toFixed(2) + ' ' + units[e];
-    }
-  };
   Object.defineProperty(FileList.prototype, 'humanSize', humanSize);
   Object.defineProperty(File.prototype, 'humanSize', humanSize);
 
-  var percentUploaded = {
-    get: function percentUploaded() {
-      return this.uploadedSize / this.size;
-    }
-  };
   Object.defineProperty(FileList.prototype, 'percentUploaded',
     percentUploaded);
   Object.defineProperty(File.prototype, 'percentUploaded', percentUploaded);
@@ -93,73 +130,52 @@
       return this.reduce(function(prev, curr) {
         return prev + (curr.uploadedSize || 0);
       }, 0);
-    }
+    },
   });
 
   // Object URL stuff
   Object.defineProperty(File.prototype, 'url', {
     get: function getURL() {
       return window.URL.createObjectURL(this);
-    }
+    },
   });
   File.revokeURL = function revokeURL(url) {
     window.URL.revokeObjectURL(url);
   };
 
-  // b gets merged as defaults for a
-  var merge = function merge(base, overlay) {
-    var out = base;
-    for (var key in overlay) {
-      if (typeof overlay[key] === 'object') {
-        out[key] = merge(base[key], overlay[key]);
-      } else {
-        out[key] = overlay[key];
-      }
-    }
-
-    return out;
-  };
-
-  var FileListUploader = function(url, files, opts) {
-    this.url = url;
-    this.files = files;
-
-    opts = opts || {};
-
-    this.opts = merge({
-      field: 'files[]',
-      method: 'POST',
-      data: {}
-    }, opts);
-  };
-
   FileListUploader.prototype = Object.create(EventEmitter.prototype);
   FileListUploader.prototype.upload = function(cb) {
-    if (cb) {
-      this.on('uploadcomplete', cb);
-    }
-
     var opts = this.opts;
     var files = this.files;
     var _this = this;
-
+    var len = files.length;
     var data = new FormData();
+    var xhr = new XMLHttpRequest();
+    var i;
+
+    if (cb) {
+      this.on('uploadcomplete', cb);
+    }
+
     files.forEach(function(file) {
       data.append(opts.field, file);
     });
 
-    var xhr = new XMLHttpRequest();
-
     xhr.open(opts.method, this.url, true);
-    xhr.upload.addEventListener('loadstart', function(e) {
-      for (var i = 0, l = files.length; i < l; i++) {
+
+    function initProgressBar() {
+      for (i = 0; i < len; i++) {
         files[i].uploadedSize = 0;
       }
-    });
+    }
 
-    xhr.upload.addEventListener('progress', function(e) {
-      if (e.lengthComputable) {
-        size = e.loaded;
+    xhr.upload.addEventListener('loadstart', initProgressBar);
+
+    function updateProgressBar(evt) {
+      var size;
+
+      if (evt.lengthComputable) {
+        size = evt.loaded;
 
         /**
          * We know the size of the files, the order they're in, and how
@@ -169,7 +185,7 @@
          */
 
         // TODO: This math has trouble on later uploads. Leak somewhere.
-        for (var i = 0, l = files.length; i < l; i++) {
+        for (i = 0; i < len; i++) {
           files[i].uploadedSize = Math.min(size, files[i].size);
           size -= files[i].uploadedSize;
           if (size <= 0) {
@@ -179,24 +195,31 @@
         }
       }
 
-      _this.emit('uploadprogress', e, files);
-    }, false);
+      _this.emit('uploadprogress', evt, files);
+    }
 
-    xhr.upload.addEventListener('loadstart', function(e) {
-      _this.emit('uploadstart', e);
-    });
+    xhr.upload.addEventListener('progress', updateProgressBar, false);
 
-    xhr.upload.addEventListener('load', function(e) {
-      _this.emit('uploadcomplete', e);
-    });
+    // The upload is complete, now tell the user to wait for URLs.
+    function postUpload(evt) {
+      _this.emit('uploadcomplete', evt);
+    }
 
-    xhr.addEventListener('progress', function(e) {
-      _this.emit('progress', e);
-    });
+    xhr.upload.addEventListener('load', postUpload);
 
-    xhr.addEventListener('load', function(e) {
-      _this.emit('load', e, xhr.responseText);
-    });
+    // Tell the browser the upload completed and wait for response.
+    function postProgress(evt) {
+      _this.emit('progress', evt);
+    }
+
+    xhr.addEventListener('progress', postProgress);
+
+    // Send a success/error response. Nothing more to do.
+    function uploadFinished(evt) {
+      _this.emit('load', evt, xhr.responseText);
+    }
+
+    xhr.addEventListener('load', uploadFinished);
 
     xhr.send(data);
 
diff --git a/js/pomf.js b/js/pomf.js
index baaac46..cf91e35 100644
--- a/js/pomf.js
+++ b/js/pomf.js
@@ -22,41 +22,11 @@
  */
 
 $(function() {
-  var uploadInput = $('#upload-input');
-  var uploadBtn   = $('#upload-btn');
-  var uploadFiles = $('#upload-filelist');
+  var $uploadInput = $('#upload-input');
+  var $uploadBtn = $('#upload-btn');
+  var $uploadFiles = $('#upload-filelist');
 
-  var btnContent = '';
-
-  if (!$.hasFileAPI()) {
-    $('#no-file-api').show();
-    uploadBtn.hide();
-  }
-
-  uploadBtn.cabinet(uploadInput);
-
-  uploadBtn.on('dragenter', function(e) {
-    if (this === e.target) {
-      $(this).addClass('drop');
-      btnContent = $(this).html();
-      $(this).html('Drop it here~');
-    }
-  });
-
-  uploadBtn.on('drop', function(e) {
-    $(this).trigger('dragleave');
-  });
-
-  uploadBtn.on('dragleave', function(e) {
-    node = e.target;
-    do {
-      if (node === this) {
-        $(this).removeClass('drop');
-        $(this).html(btnContent);
-        break;
-      }
-    } while (node === node.parentNode);
-  });
+  var $btnContent = '';
 
   var MAX_SIZE = (function(node) {
     var max = node.attr('data-max-size') || '10MiB';
@@ -69,106 +39,134 @@ $(function() {
     );
 
     return num * oneUnit;
-  })(uploadInput);
+  })($uploadInput);
 
   var createRow = function(filename, size, extra) {
-    var rowItem = $('<li class=file>');
-    var rowName = $('<span class=file-name>');
-    var rowProg = $('<div class="file-progress progress-outer">');
-    var rowSize = $('<span class=file-size>');
-    var rowUrl  = $('<span class=file-url>');
+    var $rowItem = $('<li class=file>');
+    var $rowName = $('<span class=file-name>');
+    var $rowProg = $('<div class="file-progress progress-outer">');
+    var $rowSize = $('<span class=file-size>');
+    var $rowUrl = $('<span class=file-url>');
 
-    rowItem.addClass(extra || '');
+    $rowItem.addClass(extra || '');
 
-    $('<div class=progress-inner>').appendTo(rowProg);
+    $('<div class=progress-inner>').appendTo($rowProg);
 
-    rowItem.attr('data-filename', escape(filename));
-    rowName.text(filename);
-    rowSize.text(size);
+    $rowItem.attr('data-filename', escape(filename));
+    $rowName.text(filename);
+    $rowSize.text(size);
 
-    rowItem.append(rowName, rowProg, rowSize, rowUrl);
+    $rowItem.append($rowName, $rowProg, $rowSize, $rowUrl);
 
-    return rowItem;
+    return $rowItem;
   };
 
-  uploadBtn.on('change', function(e) {
-    uploadFiles.empty().removeClass('error completed');
+  if (!$.hasFileAPI()) {
+    $('#no-file-api').show();
+    $uploadBtn.hide();
+  }
 
-    var files = uploadInput[0].filelist;
+  $uploadBtn.cabinet($uploadInput);
 
-    files.forEach(function(file) {
-      createRow(file.name, file.humanSize).appendTo(uploadFiles);
-    });
+  $uploadBtn.on('dragenter', function(evt) {
+    if (this === evt.target) {
+      $(this).addClass('drop');
+      $btnContent = $(this).html();
+      $(this).html('Drop it here~');
+    }
+  });
 
-    var totalRow = createRow('', files.humanSize, 'total');
-    totalRow.appendTo(uploadFiles);
+  $uploadBtn.on('drop', function() {
+    $(this).trigger('dragleave');
+  });
 
-    var totalName = $('.file-name', totalRow);
+  $uploadBtn.on('dragleave', function(evt) {
+    var node = evt.target;
+    do {
+      if (node === this) {
+        $(this).removeClass('drop');
+        $(this).html($btnContent);
+        break;
+      }
+    } while (node === node.parentNode);
+  });
 
+  $uploadBtn.on('change', function() {
+    var files = $uploadInput[0].filelist;
+    var totalRow = createRow('', files.humanSize, 'total');
+    var $totalName = $('.file-name', totalRow);
     var UPLOAD_ERR_MAX_SIZE = 'onii-chan y-your upload is t-too big&hellip;';
     var UPLOAD_ERR_FAILED = 'Something went wrong; try again later.';
-
-    if (files.size > MAX_SIZE) {
-      uploadFiles.addClass('error');
-      totalName.html(UPLOAD_ERR_MAX_SIZE);
-      return;
-    }
-
     var up = files.upload('upload.php');
 
-    var eachRow = function(files, fn) {
+    var eachRow = function(_files, fn) {
       var hits = {};
-      files.forEach(function(file) {
-        ++hits[file.name];
+      _files.forEach(function(file) {
         var row = $($('li[data-filename="' +
           escape(file.name) + '"]')[hits[file.name] || 0]);
-        fn.call(row, row, file, files);
+        ++hits[file.name];
+        fn.call(row, row, file, _files);
       });
     };
 
-    up.on('uploadprogress', function(e, files) {
-      eachRow(files, function(row, file, files) {
+    $uploadFiles.empty().removeClass('error completed');
+
+    files.forEach(function(file) {
+      createRow(file.name, file.humanSize).appendTo($uploadFiles);
+    });
+
+    totalRow.appendTo($uploadFiles);
+
+    if (files.size > MAX_SIZE) {
+      $uploadFiles.addClass('error');
+      $totalName.html(UPLOAD_ERR_MAX_SIZE);
+      return;
+    }
+
+    up.on('uploadprogress', function(evt, _files) {
+      eachRow(_files, function(row, file) {
         $('.progress-inner', row).width((file.percentUploaded * 100) + '%');
       });
 
-      $('.progress-inner', totalRow).width((files.percentUploaded * 100) + '%');
+      $('.progress-inner', totalRow).width((_files.percentUploaded * 100) + '%');
     });
 
-    up.on('uploadcomplete', function(e) {
+    up.on('uploadcomplete', function() {
       $('.progress-inner').width('100%');
-      totalName.html('Grabbing URLs&hellip;');
+      $totalName.html('Grabbing URLs&hellip;');
     });
 
-    up.on('load', function(e, response) {
-      switch (e.target.status) {
+    up.on('load', function(evt, response) {
+      var res = JSON.parse(response);
+
+      switch (evt.target.status) {
       case 200:
-        var res = JSON.parse(response);
         if (!res.success) {
-          uploadFiles.addClass('error');
-          totalName.text(UPLOAD_ERR_FAILED);
+          $uploadFiles.addClass('error');
+          $totalName.text(UPLOAD_ERR_FAILED);
           break;
         }
 
-        eachRow(res.files, function(row, file, files) {
-          var link = $('<a>');
+        eachRow(res.files, function(row, file) {
+          var $link = $('<a>');
 
-          link.attr('href', file.url)
-              .attr('target', '_BLANK')
-              .text(file.url.replace('http://', '').replace('https://', ''));
+          $link.attr('href', file.url)
+               .attr('target', '_BLANK')
+               .text(file.url.replace('http://', '').replace('https://', ''));
 
-          $('.file-url', row).append(link);
+          $('.file-url', row).append($link);
         });
 
-        uploadFiles.addClass('completed');
-        totalName.text('Done!');
+        $uploadFiles.addClass('completed');
+        $totalName.text('Done!');
         break;
       case 413:
-        uploadFiles.addClass('error completed');
-        totalName.html(UPLOAD_ERR_MAX_SIZE);
+        $uploadFiles.addClass('error completed');
+        $totalName.html(UPLOAD_ERR_MAX_SIZE);
         break;
       default:
-        uploadFiles.addClass('error completed');
-        totalName.text(UPLOAD_ERR_FAILED);
+        $uploadFiles.addClass('error completed');
+        $totalName.text(UPLOAD_ERR_FAILED);
       }
     });