diff --git a/resources/texts/_contentManager.html b/resources/texts/_contentManager.html index 819e04d..03bfb42 100644 --- a/resources/texts/_contentManager.html +++ b/resources/texts/_contentManager.html @@ -53,6 +53,16 @@ function getDownloadInfo(id) { }); } +function displayLoadIcon(display) { + if (display) { + document.getElementById("load-icon").classList.remove("do-not-display") + document.getElementById("bookList").classList.add("do-not-display"); + } else { + document.getElementById("load-icon").classList.add("do-not-display"); + document.getElementById("bookList").classList.remove("do-not-display") + } +} + function init() { new QWebChannel(qt.webChannelTransport, function(channel) { contentManager = channel.objects.contentManager; @@ -103,7 +113,9 @@ function init() { } }); contentManager.booksChanged.connect(onBooksChanged); + contentManager.pendingRequest.connect(displayLoadIcon); onBooksChanged(); + displayLoadIcon(false); }); } @@ -284,6 +296,24 @@ details:hover { .menu-option:hover { background: rgba(0, 0, 0, 0.2); } +.loader { + margin: 0 auto; + border: 16px solid #f3f3f3; /* Light grey */ + border-top: 16px solid #3498db; /* Blue */ + border-radius: 50%; + width: 120px; + height: 120px; + animation: spin 2s linear infinite; +} + +.do-not-display { + display: none; +} + +@keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} @@ -303,6 +333,7 @@ details:hover { Content type +