Display books on library page

Librum-Reader · Apr 1, 2024 · dbce043 · dbce043
1 parent b505945
commit dbce043
Show file tree

Hide file tree

Showing 3 changed files with 160 additions and 7 deletions.
diff --git a/src/presentation/mobile/libraryPage/MBook.qml b/src/presentation/mobile/libraryPage/MBook.qml
@@ -0,0 +1,93 @@
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import Librum.style
+import Librum.icons
+import CustomComponents
+import Librum.fonts
+import Librum.globals
+
+Item {
+    id: root
+    property bool downloading: false
+    signal leftButtonClicked(int index)
+    signal rightButtonClicked(int index, var mouse)
+    signal moreOptionClicked(int index, var point)
+
+    implicitWidth: 120
+    implicitHeight: 190
+    clip: true
+
+    ColumnLayout {
+        id: layout
+        anchors.fill: parent
+        spacing: 0
+
+        Rectangle {
+            id: upperBookPart
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+            color: Style.colorBookImageBackground
+
+            ColumnLayout {
+                id: upperPartLayout
+                anchors.centerIn: parent
+                spacing: 0
+
+                Image {
+                    id: bookCover
+                    // visible: source != ""
+                    visible: false
+                    Layout.alignment: Qt.AlignHCenter
+                    Layout.topMargin: -10
+                    // source: cover
+                    cache: false
+                }
+            }
+        }
+
+        Rectangle {
+            id: lowerBookPart
+            Layout.fillWidth: true
+            Layout.preferredHeight: 42
+            color: "transparent"
+
+            ColumnLayout {
+                id: bottomPartLayout
+                width: parent.width
+                anchors.horizontalCenter: parent.horizontalCenter
+                spacing: 0
+
+                Label {
+                    id: title
+                    Layout.fillWidth: true
+                    Layout.preferredHeight: 24
+                    Layout.topMargin: 5
+                    clip: true
+                    text: model.title === "" ? qsTr("Unknown") : model.title
+                    font.weight: Font.Medium
+                    verticalAlignment: Text.AlignVCenter
+                    color: Style.colorTitle
+                    font.pointSize: Fonts.size12
+                    lineHeight: 0.8
+                    wrapMode: TextInput.WrapAtWordBoundaryOrAnywhere
+                    elide: Text.ElideRight
+                }
+
+                Label {
+                    id: authors
+                    Layout.fillWidth: true
+                    clip: true
+                    text: model.authors === "" ? qsTr("Unknown") : model.authors
+                    color: Style.colorLightText
+                    font.pointSize: Fonts.size11
+                    elide: Text.ElideRight
+                }
+            }
+        }
+    }
+
+    function giveFocus() {
+        root.forceActiveFocus()
+    }
+}
diff --git a/src/presentation/mobile/libraryPage/MLibraryPage.qml b/src/presentation/mobile/libraryPage/MLibraryPage.qml
@@ -13,12 +13,71 @@ Page {
         color: Style.colorPageBackground
     }
 
-    Label {
-        id: welcomeText
-        anchors.centerIn: parent
-        text: qsTr("Home Page")
-        color: Style.colorTitle
-        font.weight: Font.Bold
-        font.pointSize: Fonts.size28
+    ColumnLayout {
+        anchors.fill: parent
+
+        Pane {
+            id: bookGridContainer
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+            Layout.minimumHeight: 100
+            padding: 0
+            background: Rectangle {
+                color: "transparent"
+            }
+
+            GridView {
+                id: bookGrid
+                width: cellWidth * 2
+                height: parent.height
+                anchors.horizontalCenter: parent.horizontalCenter
+                cellWidth: 120 + 14
+                cellHeight: 190 + 14
+                rightMargin: -14
+                layoutDirection: Qt.LeftToRight
+                LayoutMirroring.enabled: false
+                LayoutMirroring.childrenInherit: true
+                interactive: true
+                boundsBehavior: Flickable.StopAtBounds
+                flickDeceleration: 1650
+                maximumFlickVelocity: 2500
+                clip: true
+                model: LibraryController.libraryModel
+                delegate: MBook {}
+            }
+
+            ScrollBar {
+                id: verticalScrollbar
+                width: pressed ? 14 : 12
+                hoverEnabled: true
+                active: true
+                policy: ScrollBar.AlwaysOff
+                visible: bookGrid.contentHeight > bookGrid.height
+                orientation: Qt.Vertical
+                size: bookGrid.height / bookGrid.contentHeight
+                minimumSize: 0.04
+                position: (bookGrid.contentY - bookGrid.originY) / bookGrid.contentHeight
+                onPositionChanged: if (pressed)
+                                       bookGrid.contentY = position
+                                               * bookGrid.contentHeight + bookGrid.originY
+                anchors.top: parent.top
+                anchors.right: parent.right
+                anchors.bottomMargin: 16
+                anchors.bottom: parent.bottom
+                horizontalPadding: 4
+
+                contentItem: Rectangle {
+                    color: Style.colorScrollBarHandle
+                    opacity: verticalScrollbar.pressed ? 0.8 : 1
+                    radius: 4
+                }
+
+                background: Rectangle {
+                    implicitWidth: 26
+                    implicitHeight: 200
+                    color: "transparent"
+                }
+            }
+        }
     }
 }
diff --git a/src/presentation/mobile/qmlSourcesMobile.qrc b/src/presentation/mobile/qmlSourcesMobile.qrc
@@ -20,5 +20,6 @@
         <file>modules/CustomComponents/MFlickWrapper.qml</file>
         <file>myAccountPage/MMyAccountPage.qml</file>
         <file>modules/CustomComponents/buttons/MBackButton.qml</file>
+        <file>libraryPage/MBook.qml</file>
     </qresource>
 </RCC>