From 5462c603b6b9389fd7ea8e55998045a4452d2d7d Mon Sep 17 00:00:00 2001 From: Juuso Lapinlampi Date: Sun, 27 Sep 2015 21:41:12 +0000 Subject: Prefix jQuery object variables with a $ While JSCS and ESLint do not detect this yet as of today, my eyes do. The Airbnb style guide wants to do this. This commit doesn't prefix cabinet.js, but the next commit will while addressing another issue. --- js/pomf.js | 92 +++++++++++++++++++++++++++++++------------------------------- 1 file changed, 46 insertions(+), 46 deletions(-) (limited to 'js/pomf.js') diff --git a/js/pomf.js b/js/pomf.js index 1a11543..db68ed8 100644 --- a/js/pomf.js +++ b/js/pomf.js @@ -23,37 +23,37 @@ /* jshint browser:true, jquery:true */ $(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 = ''; + var $btnContent = ''; if (!$.hasFileAPI()) { $('#no-file-api').show(); - uploadBtn.hide(); + $uploadBtn.hide(); } - uploadBtn.cabinet(uploadInput); + $uploadBtn.cabinet($uploadInput); - uploadBtn.on('dragenter', function(e) { + $uploadBtn.on('dragenter', function(e) { if (this === e.target) { $(this).addClass('drop'); - btnContent = $(this).html(); + $btnContent = $(this).html(); $(this).html('Drop it here~'); } }); - uploadBtn.on('drop', function(e) { + $uploadBtn.on('drop', function(e) { $(this).trigger('dragleave'); }); - uploadBtn.on('dragleave', function(e) { + $uploadBtn.on('dragleave', function(e) { node = e.target; do { if (node === this) { $(this).removeClass('drop'); - $(this).html(btnContent); + $(this).html($btnContent); break; } } while (node === node.parentNode); @@ -70,48 +70,48 @@ $(function() { ); return num * oneUnit; - })(uploadInput); + })($uploadInput); var createRow = function(filename, size, extra) { - var rowItem = $('
  • '); - var rowName = $(''); - var rowProg = $('
    '); - var rowSize = $(''); - var rowUrl = $(''); + var $rowItem = $('
  • '); + var $rowName = $(''); + var $rowProg = $('
    '); + var $rowSize = $(''); + var $rowUrl = $(''); - rowItem.addClass(extra || ''); + $rowItem.addClass(extra || ''); - $('
    ').appendTo(rowProg); + $('
    ').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'); + $uploadBtn.on('change', function(e) { + $uploadFiles.empty().removeClass('error completed'); - var files = uploadInput[0].filelist; + var files = $uploadInput[0].filelist; files.forEach(function(file) { - createRow(file.name, file.humanSize).appendTo(uploadFiles); + createRow(file.name, file.humanSize).appendTo($uploadFiles); }); var totalRow = createRow('', files.humanSize, 'total'); - totalRow.appendTo(uploadFiles); + totalRow.appendTo($uploadFiles); - var totalName = $('.file-name', totalRow); + var $totalName = $('.file-name', totalRow); var UPLOAD_ERR_MAX_SIZE = 'onii-chan y-your upload is t-too big…'; var UPLOAD_ERR_FAILED = 'Something went wrong; try again later.'; if (files.size > MAX_SIZE) { - uploadFiles.addClass('error'); - totalName.html(UPLOAD_ERR_MAX_SIZE); + $uploadFiles.addClass('error'); + $totalName.html(UPLOAD_ERR_MAX_SIZE); return; } @@ -137,7 +137,7 @@ $(function() { up.on('uploadcomplete', function(e) { $('.progress-inner').width('100%'); - totalName.html('Grabbing URLs…'); + $totalName.html('Grabbing URLs…'); }); up.on('load', function(e, response) { @@ -145,31 +145,31 @@ $(function() { 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 = $(''); + var $link = $(''); - 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); } }); -- cgit v1.2.3 From 11e9d2d0e6d7266ff119fdab9947e879192bd75e Mon Sep 17 00:00:00 2001 From: Juuso Lapinlampi Date: Mon, 28 Sep 2015 19:14:49 +0000 Subject: Add missing var declarations to undefined variables Fixes ESLint no-undef warnings using Airbnb ES5 config. --- js/pomf.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/pomf.js') diff --git a/js/pomf.js b/js/pomf.js index 7dd44ef..71972e1 100644 --- a/js/pomf.js +++ b/js/pomf.js @@ -49,7 +49,7 @@ $(function() { }); uploadBtn.on('dragleave', function(e) { - node = e.target; + var node = e.target; do { if (node === this) { $(this).removeClass('drop'); -- cgit v1.2.3 From 9bdedb32e61159a78fd9717fdaacf63405fe9e98 Mon Sep 17 00:00:00 2001 From: Juuso Lapinlampi Date: Sun, 4 Oct 2015 18:02:53 +0000 Subject: Remove extra whitespace in variable declarations This is something I would disagree with, because this commit in my opinion reduces readability. I am not going to reinvent the wheel and write for humans, because I enjoy being a slave to ESLint. Any complaints about this commit should be directed at Airbnb to fix their style guide. Alternatively, a documented standard style guide should be created for pantsu.cat, extending the Airbnb config. This fixes ESLint no-multi-spaces errors using airbnb/legacy config. --- js/pomf.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/pomf.js') diff --git a/js/pomf.js b/js/pomf.js index 7d61160..a108c4b 100644 --- a/js/pomf.js +++ b/js/pomf.js @@ -24,7 +24,7 @@ /* jshint browser:true, jquery:true */ $(function() { var $uploadInput = $('#upload-input'); - var $uploadBtn = $('#upload-btn'); + var $uploadBtn = $('#upload-btn'); var $uploadFiles = $('#upload-filelist'); var $btnContent = ''; @@ -77,7 +77,7 @@ $(function() { var $rowName = $(''); var $rowProg = $('
    '); var $rowSize = $(''); - var $rowUrl = $(''); + var $rowUrl = $(''); $rowItem.addClass(extra || ''); -- cgit v1.2.3 From 59502c86ceba164c3ccf1a7fa58bf33560157d2b Mon Sep 17 00:00:00 2001 From: Juuso Lapinlampi Date: Fri, 9 Oct 2015 13:59:32 +0000 Subject: Lint pomf.js ID length to > 2 characters Fixes ESLint id-length errors using airbnb/legacy config. Some arguments were also unused, so this will also avoid introducing new no-unused-vars lint errors. --- js/pomf.js | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) (limited to 'js/pomf.js') diff --git a/js/pomf.js b/js/pomf.js index a108c4b..0e2ecee 100644 --- a/js/pomf.js +++ b/js/pomf.js @@ -36,20 +36,20 @@ $(function() { $uploadBtn.cabinet($uploadInput); - $uploadBtn.on('dragenter', function(e) { - if (this === e.target) { + $uploadBtn.on('dragenter', function(evt) { + if (this === evt.target) { $(this).addClass('drop'); $btnContent = $(this).html(); $(this).html('Drop it here~'); } }); - $uploadBtn.on('drop', function(e) { + $uploadBtn.on('drop', function() { $(this).trigger('dragleave'); }); - $uploadBtn.on('dragleave', function(e) { - var node = e.target; + $uploadBtn.on('dragleave', function(evt) { + var node = evt.target; do { if (node === this) { $(this).removeClass('drop'); @@ -92,7 +92,7 @@ $(function() { return $rowItem; }; - $uploadBtn.on('change', function(e) { + $uploadBtn.on('change', function() { $uploadFiles.empty().removeClass('error completed'); var files = $uploadInput[0].filelist; @@ -127,7 +127,7 @@ $(function() { }); }; - up.on('uploadprogress', function(e, files) { + up.on('uploadprogress', function(evt, files) { eachRow(files, function(row, file, files) { $('.progress-inner', row).width((file.percentUploaded * 100) + '%'); }); @@ -135,13 +135,13 @@ $(function() { $('.progress-inner', totalRow).width((files.percentUploaded * 100) + '%'); }); - up.on('uploadcomplete', function(e) { + up.on('uploadcomplete', function() { $('.progress-inner').width('100%'); $totalName.html('Grabbing URLs…'); }); - up.on('load', function(e, response) { - switch (e.target.status) { + up.on('load', function(evt, response) { + switch (evt.target.status) { case 200: var res = JSON.parse(response); if (!res.success) { @@ -150,7 +150,7 @@ $(function() { break; } - eachRow(res.files, function(row, file, files) { + eachRow(res.files, function(row, file) { var $link = $(''); $link.attr('href', file.url) -- cgit v1.2.3 From 24ce733985f9d220067654e51698b41c4b446fe7 Mon Sep 17 00:00:00 2001 From: Juuso Lapinlampi Date: Fri, 9 Oct 2015 15:59:48 +0000 Subject: Lint pomf.js vars declarations to top of function Fixes ESLint vars-on-top errors using airbnb/legacy config. --- js/pomf.js | 93 ++++++++++++++++++++++++++++++-------------------------------- 1 file changed, 45 insertions(+), 48 deletions(-) (limited to 'js/pomf.js') diff --git a/js/pomf.js b/js/pomf.js index 0e2ecee..1e89576 100644 --- a/js/pomf.js +++ b/js/pomf.js @@ -29,36 +29,6 @@ $(function() { var $btnContent = ''; - if (!$.hasFileAPI()) { - $('#no-file-api').show(); - $uploadBtn.hide(); - } - - $uploadBtn.cabinet($uploadInput); - - $uploadBtn.on('dragenter', function(evt) { - if (this === evt.target) { - $(this).addClass('drop'); - $btnContent = $(this).html(); - $(this).html('Drop it here~'); - } - }); - - $uploadBtn.on('drop', function() { - $(this).trigger('dragleave'); - }); - - $uploadBtn.on('dragleave', function(evt) { - var node = evt.target; - do { - if (node === this) { - $(this).removeClass('drop'); - $(this).html($btnContent); - break; - } - } while (node === node.parentNode); - }); - var MAX_SIZE = (function(node) { var max = node.attr('data-max-size') || '120MiB'; var num = parseInt(/([0-9,]+).*/.exec(max)[1].replace(',', ''), 10); @@ -92,40 +62,66 @@ $(function() { return $rowItem; }; - $uploadBtn.on('change', function() { - $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…'; 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 hits = {}; files.forEach(function(file) { - ++hits[file.name]; var row = $($('li[data-filename="' + escape(file.name) + '"]')[hits[file.name] || 0]); + ++hits[file.name]; fn.call(row, 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, files) { @@ -141,9 +137,10 @@ $(function() { }); 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); -- cgit v1.2.3 From 25109de5f34842de0ea7a80e1a9f3e9c57e68e34 Mon Sep 17 00:00:00 2001 From: Juuso Lapinlampi Date: Fri, 9 Oct 2015 16:04:58 +0000 Subject: Add missing newline introduced in previous commit Before this, JSCS would print an error about missing newline. This was introduced in previous commit 24ce733. --- js/pomf.js | 1 + 1 file changed, 1 insertion(+) (limited to 'js/pomf.js') diff --git a/js/pomf.js b/js/pomf.js index 1e89576..a8cd248 100644 --- a/js/pomf.js +++ b/js/pomf.js @@ -109,6 +109,7 @@ $(function() { fn.call(row, row, file, files); }); }; + $uploadFiles.empty().removeClass('error completed'); files.forEach(function(file) { -- cgit v1.2.3 From f413dc9a1b944fd653c3bc089516c3363fb57857 Mon Sep 17 00:00:00 2001 From: Juuso Lapinlampi Date: Wed, 18 Nov 2015 11:54:42 +0000 Subject: Remove unused JavaScript variables (no-unused-vars) Quoting ESLint: > Variables that are declared and not used anywhere in the code are most > likely an error due to incomplete refactoring. Such variables take up > space in the code and can lead to confusion by readers. This commit removes them. Fixes ESLint no-unused-vars errors using airbnb/legacy config. Suggested-by: marc --- js/pomf.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/pomf.js') diff --git a/js/pomf.js b/js/pomf.js index a8cd248..f1b23f3 100644 --- a/js/pomf.js +++ b/js/pomf.js @@ -125,7 +125,7 @@ $(function() { } up.on('uploadprogress', function(evt, files) { - eachRow(files, function(row, file, files) { + eachRow(files, function(row, file) { $('.progress-inner', row).width((file.percentUploaded * 100) + '%'); }); -- cgit v1.2.3 From d527b2d6769bdc0d2cd6744f1bda9d8da74ef6a6 Mon Sep 17 00:00:00 2001 From: Juuso Lapinlampi Date: Wed, 18 Nov 2015 12:24:32 +0000 Subject: Rename local variables to unique private names When a local variable shares the same name with a variable in its scope, it can cause confusion to the reader and make it impossible to access the global variable. Disallow shadowing. Fixes ESLint no-shadow errors using airbnb/legacy config. Suggested-by: marc --- js/pomf.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'js/pomf.js') diff --git a/js/pomf.js b/js/pomf.js index f1b23f3..4c2f9fe 100644 --- a/js/pomf.js +++ b/js/pomf.js @@ -100,13 +100,13 @@ $(function() { var UPLOAD_ERR_FAILED = 'Something went wrong; try again later.'; var up = files.upload('upload.php'); - var eachRow = function(files, fn) { + var eachRow = function(_files, fn) { var hits = {}; - files.forEach(function(file) { + _files.forEach(function(file) { var row = $($('li[data-filename="' + escape(file.name) + '"]')[hits[file.name] || 0]); ++hits[file.name]; - fn.call(row, row, file, files); + fn.call(row, row, file, _files); }); }; @@ -124,12 +124,12 @@ $(function() { return; } - up.on('uploadprogress', function(evt, files) { - eachRow(files, function(row, file) { + 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() { -- cgit v1.2.3