added possibility to filter
This commit is contained in:
parent
307b60e805
commit
99409f913e
@ -67,4 +67,12 @@
|
||||
padding: 5px;
|
||||
margin-right: 20px; /* Adjust for indentation */
|
||||
}
|
||||
*/
|
||||
|
||||
.nosee {
|
||||
display: none !important;
|
||||
padding-top: 0px !important;
|
||||
padding-bottom: 0px !important;
|
||||
}
|
||||
|
||||
.see {
|
||||
}
|
||||
|
||||
@ -14,7 +14,7 @@ function add_file_tree_clickhanlder(side) {
|
||||
path.unshift(elem.textContent);
|
||||
let root_dir = document.getElementById(side + "_dir").value;
|
||||
path.push(root_dir);
|
||||
fetchmkvdata(path);
|
||||
fetchmkvdata(path,side);
|
||||
}
|
||||
}
|
||||
if (type == "folder") {
|
||||
|
||||
31
filter.js
Normal file
31
filter.js
Normal file
@ -0,0 +1,31 @@
|
||||
function filter_files(side) {
|
||||
var elements = Array.from(document.getElementsByClassName(side+ '-align'));
|
||||
let visibility = !side ? "see" : "nosee";
|
||||
|
||||
let filter_value = document.getElementById(side+"_filter").value;
|
||||
elements.forEach((x) => {
|
||||
if ( !filter_value) {
|
||||
x.classList.remove("nosee");
|
||||
x.classList.add("see");
|
||||
}
|
||||
else if (x.parentElement
|
||||
&& x.parentElement.parentElement
|
||||
&& x.parentElement.parentElement.id.startsWith("hierarchy")
|
||||
&& x.textContent === x.parentElement.parentElement.dataset.folder) {
|
||||
x.classList.remove("nosee");
|
||||
x.classList.add("see");
|
||||
}
|
||||
|
||||
else if (!(x.classList.contains("file") || x.classList.contains("folder") || x.classList.contains("foldercontainer"))) {
|
||||
x.classList.remove("nosee");
|
||||
x.classList.add("see");
|
||||
}
|
||||
else if (filter_value && x.textContent.match(new RegExp(filter_value))) {
|
||||
x.classList.remove("nosee");
|
||||
x.classList.add("see");
|
||||
} else {
|
||||
x.classList.add("nosee");
|
||||
x.classList.remove("see");
|
||||
}
|
||||
});
|
||||
}
|
||||
107
index.html
107
index.html
@ -9,59 +9,84 @@
|
||||
<link rel="stylesheet" href="css/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<table class="wide"><tr><td>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
|
||||
<div class="beside scrollable col-md4 bg-light p-4 m-2" >
|
||||
<label for="left-basedir">Left Basedir:</label>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
|
||||
<table class="wide"><tr><td>
|
||||
|
||||
<select name="left_dir" id="left_dir" onchange="set_left_dir()">
|
||||
<option value="media">tmp</option>
|
||||
<option value="media">movies</option>
|
||||
<option value="media">tvseries</option>
|
||||
<option value="download">nzb</option>
|
||||
</select>
|
||||
<div id="hierarchy-left" data-folder="tmp">
|
||||
<div class="foldercontainer" data-folder="tmp">
|
||||
<span class="folder fa-folder-o" data-isexpanded="false">tmp</span>
|
||||
|
||||
<label for="left-basedir">Left Basedir:</label>
|
||||
|
||||
<select name="left_dir" id="left_dir" onchange="set_base_dir('left')">
|
||||
<option value="media">tmp</option>
|
||||
<option value="media">movies</option>
|
||||
<option value="media">tvseries</option>
|
||||
<option value="download">nzb</option>
|
||||
</select>
|
||||
<label for="left-filter">Filter</label>
|
||||
<input type="text" id="left_filter" name="left_filter" onkeyup="filter_files('left')">
|
||||
</td><td>
|
||||
<label for="right-basedir">Reght Basedir::</label>
|
||||
|
||||
<select name="right_dir" id="right_dir" onchange="set_base_dir('right')">
|
||||
<option value="media">tmp</option>
|
||||
<option value="media">movies</option>
|
||||
<option value="media">tvseries</option>
|
||||
<option value="download">nzb</option>
|
||||
</select>
|
||||
<label for="right-filter">Filter</label>
|
||||
<input type="text" id="right_filter" name="right_filter" onkeyup="filter_files('right')" >
|
||||
</td></tr><tr><td>
|
||||
<div>
|
||||
|
||||
|
||||
<div class="beside scrollable col-md4 bg-light p-4 m-2 left" >
|
||||
<div id="hierarchy-left" data-folder="tmp">
|
||||
<div class="foldercontainer" data-folder="tmp">
|
||||
<span class="folder fa-folder-o" data-isexpanded="false">tmp</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div></td><td>
|
||||
<div class="beside info col-md4 bg-light p-4 m-2" id="info"></div>
|
||||
</td><td>
|
||||
<div id="table-container">
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div>
|
||||
|
||||
<div class="beside scrollable right-align col-md4 bg-light p-4 m-2">
|
||||
<label for="right-basedir">Reght Basedir::</label>
|
||||
|
||||
<select name="right_dir" id="right_dir" onchange="set_right_dir()">
|
||||
<option value="media">tmp</option>
|
||||
<option value="media">movies</option>
|
||||
<option value="media">tvseries</option>
|
||||
<option value="download">nzb</option>
|
||||
</select>
|
||||
<div id="hierarchy-right" data-folder="tmp">
|
||||
<div class="foldercontainer" data-folder="tmp">
|
||||
<span class="folder fa-folder-o" data-isexpanded="false">tmp</span>
|
||||
<div class="beside scrollable right-align col-md4 bg-light p-4 m-2 right">
|
||||
<div id="hierarchy-right" data-folder="tmp">
|
||||
<div class="foldercontainer" data-folder="tmp">
|
||||
<span class="folder fa-folder-o" data-isexpanded="false">tmp</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td></tr></table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="beside info col-md4 bg-light p-4 m-2" id="info-left"></div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="beside info col-md4 bg-light p-4 m-2" id="info-right"></div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<script src="file_structure.js" defer></script>
|
||||
<script src="table_builder.js" defer></script>
|
||||
<script src="mkvdatefetcher.js"></script>
|
||||
<script src="media_info_presenter.js"></script>
|
||||
<script src="filter.js"></script>
|
||||
<script>
|
||||
function set_left_dir() {
|
||||
let left_dir_select = document.getElementById("left_dir");
|
||||
let value = left_dir_select.options[left_dir_select.selectedIndex].text;
|
||||
function set_base_dir(side) {
|
||||
let text = document.getElementById(side+"_filter");
|
||||
text.setAttribute('value', '')
|
||||
let base_dir_select = document.getElementById(side+"_dir");
|
||||
let value = base_dir_select.options[base_dir_select.selectedIndex].text;
|
||||
|
||||
let left_hier = document.getElementById("hierarchy-left");
|
||||
left_hier.dataset.folder=value;
|
||||
left_hier.innerHTML = "";
|
||||
left_hier.appendChild(create_folder(value));
|
||||
let base_hier = document.getElementById("hierarchy-"+side);
|
||||
base_hier.dataset.folder=value;
|
||||
base_hier.innerHTML = "";
|
||||
base_hier.appendChild(create_folder(value));
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
@ -64,9 +64,9 @@ function create_media_info(data) {
|
||||
subs.appendChild(create_info_table(data["subtitles"], ["codec"]))
|
||||
info_ct.appendChild(subs);
|
||||
}
|
||||
info_ct.id="left_info";
|
||||
info_ct.classList.add("left_info");
|
||||
let info_obj = document.getElementById("info");
|
||||
info_ct.id=data["side"]+"_info";
|
||||
info_ct.classList.add(data["side"]+"_info");
|
||||
let info_obj = document.getElementById("info-"+data["side"]);
|
||||
info_obj.innerHTML = "";
|
||||
info_obj.appendChild(info_ct);
|
||||
}
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
|
||||
function fetchmkvdata(path) {
|
||||
function fetchmkvdata(path,side) {
|
||||
let fetcher = "mkvinfo.py";
|
||||
|
||||
console.log(path);
|
||||
let url = '/script/' + fetcher+ '?'
|
||||
let url = '/script/' + fetcher+ '?side='+ encodeURIComponent(side )+ "&"
|
||||
+ path
|
||||
.reverse()
|
||||
.map((par) => 'path=' + encodeURIComponent(par))
|
||||
|
||||
@ -10,6 +10,7 @@ from mkvservice.analyzer import MkvAnalyzer
|
||||
|
||||
form = cgi.FieldStorage()
|
||||
param = form.getvalue('path', [])
|
||||
side = form.getvalue('side', [])
|
||||
print(param, file=sys.stderr);
|
||||
print(sys.path, file=sys.stderr);
|
||||
|
||||
@ -34,6 +35,7 @@ if not os.path.isfile(path) or not path.endswith(".mkv"):
|
||||
|
||||
data = MkvAnalyzer.get_short_mkv_info(path)
|
||||
|
||||
data["side"] = side;
|
||||
ret(data)
|
||||
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user