@@ -4,208 +4,213 @@ import Unity.Launcher 0.1
44import Utils 0.1
55import "../Components"
66
7−Rectangle {
7+FocusScope {
88 id: root
9− color: "#BF000000"
109
1110 property int panelWidth: 0
1211 readonly property bool moving: listLoader.item && listLoader.item.moving
1312
1413 signal applicationSelected(string appId)
1514
16− AppDrawerModel {
17− id: appDrawerModel
18− }
19−
20− AppDrawerProxyModel {
21− id: sortProxyModel
22− source: appDrawerModel
23− filterString: searchField.text
24− }
25−
26− Item {
27− id: contentContainer
15+ Rectangle {
2816 anchors.fill: parent
29− anchors.leftMargin: root.panelWidth
17+ color: "#BF000000"
3018
31− TextField {
32− id: searchField
33− anchors { left: parent.left; top: parent.top; right: parent.right; margins: units.gu(1) }
34− placeholderText: i18n.tr("Search...")
19+ AppDrawerModel {
20+ id: appDrawerModel
3521 }
3622
37− Item {
38− id: sectionsContainer
39− anchors { left: parent.left; top: searchField.bottom; right: parent.right; }
40− height: sections.height
41− clip: true
42− z: 2
43−
44− Sections {
45− id: sections
46− width: parent.width
47− actions: [
48− Action {
49− text: "A-Z"
50− },
51− Action {
52− text: "Most used"
53− }
54− ]
55−
56− Rectangle {
57− anchors.bottom: parent.bottom
58− height: units.dp(1)
59− color: 'gray'
60− width: contentContainer.width
61− }
62− }
23+ AppDrawerProxyModel {
24+ id: sortProxyModel
25+ source: appDrawerModel
26+ filterString: searchField.text
6327 }
6428
65− Loader {
66− id: listLoader
67− anchors { left: parent.left; top: sectionsContainer.bottom; right: parent.right; bottom: parent.bottom; leftMargin: units.gu(1); rightMargin: units.gu(1) }
68− sourceComponent: sections.selectedIndex == 0 ? aToZComponent : mostUsedComponent
69− }
29+ Item {
30+ id: contentContainer
31+ anchors.fill: parent
32+ anchors.leftMargin: root.panelWidth
33+
34+ TextField {
35+ id: searchField
36+ anchors { left: parent.left; top: parent.top; right: parent.right; margins: units.gu(1) }
37+ placeholderText: i18n.tr("Search...")
38+ focus: true
39+ }
7040
71− Component {
72− id: mostUsedComponent
73− ListView {
74− anchors.fill: parent
75− topMargin: units.gu(1)
76− bottomMargin: units.gu(1)
77− spacing: units.gu(1)
41+ Item {
42+ id: sectionsContainer
43+ anchors { left: parent.left; top: searchField.bottom; right: parent.right; }
44+ height: sections.height
7845 clip: true
46+ z: 2
7947
80− header: MoreAppsHeader {
48+ Sections {
49+ id: sections
8150 width: parent.width
82− height: units.gu(6)
83− }
51+ actions: [
52+ Action {
53+ text: "A-Z"
54+ },
55+ Action {
56+ text: "Most used"
57+ }
58+ ]
8459
85− model: AppDrawerProxyModel {
86− source: sortProxyModel
87− group: AppDrawerProxyModel.GroupByAll
60+ Rectangle {
61+ anchors.bottom: parent.bottom
62+ height: units.dp(1)
63+ color: 'gray'
64+ width: contentContainer.width
65+ }
8866 }
67+ }
8968
90− delegate: UbuntuShape {
91− width: parent.width
92− color: "#20ffffff"
93− aspect: UbuntuShape.Flat
94− // NOTE: Cannot use gridView.rows here as it would evaluate to 0 at first and only update later,
95− // which messes up the ListView.
96− height: (Math.ceil(mostUsedGridView.model.count / mostUsedGridView.columns) * mostUsedGridView.delegateHeight) + units.gu(2)
69+ Loader {
70+ id: listLoader
71+ anchors { left: parent.left; top: sectionsContainer.bottom; right: parent.right; bottom: parent.bottom; leftMargin: units.gu(1); rightMargin: units.gu(1) }
72+ sourceComponent: sections.selectedIndex == 0 ? aToZComponent : mostUsedComponent
73+ }
9774
98− DrawerGridView {
99− id: mostUsedGridView
100− anchors.fill: parent
101− topMargin: units.gu(1)
102− bottomMargin: units.gu(1)
103− clip: true
75+ Component {
76+ id: mostUsedComponent
77+ ListView {
78+ anchors.fill: parent
79+ topMargin: units.gu(1)
80+ bottomMargin: units.gu(1)
81+ spacing: units.gu(1)
82+ clip: true
83+
84+ header: MoreAppsHeader {
85+ width: parent.width
86+ height: units.gu(6)
87+ }
10488
105− model: sortProxyModel
89+ model: AppDrawerProxyModel {
90+ source: sortProxyModel
91+ group: AppDrawerProxyModel.GroupByAll
92+ }
10693
94+ delegate: UbuntuShape {
95+ width: parent.width
96+ color: "#20ffffff"
97+ aspect: UbuntuShape.Flat
98+ // NOTE: Cannot use gridView.rows here as it would evaluate to 0 at first and only update later,
99+ // which messes up the ListView.
100+ height: (Math.ceil(mostUsedGridView.model.count / mostUsedGridView.columns) * mostUsedGridView.delegateHeight) + units.gu(2)
107101
108− delegateWidth: units.gu(8)
109− delegateHeight: units.gu(10)
110− delegate: drawerDelegateComponent
111− }
112− }
113− }
114− }
102+ DrawerGridView {
103+ id: mostUsedGridView
104+ anchors.fill: parent
105+ topMargin: units.gu(1)
106+ bottomMargin: units.gu(1)
107+ clip: true
115108
116− Component {
117− id: aToZComponent
118− ListView {
119− anchors.fill: parent
120− topMargin: units.gu(1)
121− bottomMargin: units.gu(1)
122− spacing: units.gu(1)
123− clip: true
109+ model: sortProxyModel
124110
125− header: MoreAppsHeader {
126− width: parent.width
127− height: units.gu(6)
128− }
129111
130− model: AppDrawerProxyModel {
131− source: sortProxyModel
132− group: AppDrawerProxyModel.GroupByAToZ
112+ delegateWidth: units.gu(8)
113+ delegateHeight: units.gu(10)
114+ delegate: drawerDelegateComponent
115+ }
116+ }
133117 }
118+ }
134119
135− delegate: UbuntuShape {
136− width: parent.width
137− color: "#20ffffff"
138− aspect: UbuntuShape.Flat
139−
140− // NOTE: Cannot use gridView.rows here as it would evaluate to 0 at first and only update later,
141− // which messes up the ListView.
142− height: (Math.ceil(gridView.model.count / gridView.columns) * gridView.delegateHeight) +
143− categoryNameLabel.implicitHeight + units.gu(2)
120+ Component {
121+ id: aToZComponent
122+ ListView {
123+ anchors.fill: parent
124+ topMargin: units.gu(1)
125+ bottomMargin: units.gu(1)
126+ spacing: units.gu(1)
127+ clip: true
128+
129+ header: MoreAppsHeader {
130+ width: parent.width
131+ height: units.gu(6)
132+ }
144133
145− Label {
146− id: categoryNameLabel
147− anchors { left: parent.left; top: parent.top; right: parent.right; margins: units.gu(1) }
148− text: model.letter
134+ model: AppDrawerProxyModel {
135+ source: sortProxyModel
136+ group: AppDrawerProxyModel.GroupByAToZ
149137 }
150138
151− DrawerGridView {
152− id: gridView
153− anchors { left: parent.left; top: categoryNameLabel.bottom; right: parent.right; topMargin: units.gu(1) }
154− height: rows * delegateHeight
139+ delegate: UbuntuShape {
140+ width: parent.width
141+ color: "#20ffffff"
142+ aspect: UbuntuShape.Flat
143+
144+ // NOTE: Cannot use gridView.rows here as it would evaluate to 0 at first and only update later,
145+ // which messes up the ListView.
146+ height: (Math.ceil(gridView.model.count / gridView.columns) * gridView.delegateHeight) +
147+ categoryNameLabel.implicitHeight + units.gu(2)
155148
156− interactive: false
149+ Label {
150+ id: categoryNameLabel
151+ anchors { left: parent.left; top: parent.top; right: parent.right; margins: units.gu(1) }
152+ text: model.letter
153+ }
157154
158− model: AppDrawerProxyModel {
159− id: categoryModel
160− source: sortProxyModel
161− filterLetter: model.letter
155+ DrawerGridView {
156+ id: gridView
157+ anchors { left: parent.left; top: categoryNameLabel.bottom; right: parent.right; topMargin: units.gu(1) }
158+ height: rows * delegateHeight
159+
160+ interactive: false
161+
162+ model: AppDrawerProxyModel {
163+ id: categoryModel
164+ source: sortProxyModel
165+ filterLetter: model.letter
166+ }
167+ delegateWidth: units.gu(8)
168+ delegateHeight: units.gu(10)
169+ delegate: drawerDelegateComponent
162170 }
163− delegateWidth: units.gu(8)
164− delegateHeight: units.gu(10)
165− delegate: drawerDelegateComponent
166171 }
167172 }
168173 }
169174 }
170− }
171−
172− Component {
173− id: drawerDelegateComponent
174− AbstractButton {
175− width: GridView.view.cellWidth
176− height: units.gu(10)
177175
178− onClicked: root.applicationSelected(model.appId)
176+ Component {
177+ id: drawerDelegateComponent
178+ AbstractButton {
179+ width: GridView.view.cellWidth
180+ height: units.gu(10)
179181
180− Column {
181− width: units.gu(8)
182− anchors.horizontalCenter: parent.horizontalCenter
183− height: childrenRect.height
184− spacing: units.gu(1)
182+ onClicked: root.applicationSelected(model.appId)
185183
186− UbuntuShape {
187− id: appIcon
188− width: units.gu(6)
189− height: 7.5 / 8 * width
184+ Column {
185+ width: units.gu(8)
190186 anchors.horizontalCenter: parent.horizontalCenter
191− backgroundMode: UbuntuShape.SolidColor
192− backgroundColor: UbuntuColors.lightGrey
193− radius: "medium"
194− borderSource: 'undefined'
195− source: Image {
196− id: sourceImage
197− sourceSize.width: appIcon.width
198− source: model.icon
187+ height: childrenRect.height
188+ spacing: units.gu(1)
189+
190+ UbuntuShape {
191+ id: appIcon
192+ width: units.gu(6)
193+ height: 7.5 / 8 * width
194+ anchors.horizontalCenter: parent.horizontalCenter
195+ backgroundMode: UbuntuShape.SolidColor
196+ backgroundColor: UbuntuColors.lightGrey
197+ radius: "medium"
198+ borderSource: 'undefined'
199+ source: Image {
200+ id: sourceImage
201+ sourceSize.width: appIcon.width
202+ source: model.icon
203+ }
204+ sourceFillMode: UbuntuShape.PreserveAspectCrop
199205 }
200− sourceFillMode: UbuntuShape.PreserveAspectCrop
201− }
202206
203− Label {
204− text: model.name
205− width: parent.width
206− horizontalAlignment: Text.AlignHCenter
207− fontSize: "small"
208− elide: Text.ElideRight
207+ Label {
208+ text: model.name
209+ width: parent.width
210+ horizontalAlignment: Text.AlignHCenter
211+ fontSize: "small"
212+ elide: Text.ElideRight
213+ }
209214 }
210215 }
211216 }