Store: Update details page

* Add a big back button in details page. * Add static CSS to render QPushButtons as flat when the `flat` property is set * Remove outer scroll areas from details page since the page is already adjustable * Remove scroll area from the requirements widget because ElideLabels are already used in it. * Fix crash when sorting the wishlist
2024-05-04 20:52:58 +12:00 · 2024-02-03 02:28:55 +02:00 · 2024-02-03 02:28:55 +02:00 · 2a2458bacb
parent 816c5f3de9
commit 2a2458bacb
9 changed files with 97 additions and 70 deletions
--- a/rare/components/tabs/store/main.py
+++ b/rare/components/tabs/store/main.py
@ -23,13 +23,14 @@ class StoreWindow(QDialog):

 if __name__ == "__main__":
    import rare.resources.static_css
-    import rare.resources.stylesheets.RareStyle
+    # import rare.resources.stylesheets.RareStyle
    from rare.utils.misc import set_style_sheet

    app = QApplication(sys.argv)
    app.setApplicationName("Rare")
    app.setOrganizationName("Rare")

+    set_style_sheet("")
    set_style_sheet("RareStyle")
    window = StoreWindow()
    window.setWindowTitle(f"{app.applicationName()} - Store")
--- a/rare/components/tabs/store/landing.py
+++ b/rare/components/tabs/store/landing.py
@ -48,14 +48,9 @@ class LandingPage(SlidingStackedWidget, SideTabContents):
        self.details_widget.set_title.connect(self.set_title)
        self.details_widget.back_clicked.connect(self.show_main)

-        self.details_scroll = QScrollArea(self)
-        self.details_scroll.setWidgetResizable(True)
-        self.details_scroll.setFrameStyle(QFrame.NoFrame | QFrame.Plain)
-        self.details_scroll.setWidget(self.details_widget)
-
        self.setDirection(Qt.Horizontal)
        self.addWidget(self.landing_scroll)
-        self.addWidget(self.details_scroll)
+        self.addWidget(self.details_widget)

    @pyqtSlot()
    def show_main(self):
@ -64,7 +59,7 @@ class LandingPage(SlidingStackedWidget, SideTabContents):
    @pyqtSlot(object)
    def show_details(self, game: CatalogOfferModel):
        self.details_widget.update_game(game)
-        self.slideInWidget(self.details_scroll)
+        self.slideInWidget(self.details_widget)


 class LandingWidget(QWidget, SideTabContents):
--- a/rare/components/tabs/store/results.py
+++ b/rare/components/tabs/store/results.py
@ -17,7 +17,6 @@ class ResultsWidget(QScrollArea):

    def __init__(self, store_api, parent=None):
        super(ResultsWidget, self).__init__(parent=parent)
-        self.implements_scrollarea = True
        self.store_api = store_api

        self.results_container = QWidget(self)
--- a/rare/components/tabs/store/search.py
+++ b/rare/components/tabs/store/search.py
@ -40,14 +40,9 @@ class SearchPage(SlidingStackedWidget, SideTabContents):
        self.details_widget.set_title.connect(self.set_title)
        self.details_widget.back_clicked.connect(self.show_main)

-        self.details_scroll = QScrollArea(self)
-        self.details_scroll.setWidgetResizable(True)
-        self.details_scroll.setFrameStyle(QFrame.NoFrame | QFrame.Plain)
-        self.details_scroll.setWidget(self.details_widget)
-
        self.setDirection(Qt.Horizontal)
        self.addWidget(self.search_widget)
-        self.addWidget(self.details_scroll)
+        self.addWidget(self.details_widget)

    @pyqtSlot()
    def show_main(self):
@ -56,7 +51,7 @@ class SearchPage(SlidingStackedWidget, SideTabContents):
    @pyqtSlot(object)
    def show_details(self, game: CatalogOfferModel):
        self.details_widget.update_game(game)
-        self.slideInWidget(self.details_scroll)
+        self.slideInWidget(self.details_widget)


 # noinspection PyAttributeOutsideInit,PyBroadException
--- a/rare/components/tabs/store/widgets/details.py
+++ b/rare/components/tabs/store/widgets/details.py
@ -2,7 +2,7 @@ import logging
 from typing import List

 from PyQt5.QtCore import Qt, QUrl, pyqtSignal
-from PyQt5.QtGui import QFont, QDesktopServices, QFontMetrics
+from PyQt5.QtGui import QFont, QDesktopServices, QKeyEvent
 from PyQt5.QtWidgets import (
    QWidget,
    QLabel,
@ -12,7 +12,7 @@ from PyQt5.QtWidgets import (
 )

 from rare.components.tabs.store.api.debug import DebugDialog
-from rare.components.tabs.store.api.models.diesel import DieselProduct, DieselProductDetail
+from rare.components.tabs.store.api.models.diesel import DieselProduct, DieselProductDetail, DieselSystemDetail
 from rare.components.tabs.store.api.models.response import CatalogOfferModel
 from rare.models.image import ImageSize
 from rare.ui.components.tabs.store.details import Ui_DetailsWidget
@ -30,6 +30,8 @@ class DetailsWidget(QWidget, SideTabContents):
    # TODO Design
    def __init__(self, installed_titles: list, api_core, parent=None):
        super(DetailsWidget, self).__init__(parent=parent)
+        self.implements_scrollarea = True
+
        self.ui = Ui_DetailsWidget()
        self.ui.setupUi(self)
        self.ui.main_layout.setContentsMargins(0, 0, 3, 0)
@ -55,6 +57,7 @@ class DetailsWidget(QWidget, SideTabContents):
        self.requirements_tabs.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Fixed)
        self.ui.requirements_layout.addWidget(self.requirements_tabs)

+        self.ui.back_button.setIcon(icon("fa.chevron-left"))
        self.ui.back_button.clicked.connect(self.back_clicked)

        self.setDisabled(False)
@ -182,31 +185,10 @@ class DetailsWidget(QWidget, SideTabContents):
        else:
            self.ui.discount_price.setVisible(False)

-        bold_font = QFont()
-        bold_font.setBold(True)
-
-        fm = QFontMetrics(self.font())
        requirements = product_data.requirements
        if requirements and requirements.systems:
            for system in requirements.systems:
-                req_widget = QWidget(self.requirements_tabs)
-                req_layout = QGridLayout(req_widget)
-                req_widget.layout().setAlignment(Qt.AlignTop)
-                req_widget.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Fixed)
-                min_label = QLabel(self.tr("Minimum"), parent=req_widget)
-                min_label.setFont(bold_font)
-                rec_label = QLabel(self.tr("Recommend"), parent=req_widget)
-                rec_label.setFont(bold_font)
-                req_layout.addWidget(min_label, 0, 1)
-                req_layout.addWidget(rec_label, 0, 2)
-                req_layout.setColumnStretch(1, 2)
-                req_layout.setColumnStretch(2, 2)
-                for i, detail in enumerate(system.details):
-                    req_layout.addWidget(QLabel(detail.title, parent=req_widget), i + 1, 0)
-                    min_label = ElideLabel(detail.minimum, parent=req_widget)
-                    req_layout.addWidget(min_label, i + 1, 1)
-                    rec_label = ElideLabel(detail.recommended, parent=req_widget)
-                    req_layout.addWidget(rec_label, i + 1, 2)
+                req_widget = RequirementsWidget(system, self.requirements_tabs)
                self.requirements_tabs.addTab(req_widget, system.system_type)
                # self.req_group_box.layout().addWidget(req_tabs)
                # self.req_group_box.layout().setAlignment(Qt.AlignTop)
@ -273,6 +255,10 @@ class DetailsWidget(QWidget, SideTabContents):
        return
        QDesktopServices.openUrl(QUrl(f"https://www.epicgames.com/store/{self.core.language_code}/p/{self.slug}"))

+    def keyPressEvent(self, a0: QKeyEvent):
+        if a0.key() == Qt.Key_Escape:
+            self.back_clicked.emit()
+

 class SocialButton(QPushButton):
    def __init__(self, icn, url, parent=None):
@ -280,3 +266,30 @@ class SocialButton(QPushButton):
        self.url = url
        self.clicked.connect(lambda: QDesktopServices.openUrl(QUrl(url)))
        self.setToolTip(url)
+
+
+class RequirementsWidget(QWidget, SideTabContents):
+    def __init__(self, system: DieselSystemDetail, parent=None):
+        super().__init__(parent=parent)
+        self.implements_scrollarea = True
+
+        bold_font = self.font()
+        bold_font.setBold(True)
+
+        req_layout = QGridLayout(self)
+        min_label = QLabel(self.tr("Minimum"), parent=self)
+        min_label.setFont(bold_font)
+        rec_label = QLabel(self.tr("Recommend"), parent=self)
+        rec_label.setFont(bold_font)
+        req_layout.addWidget(min_label, 0, 1)
+        req_layout.addWidget(rec_label, 0, 2)
+        req_layout.setColumnStretch(1, 2)
+        req_layout.setColumnStretch(2, 2)
+        for i, detail in enumerate(system.details):
+            req_layout.addWidget(QLabel(detail.title, parent=self), i + 1, 0)
+            min_label = ElideLabel(detail.minimum, parent=self)
+            req_layout.addWidget(min_label, i + 1, 1)
+            rec_label = ElideLabel(detail.recommended, parent=self)
+            req_layout.addWidget(rec_label, i + 1, 2)
+        req_layout.setAlignment(Qt.AlignTop)
+        self.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Fixed)
--- a/rare/components/tabs/store/wishlist.py
+++ b/rare/components/tabs/store/wishlist.py
@ -30,14 +30,9 @@ class WishlistPage(SlidingStackedWidget, SideTabContents):
        self.details_widget.set_title.connect(self.set_title)
        self.details_widget.back_clicked.connect(self.show_main)

-        self.details_scroll = QScrollArea(self)
-        self.details_scroll.setWidgetResizable(True)
-        self.details_scroll.setFrameStyle(QFrame.NoFrame | QFrame.Plain)
-        self.details_scroll.setWidget(self.details_widget)
-
        self.setDirection(Qt.Horizontal)
        self.addWidget(self.wishlist_widget)
-        self.addWidget(self.details_scroll)
+        self.addWidget(self.details_widget)

    @pyqtSlot()
    def show_main(self):
@ -46,7 +41,7 @@ class WishlistPage(SlidingStackedWidget, SideTabContents):
    @pyqtSlot(object)
    def show_details(self, game: CatalogOfferModel):
        self.details_widget.update_game(game)
-        self.slideInWidget(self.details_scroll)
+        self.slideInWidget(self.details_widget)


 class WishlistWidget(QWidget, SideTabContents):
@ -118,19 +113,19 @@ class WishlistWidget(QWidget, SideTabContents):
            self.ui.list_container.layout().removeWidget(w)

        if sort == 0:
-            func = lambda x: x.game.title
+            func = lambda x: x.catalog_game.title
            reverse = self.ui.reverse.isChecked()
        elif sort == 1:
-            func = lambda x: x.game.price.total_price["fmtPrice"]["discountPrice"]
+            func = lambda x: x.catalog_game.price.total_price["fmtPrice"]["discountPrice"]
            reverse = self.ui.reverse.isChecked()
        elif sort == 2:
-            func = lambda x: x.game.seller["name"]
+            func = lambda x: x.catalog_game.seller["name"]
            reverse = self.ui.reverse.isChecked()
        elif sort == 3:
-            func = lambda x: 1 - (x.game.price.total_price["discountPrice"] / x.game.price.total_price["originalPrice"])
+            func = lambda x: 1 - (x.catalog_game.price.total_price["discountPrice"] / x.catalog_game.price.total_price["originalPrice"])
            reverse = not self.ui.reverse.isChecked()
        else:
-            func = lambda x: x.game.title
+            func = lambda x: x.catalog_game.title
            reverse = self.ui.reverse.isChecked()

        widgets = sorted(widgets, key=func, reverse=reverse)
--- a/rare/resources/static_css/stylesheet.py
+++ b/rare/resources/static_css/stylesheet.py
@ -64,6 +64,14 @@ def css_name(widget: Union[wrappertype, QObject, Type], subwidget: str = ""):
 css = qstylizer.style.StyleSheet()


+# Generic flat button
+css['QPushButton[flat="true"]'].setValues(
+    border="0px",
+    borderRadius="5px",
+    backgroundColor="rgba(255, 255, 255, 5%)",
+)
+
+
 # InfoLabel
 css.QLabel["#InfoLabel"].setValues(
    color="#999",
--- a/rare/ui/components/tabs/store/details.py
+++ b/rare/ui/components/tabs/store/details.py
@ -14,16 +14,23 @@ from PyQt5 import QtCore, QtGui, QtWidgets
 class Ui_DetailsWidget(object):
    def setupUi(self, DetailsWidget):
        DetailsWidget.setObjectName("DetailsWidget")
-        DetailsWidget.resize(414, 343)
+        DetailsWidget.resize(702, 414)
        DetailsWidget.setWindowTitle("DetailsWidget")
        self.main_layout = QtWidgets.QHBoxLayout(DetailsWidget)
        self.main_layout.setObjectName("main_layout")
+        self.back_button = QtWidgets.QPushButton(DetailsWidget)
+        sizePolicy = QtWidgets.QSizePolicy(QtWidgets.QSizePolicy.Fixed, QtWidgets.QSizePolicy.Expanding)
+        sizePolicy.setHorizontalStretch(0)
+        sizePolicy.setVerticalStretch(0)
+        sizePolicy.setHeightForWidth(self.back_button.sizePolicy().hasHeightForWidth())
+        self.back_button.setSizePolicy(sizePolicy)
+        self.back_button.setText("")
+        self.back_button.setIconSize(QtCore.QSize(32, 32))
+        self.back_button.setFlat(True)
+        self.back_button.setObjectName("back_button")
+        self.main_layout.addWidget(self.back_button)
        self.left_layout = QtWidgets.QVBoxLayout()
        self.left_layout.setObjectName("left_layout")
-        self.back_button = QtWidgets.QPushButton(DetailsWidget)
-        self.back_button.setText("")
-        self.back_button.setObjectName("back_button")
-        self.left_layout.addWidget(self.back_button)
        self.main_layout.addLayout(self.left_layout)
        self.right_layout = QtWidgets.QVBoxLayout()
        self.right_layout.setObjectName("right_layout")
@ -169,7 +176,7 @@ class Ui_DetailsWidget(object):
        self.description_label.setObjectName("description_label")
        self.right_layout.addWidget(self.description_label)
        self.main_layout.addLayout(self.right_layout)
-        self.main_layout.setStretch(1, 1)
+        self.main_layout.setStretch(2, 1)

        self.retranslateUi(DetailsWidget)

--- a/rare/ui/components/tabs/store/details.ui
+++ b/rare/ui/components/tabs/store/details.ui
@ -6,24 +6,38 @@
   <rect>
    <x>0</x>
    <y>0</y>
-    <width>414</width>
-    <height>343</height>
+    <width>702</width>
+    <height>414</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string notr="true">DetailsWidget</string>
  </property>
-  <layout class="QHBoxLayout" name="main_layout" stretch="0,1">
+  <layout class="QHBoxLayout" name="main_layout" stretch="0,0,1">
   <item>
-    <layout class="QVBoxLayout" name="left_layout">
-     <item>
-      <widget class="QPushButton" name="back_button">
-       <property name="text">
-        <string notr="true"/>
-       </property>
-      </widget>
-     </item>
-    </layout>
+    <widget class="QPushButton" name="back_button">
+     <property name="sizePolicy">
+      <sizepolicy hsizetype="Fixed" vsizetype="Expanding">
+       <horstretch>0</horstretch>
+       <verstretch>0</verstretch>
+      </sizepolicy>
+     </property>
+     <property name="text">
+      <string notr="true"/>
+     </property>
+     <property name="iconSize">
+      <size>
+       <width>32</width>
+       <height>32</height>
+      </size>
+     </property>
+     <property name="flat">
+      <bool>true</bool>
+     </property>
+    </widget>
+   </item>
+   <item>
+    <layout class="QVBoxLayout" name="left_layout"/>
   </item>
   <item>
    <layout class="QVBoxLayout" name="right_layout">