ui/components/Sidebar.qml

0001 // SPDX-FileCopyrightText: 2022 Devin Lin <devin@kde.org>
0002 // SPDX-License-Identifier: GPL-3.0-or-later
0003
0004 import QtQuick
0005 import QtQuick.Layouts
0006 import QtQuick.Window
0007 import QtQuick.Controls as QQC2
0008
0009 import org.kde.kirigami as Kirigami
0010
0011 import org.kde.plasmatube
0012
0013 Kirigami.OverlayDrawer {
0014     id: root
0015
0016     property alias trendingDelegate: trendingDelegate
0017     property alias subscriptionsDelegate: subscriptionsDelegate
0018     property alias playslistsDelegate: playslistsDelegate
0019     property alias historyDelegate: historyDelegate
0020
0021     width: Kirigami.Units.gridUnit * 13
0022     height: applicationWindow().height
0023     edge: Qt.application.layoutDirection === Qt.RightToLeft ? Qt.RightEdge : Qt.LeftEdge
0024     drawerOpen: !Kirigami.Settings.isMobile && enabled
0025     modal: !enabled || Kirigami.Settings.isMobile || Kirigami.Settings.tabletMode || (applicationWindow().width < Kirigami.Units.gridUnit * 50 && !collapsed) // Only modal when not collapsed, otherwise collapsed won't show.
0026
0027     onModalChanged: drawerOpen = !modal
0028
0029     Kirigami.Theme.colorSet: Kirigami.Theme.Window
0030     Kirigami.Theme.inherit: false
0031
0032     leftPadding: 0
0033     rightPadding: 0
0034     topPadding: 0
0035     bottomPadding: 0
0036
0037     contentItem: ColumnLayout {
0038         id: column
0039
0040         spacing: 0
0041
0042         QQC2.ToolBar {
0043             Layout.fillWidth: true
0044             Layout.preferredHeight: pageStack.globalToolBar.preferredHeight
0045             Layout.bottomMargin: Kirigami.Units.smallSpacing / 2
0046
0047             leftPadding: 3
0048             rightPadding: 3
0049             topPadding: 3
0050             bottomPadding: 3
0051
0052             visible: !Kirigami.Settings.isMobile
0053
0054             contentItem: Kirigami.SearchField {
0055                 id: searchField
0056
0057                 autoAccept: false
0058
0059                 onAccepted: {
0060                     let page = Qt.createComponent("org.kde.plasmatube", "SearchPage");
0061                     applicationWindow().switchToPage(page, {initialSearch: searchField.text});
0062                     searchField.text = "";
0063                 }
0064             }
0065         }
0066
0067         SourceSwitcher {
0068             Layout.fillWidth: true
0069         }
0070
0071         Kirigami.Separator {
0072             Layout.fillWidth: true
0073         }
0074
0075         QQC2.ButtonGroup {
0076             id: pageButtonGroup
0077         }
0078
0079         QQC2.ItemDelegate {
0080             id: trendingDelegate
0081
0082             Layout.fillWidth: true
0083             width: column.width - column.Layout.leftMargin - column.Layout.rightMargin
0084
0085             icon.name: "favorite"
0086             text: i18n("Trending")
0087             onClicked: {
0088                 applicationWindow().switchToPage(Qt.createComponent("org.kde.plasmatube", "TrendingPage"));
0089                 checked = true;
0090             }
0091             highlighted: checked
0092
0093             QQC2.ButtonGroup.group: pageButtonGroup
0094         }
0095
0096         QQC2.ItemDelegate {
0097             id: subscriptionsDelegate
0098
0099             Layout.fillWidth: true
0100             width: column.width - column.Layout.leftMargin - column.Layout.rightMargin
0101
0102             icon.name: "videoclip-amarok"
0103             text: i18n("Subscriptions")
0104             enabled: PlasmaTube.selectedSource !== null && PlasmaTube.selectedSource.loggedIn
0105             onClicked: {
0106                 applicationWindow().switchToPage(Qt.createComponent("org.kde.plasmatube", "SubscriptionsPage"));
0107                 checked = true;
0108             }
0109             highlighted: checked
0110
0111             QQC2.ButtonGroup.group: pageButtonGroup
0112         }
0113
0114         QQC2.ItemDelegate {
0115             id: playslistsDelegate
0116
0117             Layout.fillWidth: true
0118             width: column.width - column.Layout.leftMargin - column.Layout.rightMargin
0119
0120             icon.name: "view-media-playlist"
0121             text: i18n("Playlists")
0122             enabled: PlasmaTube.selectedSource !== null && PlasmaTube.selectedSource.loggedIn
0123             onClicked: {
0124                 applicationWindow().switchToPage(Qt.createComponent("org.kde.plasmatube", "PlaylistsPage"));
0125                 checked = true;
0126             }
0127             highlighted: checked
0128
0129             QQC2.ButtonGroup.group: pageButtonGroup
0130         }
0131
0132         QQC2.ItemDelegate {
0133             id: historyDelegate
0134
0135             Layout.fillWidth: true
0136             width: column.width - column.Layout.leftMargin - column.Layout.rightMargin
0137
0138             icon.name: "view-history"
0139             text: i18n("History")
0140             enabled: PlasmaTube.selectedSource !== null && PlasmaTube.selectedSource.loggedIn
0141             onClicked: {
0142                 applicationWindow().switchToPage(Qt.createComponent("org.kde.plasmatube", "HistoryPage"));
0143                 checked = true;
0144             }
0145             highlighted: checked
0146
0147             QQC2.ButtonGroup.group: pageButtonGroup
0148         }
0149
0150         Item {
0151             Layout.fillHeight: true
0152         }
0153
0154         QQC2.ItemDelegate {
0155             icon.name: "settings-configure"
0156             text: i18nc("@action:button Open settings dialog", "Settings")
0157             padding: Kirigami.Units.largeSpacing
0158
0159             onClicked: {
0160                 applicationWindow().pageStack.pushDialogLayer(Qt.createComponent("org.kde.plasmatube", "SettingsPage"));
0161             }
0162
0163             Layout.fillWidth: true
0164         }
0165     }
0166 }
0167