refactor single_file_diff.js to use ES class syntax

1 files changed, 13 insertions, 18 deletions

diff --git a/app/assets/javascripts/single_file_diff.js b/app/assets/javascripts/single_file_diff.js
index 00d04ce0c33..6667e30b6c6 100644
--- a/app/assets/javascripts/single_file_diff.js
+++ b/app/assets/javascripts/single_file_diff.js
@@ -2,18 +2,13 @@
 
 import FilesCommentButton from './files_comment_button';
 
-window.SingleFileDiff = (function() {
-  var COLLAPSED_HTML, ERROR_HTML, LOADING_HTML, WRAPPER;
+const WRAPPER = '<div class="diff-content"></div>';
+const LOADING_HTML = '<i class="fa fa-spinner fa-spin"></i>';
+const ERROR_HTML = '<div class="nothing-here-block"><i class="fa fa-warning"></i> Could not load diff</div>';
+const COLLAPSED_HTML = '<div class="nothing-here-block diff-collapsed">This diff is collapsed. <a class="click-to-expand">Click to expand it.</a></div>';
 
-  WRAPPER = '<div class="diff-content"></div>';
-
-  LOADING_HTML = '<i class="fa fa-spinner fa-spin"></i>';
-
-  ERROR_HTML = '<div class="nothing-here-block"><i class="fa fa-warning"></i> Could not load diff</div>';
-
-  COLLAPSED_HTML = '<div class="nothing-here-block diff-collapsed">This diff is collapsed. <a class="click-to-expand">Click to expand it.</a></div>';
-
-  function SingleFileDiff(file) {
+class SingleFileDiff {
+  constructor(file) {
     this.file = file;
     this.toggleDiff = this.toggleDiff.bind(this);
     this.content = $('.diff-content', this.file);
@@ -37,7 +32,7 @@ window.SingleFileDiff = (function() {
     }).bind(this));
   }
 
-  SingleFileDiff.prototype.toggleDiff = function($target, cb) {
+  toggleDiff($target, cb) {
     if (!$target.hasClass('js-file-title') && !$target.hasClass('click-to-expand') && !$target.hasClass('diff-toggle-caret')) return;
     this.isOpen = !this.isOpen;
     if (!this.isOpen && !this.hasError) {
@@ -58,9 +53,9 @@ window.SingleFileDiff = (function() {
       this.$toggleIcon.addClass('fa-caret-down').removeClass('fa-caret-right');
       return this.getContentHTML(cb);
     }
-  };
+  }
 
-  SingleFileDiff.prototype.getContentHTML = function(cb) {
+  getContentHTML(cb) {
     this.collapsedContent.hide();
     this.loadingContent.show();
     $.get(this.diffForPath, (function(_this) {
@@ -84,10 +79,8 @@ window.SingleFileDiff = (function() {
         if (cb) cb();
       };
     })(this));
-  };
-
-  return SingleFileDiff;
-})();
+  }
+}
 
 $.fn.singleFileDiff = function() {
   return this.each(function() {
@@ -96,3 +89,5 @@ $.fn.singleFileDiff = function() {
     }
   });
 };
+
+window.SingleFileDiff = SingleFileDiff;