WebUI: Use native function for selecting elements by ID

This commit is contained in:
skomerko
2025-04-12 11:57:27 +02:00
parent 7b3aa51bb1
commit 411ca0f668
48 changed files with 1303 additions and 1303 deletions

View File

@@ -107,7 +107,7 @@ window.qBittorrent.Search ??= (() => {
const init = () => {
// load "Search in" preference from local storage
$("searchInTorrentName").value = (LocalPreferences.get("search_in_filter") === "names") ? "names" : "everywhere";
document.getElementById("searchInTorrentName").value = (LocalPreferences.get("search_in_filter") === "names") ? "names" : "everywhere";
const searchResultsTableContextMenu = new window.qBittorrent.ContextMenu.ContextMenu({
targets: "#searchResultsTableDiv tbody tr",
menu: "searchResultsTableMenu",
@@ -128,12 +128,12 @@ window.qBittorrent.Search ??= (() => {
// listen for changes to searchInNameFilter
let searchInNameFilterTimer = -1;
$("searchInNameFilter").addEventListener("input", () => {
document.getElementById("searchInNameFilter").addEventListener("input", () => {
clearTimeout(searchInNameFilterTimer);
searchInNameFilterTimer = setTimeout(() => {
searchInNameFilterTimer = -1;
const value = $("searchInNameFilter").value;
const value = document.getElementById("searchInNameFilter").value;
searchText.filterPattern = value;
searchFilterChanged();
}, window.qBittorrent.Misc.FILTER_INPUT_DELAY);
@@ -200,15 +200,15 @@ window.qBittorrent.Search ??= (() => {
document.getElementById("startSearchButton").lastChild.textContent = "QBT_TR(Search)QBT_TR[CONTEXT=SearchEngineWidget]";
});
listItem.appendChild(tabElem);
$("searchTabs").appendChild(listItem);
document.getElementById("searchTabs").appendChild(listItem);
searchResultsTabsContextMenu.addTarget(listItem);
// unhide the results elements
if (numSearchTabs() >= 1) {
$("searchResultsNoSearches").classList.add("invisible");
$("searchResultsFilters").classList.remove("invisible");
$("searchResultsTableContainer").classList.remove("invisible");
$("searchTabsToolbar").classList.remove("invisible");
document.getElementById("searchResultsNoSearches").classList.add("invisible");
document.getElementById("searchResultsFilters").classList.remove("invisible");
document.getElementById("searchResultsTableContainer").classList.remove("invisible");
document.getElementById("searchTabsToolbar").classList.remove("invisible");
}
// select new tab
@@ -268,12 +268,12 @@ window.qBittorrent.Search ??= (() => {
resetSearchState();
resetFilters();
$("numSearchResultsVisible").textContent = 0;
$("numSearchResultsTotal").textContent = 0;
$("searchResultsNoSearches").classList.remove("invisible");
$("searchResultsFilters").classList.add("invisible");
$("searchResultsTableContainer").classList.add("invisible");
$("searchTabsToolbar").classList.add("invisible");
document.getElementById("numSearchResultsVisible").textContent = 0;
document.getElementById("numSearchResultsTotal").textContent = 0;
document.getElementById("searchResultsNoSearches").classList.remove("invisible");
document.getElementById("searchResultsFilters").classList.add("invisible");
document.getElementById("searchResultsTableContainer").classList.add("invisible");
document.getElementById("searchTabsToolbar").classList.add("invisible");
}
else if (isTabSelected && newTabToSelect) {
setActiveTab(newTabToSelect);
@@ -335,23 +335,23 @@ window.qBittorrent.Search ??= (() => {
// restore filters
searchText.pattern = state.searchPattern;
searchText.filterPattern = state.filterPattern;
$("searchInNameFilter").value = state.filterPattern;
document.getElementById("searchInNameFilter").value = state.filterPattern;
searchSeedsFilter.min = state.seedsFilter.min;
searchSeedsFilter.max = state.seedsFilter.max;
$("searchMinSeedsFilter").value = state.seedsFilter.min;
$("searchMaxSeedsFilter").value = state.seedsFilter.max;
document.getElementById("searchMinSeedsFilter").value = state.seedsFilter.min;
document.getElementById("searchMaxSeedsFilter").value = state.seedsFilter.max;
searchSizeFilter.min = state.sizeFilter.min;
searchSizeFilter.minUnit = state.sizeFilter.minUnit;
searchSizeFilter.max = state.sizeFilter.max;
searchSizeFilter.maxUnit = state.sizeFilter.maxUnit;
$("searchMinSizeFilter").value = state.sizeFilter.min;
$("searchMinSizePrefix").value = state.sizeFilter.minUnit;
$("searchMaxSizeFilter").value = state.sizeFilter.max;
$("searchMaxSizePrefix").value = state.sizeFilter.maxUnit;
document.getElementById("searchMinSizeFilter").value = state.sizeFilter.min;
document.getElementById("searchMinSizePrefix").value = state.sizeFilter.minUnit;
document.getElementById("searchMaxSizeFilter").value = state.sizeFilter.max;
document.getElementById("searchMaxSizePrefix").value = state.sizeFilter.maxUnit;
const currentSearchPattern = $("searchPattern").value.trim();
const currentSearchPattern = document.getElementById("searchPattern").value.trim();
if (state.running && (state.searchPattern === currentSearchPattern)) {
// allow search to be stopped
document.getElementById("startSearchButton").lastChild.textContent = "QBT_TR(Stop)QBT_TR[CONTEXT=SearchEngineWidget]";
@@ -360,7 +360,7 @@ window.qBittorrent.Search ??= (() => {
searchResultsTable.setSortedColumn(state.sort.column, state.sort.reverse);
$("searchInTorrentName").value = state.searchIn;
document.getElementById("searchInTorrentName").value = state.searchIn;
}
// must restore all filters before calling updateTable
@@ -370,8 +370,8 @@ window.qBittorrent.Search ??= (() => {
if (rowsToSelect.length > 0)
searchResultsTable.reselectRows(rowsToSelect);
$("numSearchResultsVisible").textContent = searchResultsTable.getFilteredAndSortedRows().length;
$("numSearchResultsTotal").textContent = searchResultsTable.getRowSize();
document.getElementById("numSearchResultsVisible").textContent = searchResultsTable.getFilteredAndSortedRows().length;
document.getElementById("numSearchResultsTotal").textContent = searchResultsTable.getRowSize();
};
const getStatusIconElement = (text, image) => {
@@ -386,7 +386,7 @@ window.qBittorrent.Search ??= (() => {
};
const updateStatusIconElement = (searchId, text, image) => {
const searchTab = $(`${searchTabIdPrefix}${searchId}`);
const searchTab = document.getElementById(`${searchTabIdPrefix}${searchId}`);
if (searchTab) {
const statusIcon = searchTab.querySelector(".statusIcon");
statusIcon.alt = text;
@@ -439,7 +439,7 @@ window.qBittorrent.Search ??= (() => {
};
const getSelectedSearchId = () => {
const selectedTab = $("searchTabs").querySelector("li.selected");
const selectedTab = document.getElementById("searchTabs").querySelector("li.selected");
return selectedTab ? getSearchIdFromTab(selectedTab) : null;
};
@@ -448,9 +448,9 @@ window.qBittorrent.Search ??= (() => {
const state = searchState.get(currentSearchId);
const isSearchRunning = state && state.running;
if (!isSearchRunning || searchPatternChanged) {
const pattern = $("searchPattern").value.trim();
const category = $("categorySelect").value;
const plugins = $("pluginsSelect").value;
const pattern = document.getElementById("searchPattern").value.trim();
const category = document.getElementById("categorySelect").value;
const plugins = document.getElementById("pluginsSelect").value;
if (!pattern || !category || !plugins)
return;
@@ -506,7 +506,7 @@ window.qBittorrent.Search ??= (() => {
const manageSearchPlugins = () => {
const id = "searchPlugins";
if (!$(id)) {
if (!document.getElementById(id)) {
new MochaUI.Window({
id: id,
title: "QBT_TR(Search plugins)QBT_TR[CONTEXT=PluginSelectDlg]",
@@ -541,7 +541,7 @@ window.qBittorrent.Search ??= (() => {
const onSearchPatternChanged = () => {
const currentSearchId = getSelectedSearchId();
const state = searchState.get(currentSearchId);
const currentSearchPattern = $("searchPattern").value.trim();
const currentSearchPattern = document.getElementById("searchPattern").value.trim();
// start a new search if pattern has changed, otherwise allow the search to be stopped
if (state && (state.searchPattern === currentSearchPattern)) {
searchPatternChanged = false;
@@ -554,11 +554,11 @@ window.qBittorrent.Search ??= (() => {
};
const categorySelected = () => {
selectedCategory = $("categorySelect").value;
selectedCategory = document.getElementById("categorySelect").value;
};
const pluginSelected = () => {
selectedPlugin = $("pluginsSelect").value;
selectedPlugin = document.getElementById("pluginsSelect").value;
if (selectedPlugin !== prevSelectedPlugin) {
prevSelectedPlugin = selectedPlugin;
@@ -567,18 +567,18 @@ window.qBittorrent.Search ??= (() => {
};
const reselectCategory = () => {
for (let i = 0; i < $("categorySelect").options.length; ++i) {
if ($("categorySelect").options[i].get("value") === selectedCategory)
$("categorySelect").options[i].selected = true;
for (let i = 0; i < document.getElementById("categorySelect").options.length; ++i) {
if (document.getElementById("categorySelect").options[i].get("value") === selectedCategory)
document.getElementById("categorySelect").options[i].selected = true;
}
categorySelected();
};
const reselectPlugin = () => {
for (let i = 0; i < $("pluginsSelect").options.length; ++i) {
if ($("pluginsSelect").options[i].get("value") === selectedPlugin)
$("pluginsSelect").options[i].selected = true;
for (let i = 0; i < document.getElementById("pluginsSelect").options.length; ++i) {
if (document.getElementById("pluginsSelect").options[i].get("value") === selectedPlugin)
document.getElementById("pluginsSelect").options[i].selected = true;
}
pluginSelected();
@@ -614,10 +614,10 @@ window.qBittorrent.Search ??= (() => {
categoryOptions.splice(1, 0, option);
}
$("categorySelect").replaceChildren(...categoryOptions);
document.getElementById("categorySelect").replaceChildren(...categoryOptions);
};
const selectedPlugin = $("pluginsSelect").value;
const selectedPlugin = document.getElementById("pluginsSelect").value;
if ((selectedPlugin === "all") || (selectedPlugin === "enabled")) {
const uniqueCategories = {};
@@ -675,9 +675,9 @@ window.qBittorrent.Search ??= (() => {
const searchPluginsEmpty = (searchPlugins.length === 0);
if (!searchPluginsEmpty) {
$("searchResultsNoPlugins").classList.add("invisible");
document.getElementById("searchResultsNoPlugins").classList.add("invisible");
if (numSearchTabs() === 0)
$("searchResultsNoSearches").classList.remove("invisible");
document.getElementById("searchResultsNoSearches").classList.remove("invisible");
// sort plugins alphabetically
const allPlugins = searchPlugins.sort((left, right) => {
@@ -695,11 +695,11 @@ window.qBittorrent.Search ??= (() => {
pluginOptions.splice(2, 0, createOption("──────────", undefined, true));
}
$("pluginsSelect").replaceChildren(...pluginOptions);
document.getElementById("pluginsSelect").replaceChildren(...pluginOptions);
$("searchPattern").disabled = searchPluginsEmpty;
$("categorySelect").disabled = searchPluginsEmpty;
$("pluginsSelect").disabled = searchPluginsEmpty;
document.getElementById("searchPattern").disabled = searchPluginsEmpty;
document.getElementById("categorySelect").disabled = searchPluginsEmpty;
document.getElementById("pluginsSelect").disabled = searchPluginsEmpty;
document.getElementById("startSearchButton").disabled = searchPluginsEmpty;
if (window.qBittorrent.SearchPlugins !== undefined)
@@ -721,25 +721,25 @@ window.qBittorrent.Search ??= (() => {
const resetFilters = () => {
searchText.filterPattern = "";
$("searchInNameFilter").value = "";
document.getElementById("searchInNameFilter").value = "";
searchSeedsFilter.min = 0;
searchSeedsFilter.max = 0;
$("searchMinSeedsFilter").value = searchSeedsFilter.min;
$("searchMaxSeedsFilter").value = searchSeedsFilter.max;
document.getElementById("searchMinSeedsFilter").value = searchSeedsFilter.min;
document.getElementById("searchMaxSeedsFilter").value = searchSeedsFilter.max;
searchSizeFilter.min = 0.00;
searchSizeFilter.minUnit = 2; // B = 0, KiB = 1, MiB = 2, GiB = 3, TiB = 4, PiB = 5, EiB = 6
searchSizeFilter.max = 0.00;
searchSizeFilter.maxUnit = 3;
$("searchMinSizeFilter").value = searchSizeFilter.min;
$("searchMinSizePrefix").value = searchSizeFilter.minUnit;
$("searchMaxSizeFilter").value = searchSizeFilter.max;
$("searchMaxSizePrefix").value = searchSizeFilter.maxUnit;
document.getElementById("searchMinSizeFilter").value = searchSizeFilter.min;
document.getElementById("searchMinSizePrefix").value = searchSizeFilter.minUnit;
document.getElementById("searchMaxSizeFilter").value = searchSizeFilter.max;
document.getElementById("searchMaxSizePrefix").value = searchSizeFilter.maxUnit;
};
const getSearchInTorrentName = () => {
return ($("searchInTorrentName").value === "names") ? "names" : "everywhere";
return (document.getElementById("searchInTorrentName").value === "names") ? "names" : "everywhere";
};
const searchInTorrentName = () => {
@@ -748,29 +748,29 @@ window.qBittorrent.Search ??= (() => {
};
const searchSeedsFilterChanged = () => {
searchSeedsFilter.min = $("searchMinSeedsFilter").value;
searchSeedsFilter.max = $("searchMaxSeedsFilter").value;
searchSeedsFilter.min = document.getElementById("searchMinSeedsFilter").value;
searchSeedsFilter.max = document.getElementById("searchMaxSeedsFilter").value;
searchFilterChanged();
};
const searchSizeFilterChanged = () => {
searchSizeFilter.min = $("searchMinSizeFilter").value;
searchSizeFilter.minUnit = $("searchMinSizePrefix").value;
searchSizeFilter.max = $("searchMaxSizeFilter").value;
searchSizeFilter.maxUnit = $("searchMaxSizePrefix").value;
searchSizeFilter.min = document.getElementById("searchMinSizeFilter").value;
searchSizeFilter.minUnit = document.getElementById("searchMinSizePrefix").value;
searchSizeFilter.max = document.getElementById("searchMaxSizeFilter").value;
searchSizeFilter.maxUnit = document.getElementById("searchMaxSizePrefix").value;
searchFilterChanged();
};
const searchSizeFilterPrefixChanged = () => {
if ((Number($("searchMinSizeFilter").value) !== 0) || (Number($("searchMaxSizeFilter").value) !== 0))
if ((Number(document.getElementById("searchMinSizeFilter").value) !== 0) || (Number(document.getElementById("searchMaxSizeFilter").value) !== 0))
searchSizeFilterChanged();
};
const searchFilterChanged = () => {
searchResultsTable.updateTable();
$("numSearchResultsVisible").textContent = searchResultsTable.getFilteredAndSortedRows().length;
document.getElementById("numSearchResultsVisible").textContent = searchResultsTable.getFilteredAndSortedRows().length;
};
const loadSearchResultsData = function(searchId) {
@@ -799,7 +799,7 @@ window.qBittorrent.Search ??= (() => {
return;
}
$("error_div").textContent = "";
document.getElementById("error_div").textContent = "";
const state = searchState.get(searchId);
// check if user stopped the search prior to receiving the response
@@ -842,8 +842,8 @@ window.qBittorrent.Search ??= (() => {
for (const row of newRows)
searchResultsTable.updateRowData(row);
$("numSearchResultsVisible").textContent = searchResultsTable.getFilteredAndSortedRows().length;
$("numSearchResultsTotal").textContent = searchResultsTable.getRowSize();
document.getElementById("numSearchResultsVisible").textContent = searchResultsTable.getFilteredAndSortedRows().length;
document.getElementById("numSearchResultsTotal").textContent = searchResultsTable.getRowSize();
searchResultsTable.updateTable();
}