From 30ab2cf9a721a7fd9a96cbaa51f61765243a496a Mon Sep 17 00:00:00 2001
From: shortcutme <tamas@zeronet.io>
Date: Thu, 29 Mar 2018 02:42:57 +0200
Subject: [PATCH] Transform progressbar with scale instead of changing width

---
 src/Ui/media/Loading.coffee | 4 ++--
 src/Ui/media/all.js         | 8 ++++++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/Ui/media/Loading.coffee b/src/Ui/media/Loading.coffee
index 57b973bb..b1ffba1f 100644
--- a/src/Ui/media/Loading.coffee
+++ b/src/Ui/media/Loading.coffee
@@ -8,12 +8,12 @@ class Loading
 		if @timer_hide
 			clearInterval @timer_hide
 		RateLimit 200, ->
-			$(".progressbar").css("width", percent*100+"%").css("opacity", "1").css("display", "block")
+			$(".progressbar").css("transform": "scaleX(#{parseInt(percent*100)/100})").css("opacity", "1").css("display", "block")
 
 	hideProgress: ->
 		console.log "hideProgress"
 		@timer_hide = setTimeout ( =>
-			$(".progressbar").css("width", "100%").css("opacity", "0").hideLater(1000)
+			$(".progressbar").css("transform": "scaleX(1)").css("opacity", "0").hideLater(1000)
 		), 300
 
 
diff --git a/src/Ui/media/all.js b/src/Ui/media/all.js
index ead47793..ade58213 100644
--- a/src/Ui/media/all.js
+++ b/src/Ui/media/all.js
@@ -587,7 +587,9 @@ jQuery.extend( jQuery.easing,
         clearInterval(this.timer_hide);
       }
       return RateLimit(200, function() {
-        return $(".progressbar").css("width", percent * 100 + "%").css("opacity", "1").css("display", "block");
+        return $(".progressbar").css({
+          "transform": "scaleX(" + (parseInt(percent * 100) / 100) + ")"
+        }).css("opacity", "1").css("display", "block");
       });
     };
 
@@ -595,7 +597,9 @@ jQuery.extend( jQuery.easing,
       console.log("hideProgress");
       return this.timer_hide = setTimeout(((function(_this) {
         return function() {
-          return $(".progressbar").css("width", "100%").css("opacity", "0").hideLater(1000);
+          return $(".progressbar").css({
+            "transform": "scaleX(1)"
+          }).css("opacity", "0").hideLater(1000);
         };
       })(this)), 300);
     };