Add message for when display is delayed by CSS caching

kiwix · Jun 1, 2018 · 41f1b70 · 41f1b70
1 parent 127ff29
commit 41f1b70
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/www/index.html b/www/index.html
@@ -255,7 +255,10 @@ <h3>Expert settings</h3>
                     </div>
                 </div>
                 <div id="readingArticle" style="display: none;" class="container">
-                    Reading article <span id="articleName"></span> from archive... Please wait <img src="img/spinner.gif" alt="Please wait..." />
+                    <p>Reading article <span id="articleName"></span> from archive... Please wait <img src="img/spinner.gif" alt="Please wait..." /></p>
+                </div>
+                <div id="cachingCSS" style="display: none;" class="container">
+                    <p>Caching styles to speed up future page display...</p>
                 </div>
                 <iframe id="articleContent" class="articleIFrame" src="article.html"></iframe>
             </article>

diff --git a/www/js/app.js b/www/js/app.js
@@ -966,6 +966,7 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies','abstractFiles
                     uiUtil.replaceCSSLinkWithInlineCSS(link, cssContent);
                     cssFulfilled++;
                 } else {
+                    $('#cachingCSS').show();
                     selectedArchive.getDirEntryByTitle(title)
                     .then(function (dirEntry) {
                         return selectedArchive.readUtf8File(dirEntry,
@@ -990,6 +991,7 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies','abstractFiles
             // until all CSS content is available [kiwix-js #381]
             function renderIfCSSFulfilled() {
                 if (cssFulfilled >= cssCount) {
+                    $('#cachingCSS').hide();
                     $('#readingArticle').hide();
                     $('#articleContent').show();
                 }