mirror/qBittorrent
2
0
Fork 0
mirror of https://github.com/qbittorrent/qBittorrent.git synced 2025-01-06 15:04:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

Allow WebUI sidebar filters to be hidden

Browse Source
This commit is contained in:
Thomas Piccirello 2018-08-22 01:44:25 -04:00
parent adad883eb6
commit fef1ad6083
3 changed files with 55 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/webui/www/private/css/style.css
View File

@ -408,6 +408,19 @@ div.formRow {
font-weight: bold;
text-transform: uppercase;
padding-left: 5px;
padding-top: 5px;
display: block;
}
.filterTitle img {
width: 16px;
height: 16px;
margin-bottom: -3px;
padding: 0 5px;
}
.filterTitle img.rotate {
transform: rotate(270deg);
}
ul.filterList {

45
src/webui/www/private/filters.html
View File

@ -1,19 +1,26 @@
<span class="filterTitle">QBT_TR(Status)QBT_TR[CONTEXT=TransferListFiltersWidget]</span>
<ul class="filterList">
<li id="all_filter"><a href="#" onclick="setFilter('all');return false;"><img src="images/skin/filterall.svg" alt="All" />QBT_TR(All (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="downloading_filter"><a href="#" onclick="setFilter('downloading');return false;"><img src="images/skin/downloading.svg" alt="Downloading" />QBT_TR(Downloading (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="seeding_filter"><a href="#" onclick="setFilter('seeding');return false;"><img src="images/skin/uploading.svg" alt="Seeding" />QBT_TR(Seeding (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="completed_filter"><a href="#" onclick="setFilter('completed');return false;"><img src="images/skin/completed.svg" alt="Completed" />QBT_TR(Completed (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="resumed_filter"><a href="#" onclick="setFilter('resumed');return false;"><img src="images/skin/resumed.svg" alt="Resumed" />QBT_TR(Resumed (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="paused_filter"><a href="#" onclick="setFilter('paused');return false;"><img src="images/skin/paused.svg" alt="Paused" />QBT_TR(Paused (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="active_filter"><a href="#" onclick="setFilter('active');return false;"><img src="images/skin/filteractive.svg" alt="Active" />QBT_TR(Active (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="inactive_filter"><a href="#" onclick="setFilter('inactive');return false;"><img src="images/skin/filterinactive.svg" alt="Inactive" />QBT_TR(Inactive (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="errored_filter"><a href="#" onclick="setFilter('errored');return false;"><img src="images/skin/error.svg" alt="Errored" />QBT_TR(Errored (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
</ul>
<br/>
<span class="filterTitle">QBT_TR(Categories)QBT_TR[CONTEXT=TransferListFiltersWidget]</span>
<ul id="filterCategoryList" class="filterList">
</ul>
<div class="filterWrapper">
<span class="filterTitle" onclick="toggleFilterDisplay('status');">
<img src="images/qbt-theme/go-down.svg">QBT_TR(Status)QBT_TR[CONTEXT=TransferListFiltersWidget]
</span>
<ul class="filterList" id="statusFilterList">
<li id="all_filter"><a href="#" onclick="setFilter('all');return false;"><img src="images/skin/filterall.svg" alt="All" />QBT_TR(All (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="downloading_filter"><a href="#" onclick="setFilter('downloading');return false;"><img src="images/skin/downloading.svg" alt="Downloading" />QBT_TR(Downloading (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="seeding_filter"><a href="#" onclick="setFilter('seeding');return false;"><img src="images/skin/uploading.svg" alt="Seeding" />QBT_TR(Seeding (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="completed_filter"><a href="#" onclick="setFilter('completed');return false;"><img src="images/skin/completed.svg" alt="Completed" />QBT_TR(Completed (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="resumed_filter"><a href="#" onclick="setFilter('resumed');return false;"><img src="images/skin/resumed.svg" alt="Resumed" />QBT_TR(Resumed (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="paused_filter"><a href="#" onclick="setFilter('paused');return false;"><img src="images/skin/paused.svg" alt="Paused" />QBT_TR(Paused (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="active_filter"><a href="#" onclick="setFilter('active');return false;"><img src="images/skin/filteractive.svg" alt="Active" />QBT_TR(Active (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="inactive_filter"><a href="#" onclick="setFilter('inactive');return false;"><img src="images/skin/filterinactive.svg" alt="Inactive" />QBT_TR(Inactive (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="errored_filter"><a href="#" onclick="setFilter('errored');return false;"><img src="images/skin/error.svg" alt="Errored" />QBT_TR(Errored (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
</ul>
</div>
<div class="filterWrapper">
<span class="filterTitle" onclick="toggleFilterDisplay('category');">
<img src="images/qbt-theme/go-down.svg">QBT_TR(Categories)QBT_TR[CONTEXT=TransferListFiltersWidget]
</span>
<ul class="filterList" id="categoryFilterList">
</ul>
</div>
<script>
var categoriesFilterContextMenu = new CategoriesFilterContextMenu({
@ -47,4 +54,10 @@
this.options.element.firstChild.click();
}
});
if (localStorage.getItem('filter_status_collapsed') === "true")
toggleFilterDisplay('status');
if (localStorage.getItem('filter_category_collapsed') === "true")
toggleFilterDisplay('category');
</script>

15
src/webui/www/private/scripts/client.js
View File

@ -50,6 +50,7 @@ var setCategoryFilter = function() {};
var selected_filter = getLocalStorageItem('selected_filter', 'all');
var setFilter = function() {};
var toggleFilterDisplay = function() {};
var loadSelectedCategory = function() {
selected_category = getLocalStorageItem('selected_category', CATEGORIES_ALL);
@ -132,6 +133,16 @@ window.addEvent('load', function() {
updateMainData();
};
toggleFilterDisplay = function(filter) {
var element = filter + "FilterList";
localStorage.setItem('filter_' + filter + "_collapsed", !$(element).hasClass("invisible"));
$(element).toggleClass("invisible")
var parent = $(element).getParent(".filterWrapper");
var toggleIcon = $(parent).getChildren(".filterTitle img");
if (toggleIcon)
toggleIcon[0].toggleClass("rotate");
};
new MochaUI.Panel({
id: 'Filters',
title: 'Panel',
@ -232,7 +243,7 @@ window.addEvent('load', function() {
};
var updateCategoryList = function() {
var categoryList = $('filterCategoryList');
var categoryList = $('categoryFilterList');
if (!categoryList)
return;
categoryList.empty();
@ -274,7 +285,7 @@ window.addEvent('load', function() {
};
var highlightSelectedCategory = function() {
var categoryList = $('filterCategoryList');
var categoryList = $('categoryFilterList');
if (!categoryList)
return;
var childrens = categoryList.childNodes;