diff --git a/src/webui/www/private/css/style.css b/src/webui/www/private/css/style.css index 479532fa8..8526113ed 100644 --- a/src/webui/www/private/css/style.css +++ b/src/webui/www/private/css/style.css @@ -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 { diff --git a/src/webui/www/private/filters.html b/src/webui/www/private/filters.html index 890431a4b..c49f83208 100644 --- a/src/webui/www/private/filters.html +++ b/src/webui/www/private/filters.html @@ -1,19 +1,26 @@ -QBT_TR(Status)QBT_TR[CONTEXT=TransferListFiltersWidget] - -
-QBT_TR(Categories)QBT_TR[CONTEXT=TransferListFiltersWidget] - +
+ + QBT_TR(Status)QBT_TR[CONTEXT=TransferListFiltersWidget] + + +
+
+ + QBT_TR(Categories)QBT_TR[CONTEXT=TransferListFiltersWidget] + + +
diff --git a/src/webui/www/private/scripts/client.js b/src/webui/www/private/scripts/client.js index 5561c29ef..5674f4e7a 100644 --- a/src/webui/www/private/scripts/client.js +++ b/src/webui/www/private/scripts/client.js @@ -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;