From b55d4b17335df3fe39d47d2f27acbaf143e371ef Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bartu=20=C3=96zen?=
 <15032958+Bartuzen@users.noreply.github.com>
Date: Sun, 2 Apr 2023 11:02:22 +0300
Subject: [PATCH] WebUI: Implement subcategories

PR #18740.
---
 src/webui/api/appcontroller.cpp               |  3 ++
 src/webui/api/synccontroller.cpp              |  3 ++
 src/webui/www/private/index.html              |  1 +
 src/webui/www/private/newcategory.html        |  5 +++
 src/webui/www/private/scripts/client.js       | 33 ++++++++++++++++---
 src/webui/www/private/scripts/contextmenu.js  |  7 ++++
 src/webui/www/private/scripts/dynamicTable.js | 12 +++++--
 src/webui/www/private/scripts/mocha-init.js   | 20 +++++++++++
 src/webui/www/private/views/filters.html      |  3 ++
 src/webui/www/private/views/preferences.html  |  6 ++++
 10 files changed, 86 insertions(+), 7 deletions(-)

diff --git a/src/webui/api/appcontroller.cpp b/src/webui/api/appcontroller.cpp
index 889689876..562380a5e 100644
--- a/src/webui/api/appcontroller.cpp
+++ b/src/webui/api/appcontroller.cpp
@@ -134,6 +134,7 @@ void AppController::preferencesAction()
     data[u"torrent_changed_tmm_enabled"_qs] = !session->isDisableAutoTMMWhenCategoryChanged();
     data[u"save_path_changed_tmm_enabled"_qs] = !session->isDisableAutoTMMWhenDefaultSavePathChanged();
     data[u"category_changed_tmm_enabled"_qs] = !session->isDisableAutoTMMWhenCategorySavePathChanged();
+    data[u"use_subcategories"] = session->isSubcategoriesEnabled();
     data[u"save_path"_qs] = session->savePath().toString();
     data[u"temp_path_enabled"_qs] = session->isDownloadPathEnabled();
     data[u"temp_path"_qs] = session->downloadPath().toString();
@@ -489,6 +490,8 @@ void AppController::setPreferencesAction()
         session->setDisableAutoTMMWhenDefaultSavePathChanged(!it.value().toBool());
     if (hasKey(u"category_changed_tmm_enabled"_qs))
         session->setDisableAutoTMMWhenCategorySavePathChanged(!it.value().toBool());
+    if (hasKey(u"use_subcategories"_qs))
+        session->setSubcategoriesEnabled(it.value().toBool());
     if (hasKey(u"save_path"_qs))
         session->setSavePath(Path(it.value().toString()));
     if (hasKey(u"temp_path_enabled"_qs))
diff --git a/src/webui/api/synccontroller.cpp b/src/webui/api/synccontroller.cpp
index d11ee8a93..6e77396ce 100644
--- a/src/webui/api/synccontroller.cpp
+++ b/src/webui/api/synccontroller.cpp
@@ -61,6 +61,7 @@ namespace
     const QString KEY_SYNC_MAINDATA_QUEUEING = u"queueing"_qs;
     const QString KEY_SYNC_MAINDATA_REFRESH_INTERVAL = u"refresh_interval"_qs;
     const QString KEY_SYNC_MAINDATA_USE_ALT_SPEED_LIMITS = u"use_alt_speed_limits"_qs;
+    const QString KEY_SYNC_MAINDATA_USE_SUBCATEGORIES = u"use_subcategories"_qs;
 
     // Sync torrent peers keys
     const QString KEY_SYNC_TORRENT_PEERS_SHOW_FLAGS = u"show_flags"_qs;
@@ -549,6 +550,7 @@ void SyncController::makeMaindataSnapshot()
     m_maindataSnapshot.serverState[KEY_SYNC_MAINDATA_QUEUEING] = session->isQueueingSystemEnabled();
     m_maindataSnapshot.serverState[KEY_SYNC_MAINDATA_USE_ALT_SPEED_LIMITS] = session->isAltGlobalSpeedLimitEnabled();
     m_maindataSnapshot.serverState[KEY_SYNC_MAINDATA_REFRESH_INTERVAL] = session->refreshInterval();
+    m_maindataSnapshot.serverState[KEY_SYNC_MAINDATA_USE_SUBCATEGORIES] = session->isSubcategoriesEnabled();
 }
 
 QJsonObject SyncController::generateMaindataSyncData(const int id, const bool fullUpdate)
@@ -657,6 +659,7 @@ QJsonObject SyncController::generateMaindataSyncData(const int id, const bool fu
     serverState[KEY_SYNC_MAINDATA_QUEUEING] = session->isQueueingSystemEnabled();
     serverState[KEY_SYNC_MAINDATA_USE_ALT_SPEED_LIMITS] = session->isAltGlobalSpeedLimitEnabled();
     serverState[KEY_SYNC_MAINDATA_REFRESH_INTERVAL] = session->refreshInterval();
+    serverState[KEY_SYNC_MAINDATA_USE_SUBCATEGORIES] = session->isSubcategoriesEnabled();
     processMap(m_maindataSnapshot.serverState, serverState, m_maindataSyncBuf.serverState);
     m_maindataSnapshot.serverState = serverState;
 
diff --git a/src/webui/www/private/index.html b/src/webui/www/private/index.html
index 94e83f062..d9c0c60e8 100644
--- a/src/webui/www/private/index.html
+++ b/src/webui/www/private/index.html
@@ -188,6 +188,7 @@
     </ul>
     <ul id="categoriesFilterMenu" class="contextMenu">
         <li><a href="#createCategory"><img src="images/list-add.svg" alt="QBT_TR(Add category...)QBT_TR[CONTEXT=CategoryFilterWidget]" /> QBT_TR(Add category...)QBT_TR[CONTEXT=CategoryFilterWidget]</a></li>
+        <li><a href="#createSubcategory"><img src="images/list-add.svg" alt="QBT_TR(Add subcategory...)QBT_TR[CONTEXT=CategoryFilterWidget]" /> QBT_TR(Add subcategory...)QBT_TR[CONTEXT=CategoryFilterWidget]</a></li>
         <li><a href="#editCategory"><img src="images/edit-rename.svg" alt="QBT_TR(Edit category...)QBT_TR[CONTEXT=CategoryFilterWidget]" /> QBT_TR(Edit category...)QBT_TR[CONTEXT=CategoryFilterWidget]</a></li>
         <li><a href="#deleteCategory"><img src="images/list-remove.svg" alt="QBT_TR(Remove category)QBT_TR[CONTEXT=CategoryFilterWidget]" /> QBT_TR(Remove category)QBT_TR[CONTEXT=CategoryFilterWidget]</a></li>
         <li><a href="#deleteUnusedCategories"><img src="images/list-remove.svg" alt="QBT_TR(Remove unused categories)QBT_TR[CONTEXT=CategoryFilterWidget]" /> QBT_TR(Remove unused categories)QBT_TR[CONTEXT=CategoryFilterWidget]</a></li>
diff --git a/src/webui/www/private/newcategory.html b/src/webui/www/private/newcategory.html
index 6fc407d09..63186e013 100644
--- a/src/webui/www/private/newcategory.html
+++ b/src/webui/www/private/newcategory.html
@@ -44,6 +44,10 @@
                 $('savePath').set('value', window.qBittorrent.Misc.escapeHtml(uriSavePath));
                 $('savePath').focus();
             }
+            else if (uriAction === "createSubcategory") {
+                $('categoryName').set('value', window.qBittorrent.Misc.escapeHtml(uriCategoryName));
+                $('categoryName').focus();
+            }
             else {
                 $('categoryName').focus();
             }
@@ -95,6 +99,7 @@
                         }).send();
                         break;
                     case "create":
+                    case "createSubcategory":
                         if (!verifyCategoryName(categoryName))
                             return;
 
diff --git a/src/webui/www/private/scripts/client.js b/src/webui/www/private/scripts/client.js
index f8cf2f5c0..1d8d79eee 100644
--- a/src/webui/www/private/scripts/client.js
+++ b/src/webui/www/private/scripts/client.js
@@ -33,6 +33,7 @@ let alternativeSpeedLimits = false;
 let queueing_enabled = true;
 let serverSyncMainDataInterval = 1500;
 let customSyncMainDataInterval = null;
+let useSubcategories = true;
 let searchTabInitialized = false;
 let rssTabInitialized = false;
 let logTabInitialized = false;
@@ -429,9 +430,17 @@ window.addEvent('load', function() {
         categoryList.empty();
 
         const create_link = function(hash, text, count) {
-            const html = '<a href="#" onclick="setCategoryFilter(' + hash + ');return false;">'
+            let display_name = text;
+            let margin_left = 0;
+            if (useSubcategories) {
+                const category_path = text.split("/");
+                display_name = category_path[category_path.length - 1];
+                margin_left = (category_path.length - 1) * 20;
+            }
+
+            const html = '<a href="#" style="margin-left: ' + margin_left + 'px" onclick="setCategoryFilter(' + hash + ');return false;">'
                 + '<img src="images/view-categories.svg"/>'
-                + window.qBittorrent.Misc.escapeHtml(text) + ' (' + count + ')' + '</a>';
+                + window.qBittorrent.Misc.escapeHtml(display_name) + ' (' + count + ')' + '</a>';
             const el = new Element('li', {
                 id: hash,
                 html: html
@@ -455,11 +464,20 @@ window.addEvent('load', function() {
         });
         sortedCategories.sort();
 
-        Object.each(sortedCategories, function(categoryName) {
+        for (let i = 0; i < sortedCategories.length; ++i) {
+            const categoryName = sortedCategories[i];
             const categoryHash = genHash(categoryName);
-            const categoryCount = category_list[categoryHash].torrents.length;
+            let categoryCount = category_list[categoryHash].torrents.length;
+
+            if (useSubcategories) {
+                for (let j = i + 1; j < sortedCategories.length && sortedCategories[j].startsWith(categoryName + "/"); ++j) {
+                    const hash = genHash(sortedCategories[j]);
+                    categoryCount += category_list[hash].torrents.length;
+                }
+            }
+
             categoryList.appendChild(create_link(categoryHash, categoryName, categoryCount));
-        });
+        }
 
         highlightSelectedCategory();
     };
@@ -821,6 +839,11 @@ window.addEvent('load', function() {
             updateAltSpeedIcon(alternativeSpeedLimits);
         }
 
+        if (useSubcategories != serverState.use_subcategories) {
+            useSubcategories = serverState.use_subcategories;
+            updateCategoryList();
+        }
+
         serverSyncMainDataInterval = Math.max(serverState.refresh_interval, 500);
     };
 
diff --git a/src/webui/www/private/scripts/contextmenu.js b/src/webui/www/private/scripts/contextmenu.js
index eca991330..167570bc3 100644
--- a/src/webui/www/private/scripts/contextmenu.js
+++ b/src/webui/www/private/scripts/contextmenu.js
@@ -517,10 +517,17 @@ window.qBittorrent.ContextMenu = (function() {
             if ((id != CATEGORIES_ALL) && (id != CATEGORIES_UNCATEGORIZED)) {
                 this.showItem('editCategory');
                 this.showItem('deleteCategory');
+                if (useSubcategories) {
+                    this.showItem('createSubcategory');
+                }
+                else {
+                    this.hideItem('createSubcategory');
+                }
             }
             else {
                 this.hideItem('editCategory');
                 this.hideItem('deleteCategory');
+                this.hideItem('createSubcategory');
             }
         }
     });
diff --git a/src/webui/www/private/scripts/dynamicTable.js b/src/webui/www/private/scripts/dynamicTable.js
index 21a0d5404..63c9045ec 100644
--- a/src/webui/www/private/scripts/dynamicTable.js
+++ b/src/webui/www/private/scripts/dynamicTable.js
@@ -1383,8 +1383,16 @@ window.qBittorrent.DynamicTable = (function() {
                             return false;
                         break; // do nothing
                     default:
-                        if (categoryHashInt !== genHash(row['full_data'].category))
-                            return false;
+                        if (!useSubcategories) {
+                            if (categoryHashInt !== genHash(row['full_data'].category))
+                                return false;
+                        }
+                        else {
+                            const selectedCategoryName = category_list[categoryHash].name + "/";
+                            const torrentCategoryName = row['full_data'].category + "/";
+                            if (!torrentCategoryName.startsWith(selectedCategoryName))
+                                return false;
+                        }
                 }
             }
 
diff --git a/src/webui/www/private/scripts/mocha-init.js b/src/webui/www/private/scripts/mocha-init.js
index c1906a60c..ef4856823 100644
--- a/src/webui/www/private/scripts/mocha-init.js
+++ b/src/webui/www/private/scripts/mocha-init.js
@@ -66,6 +66,7 @@ let renameFilesFN = function() {};
 let torrentNewCategoryFN = function() {};
 let torrentSetCategoryFN = function() {};
 let createCategoryFN = function() {};
+let createSubcategoryFN = function() {};
 let editCategoryFN = function() {};
 let removeCategoryFN = function() {};
 let deleteUnusedCategoriesFN = function() {};
@@ -604,6 +605,25 @@ const initializeWindows = function() {
         updateMainData();
     };
 
+    createSubcategoryFN = function(categoryHash) {
+        const action = "createSubcategory";
+        const categoryName = category_list[categoryHash].name + "/";
+        new MochaUI.Window({
+            id: 'newSubcategoryPage',
+            title: "QBT_TR(New Category)QBT_TR[CONTEXT=CategoryFilterWidget]",
+            loadMethod: 'iframe',
+            contentURL: new URI("newcategory.html").setData("action", action).setData("categoryName", categoryName).toString(),
+            scrollbars: false,
+            resizable: true,
+            maximizable: false,
+            paddingVertical: 0,
+            paddingHorizontal: 0,
+            width: 400,
+            height: 150
+        });
+        updateMainData();
+    };
+
     editCategoryFN = function(categoryHash) {
         const action = "edit";
         const categoryName = category_list[categoryHash].name;
diff --git a/src/webui/www/private/views/filters.html b/src/webui/www/private/views/filters.html
index b34484541..9891ddf16 100644
--- a/src/webui/www/private/views/filters.html
+++ b/src/webui/www/private/views/filters.html
@@ -63,6 +63,9 @@
                 createCategory: function(element, ref) {
                     createCategoryFN();
                 },
+                createSubcategory: function(element, ref) {
+                    createSubcategoryFN(element.id);
+                },
                 editCategory: function(element, ref) {
                     editCategoryFN(element.id);
                 },
diff --git a/src/webui/www/private/views/preferences.html b/src/webui/www/private/views/preferences.html
index b9e789224..87b93f099 100644
--- a/src/webui/www/private/views/preferences.html
+++ b/src/webui/www/private/views/preferences.html
@@ -135,6 +135,10 @@
                 </td>
             </tr>
         </table>
+        <div class="formRow">
+            <input type="checkbox" id="use_subcategories_checkbox" />
+            <label for="use_subcategories_checkbox">QBT_TR(Use Subcategories)QBT_TR[CONTEXT=OptionsDialog]</label>
+        </div>
         <table>
             <tr>
                 <td>
@@ -1844,6 +1848,7 @@ Use ';' to split multiple entries. Can use wildcard '*'.)QBT_TR[CONTEXT=OptionsD
                         $('torrent_changed_tmm_combobox').setProperty('value', pref.torrent_changed_tmm_enabled);
                         $('save_path_changed_tmm_combobox').setProperty('value', pref.save_path_changed_tmm_enabled);
                         $('category_changed_tmm_combobox').setProperty('value', pref.category_changed_tmm_enabled);
+                        $('use_subcategories_checkbox').setProperty('checked', pref.use_subcategories);
                         $('savepath_text').setProperty('value', pref.save_path);
                         $('temppath_checkbox').setProperty('checked', pref.temp_path_enabled);
                         $('temppath_text').setProperty('value', pref.temp_path);
@@ -2199,6 +2204,7 @@ Use ';' to split multiple entries. Can use wildcard '*'.)QBT_TR[CONTEXT=OptionsD
             settings.set('torrent_changed_tmm_enabled', $('torrent_changed_tmm_combobox').getProperty('value'));
             settings.set('save_path_changed_tmm_enabled', $('save_path_changed_tmm_combobox').getProperty('value'));
             settings.set('category_changed_tmm_enabled', $('category_changed_tmm_combobox').getProperty('value'));
+            settings.set('use_subcategories', $('use_subcategories_checkbox').getProperty('checked'));
             settings.set('save_path', $('savepath_text').getProperty('value'));
             settings.set('temp_path_enabled', $('temppath_checkbox').getProperty('checked'));
             settings.set('temp_path', $('temppath_text').getProperty('value'));