Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Web-UI: Search for files feature #268

Merged
merged 1 commit into from
Nov 22, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
3 changes: 3 additions & 0 deletions html/locales/de.json
Original file line number Diff line number Diff line change
Expand Up @@ -96,6 +96,9 @@
"title": "Ordner",
"desc": "Einen Ordner samt Inhalt (und allen Unterordnern) hochladen"
},
"search": {
"placeholder": "Dateien suchen.."
},
"upload": {
"title": "Upload",
"desc": "Upload starten",
Expand Down
3 changes: 3 additions & 0 deletions html/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -96,6 +96,9 @@
"title": "Directory",
"desc": "Upload directory with all files and subdirectories"
},
"search": {
"placeholder": "Search files.."
},
"upload": {
"title": "Upload",
"desc": "Start Upload",
Expand Down
28 changes: 24 additions & 4 deletions html/management.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,22 +7,27 @@
<link rel="preconnect" href="https://cdnjs.cloudflare.com">
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/4.6.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.16/themes/default/style.min.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/11.0.2/css/bootstrap-slider.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/2.11.8/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/4.6.2/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.16/jstree.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/11.0.2/bootstrap-slider.min.js"></script>

<script src="/js/i18next.min.js"></script>
<script src="/js/i18nextHttpBackend.min.js"></script>
<script src="/js/loc_i18next.min.js"></script>
<style type="text/css">
.jstree-default .jstree-search {
font-style: italic;
color: #007bff; /* change searchresult theme-color to bootstrap blue */
font-weight: bold;
}
.filetree {
border: 1px solid black;
height: 200px;
Expand Down Expand Up @@ -423,7 +428,15 @@ <h5 class="modal-title" data-i18n="tools.nvserase.title"></h5>
<div id="filebrowser">
<div class="filetree demo" id="explorerTree"></div>
</div>
<div class="input-group input-focus">
<div class="input-group-prepend">
<span class="input-group-text bg-white"><i class="fas fa-search"></i></span>
</div>
<input type="search" id="filetreesearch" data-i18n="[placeholder]files.search.placeholder" class="form-control border-left-0" onsearch="searchFiles($(this).val())" onkeyup="searchFiles($(this).val())">
</div>
<div>
<br>
<legend id="filesupload" data-i18n="files.upload.title">Files</legend>
<form id="explorerUploadForm" method="POST" enctype="multipart/form-data" action="/explorer">
<div class="input-group">
<span class="form-control" id="uploaded_file_text"></span>&nbsp
Expand Down Expand Up @@ -1361,7 +1374,11 @@ <h5 class="modal-title" data-i18n="tools.nvserase.title"></h5>
'icon': "fa fa-folder"
}
},
plugins: ["contextmenu", "themes", "types"],
plugins: ["contextmenu", "themes", "types", "search"],
"search": {
"case_sensitive": false,
"show_only_matches": true
},
contextmenu: {
items: function(nodeId) {
var ref = $('#explorerTree').jstree(true);
Expand Down Expand Up @@ -2040,6 +2057,10 @@ <h5 class="modal-title" data-i18n="tools.nvserase.title"></h5>
await rebuildSSIDList();
}

function searchFiles(searchText) {
$('#explorerTree').jstree('search', searchText);
}

function sendControl(cmd) {
var myObj = {
"controls": {
Expand Down Expand Up @@ -2196,7 +2217,6 @@ <h5 class="modal-title" data-i18n="tools.nvserase.title"></h5>
shutdownDevice();
});

console.log(parseInt(document.getElementById('warningLowVoltage').value));
$(function () {
$('[data-toggle="tooltip"]').tooltip();
});
Expand Down