From 7cee919f57c916ee6e3291c795fe25802d17c3ba Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?John=20Molakvo=C3=A6=20=28skjnldsv=29?=
 <skjnldsv@protonmail.com>
Date: Thu, 21 Sep 2017 19:46:29 +0200
Subject: [PATCH] Fix busy state loading animation in files
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
 apps/files/css/files.scss | 10 +++++++++-
 apps/files/js/filelist.js |  6 ++----
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/apps/files/css/files.scss b/apps/files/css/files.scss
index 8d5d245a6c..7c2d3b0bb1 100644
--- a/apps/files/css/files.scss
+++ b/apps/files/css/files.scss
@@ -296,11 +296,19 @@ table td.filename a.name {
 	line-height: 50px;
 	padding: 0;
 }
+table td.filename label.icon-loading-small {
+	&:after {
+		z-index: 10;
+	}
+	.thumbnail {
+		opacity: 0.2;
+	}
+}
 table td.filename .thumbnail {
 	display: inline-block;
 	width: 32px;
 	height: 32px;
-	margin-left: 8px;
+	margin-left: 9px;
 	margin-top: 9px;
 	cursor: pointer;
 	float: left;
diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
index 48ac0f4e33..fd13deedc0 100644
--- a/apps/files/js/filelist.js
+++ b/apps/files/js/filelist.js
@@ -2540,11 +2540,9 @@
 				$tr.toggleClass('busy', state);
 
 				if (state) {
-					$thumbEl.attr('data-oldimage', $thumbEl.css('background-image'));
-					$thumbEl.css('background-image', 'url('+ OC.imagePath('core', 'loading.gif') + ')');
+					$thumbEl.parent().addClass('icon-loading-small');
 				} else {
-					$thumbEl.css('background-image', $thumbEl.attr('data-oldimage'));
-					$thumbEl.removeAttr('data-oldimage');
+					$thumbEl.parent().removeClass('icon-loading-small');
 				}
 			});
 		},