From 0c3d2322ccb832bf380cf3376f04e8303e1378ab Mon Sep 17 00:00:00 2001 From: Damien Churchill Date: Tue, 4 Oct 2011 20:39:59 +0100 Subject: web: add loading mask Add a loading mask that hides the loading of the interface with some text and a nice ajax spinner. The situation can be further improved by loading all of the scripts and other resources dynamically, which will be added later. --- deluge/ui/web/css/deluge.css | 30 ++++++++++++++++++++++++++++++ deluge/ui/web/images/loading.gif | Bin 0 -> 3208 bytes deluge/ui/web/index.html | 7 ++++++- deluge/ui/web/js/deluge-all/UI.js | 2 ++ 4 files changed, 38 insertions(+), 1 deletion(-) create mode 100644 deluge/ui/web/images/loading.gif diff --git a/deluge/ui/web/css/deluge.css b/deluge/ui/web/css/deluge.css index 303a0d1f7..12ad52b5e 100644 --- a/deluge/ui/web/css/deluge.css +++ b/deluge/ui/web/css/deluge.css @@ -11,6 +11,36 @@ input { color: Black; } +#loading-mask { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: 20000; + background-color: white; +} + +#loading { + position: absolute; + left: 50%; + top: 50%; + padding: 2px; + z-index: 20001; + height: auto; + margin: -35px 0 0 -30px; +} + +#loading .loading-indicator { + background: url('../images/loading.gif') no-repeat; + color: #555; + font: 24px "UbuntuBeta Regular",Ubuntu,"Bitstream Vera Sans","DejaVu Sans",Tahoma,sans-serif; + padding: 2px 42px; + margin: 0; + text-align: center; + height: auto; +} + .x-deluge-main-panel { background-image: url('../icons/deluge.png'); } diff --git a/deluge/ui/web/images/loading.gif b/deluge/ui/web/images/loading.gif new file mode 100644 index 000000000..3c2f7c058 Binary files /dev/null and b/deluge/ui/web/images/loading.gif differ diff --git a/deluge/ui/web/index.html b/deluge/ui/web/index.html index 3b53400be..694c5b843 100644 --- a/deluge/ui/web/index.html +++ b/deluge/ui/web/index.html @@ -31,7 +31,12 @@ -

+ Loading... +

diff --git a/deluge/ui/web/js/deluge-all/UI.js b/deluge/ui/web/js/deluge-all/UI.js index bab33294e..d7c710516 100644 --- a/deluge/ui/web/js/deluge-all/UI.js +++ b/deluge/ui/web/js/deluge-all/UI.js @@ -99,6 +99,8 @@ deluge.ui = { deluge.client.on('connected', function(e) { deluge.login.show(); + Ext.get('loading').remove(); + Ext.get('loading-mask').fadeOut({remove:true}); }, this, {single: true}); this.update = Ext.bind(this.update, this); -- cgit