d4708
/
qBittorrent
mirror of https://github.com/d47081/qBittorrent.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Allow WebUI sidebar filters to be hidden

adaptive-webui-19844
Thomas Piccirello 6 years ago
parent
adad883eb6
commit
fef1ad6083
3 changed files with 55 additions and 18 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 13
      src/webui/www/private/css/style.css
  2. 45
      src/webui/www/private/filters.html
  3. 15
      src/webui/www/private/scripts/client.js

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

@ -408,6 +408,19 @@ div.formRow {
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
padding-left: 5px; 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 { ul.filterList {

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

@ -1,19 +1,26 @@
<span class="filterTitle">QBT_TR(Status)QBT_TR[CONTEXT=TransferListFiltersWidget]</span> <div class="filterWrapper">
<ul class="filterList"> <span class="filterTitle" onclick="toggleFilterDisplay('status');">
<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> <img src="images/qbt-theme/go-down.svg">QBT_TR(Status)QBT_TR[CONTEXT=TransferListFiltersWidget]
<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> </span>
<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> <ul class="filterList" id="statusFilterList">
<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="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="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="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="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="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="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="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="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="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="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> <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>
</ul> <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>
<br/> <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>
<span class="filterTitle">QBT_TR(Categories)QBT_TR[CONTEXT=TransferListFiltersWidget]</span> <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 id="filterCategoryList" class="filterList"> </ul>
</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> <script>
var categoriesFilterContextMenu = new CategoriesFilterContextMenu({ var categoriesFilterContextMenu = new CategoriesFilterContextMenu({
@ -47,4 +54,10 @@
this.options.element.firstChild.click(); this.options.element.firstChild.click();
} }
}); });
if (localStorage.getItem('filter_status_collapsed') === "true")
toggleFilterDisplay('status');
if (localStorage.getItem('filter_category_collapsed') === "true")
toggleFilterDisplay('category');
</script> </script>

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

@ -50,6 +50,7 @@ var setCategoryFilter = function() {};
var selected_filter = getLocalStorageItem('selected_filter', 'all'); var selected_filter = getLocalStorageItem('selected_filter', 'all');
var setFilter = function() {}; var setFilter = function() {};
var toggleFilterDisplay = function() {};
var loadSelectedCategory = function() { var loadSelectedCategory = function() {
selected_category = getLocalStorageItem('selected_category', CATEGORIES_ALL); selected_category = getLocalStorageItem('selected_category', CATEGORIES_ALL);
@ -132,6 +133,16 @@ window.addEvent('load', function() {
updateMainData(); 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({ new MochaUI.Panel({
id: 'Filters', id: 'Filters',
title: 'Panel', title: 'Panel',
@ -232,7 +243,7 @@ window.addEvent('load', function() {
}; };
var updateCategoryList = function() { var updateCategoryList = function() {
var categoryList = $('filterCategoryList'); var categoryList = $('categoryFilterList');
if (!categoryList) if (!categoryList)
return; return;
categoryList.empty(); categoryList.empty();
@ -274,7 +285,7 @@ window.addEvent('load', function() {
}; };
var highlightSelectedCategory = function() { var highlightSelectedCategory = function() {
var categoryList = $('filterCategoryList'); var categoryList = $('categoryFilterList');
if (!categoryList) if (!categoryList)
return; return;
var childrens = categoryList.childNodes; var childrens = categoryList.childNodes;

Write Preview
Loading…
Cancel
Save