From 2d1b68837b6c9e4600b2be15a856c44d4873db34 Mon Sep 17 00:00:00 2001
From: Jaifroid <egk10@cam.ac.uk>
Date: Tue, 23 Jan 2018 08:19:52 +0000
Subject: [PATCH] Changes to Dark Theme and display of file version on settings
 page

# Conflicts:
#	www/index.html

# Conflicts:
#	www/index.html


Former-commit-id: be002eaf42d4352822d469dfadb29603f9e0e9c2 [formerly 22ec64ef09e388b139d1f2c24ff985770a8e355b]
Former-commit-id: 56c5dde984bcff3f8bb1a50f3d788b2c51462dab
---
 www/index.html | 36 ++++++++++++++++++------------------
 www/js/app.js  |  3 ++-
 www/js/init.js |  5 ++++-
 3 files changed, 24 insertions(+), 20 deletions(-)

diff --git a/www/index.html b/www/index.html
index d0c7fbd3..a0593497 100644
--- a/www/index.html
+++ b/www/index.html
@@ -136,7 +136,7 @@
                     <h3 style="margin-top:0;">
                         Offline Wikipedia Viewer <small>(Version <span id="version"></span>)</small>
                     </h3>
-                    <p><small>Packaged ZIM archive: <b><span id="fileVersion"></span></b></small></p>
+                    <p><small>Packaged ZIM archive: <b><span class="fileVersion"></span></b></small></p>
                     <p>Official site : <a href="http://www.kiwix.org/" target="_blank">http://www.kiwix.org/</a></p>
                     <p>
                         If your Internet access is expensive / slow / unreliable / watched / censored, you can still gain offline access to a huge
@@ -370,6 +370,23 @@
                         <div class="row">
                             <h3>Display settings</h3>
                             <div class="column">
+                                <div id="displayThemeDiv" class="panel panel-info" style="clear: left;">
+                                    <div class="panel-heading">Dark mode:</div>
+                                    <div class="panel-body">
+                                        <label class="checkbox">
+                                            <input type="checkbox" name="cssUIDarkTheme" id="cssUIDarkThemeCheck">
+                                            <b>Use dark mode for User Interface</b>
+                                        </label>
+                                        <label class="checkbox">
+                                            <input type="checkbox" name="cssWikiDarkTheme" id="cssWikiDarkThemeCheck">
+                                            <b>Use dark theme for articles</b> (<i>experimental</i>: may only work with Wikipedia)
+                                        </label>
+                                        <label id="darkInvert" style="display:none;" class="checkbox">
+                                            <input type="checkbox" name="cssWikiDarkThemeInvert" id="cssWikiDarkThemeInvertCheck">
+                                            <b>Use simple inversion for dark theme</b> (should work with all archive types)
+                                        </label>
+                                    </div>
+                                </div>
                                 <div class="panel panel-info" id="cssSettingsDiv">
                                     <div class="panel-heading">Display style:</div>
                                     <div class="panel-body">
@@ -410,26 +427,9 @@
                                         </label>
                                     </div>
                                 </div>
-                                <div id="displayThemeDiv" class="panel panel-info" style="clear: left;">
-                                    <div class="panel-heading">Dark mode:</div>
-                                    <div class="panel-body">
-                                        <label class="checkbox">
-                                            <input type="checkbox" name="cssUIDarkTheme" id="cssUIDarkThemeCheck">
-                                            <b>Use dark mode for User Interface</b>
-                                        </label>
-                                        <label class="checkbox">
-                                            <input type="checkbox" name="cssWikiDarkTheme" id="cssWikiDarkThemeCheck">
-                                            <b>Use dark theme for articles</b> (<i>experimental</i>: may only work with Wikipedia)
-                                        </label>
-                                        <label id="darkInvert" style="display:none;" class="checkbox">
-                                            <input type="checkbox" name="cssWikiDarkThemeInvert" id="cssWikiDarkThemeInvertCheck">
-                                            <b>Use simple inversion for dark theme</b> (should work with all archive types)
-                                        </label>
                                     </div>
                                 </div>
                             </div>
-                        </div>
-                    </div>
                     <div id="returntoArticle_bottom" style="text-align:center;"></div>
                     <div>
                         <div class="row">
diff --git a/www/js/app.js b/www/js/app.js
index b48dc83d..04dde65d 100644
--- a/www/js/app.js
+++ b/www/js/app.js
@@ -561,6 +561,7 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies', 'q', 'module'
             params.cssUITheme = this.checked ? 'dark' : 'light';
             cookies.setItem('cssUITheme', params.cssUITheme, Infinity);
             cssUIThemeSet(params.cssUITheme);
+            if (params.cssUITheme !== params.cssTheme) $('#cssWikiDarkThemeCheck').click();
         });
 
         function cssUIThemeSet(value) {
@@ -1047,7 +1048,7 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies', 'q', 'module'
          */
         function setLocalArchiveFromArchiveList() {
             var archiveDirectory = $('#archiveList').val();
-            document.getElementById('kiwixIcon').src = /wikivoyage/i.test(archiveDirectory) ? params.cssUITheme == "light" ? "./img/icons/wikivoyage-black-32.png" : "./img/icons/wikivoyage-white-32.png" : params.cssUITheme == "light" ? "./img/icons/kiwix-blue-32.png" : "./img/icons/kiwix-32.png";
+            document.getElementById('kiwixIcon').src = /wikivoyage/i.test(archiveDirectory) ? params.cssUITheme == "light" ? "./img/icons/wikivoyage-black-32.png" : "./img/icons/wikivoyage-white-32.png" : /medicine/i.test(archiveDirectory) ? params.cssUITheme == "light" ? "./img/icons/wikimed-lightblue-32.png" : "./img/icons/wikimed-blue-32.png" : params.cssUITheme == "light" ? "./img/icons/kiwix-blue-32.png" : "./img/icons/kiwix-32.png";
             if (archiveDirectory && archiveDirectory.length > 0) {
                 // Now, try to find which DeviceStorage has been selected by the user
                 // It is the prefix of the archive directory
diff --git a/www/js/init.js b/www/js/init.js
index 07e5ac34..f84f5847 100644
--- a/www/js/init.js
+++ b/www/js/init.js
@@ -64,7 +64,10 @@ document.getElementById('useMathJaxRadio' + (params.useMathJax ? 'True' : 'False
 document.getElementById('rememberLastPageCheck').checked = params.rememberLastPage;
 document.getElementById('displayFileSelectorsCheck').checked = params.showFileSelectors;
 document.getElementById('version').innerHTML = params.version;
-document.getElementById('fileVersion').innerHTML = params.fileVersion;
+var versionDivs = document.getElementsByClassName('fileVersion');
+for (var i = 0; i < versionDivs.length; i++) {
+    versionDivs[i].innerHTML = i ? params['fileVersion'].replace(/\s+.+$/, "") : params['fileVersion'];
+}
 
 //Set up storage types
 if (params.storedFile && typeof Windows !== 'undefined' && typeof Windows.Storage !== 'undefined') { //UWP