git.iko.soy/unity8
on 3bbd428 help sign in
unity8/Dash/GenericScopeView.qml
592 lines 23 kB history raw
1/*
2 * Copyright (C) 2013 Canonical, Ltd.
3 *
4 * This program is free software; you can redistribute it and/or modify
5 * it under the terms of the GNU General Public License as published by
6 * the Free Software Foundation; version 3.
7 *
8 * This program is distributed in the hope that it will be useful,
9 * but WITHOUT ANY WARRANTY; without even the implied warranty of
10 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11 * GNU General Public License for more details.
12 *
13 * You should have received a copy of the GNU General Public License
14 * along with this program. If not, see <http://www.gnu.org/licenses/>.
15 */
17import QtQuick 2.0
18import Ubuntu.Components 0.1
19import Utils 0.1
20import Unity 0.2
21import "../Components"
22import "../Components/ListItems" as ListItems
24FocusScope {
25 id: scopeView
27 property Scope scope
28 property SortFilterProxyModel categories: categoryFilter
29 property bool isCurrent
30 property ListModel searchHistory
31 property alias moving: categoryView.moving
33 signal endReached
34 signal movementStarted
35 signal positionedAtBeginning
37 readonly property alias previewShown: previewListView.onScreen
38 property bool enableHeightBehaviorOnNextCreation: false
40 // FIXME delay the search so that daemons have time to settle, note that
41 // removing this will break ScopeView::test_changeScope
42 onScopeChanged: {
43 if (scope) {
44 timer.restart();
45 scope.activateApplication.connect(activateApp);
46 }
47 }
49 function activateApp(appId) {
50 shell.activateApplication(appId);
51 }
53 Binding {
54 target: scope
55 property: "isActive"
56 value: isCurrent
57 }
59 Timer {
60 id: timer
61 interval: 2000
62 onTriggered: scope.searchQuery = ""
63 }
65 SortFilterProxyModel {
66 id: categoryFilter
67 model: scope ? scope.categories : null
68 dynamicSortFilter: true
69 filterRole: Categories.RoleCount
70 filterRegExp: /^0$/
71 invertMatch: true
72 }
74 onIsCurrentChanged: {
75 pageHeader.resetSearch();
76 previewListView.open = false;
77 }
79 onMovementStarted: categoryView.showHeader()
81 onPositionedAtBeginning: categoryView.positionAtBeginning()
83 Binding {
84 target: scopeView.scope
85 property: "searchQuery"
86 value: pageHeader.searchQuery
87 }
89 Binding {
90 target: pageHeader
91 property: "searchQuery"
92 value: scopeView.scope.searchQuery
93 }
95 Connections {
96 target: panel
97 onSearchClicked: if (isCurrent) {
98 pageHeader.triggerSearch()
99 categoryView.showHeader()
100 }
101 }
103 Connections {
104 target: scopeView.scope
105 onShowDash: previewListView.open = false;
106 onHideDash: previewListView.open = false;
107 }
109 ScopeListView {
110 id: categoryView
111 objectName: "categoryListView"
112 anchors.fill: parent
113 model: scopeView.categories
114 forceNoClip: previewListView.onScreen
116 onAtYEndChanged: if (atYEnd) endReached()
117 onMovingChanged: if (moving && atYEnd) endReached()
119 property string expandedCategoryId: ""
120 signal correctExpandedCategory();
122 Behavior on contentY {
123 enabled: previewListView.open
124 UbuntuNumberAnimation {}
125 }
127 delegate: ListItems.Base {
128 id: baseItem
129 highlightWhenPressed: false
131 readonly property bool expandable: rendererLoader.item ? rendererLoader.item.expandable : false
132 readonly property bool filtered: rendererLoader.item ? rendererLoader.item.filter : true
133 readonly property string category: categoryId
135 Loader {
136 id: rendererLoader
137 anchors {
138 top: parent.top
139 left: parent.left
140 right: parent.right
141 }
143 source: getRenderer(model.renderer, model.contentType, model.rendererHint, results)
145 onLoaded: {
146 if (item.enableHeightBehavior !== undefined && item.enableHeightBehaviorOnNextCreation !== undefined) {
147 item.enableHeightBehavior = scopeView.enableHeightBehaviorOnNextCreation;
148 scopeView.enableHeightBehaviorOnNextCreation = false;
149 }
150 if (source.toString().indexOf("Apps/RunningApplicationsGrid.qml") != -1) {
151 // TODO: the running apps grid doesn't support standard scope results model yet
152 item.firstModel = Qt.binding(function() { return results.firstModel })
153 item.secondModel = Qt.binding(function() { return results.secondModel })
154 item.canEnableTerminationMode = Qt.binding(function() { return scopeView.isCurrent })
155 } else {
156 item.model = Qt.binding(function() { return results })
157 }
158 item.objectName = Qt.binding(function() { return categoryId })
159 if (item.expandable) {
160 var shouldFilter = categoryId != categoryView.expandedCategoryId;
161 if (shouldFilter != item.filter) {
162 item.filter = shouldFilter;
163 }
164 }
165 updateDelegateCreationRange();
166 }
168 Component.onDestruction: {
169 if (item.enableHeightBehavior !== undefined && item.enableHeightBehaviorOnNextCreation !== undefined) {
170 scopeView.enableHeightBehaviorOnNextCreation = item.enableHeightBehaviorOnNextCreation;
171 }
172 }
174 Connections {
175 target: rendererLoader.item
176 onClicked: {
177 // Prepare the preview in case activate() triggers a preview only
178 effect.positionPx = Math.max(mapToItem(categoryView, 0, itemY).y, pageHeader.height + categoryView.stickyHeaderHeight);
179 previewListView.categoryId = categoryId
180 previewListView.categoryDelegate = rendererLoader.item
181 previewListView.model = target.model;
182 previewListView.init = true;
183 previewListView.currentIndex = index;
185 var item = target.model.get(index);
187 if ((scopeView.scope.id == "applications.scope" && categoryId == "installed")
188 || (scopeView.scope.id == "home.scope" && categoryId == "applications.scope")) {
189 scopeView.scope.activate(item.uri, item.icon, item.category, 0, item.mimetype, item.title,
190 item.comment, item.dndUri, item.metadata)
191 } else {
192 previewListView.open = true
194 scopeView.scope.preview(item.uri, item.icon, item.category, 0, item.mimetype, item.title,
195 item.comment, item.dndUri, item.metadata)
196 }
197 }
198 onPressAndHold: {
199 effect.positionPx = Math.max(mapToItem(categoryView, 0, itemY).y, pageHeader.height + categoryView.stickyHeaderHeight);
200 previewListView.categoryId = categoryId
201 previewListView.categoryDelegate = rendererLoader.item
202 previewListView.model = target.model;
203 previewListView.init = true;
204 previewListView.currentIndex = index;
205 previewListView.open = true
207 var item = target.model.get(index)
208 scopeView.scope.preview(item.uri, item.icon, item.category, 0, item.mimetype, item.title,
209 item.comment, item.dndUri, item.metadata)
210 }
211 }
212 Connections {
213 target: categoryView
214 onExpandedCategoryIdChanged: {
215 collapseAllButExpandedCategory();
216 }
217 onCorrectExpandedCategory: {
218 collapseAllButExpandedCategory();
219 }
220 function collapseAllButExpandedCategory() {
221 var item = rendererLoader.item;
222 if (item.expandable) {
223 var shouldFilter = categoryId != categoryView.expandedCategoryId;
224 if (shouldFilter != item.filter) {
225 // If the filter animation will be seen start it, otherwise, just flip the switch
226 var shrinkingVisible = shouldFilter && y + item.collapsedHeight < categoryView.height;
227 var growingVisible = !shouldFilter && y + height < categoryView.height;
228 if (!previewListView.open || !shouldFilter) {
229 if (shrinkingVisible || growingVisible) {
230 item.startFilterAnimation(shouldFilter)
231 } else {
232 item.filter = shouldFilter;
233 }
234 if (!shouldFilter && !previewListView.open) {
235 categoryView.maximizeVisibleArea(index, item.uncollapsedHeight);
236 }
237 }
238 }
239 }
240 }
241 onContentYChanged: rendererLoader.updateDelegateCreationRange();
242 onHeightChanged: rendererLoader.updateDelegateCreationRange();
243 }
245 function updateDelegateCreationRange() {
246 // Do not update the range if we are overshooting up or down, since we'll come back
247 // to the stable position and delete/create items without any reason
248 if (categoryView.contentY < categoryView.originY) {
249 return;
250 } else if (categoryView.contentY + categoryView.height > categoryView.contentHeight) {
251 return;
252 }
254 if (item.hasOwnProperty("delegateCreationBegin")) {
255 if (baseItem.y + baseItem.height <= 0) {
256 // Not visible (item at top of the list)
257 item.delegateCreationBegin = baseItem.height
258 item.delegateCreationEnd = baseItem.height
259 } else if (baseItem.y >= categoryView.height) {
260 // Not visible (item at bottom of the list)
261 item.delegateCreationBegin = 0
262 item.delegateCreationEnd = 0
263 } else {
264 item.delegateCreationBegin = Math.max(-baseItem.y, 0)
265 item.delegateCreationEnd = Math.min(categoryView.height + item.delegateCreationBegin, baseItem.height)
266 }
267 }
268 }
269 }
270 }
272 sectionProperty: "name"
273 sectionDelegate: ListItems.Header {
274 property var delegate: categoryView.item(delegateIndex)
275 width: categoryView.width
276 text: section
277 image: {
278 if (delegate && delegate.expandable)
279 return delegate.filtered ? "graphics/header_handlearrow.png" : "graphics/header_handlearrow2.png"
280 return "";
281 }
282 onClicked: {
283 if (categoryView.expandedCategoryId != delegate.category)
284 categoryView.expandedCategoryId = delegate.category;
285 else
286 categoryView.expandedCategoryId = "";
287 }
288 }
289 pageHeader: PageHeader {
290 id: pageHeader
291 objectName: "pageHeader"
292 width: categoryView.width
293 text: scopeView.scope.name
294 searchEntryEnabled: true
295 scope: scopeView.scope
296 searchHistory: scopeView.searchHistory
297 }
298 }
300 function getDefaultRendererId(contentType) {
301 switch (contentType) {
302 default: return "grid";
303 }
304 }
306 function getRenderer(rendererId, contentType, rendererHint, results) {
307 if (rendererId == "default") {
308 rendererId = getDefaultRendererId(contentType);
309 }
310 if (rendererId == "carousel") {
311 // Selectively disable carousel, 6 is fixed for now, should change on the form factor
312 if (results.count <= 6)
313 rendererId = "grid"
314 }
315 switch (rendererId) {
316 case "carousel": {
317 switch (contentType) {
318 case "music": return "Music/MusicCarousel.qml";
319 case "video": return "Video/VideoCarousel.qml";
320 default: return "Generic/GenericCarousel.qml";
321 }
322 }
323 case "grid": {
324 switch (contentType) {
325 case "apps": {
326 if (rendererHint == "toggled")
327 return "Apps/DashPluginFilterGrid.qml";
328 else
329 return "Generic/GenericFilterGrid.qml";
330 }
331 case "music": return "Music/MusicFilterGrid.qml";
332 case "video": return "Video/VideoFilterGrid.qml";
333 case "weather": return "Generic/WeatherFilterGrid.qml";
334 default: return "Generic/GenericFilterGrid.qml";
335 }
336 }
337 case "special": {
338 switch (contentType) {
339 case "apps": return "Apps/RunningApplicationsGrid.qml";
340 default: return "Generic/GenericFilterGrid.qml";
341 }
342 }
343 default: return "Generic/GenericFilterGrid.qml";
344 }
345 }
347 OpenEffect {
348 id: effect
349 objectName: "openEffect"
350 anchors {
351 fill: parent
352 bottomMargin: -bottomOverflow
353 }
354 sourceItem: categoryView
356 enabled: gap > 0.0
358 topGapPx: (1 - gap) * positionPx
359 topOpacity: (1 - gap * 1.2)
360 bottomGapPx: positionPx + gap * (targetBottomGapPx - positionPx)
361 bottomOverflow: units.gu(20)
362 live: !expansionAnimation.running
364 property int targetBottomGapPx: height - units.gu(8) - bottomOverflow
365 property real gap: previewListView.open ? 1.0 : 0.0
367 Behavior on gap {
368 NumberAnimation {
369 id: expansionAnimation
370 duration: 200
371 easing.type: Easing.InOutQuad
372 onRunningChanged: {
373 if (!previewListView.open && !running) {
374 previewListView.onScreen = false
375 }
376 }
377 }
378 }
379 Behavior on positionPx {
380 enabled: previewListView.open
381 UbuntuNumberAnimation {}
382 }
383 }
385 Connections {
386 target: scopeView.scope
387 onPreviewReady: {
388 if (previewListView.init) {
389 // Preview was triggered because of a click on the item. Need to expand now.
390 if (!previewListView.open) {
391 previewListView.open = true
392 }
394 var index = previewListView.currentIndex
395 previewListView.currentIndex = -1
396 previewListView.currentIndex = index
397 previewListView.init = false
398 }
399 previewListView.currentItem.previewData = preview
400 }
401 }
403 PreviewDelegateMapper {
404 id: previewDelegateMapper
405 }
407 ListView {
408 id: previewListView
409 objectName: "previewListView"
410 height: effect.bottomGapPx - effect.topGapPx
411 anchors {
412 top: parent.top
413 topMargin: effect.topGapPx
414 left: parent.left
415 right: parent.right
416 }
417 orientation: ListView.Horizontal
418 highlightRangeMode: ListView.StrictlyEnforceRange
419 snapMode: ListView.SnapOneItem
420 boundsBehavior: Flickable.DragAndOvershootBounds
421 highlightMoveDuration: 250
422 flickDeceleration: units.gu(625)
423 maximumFlickVelocity: width * 5
424 cacheBuffer: 0
426 // To be set before opening the preview
427 property string categoryId: ""
428 property var categoryDelegate
430 // because the ListView is built asynchronous, setting the
431 // currentIndex directly won't work. We need to refresh it
432 // when the first preview is ready to be displayed.
433 property bool init: true
435 onCurrentIndexChanged: {
436 var row = Math.floor(currentIndex / categoryDelegate.columns);
437 if (categoryDelegate.collapsedRowCount <= row) {
438 categoryView.expandedCategoryId = categoryId
439 }
441 if (open) {
442 categoryDelegate.highlightIndex = currentIndex
443 }
445 if (!init && model !== undefined) {
446 var item = model.get(currentIndex)
447 scopeView.scope.preview(item.uri, item.icon, item.category, 0, item.mimetype, item.title, item.comment, item.dndUri, item.metadata)
448 }
450 // Adjust contentY in case we need to change to it to show the next row
451 if (categoryDelegate.rows > 1) {
452 var itemY = categoryView.contentItem.mapFromItem(categoryDelegate.currentItem).y;
454 // Find new contentY and effect.postionPx
455 var newContentY = itemY - effect.positionPx - categoryDelegate.verticalSpacing;
457 // Make sure the item is not covered by a header. Move the effect split down if necessary
458 var headerHeight = pageHeader.height + categoryView.stickyHeaderHeight;
459 var effectAdjust = Math.max(effect.positionPx, headerHeight);
461 // Make sure we don't overscroll the listview. If yes, adjust effect position
462 if (newContentY < 0) {
463 effectAdjust += newContentY;
464 newContentY = 0;
465 }
466 if (newContentY > Math.max(0, categoryView.contentHeight - categoryView.height)) {
467 effectAdjust += -(categoryView.contentHeight - categoryView.height) + newContentY
468 newContentY = categoryView.contentHeight - categoryView.height;
469 }
471 effect.positionPx = effectAdjust;
472 categoryView.contentY = newContentY;
473 }
474 }
476 property bool open: false
477 property bool onScreen: false
479 onOpenChanged: {
480 if (open) {
481 onScreen = true;
482 categoryDelegate.highlightIndex = currentIndex;
483 pageHeader.unfocus();
484 } else {
485 // Cancel any pending preview requests or actions
486 if (previewListView.currentItem.previewData !== undefined) {
487 previewListView.currentItem.previewData.cancelAction();
488 }
489 scopeView.scope.cancelActivation();
490 model = undefined;
491 categoryView.correctExpandedCategory();
492 categoryDelegate.highlightIndex = -1;
493 }
494 }
496 Rectangle {
497 anchors.fill: parent
498 color: Qt.rgba(0, 0, 0, .3)
499 z: -1
500 }
502 delegate: Loader {
503 id: previewLoader
504 objectName: "previewLoader" + index
505 height: previewListView.height
506 width: previewListView.width
507 asynchronous: true
508 source: previewListView.onScreen ?
509 (previewData !== undefined ? previewDelegateMapper.map(previewData.rendererName) : "DashPreviewPlaceholder.qml") : ""
511 onPreviewDataChanged: {
512 if (previewData !== undefined && source.toString().indexOf("DashPreviewPlaceholder.qml") != -1) {
513 previewLoader.opacity = 0;
514 }
515 }
517 onSourceChanged: {
518 if (previewData !== undefined) {
519 fadeIn.start()
520 }
521 }
523 PropertyAnimation {
524 id: fadeIn
525 target: previewLoader
526 property: "opacity"
527 from: 0.0
528 to: 1.0
529 duration: UbuntuAnimation.BriskDuration
530 }
532 property var previewData
533 property bool valid: item !== null
535 onLoaded: {
536 if (previewListView.onScreen && previewData !== undefined) {
537 item.previewData = Qt.binding(function() { return previewData })
538 item.isCurrent = Qt.binding(function() { return ListView.isCurrentItem })
539 }
540 }
542 Connections {
543 ignoreUnknownSignals: true
544 target: item
545 onClose: {
546 previewListView.open = false
547 }
548 }
550 function closePreviewSpinner() {
551 if (item) {
552 item.showProcessingAction = false;
553 }
554 }
555 }
556 }
558 Image {
559 objectName: "pointerArrow"
560 anchors {
561 top: previewListView.bottom
562 left: parent.left
563 leftMargin: previewListView.categoryDelegate !== undefined && previewListView.categoryDelegate.currentItem ?
564 previewListView.categoryDelegate.currentItem.center + (-width + margins) / 2 : 0
566 Behavior on leftMargin {
567 SmoothedAnimation {
568 duration: UbuntuAnimation.FastDuration
569 }
570 }
571 }
572 height: units.gu(1)
573 width: units.gu(2)
574 property int margins: previewListView.categoryDelegate ? previewListView.categoryDelegate.margins : 0
575 opacity: previewListView.open ? .5 : 0
577 source: "graphics/tooltip_arrow.png"
578 }
580 // TODO: Move as InverseMouseArea to DashPreview
581 MouseArea {
582 objectName: "closePreviewMouseArea"
583 enabled: previewListView.onScreen
584 anchors {
585 fill: parent
586 topMargin: effect.bottomGapPx
587 }
588 onClicked: {
589 previewListView.open = false;
590 }
591 }