[REFACTOR] using already existing select

kiwix · Oct 22, 2023 · 430eefb · 430eefb
1 parent 3818fa2
commit 430eefb
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 13 deletions.
diff --git a/www/index.html b/www/index.html
@@ -467,12 +467,6 @@ <h2 data-i18n="configure-title">Configuration</h2>
                                 <a href="#" id="selectorsDisplayLink" data-i18n="configure-selectordisplay-link">display file selectors</a>.</p>
                         </div>
                         <div id="openLocalFiles" style="display: none; display: flex;flex-direction: row;">
-                            <div style="display: flex;flex-direction: row;">
-                                <p id="numberOfFilesDisplay">0</p>
-                                <span>&nbsp;archives found in selected location:</span>
-                            </div>
-                            <select id="zimSelectDropdown" style="display: none;">
-                            </select>
                             <p data-i18n="configure-select-instructions" id="selectInstructions">Please select or drag and drop a .zim file (or all the .zimaa, .zimab etc in
                                 case of a split ZIM file):</p>
                             <span id="fileSelectionButtonContainer">
@@ -497,10 +491,18 @@ <h2 data-i18n="configure-title">Configuration</h2>
                             <br /> Scanning for archives... Please wait <img src="img/spinner.gif" alt="Please wait..." />
                         </div>
                         <div id="chooseArchiveFromLocalStorage" style="display: none;">
-                            <br /> Please select the archive you want to use : <select id="archiveList"
+                            <div style="float: left;display: none;" id="fileCountDisplay">
+                                <p id="numberOfFilesDisplay" style="float: left;">0</p>
+                                <span>&nbsp;archives found in selected location.&nbsp;</span>
+                            </div>
+
+                            Please select the archive you want to use : <select id="archiveList"
                                 class="form-control"></select>
-                            <br /><button type="button" class="btn btn-light" id="btnRescanDeviceStorage">Rescan</button>
-                            Rescans your SD Cards and internal memory
+                            <br />
+                            <span id="rescanButtonAndText" style="display: none;">
+                                <button type="button" class="btn btn-light" id="btnRescanDeviceStorage">Rescan</button>
+                                Rescans your SD Cards and internal memory
+                            </span>
                         </div>
                     </div>
                     <br />

diff --git a/www/js/app.js b/www/js/app.js
@@ -1161,6 +1161,7 @@ window.onpopstate = function (event) {
 function populateDropDownListOfArchives (archiveDirectories) {
     document.getElementById('scanningForArchives').style.display = 'none';
     document.getElementById('chooseArchiveFromLocalStorage').style.display = '';
+    document.getElementById('rescanButtonAndText').style.display = '';
     var comboArchiveList = document.getElementById('archiveList');
     comboArchiveList.options.length = 0;
     for (var i = 0; i < archiveDirectories.length; i++) {
@@ -1266,7 +1267,7 @@ function displayFileSelect () {
 
     document.getElementById('openLocalFiles').style.display = 'block';
     if (isFileSystemAPISupported || isWebkitSupported) {
-        document.getElementById('zimSelectDropdown').style.display = '';
+        document.getElementById('chooseArchiveFromLocalStorage').style.display = '';
         document.getElementById('folderSelect').style.display = '';
     }
 
@@ -1285,7 +1286,7 @@ function displayFileSelect () {
         globalDropZone.addEventListener('drop', handleFileDrop);
     }
 
-    document.getElementById('zimSelectDropdown').addEventListener('change', async function (e) {
+    document.getElementById('archiveList').addEventListener('change', async function (e) {
         // handle zim selection from dropdown if multiple files are loaded via webkitdirectory or filesystem api
         if (isFileSystemAPISupported) {
             const files = await fileSystem.getSelectedZimFromCache(e.target.value)
@@ -1312,6 +1313,7 @@ function displayFileSelect () {
                 filenames.push(file.name);
             }
             webKitFileList = e.target.files;
+            // populateDropDownListOfArchives(filenames);
             await fileSystem.updateZimDropdownOptions({ fileOrDirHandle: null, files: filenames }, '');
         })
     }

diff --git a/www/js/lib/fileSystem.js b/www/js/lib/fileSystem.js
@@ -14,7 +14,7 @@ import cache from './cache.js';
  * @returns {Promise<Array<string>>} Array of unique filenames (if a split zim is considered a single file)
  */
 async function updateZimDropdownOptions (fileSystemHandler, selectedFile) {
-    const select = document.getElementById('zimSelectDropdown');
+    const select = document.getElementById('archiveList');
     let options = '';
     let count = 0;
     if (fileSystemHandler.files.length !== 0) options += '<option value="">Select an archive..</option>';
@@ -26,8 +26,9 @@ async function updateZimDropdownOptions (fileSystemHandler, selectedFile) {
         }
     });
     select.innerHTML = options;
-    document.getElementById('zimSelectDropdown').value = selectedFile;
+    document.getElementById('archiveList').value = selectedFile;
     document.getElementById('numberOfFilesDisplay').innerText = count;
+    document.getElementById('fileCountDisplay').style.display = '';
 }
 
 /**