Categories and Languages now use KiwixChoiceBox

Replaced the old Categories and Languages with KiwixChoiceBox

src/contentmanagerside.cpp

@@ -1,6 +1,7 @@
 #include "contentmanagerside.h"
 #include "ui_contentmanagerside.h"
 #include "kiwixapp.h"
+#include "kiwixchoicebox.h"
 
 #include <QLocale>
 #include <QDebug>
@@ -11,7 +12,13 @@ ContentManagerSide::ContentManagerSide(QWidget *parent) :
     QWidget(parent),
     mp_ui(new Ui::contentmanagerside)
 {
+    setFocusPolicy(Qt::FocusPolicy::StrongFocus);
     mp_ui->setupUi(this);
+    QFile file(QString::fromUtf8(":/css/contentmanagerside.css"));
+    file.open(QFile::ReadOnly);
+    QString styleSheet = QString(file.readAll());
+    this->setStyleSheet(styleSheet);
+
     mp_ui->buttonGroup->setId(mp_ui->allFileButton, CatalogButtonId::ALL);
     mp_ui->buttonGroup->setId(mp_ui->localFileButton, CatalogButtonId::LOCAL);
     connect(mp_ui->buttonGroup, QOverload<QAbstractButton *>::of(&QButtonGroup::buttonClicked), [=](QAbstractButton *btn) {
@@ -19,6 +26,8 @@ ContentManagerSide::ContentManagerSide(QWidget *parent) :
         mp_contentManager->setLocal(id == CatalogButtonId::LOCAL);
     });
 
+    mp_ui->contentTypeButton->setIcon(QIcon(":/icons/caret-right-solid.svg"));
+    mp_ui->contentTypeButton->setIconSize(QSize(12, 12));
     connect(mp_ui->allFileButton, &QRadioButton::toggled,
             this, [=](bool checked) { mp_ui->allFileButton->setStyleSheet(
                     checked ? "*{font-weight: bold}" : "");});
@@ -28,29 +37,29 @@ ContentManagerSide::ContentManagerSide(QWidget *parent) :
 
     mp_ui->allFileButton->setText(gt("online-files"));
     mp_ui->localFileButton ->setText(gt("local-files"));
-    mp_ui->languageButton->setText(gt("browse-by-language"));
-    mp_ui->categoryButton->setText(gt("browse-by-category"));
     mp_ui->contentTypeButton->setText(gt("content-type"));
 
-    mp_languageButton = mp_ui->languageButton;
+    mp_categories = mp_ui->categories;
-    mp_languageSelector = mp_ui->languageSelector;
+    mp_categories->setType(gt("category"));
-    connect(mp_languageButton, &QCheckBox::toggled, this, [=](bool checked) { mp_languageSelector->setHidden(!checked); });
-    mp_languageSelector->setHidden(true);
 
-    mp_categoryButton = mp_ui->categoryButton;
+    mp_languages = mp_ui->languages;
-    mp_categorySelector = mp_ui->categorySelector;
+    mp_languages->setType(gt("language"));
-    connect(mp_categoryButton, &QCheckBox::toggled, this, [=](bool checked) { mp_categorySelector->setHidden(!checked); });
-    mp_categorySelector->setHidden(true);
 
     mp_contentTypeButton = mp_ui->contentTypeButton;
-    connect(mp_contentTypeButton, &QCheckBox::toggled, this, [=](bool checked) { mp_ui->contentTypeSelector->setHidden(!checked); });
+
+
+    connect(mp_contentTypeButton, &QCheckBox::toggled, this, [=](bool checked) {
+        mp_ui->contentTypeSelector->setHidden(!checked);
+        mp_ui->contentTypeButton->setIcon(checked ? QIcon(":/icons/caret-down-solid.svg") : QIcon(":/icons/caret-right-solid.svg"));
+
+    });
     mp_ui->contentTypeSelector->setHidden(true);
 
     mp_ui->contentTypeAllButton->setText(gt("all"));
-    mp_ui->contentTypeAllButton->setStyleSheet("*{font-weight: bold}");
+    mp_ui->contentTypeAllButton->setStyleSheet("*{font-weight: 500;}");
     connect(mp_ui->contentTypeAllButton, &QCheckBox::clicked, this, [=](bool checked) {
         Q_UNUSED(checked);
-        mp_ui->contentTypeAllButton->setStyleSheet("*{font-weight: bold}");
+        mp_ui->contentTypeAllButton->setStyleSheet("*{font-weight: 500;}");
         for (auto &contentTypeFilter : m_contentTypeFilters) {
             contentTypeFilter->setCheckState(Qt::Unchecked);
         }
@@ -59,11 +68,8 @@ ContentManagerSide::ContentManagerSide(QWidget *parent) :
 
     auto searcher = mp_ui->searcher;
     searcher->setPlaceholderText(gt("search-files"));
-    QFile file(QString::fromUtf8(":/css/_contentManager.css"));
-    file.open(QFile::ReadOnly);
-    QString styleSheet = QString(file.readAll());
-    searcher->setStyleSheet(styleSheet);
     QIcon searchIcon = QIcon(":/icons/search.svg");
+
     searcher->addAction(searchIcon, QLineEdit::LeadingPosition);
     connect(searcher, &QLineEdit::textChanged, [searcher](){
         KiwixApp::instance()->getContentManager()->setSearch(searcher->text());
@@ -88,7 +94,7 @@ ContentManagerSide::ContentManagerSide(QWidget *parent) :
                     break;
                 }
             }
-            mp_ui->contentTypeAllButton->setStyleSheet(activeFilter ? "" : "*{font-weight: bold}");
+            mp_ui->contentTypeAllButton->setStyleSheet(activeFilter ? " * {color : #666666;} " : "*{font-weight: 500; color: black;}");
             mp_contentManager->setCurrentContentTypeFilter(m_contentTypeFilters);
         });
     }
@@ -111,23 +117,16 @@ void ContentManagerSide::setContentManager(ContentManager *contentManager)
     const auto checkedButton = mp_ui->buttonGroup->button(isLocal == CatalogButtonId::LOCAL);
     checkedButton->setChecked(true);
     checkedButton->setStyleSheet("*{font-weight: bold}");
-    connect(mp_languageSelector, &QListWidget::itemSelectionChanged,
+    connect(mp_languages, &KiwixChoiceBox::choiceUpdated,
-            this, [=]() {
+            this, [=](QStringList values) {
-                auto item = mp_languageSelector->selectedItems().at(0);
+                if (values[0] == "all") {
-                if (!item) return;
-                auto lang = item->data(Qt::UserRole).toString();
-                if (lang == "all") {
                     mp_contentManager->setCurrentLanguage("*");
                     return;
                 }
-                mp_contentManager->setCurrentLanguage(lang);
+                mp_contentManager->setCurrentLanguage(values.join(","));
     });
-    connect(mp_categorySelector, &QListWidget::itemSelectionChanged,
+    connect(mp_categories, &KiwixChoiceBox::choiceUpdated, this, [=](QStringList values) {
-            this, [=]() {
+        mp_contentManager->setCurrentCategoryFilter(values.join(","));
-                auto item = mp_categorySelector->selectedItems().at(0);
-                if (!item) return;
-                auto category = item->data(Qt::UserRole).toString();
-                mp_contentManager->setCurrentCategoryFilter(category);
     });
 }
 
@@ -140,40 +139,10 @@ QString beautify(QString word)
 
 void ContentManagerSide::setCategories(QStringList categories)
 {
-    mp_categorySelector->blockSignals(true);
+    mp_categories->setSelections(categories, gt("all"));
-    mp_categorySelector->setHidden(true);
-    mp_categorySelector->clear();
-    mp_categorySelector->blockSignals(false);
-    for (auto category: categories)
-    {
-        auto item = new KListWidgetItem(beautify(category));
-        item->setData(Qt::UserRole, category);
-        mp_categorySelector->addItem(item);
-        if (category ==  "all")
-        {
-            item->setSelected(true);
-        }
-    }
 }
 
 void ContentManagerSide::setLanguages(ContentManager::LanguageList langList)
 {
-    mp_languageSelector->blockSignals(true);
+    mp_languages->setSelections(langList, QLocale::languageToString(QLocale().language()));
-    mp_languageSelector->setHidden(true);
-    mp_languageSelector->clear();
-    mp_languageSelector->blockSignals(false);
-    for(auto lang: langList)
-    {
-        auto currentLang = QLocale().language();
-        auto item = new KListWidgetItem(lang.second);
-        item->setData(Qt::UserRole, lang.first);
-        mp_languageSelector->addItem(item);
-        if (lang.second == QLocale::languageToString(currentLang)) {
-            item->setSelected(true);
-        }
-    }
-    mp_languageSelector->sortItems();
-    auto item = new KListWidgetItem("All");
-    item->setData(Qt::UserRole, "all");
-    mp_languageSelector->insertItem(0, item);
 }

src/contentmanagerside.h

@@ -30,10 +30,8 @@ public:
 private:
     Ui::contentmanagerside *mp_ui;
     ContentManager* mp_contentManager;
-    QCheckBox* mp_languageButton;
+    KiwixChoiceBox *mp_categories;
-    QListWidget* mp_languageSelector;
+    KiwixChoiceBox *mp_languages;
-    QCheckBox* mp_categoryButton;
-    QListWidget* mp_categorySelector;
     QCheckBox* mp_contentTypeButton;
     QList<ContentTypeFilter*> m_contentTypeFilters;
 

src/contentmanagerside.ui

@@ -6,8 +6,8 @@
    <rect>
     <x>0</x>
     <y>0</y>
-    <width>199</width>
+    <width>300</width>
-    <height>370</height>
+    <height>386</height>
    </rect>
   </property>
   <property name="sizePolicy">
@@ -18,7 +18,7 @@
   </property>
   <property name="minimumSize">
    <size>
-    <width>0</width>
+    <width>250</width>
     <height>0</height>
    </size>
   </property>
@@ -28,27 +28,9 @@
   <property name="autoFillBackground">
    <bool>true</bool>
   </property>
-  <widget class="QGroupBox" name="groupBox">
+  <layout class="QVBoxLayout" name="verticalLayout">
-   <property name="geometry">
-    <rect>
-     <x>0</x>
-     <y>0</y>
-     <width>197</width>
-     <height>368</height>
-    </rect>
-   </property>
-   <property name="title">
-    <string/>
-   </property>
-   <property name="flat">
-    <bool>true</bool>
-   </property>
-   <layout class="QVBoxLayout" name="verticalLayout_2" stretch="0,0,0,0,0,0,0,0,0,0">
-    <property name="spacing">
-     <number>0</number>
-    </property>
    <property name="sizeConstraint">
-     <enum>QLayout::SetMinimumSize</enum>
+    <enum>QLayout::SetNoConstraint</enum>
    </property>
    <property name="leftMargin">
     <number>0</number>
@@ -62,6 +44,24 @@
    <property name="bottomMargin">
     <number>0</number>
    </property>
+   <item>
+    <widget class="QScrollArea" name="scrollArea">
+     <property name="autoFillBackground">
+      <bool>true</bool>
+     </property>
+     <property name="widgetResizable">
+      <bool>true</bool>
+     </property>
+     <widget class="QWidget" name="scrollContents">
+      <property name="geometry">
+       <rect>
+        <x>0</x>
+        <y>0</y>
+        <width>298</width>
+        <height>384</height>
+       </rect>
+      </property>
+      <layout class="QVBoxLayout" name="verticalLayout_4">
        <item>
         <widget class="QLineEdit" name="searcher"/>
        </item>
@@ -73,9 +73,15 @@
            <verstretch>0</verstretch>
           </sizepolicy>
          </property>
+         <property name="cursor">
+          <cursorShape>PointingHandCursor</cursorShape>
+         </property>
          <property name="text">
           <string>All Files</string>
          </property>
+         <attribute name="buttonGroup">
+          <string notr="true">buttonGroup</string>
+         </attribute>
         </widget>
        </item>
        <item>
@@ -86,93 +92,43 @@
            <verstretch>0</verstretch>
           </sizepolicy>
          </property>
+         <property name="cursor">
+          <cursorShape>PointingHandCursor</cursorShape>
+         </property>
          <property name="text">
           <string>Local Files</string>
          </property>
          <property name="checked">
           <bool>true</bool>
          </property>
+         <attribute name="buttonGroup">
+          <string notr="true">buttonGroup</string>
+         </attribute>
         </widget>
        </item>
        <item>
-     <widget class="QCheckBox" name="languageButton">
+        <widget class="KiwixChoiceBox" name="languages" native="true">
          <property name="sizePolicy">
-       <sizepolicy hsizetype="Minimum" vsizetype="Fixed">
+          <sizepolicy hsizetype="Expanding" vsizetype="Fixed">
            <horstretch>0</horstretch>
            <verstretch>0</verstretch>
           </sizepolicy>
          </property>
-      <property name="text">
+         <property name="autoFillBackground">
-       <string>Browse By Language</string>
-      </property>
-     </widget>
-    </item>
-    <item>
-     <widget class="QListWidget" name="languageSelector">
-      <property name="sizePolicy">
-       <sizepolicy hsizetype="Expanding" vsizetype="Expanding">
-        <horstretch>0</horstretch>
-        <verstretch>0</verstretch>
-       </sizepolicy>
-      </property>
-      <property name="frameShape">
-       <enum>QFrame::NoFrame</enum>
-      </property>
-      <property name="frameShadow">
-       <enum>QFrame::Plain</enum>
-      </property>
-      <property name="lineWidth">
-       <number>0</number>
-      </property>
-      <property name="verticalScrollBarPolicy">
-       <enum>Qt::ScrollBarAlwaysOn</enum>
-      </property>
-      <property name="horizontalScrollBarPolicy">
-       <enum>Qt::ScrollBarAlwaysOff</enum>
-      </property>
-      <property name="sizeAdjustPolicy">
-       <enum>QAbstractScrollArea::AdjustToContents</enum>
-      </property>
-     </widget>
-    </item>
-    <item>
-     <widget class="QCheckBox" name="categoryButton">
-      <property name="enabled">
           <bool>true</bool>
          </property>
-      <property name="sizePolicy">
-       <sizepolicy hsizetype="Minimum" vsizetype="Minimum">
-        <horstretch>0</horstretch>
-        <verstretch>0</verstretch>
-       </sizepolicy>
-      </property>
-      <property name="text">
-       <string>Browse By Category</string>
-      </property>
         </widget>
        </item>
        <item>
-     <widget class="QListWidget" name="categorySelector">
+        <widget class="KiwixChoiceBox" name="categories" native="true">
          <property name="sizePolicy">
-       <sizepolicy hsizetype="Expanding" vsizetype="Expanding">
+          <sizepolicy hsizetype="Expanding" vsizetype="Fixed">
            <horstretch>0</horstretch>
            <verstretch>0</verstretch>
           </sizepolicy>
          </property>
-      <property name="frameShape">
+         <property name="autoFillBackground">
-       <enum>QFrame::NoFrame</enum>
+          <bool>true</bool>
-      </property>
-      <property name="frameShadow">
-       <enum>QFrame::Plain</enum>
-      </property>
-      <property name="lineWidth">
-       <number>0</number>
-      </property>
-      <property name="horizontalScrollBarPolicy">
-       <enum>Qt::ScrollBarAlwaysOff</enum>
-      </property>
-      <property name="sizeAdjustPolicy">
-       <enum>QAbstractScrollArea::AdjustToContents</enum>
          </property>
         </widget>
        </item>
@@ -191,167 +147,20 @@
        </item>
        <item>
         <widget class="QFrame" name="contentTypeSelector">
+         <property name="sizePolicy">
+          <sizepolicy hsizetype="Expanding" vsizetype="Preferred">
+           <horstretch>0</horstretch>
+           <verstretch>0</verstretch>
+          </sizepolicy>
+         </property>
          <property name="minimumSize">
           <size>
            <width>0</width>
            <height>0</height>
           </size>
          </property>
-      <property name="frameShape">
+         <property name="cursor">
-       <enum>QFrame::NoFrame</enum>
+          <cursorShape>PointingHandCursor</cursorShape>
-      </property>
-      <property name="frameShadow">
-       <enum>QFrame::Sunken</enum>
-      </property>
-      <property name="lineWidth">
-       <number>0</number>
-      </property>
-      <property name="rightMargin">
-       <number>0</number>
-      </property>
-      <property name="bottomMargin">
-       <number>0</number>
-      </property>
-      <item>
-       <widget class="QLineEdit" name="searcher"/>
-      </item>
-      <item>
-       <widget class="QRadioButton" name="allFileButton">
-        <property name="sizePolicy">
-         <sizepolicy hsizetype="Minimum" vsizetype="Fixed">
-          <horstretch>0</horstretch>
-          <verstretch>0</verstretch>
-         </sizepolicy>
-        </property>
-        <property name="text">
-         <string>All Files</string>
-        </property>
-        <attribute name="buttonGroup">
-         <string notr="true">buttonGroup</string>
-        </attribute>
-       </widget>
-      </item>
-      <item>
-       <widget class="QRadioButton" name="localFileButton">
-        <property name="sizePolicy">
-         <sizepolicy hsizetype="Minimum" vsizetype="Fixed">
-          <horstretch>0</horstretch>
-          <verstretch>0</verstretch>
-         </sizepolicy>
-        </property>
-        <property name="text">
-         <string>Local Files</string>
-        </property>
-        <property name="checked">
-         <bool>true</bool>
-        </property>
-        <attribute name="buttonGroup">
-         <string notr="true">buttonGroup</string>
-        </attribute>
-       </widget>
-      </item>
-      <item>
-       <widget class="QCheckBox" name="languageButton">
-        <property name="sizePolicy">
-         <sizepolicy hsizetype="Minimum" vsizetype="Fixed">
-          <horstretch>0</horstretch>
-          <verstretch>0</verstretch>
-         </sizepolicy>
-        </property>
-        <property name="text">
-         <string>Browse By Language</string>
-        </property>
-       </widget>
-      </item>
-      <item>
-       <widget class="QListWidget" name="languageSelector">
-        <property name="sizePolicy">
-         <sizepolicy hsizetype="Expanding" vsizetype="Expanding">
-          <horstretch>0</horstretch>
-          <verstretch>0</verstretch>
-         </sizepolicy>
-        </property>
-        <property name="frameShape">
-         <enum>QFrame::NoFrame</enum>
-        </property>
-        <property name="frameShadow">
-         <enum>QFrame::Plain</enum>
-        </property>
-        <property name="lineWidth">
-         <number>0</number>
-        </property>
-        <property name="verticalScrollBarPolicy">
-         <enum>Qt::ScrollBarAlwaysOn</enum>
-        </property>
-        <property name="horizontalScrollBarPolicy">
-         <enum>Qt::ScrollBarAlwaysOff</enum>
-        </property>
-        <property name="sizeAdjustPolicy">
-         <enum>QAbstractScrollArea::AdjustToContents</enum>
-        </property>
-       </widget>
-      </item>
-      <item>
-       <widget class="QCheckBox" name="categoryButton">
-        <property name="enabled">
-         <bool>true</bool>
-        </property>
-        <property name="sizePolicy">
-         <sizepolicy hsizetype="Minimum" vsizetype="Minimum">
-          <horstretch>0</horstretch>
-          <verstretch>0</verstretch>
-         </sizepolicy>
-        </property>
-        <property name="text">
-         <string>Browse By Category</string>
-        </property>
-       </widget>
-      </item>
-      <item>
-       <widget class="QListWidget" name="categorySelector">
-        <property name="sizePolicy">
-         <sizepolicy hsizetype="Expanding" vsizetype="Expanding">
-          <horstretch>0</horstretch>
-          <verstretch>0</verstretch>
-         </sizepolicy>
-        </property>
-        <property name="frameShape">
-         <enum>QFrame::NoFrame</enum>
-        </property>
-        <property name="frameShadow">
-         <enum>QFrame::Plain</enum>
-        </property>
-        <property name="lineWidth">
-         <number>0</number>
-        </property>
-        <property name="horizontalScrollBarPolicy">
-         <enum>Qt::ScrollBarAlwaysOff</enum>
-        </property>
-        <property name="sizeAdjustPolicy">
-         <enum>QAbstractScrollArea::AdjustToContents</enum>
-        </property>
-       </widget>
-      </item>
-      <item>
-       <widget class="QCheckBox" name="contentTypeButton">
-        <property name="sizePolicy">
-         <sizepolicy hsizetype="Minimum" vsizetype="Fixed">
-          <horstretch>0</horstretch>
-          <verstretch>0</verstretch>
-         </sizepolicy>
-        </property>
-        <property name="text">
-         <string>Content Type</string>
-        </property>
-       </widget>
-      </item>
-      <item>
-       <widget class="QFrame" name="contentTypeSelector">
-        <property name="minimumSize">
-         <size>
-          <width>0</width>
-          <height>0</height>
-         </size>
          </property>
          <property name="frameShape">
           <enum>QFrame::NoFrame</enum>
@@ -366,6 +175,20 @@
           <property name="spacing">
            <number>0</number>
           </property>
+          <property name="topMargin">
+           <number>0</number>
+          </property>
+          <property name="bottomMargin">
+           <number>0</number>
+          </property>
+          <item>
+           <widget class="QCheckBox" name="contentTypeAllButton">
+            <property name="sizePolicy">
+             <sizepolicy hsizetype="Minimum" vsizetype="Fixed">
+              <horstretch>0</horstretch>
+              <verstretch>0</verstretch>
+             </sizepolicy>
+            </property>
             <property name="text">
              <string>All</string>
             </property>
@@ -382,10 +205,13 @@
          <property name="orientation">
           <enum>Qt::Vertical</enum>
          </property>
+         <property name="sizeType">
+          <enum>QSizePolicy::Expanding</enum>
+         </property>
          <property name="sizeHint" stdset="0">
           <size>
            <width>20</width>
-        <height>40</height>
+           <height>0</height>
           </size>
          </property>
         </spacer>
@@ -393,6 +219,17 @@
       </layout>
      </widget>
     </widget>
+   </item>
+  </layout>
+ </widget>
+ <customwidgets>
+  <customwidget>
+   <class>KiwixChoiceBox</class>
+   <extends>QWidget</extends>
+   <header>src/kiwixchoicebox.h</header>
+   <container>1</container>
+  </customwidget>
+ </customwidgets>
  <resources/>
  <connections/>
  <buttongroups>