aboutsummaryrefslogtreecommitdiffstats
path: root/share/qtcreator/qmldesigner/collectionEditorQmlSource/CollectionView.qml
blob: 9d483037ac8cd10d2b4154c386853436688dde60 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import HelperWidgets as HelperWidgets
import StudioTheme as StudioTheme
import CollectionEditorBackend

Item {
    id: root
    focus: true

    property var rootView: CollectionEditorBackend.rootView
    property var model: CollectionEditorBackend.model
    property var collectionDetailsModel: CollectionEditorBackend.collectionDetailsModel
    property var collectionDetailsSortFilterModel: CollectionEditorBackend.collectionDetailsSortFilterModel

    function showWarning(title, message) {
        warningDialog.title = title
        warningDialog.message = message
        warningDialog.open()
    }

    // called from C++ when using the delete key
    function deleteSelectedCollection() {
        print("TODO: deleteSelectedCollection")
    }

    function closeDialogs() {
        importDialog.reject()
        newCollection.reject()
        warningDialog.reject()
    }

    ImportDialog {
        id: importDialog

        backendValue: root.rootView
        anchors.centerIn: parent
    }

    NewCollectionDialog {
        id: newCollection

        anchors.centerIn: parent
    }

    Message {
        id: warningDialog

        title: ""
        message: ""
    }

    Rectangle {
        // Covers the toolbar color on top to prevent the background
        // color for the margin of splitter

        anchors.top: parent.top
        anchors.left: parent.left
        anchors.right: parent.right
        height: topToolbar.height
        color: topToolbar.color
    }

    SplitView {
        id: splitView

        readonly property bool isHorizontal: splitView.orientation === Qt.Horizontal

        orientation: width >= 500 ? Qt.Horizontal : Qt.Vertical
        anchors.fill: parent

        onOrientationChanged: detailsView.closeDialogs()

        handle: Item {
            id: handleDelegate

            property color color: SplitHandle.pressed ? StudioTheme.Values.themeControlOutlineInteraction
                                                      : SplitHandle.hovered ? StudioTheme.Values.themeControlOutlineHover
                                                                            : StudioTheme.Values.themeControlOutline

            implicitWidth: 1
            implicitHeight: 1

            Rectangle {
                id: handleRect

                property real verticalMargin: splitView.isHorizontal ? StudioTheme.Values.splitterMargin : 0
                property real horizontalMargin: splitView.isHorizontal ? 0 : StudioTheme.Values.splitterMargin

                anchors.fill: parent
                anchors.topMargin: handleRect.verticalMargin
                anchors.bottomMargin: handleRect.verticalMargin
                anchors.leftMargin: handleRect.horizontalMargin
                anchors.rightMargin: handleRect.horizontalMargin

                color: handleDelegate.color
            }

            containmentMask: Item {
                x: splitView.isHorizontal ? ((handleDelegate.width - width) / 2) : 0
                y: splitView.isHorizontal ? 0 : ((handleDelegate.height - height) / 2)
                height: splitView.isHorizontal ? handleDelegate.height : StudioTheme.Values.borderHover
                width: splitView.isHorizontal ? StudioTheme.Values.borderHover : handleDelegate.width
            }
        }

        ColumnLayout {
            id: collectionsSideBar
            spacing: 0

            SplitView.minimumWidth: 200
            SplitView.maximumWidth: 450
            SplitView.minimumHeight: 200
            SplitView.maximumHeight: 400
            SplitView.fillWidth: !splitView.isHorizontal
            SplitView.fillHeight: splitView.isHorizontal

            Rectangle {
                id: topToolbar
                color: StudioTheme.Values.themeToolbarBackground

                Layout.preferredHeight: StudioTheme.Values.toolbarHeight
                Layout.fillWidth: true
                Layout.alignment: Qt.AlignTop | Qt.AlignHCenter

                Text {
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.left: parent.left
                    anchors.leftMargin: StudioTheme.Values.toolbarHorizontalMargin

                    text: qsTr("Data Models")
                    font.pixelSize: StudioTheme.Values.baseFontSize
                    color: StudioTheme.Values.themeTextColor
                }

                HelperWidgets.AbstractButton {
                    id: importCollectionButton

                    anchors.verticalCenter: parent.verticalCenter
                    anchors.right: parent.right
                    anchors.rightMargin: StudioTheme.Values.toolbarHorizontalMargin

                    style: StudioTheme.Values.viewBarButtonStyle
                    buttonIcon: StudioTheme.Constants.import_medium
                    tooltip: qsTr("Import a model")

                    onClicked: importDialog.open()
                }
            }

            CollectionListView { // Model Groups
                id: collectionListView

                Layout.fillWidth: true
                Layout.minimumHeight: bottomSpacer.isExpanded ? 150 : 0
                Layout.fillHeight: !bottomSpacer.isExpanded
                Layout.preferredHeight: contentHeight
                Layout.maximumHeight: contentHeight
                Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
            }

            HelperWidgets.IconButton {
                id: addCollectionButton

                iconSize: 16
                Layout.fillWidth: true
                Layout.minimumWidth: 24
                Layout.alignment: Qt.AlignTop | Qt.AlignHCenter

                tooltip: qsTr("Add a new model")
                icon: StudioTheme.Constants.create_medium
                onClicked: newCollection.open()
            }

            Item {
                id: bottomSpacer

                readonly property bool isExpanded: height > 0
                Layout.minimumWidth: 1
                Layout.fillHeight: true
            }
        }

        CollectionDetailsView {
            id: detailsView

            model: root.collectionDetailsModel
            backend: root.model
            sortedModel: root.collectionDetailsSortFilterModel
            SplitView.fillHeight: true
            SplitView.fillWidth: true
        }
    }

    Connections {
        target: root.model

        function onModelReset() {
            root.closeDialogs()
        }
    }
}