[image-preivew] abort ajax request if mouse leave preview wrap

seahub/templates/repo.html

@@ -2370,7 +2370,7 @@ function updateCmt() {
 {% endif %}
 
 {% if not repo.encrypted and ENABLE_THUMBNAIL %}
-var timer,
+var timer, ajaxRequest = $.ajax(),
     default_size = {{PREVIEW_DEFAULT_SIZE}},
     preview_wrap = $('<div id="preview-wrap"><img id="image-preview" src="" alt=""/><div class="outer-caret right-outer-caret"><div class="inner-caret"></div></div></div>')
         .appendTo("body")
@@ -2385,7 +2385,7 @@ $("#repo-file-list").on({
             file_item = thumbnail.closest('.file-item');
 
         timer = setTimeout(function () {
-            $.ajax({
+            ajaxRequest = $.ajax({
                 url: '{% url 'thumbnail_create' repo.id %}?path=' + e(cur_path+file_item.attr('data-name')) + '&size=' + default_size,
                 cache: false,
                 dataType: 'json',
@@ -2424,11 +2424,20 @@ $("#repo-file-list").on({
                         }).fadeIn();
                     }
                 },
-            error: ajaxErrorHandler
+                error: function(xhr, textStatus, errorThrown) {
+                   if (textStatus != "abort") {
+                       if (xhr.responseText) {
+                           feedback($.parseJSON(xhr.responseText).error, 'error');
+                       } else {
+                           feedback("{% trans "Failed. Please check the network." %}", 'error');
+                       };
+                   };
+                }
             });
         }, 200);
     },
     mouseleave: function() {
+        ajaxRequest.abort();
         clearTimeout(timer);
         preview_wrap.hide();
         image_preview.attr('src', ''); // for ff. In ff, when hover, the last preview image would be shown first, then the right one.