2 files changed, 5 insertions, 22 deletions
diff --git a/app/assets/javascripts/commit/file.js b/app/assets/javascripts/commit/file.js
deleted file mode 100644
index ee087c978dd..00000000000
--- a/app/assets/javascripts/commit/file.js
+++ /dev/null
@@ -1,14 +0,0 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-new */
-/* global ImageFile */
-
-(function() {
-  this.CommitFile = (function() {
-    function CommitFile(file) {
-      if ($('.image', file).length) {
-        new gl.ImageFile(file);
-      }
-    }
-
-    return CommitFile;
-  })();
-}).call(window);
diff --git a/app/assets/javascripts/commit/image_file.js b/app/assets/javascripts/commit/image_file.js
index 4763985c802..e7adf8814b8 100644
--- a/app/assets/javascripts/commit/image_file.js
+++ b/app/assets/javascripts/commit/image_file.js
@@ -1,4 +1,6 @@
 /* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, no-use-before-define, prefer-arrow-callback, no-else-return, consistent-return, prefer-template, quotes, one-var, one-var-declaration-per-line, no-unused-vars, no-return-assign, comma-dangle, quote-props, no-unused-expressions, no-sequences, object-shorthand, max-len */
+import 'vendor/jquery.waitforimages';
+
 (function() {
   gl.ImageFile = (function() {
     var prepareFrames;
@@ -17,15 +19,10 @@
 
             // Load two-up view after images are loaded
             // so that we can display the correct width and height information
-            const images = $('.two-up.view img', _this.file);
-            let loadedCount = 0;
-
-            images.on('load', () => {
-              loadedCount += 1;
+            const $images = $('.two-up.view img', _this.file);
 
-              if (loadedCount === images.length) {
-                _this.initView('two-up');
-              }
+            $images.waitForImages(function() {
+              _this.initView('two-up');
             });
           });
         };