git.iko.soy/unity8
on 4a7fa07 help sign in
unity8/Dash/GenericScopeView.qml
594 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.1
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 objectName: "dashCategory" + category
130 highlightWhenPressed: false
132 readonly property bool expandable: rendererLoader.item ? rendererLoader.item.expandable : false
133 readonly property bool filtered: rendererLoader.item ? rendererLoader.item.filter : true
134 readonly property string category: categoryId
136 Loader {
137 id: rendererLoader
138 anchors {
139 top: parent.top
140 left: parent.left
141 right: parent.right
142 }
144 source: getRenderer(model.renderer, model.contentType, model.rendererHint, results)
146 onLoaded: {
147 if (item.enableHeightBehavior !== undefined && item.enableHeightBehaviorOnNextCreation !== undefined) {
148 item.enableHeightBehavior = scopeView.enableHeightBehaviorOnNextCreation;
149 scopeView.enableHeightBehaviorOnNextCreation = false;
150 }
151 if (source.toString().indexOf("Apps/RunningApplicationsGrid.qml") != -1) {
152 // TODO: the running apps grid doesn't support standard scope results model yet
153 item.firstModel = Qt.binding(function() { return results.firstModel })
154 item.secondModel = Qt.binding(function() { return results.secondModel })
155 item.canEnableTerminationMode = Qt.binding(function() { return scopeView.isCurrent })
156 } else {
157 item.model = Qt.binding(function() { return results })
158 }
159 item.objectName = Qt.binding(function() { return categoryId })
160 if (item.expandable) {
161 var shouldFilter = categoryId != categoryView.expandedCategoryId;
162 if (shouldFilter != item.filter) {
163 item.filter = shouldFilter;
164 }
165 }
166 updateDelegateCreationRange();
167 }
169 Component.onDestruction: {
170 if (item.enableHeightBehavior !== undefined && item.enableHeightBehaviorOnNextCreation !== undefined) {
171 scopeView.enableHeightBehaviorOnNextCreation = item.enableHeightBehaviorOnNextCreation;
172 }
173 }
175 Connections {
176 target: rendererLoader.item
177 onClicked: {
178 // Prepare the preview in case activate() triggers a preview only
179 effect.positionPx = Math.max(mapToItem(categoryView, 0, itemY).y, pageHeader.height + categoryView.stickyHeaderHeight);
180 previewListView.categoryId = categoryId
181 previewListView.categoryDelegate = rendererLoader.item
182 previewListView.model = target.model;
183 previewListView.init = true;
184 previewListView.currentIndex = index;
186 var item = target.model.get(index);
188 if ((scopeView.scope.id == "applications.scope" && categoryId == "installed")
189 || (scopeView.scope.id == "home.scope" && categoryId == "applications.scope")) {
190 scopeView.scope.activate(item.uri, item.icon, item.category, 0, item.mimetype, item.title,
191 item.comment, item.dndUri, item.metadata)
192 } else {
193 previewListView.open = true
195 scopeView.scope.preview(item.uri, item.icon, item.category, 0, item.mimetype, item.title,
196 item.comment, item.dndUri, item.metadata)
197 }
198 }
199 onPressAndHold: {
200 effect.positionPx = Math.max(mapToItem(categoryView, 0, itemY).y, pageHeader.height + categoryView.stickyHeaderHeight);
201 previewListView.categoryId = categoryId
202 previewListView.categoryDelegate = rendererLoader.item
203 previewListView.model = target.model;
204 previewListView.init = true;
205 previewListView.currentIndex = index;
206 previewListView.open = true
208 var item = target.model.get(index)
209 scopeView.scope.preview(item.uri, item.icon, item.category, 0, item.mimetype, item.title,
210 item.comment, item.dndUri, item.metadata)
211 }
212 }
213 Connections {
214 target: categoryView
215 onExpandedCategoryIdChanged: {
216 collapseAllButExpandedCategory();
217 }
218 onCorrectExpandedCategory: {
219 collapseAllButExpandedCategory();
220 }
221 function collapseAllButExpandedCategory() {
222 var item = rendererLoader.item;
223 if (item.expandable) {
224 var shouldFilter = categoryId != categoryView.expandedCategoryId;
225 if (shouldFilter != item.filter) {
226 // If the filter animation will be seen start it, otherwise, just flip the switch
227 var shrinkingVisible = shouldFilter && y + item.collapsedHeight < categoryView.height;
228 var growingVisible = !shouldFilter && y + height < categoryView.height;
229 if (!previewListView.open || !shouldFilter) {
230 if (shrinkingVisible || growingVisible) {
231 item.startFilterAnimation(shouldFilter)
232 } else {
233 item.filter = shouldFilter;
234 }
235 if (!shouldFilter && !previewListView.open) {
236 categoryView.maximizeVisibleArea(index, item.uncollapsedHeight);
237 }
238 }
239 }
240 }
241 }
242 onContentYChanged: rendererLoader.updateDelegateCreationRange();
243 onHeightChanged: rendererLoader.updateDelegateCreationRange();
244 }
246 function updateDelegateCreationRange() {
247 // Do not update the range if we are overshooting up or down, since we'll come back
248 // to the stable position and delete/create items without any reason
249 if (categoryView.contentY < categoryView.originY) {
250 return;
251 } else if (categoryView.contentY + categoryView.height > categoryView.contentHeight) {
252 return;
253 }
255 if (item.hasOwnProperty("delegateCreationBegin")) {
256 if (baseItem.y + baseItem.height <= 0) {
257 // Not visible (item at top of the list)
258 item.delegateCreationBegin = baseItem.height
259 item.delegateCreationEnd = baseItem.height
260 } else if (baseItem.y >= categoryView.height) {
261 // Not visible (item at bottom of the list)
262 item.delegateCreationBegin = 0
263 item.delegateCreationEnd = 0
264 } else {
265 item.delegateCreationBegin = Math.max(-baseItem.y, 0)
266 item.delegateCreationEnd = Math.min(categoryView.height + item.delegateCreationBegin, baseItem.height)
267 }
268 }
269 }
270 }
271 }
273 sectionProperty: "name"
274 sectionDelegate: ListItems.Header {
275 objectName: "dashSectionHeader" + delegate.category
276 property var delegate: categoryView.item(delegateIndex)
277 width: categoryView.width
278 text: section
279 image: {
280 if (delegate && delegate.expandable)
281 return delegate.filtered ? "graphics/header_handlearrow.png" : "graphics/header_handlearrow2.png"
282 return "";
283 }
284 onClicked: {
285 if (categoryView.expandedCategoryId != delegate.category)
286 categoryView.expandedCategoryId = delegate.category;
287 else
288 categoryView.expandedCategoryId = "";
289 }
290 }
291 pageHeader: PageHeader {
292 id: pageHeader
293 objectName: "pageHeader"
294 width: categoryView.width
295 text: scopeView.scope.name
296 searchEntryEnabled: true
297 scope: scopeView.scope
298 searchHistory: scopeView.searchHistory
299 }
300 }
302 function getDefaultRendererId(contentType) {
303 switch (contentType) {
304 default: return "grid";
305 }
306 }
308 function getRenderer(rendererId, contentType, rendererHint, results) {
309 if (rendererId == "default") {
310 rendererId = getDefaultRendererId(contentType);
311 }
312 if (rendererId == "carousel") {
313 // Selectively disable carousel, 6 is fixed for now, should change on the form factor
314 if (results.count <= 6)
315 rendererId = "grid"
316 }
317 switch (rendererId) {
318 case "carousel": {
319 switch (contentType) {
320 case "music": return "Music/MusicCarousel.qml";
321 case "video": return "Video/VideoCarousel.qml";
322 default: return "Generic/GenericCarousel.qml";
323 }
324 }
325 case "grid": {
326 switch (contentType) {
327 case "apps": {
328 if (rendererHint == "toggled")
329 return "Apps/DashPluginFilterGrid.qml";
330 else
331 return "Generic/GenericFilterGrid.qml";
332 }
333 case "music": return "Music/MusicFilterGrid.qml";
334 case "video": return "Video/VideoFilterGrid.qml";
335 case "weather": return "Generic/WeatherFilterGrid.qml";
336 default: return "Generic/GenericFilterGrid.qml";
337 }
338 }
339 case "special": {
340 switch (contentType) {
341 case "apps": return "Apps/RunningApplicationsGrid.qml";
342 default: return "Generic/GenericFilterGrid.qml";
343 }
344 }
345 default: return "Generic/GenericFilterGrid.qml";
346 }
347 }
349 OpenEffect {
350 id: effect
351 objectName: "openEffect"
352 anchors {
353 fill: parent
354 bottomMargin: -bottomOverflow
355 }
356 sourceItem: categoryView
358 enabled: gap > 0.0
360 topGapPx: (1 - gap) * positionPx
361 topOpacity: (1 - gap * 1.2)
362 bottomGapPx: positionPx + gap * (targetBottomGapPx - positionPx)
363 bottomOverflow: units.gu(20)
364 live: !expansionAnimation.running
366 property int targetBottomGapPx: height - units.gu(8) - bottomOverflow
367 property real gap: previewListView.open ? 1.0 : 0.0
369 Behavior on gap {
370 NumberAnimation {
371 id: expansionAnimation
372 duration: 200
373 easing.type: Easing.InOutQuad
374 onRunningChanged: {
375 if (!previewListView.open && !running) {
376 previewListView.onScreen = false
377 }
378 }
379 }
380 }
381 Behavior on positionPx {
382 enabled: previewListView.open
383 UbuntuNumberAnimation {}
384 }
385 }
387 Connections {
388 target: scopeView.scope
389 onPreviewReady: {
390 if (previewListView.init) {
391 // Preview was triggered because of a click on the item. Need to expand now.
392 if (!previewListView.open) {
393 previewListView.open = true
394 }
396 var index = previewListView.currentIndex
397 previewListView.currentIndex = -1
398 previewListView.currentIndex = index
399 previewListView.init = false
400 }
401 previewListView.currentItem.previewData = preview
402 }
403 }
405 PreviewDelegateMapper {
406 id: previewDelegateMapper
407 }
409 ListView {
410 id: previewListView
411 objectName: "previewListView"
412 height: effect.bottomGapPx - effect.topGapPx
413 anchors {
414 top: parent.top
415 topMargin: effect.topGapPx
416 left: parent.left
417 right: parent.right
418 }
419 orientation: ListView.Horizontal
420 highlightRangeMode: ListView.StrictlyEnforceRange
421 snapMode: ListView.SnapOneItem
422 boundsBehavior: Flickable.DragAndOvershootBounds
423 highlightMoveDuration: 250
424 flickDeceleration: units.gu(625)
425 maximumFlickVelocity: width * 5
426 cacheBuffer: 0
428 // To be set before opening the preview
429 property string categoryId: ""
430 property var categoryDelegate
432 // because the ListView is built asynchronous, setting the
433 // currentIndex directly won't work. We need to refresh it
434 // when the first preview is ready to be displayed.
435 property bool init: true
437 onCurrentIndexChanged: {
438 var row = Math.floor(currentIndex / categoryDelegate.columns);
439 if (categoryDelegate.collapsedRowCount <= row) {
440 categoryView.expandedCategoryId = categoryId
441 }
443 if (open) {
444 categoryDelegate.highlightIndex = currentIndex
445 }
447 if (!init && model !== undefined) {
448 var item = model.get(currentIndex)
449 scopeView.scope.preview(item.uri, item.icon, item.category, 0, item.mimetype, item.title, item.comment, item.dndUri, item.metadata)
450 }
452 // Adjust contentY in case we need to change to it to show the next row
453 if (categoryDelegate.rows > 1) {
454 var itemY = categoryView.contentItem.mapFromItem(categoryDelegate.currentItem).y;
456 // Find new contentY and effect.postionPx
457 var newContentY = itemY - effect.positionPx - categoryDelegate.verticalSpacing;
459 // Make sure the item is not covered by a header. Move the effect split down if necessary
460 var headerHeight = pageHeader.height + categoryView.stickyHeaderHeight;
461 var effectAdjust = Math.max(effect.positionPx, headerHeight);
463 // Make sure we don't overscroll the listview. If yes, adjust effect position
464 if (newContentY < 0) {
465 effectAdjust += newContentY;
466 newContentY = 0;
467 }
468 if (newContentY > Math.max(0, categoryView.contentHeight - categoryView.height)) {
469 effectAdjust += -(categoryView.contentHeight - categoryView.height) + newContentY
470 newContentY = categoryView.contentHeight - categoryView.height;
471 }
473 effect.positionPx = effectAdjust;
474 categoryView.contentY = newContentY;
475 }
476 }
478 property bool open: false
479 property bool onScreen: false
481 onOpenChanged: {
482 if (open) {
483 onScreen = true;
484 categoryDelegate.highlightIndex = currentIndex;
485 pageHeader.unfocus();
486 } else {
487 // Cancel any pending preview requests or actions
488 if (previewListView.currentItem.previewData !== undefined) {
489 previewListView.currentItem.previewData.cancelAction();
490 }
491 scopeView.scope.cancelActivation();
492 model = undefined;
493 categoryView.correctExpandedCategory();
494 categoryDelegate.highlightIndex = -1;
495 }
496 }
498 Rectangle {
499 anchors.fill: parent
500 color: Qt.rgba(0, 0, 0, .3)
501 z: -1
502 }
504 delegate: Loader {
505 id: previewLoader
506 objectName: "previewLoader" + index
507 height: previewListView.height
508 width: previewListView.width
509 asynchronous: true
510 source: previewListView.onScreen ?
511 (previewData !== undefined ? previewDelegateMapper.map(previewData.rendererName) : "DashPreviewPlaceholder.qml") : ""
513 onPreviewDataChanged: {
514 if (previewData !== undefined && source.toString().indexOf("DashPreviewPlaceholder.qml") != -1) {
515 previewLoader.opacity = 0;
516 }
517 }
519 onSourceChanged: {
520 if (previewData !== undefined) {
521 fadeIn.start()
522 }
523 }
525 PropertyAnimation {
526 id: fadeIn
527 target: previewLoader
528 property: "opacity"
529 from: 0.0
530 to: 1.0
531 duration: UbuntuAnimation.BriskDuration
532 }
534 property var previewData
535 property bool valid: item !== null
537 onLoaded: {
538 if (previewListView.onScreen && previewData !== undefined) {
539 item.previewData = Qt.binding(function() { return previewData })
540 item.isCurrent = Qt.binding(function() { return ListView.isCurrentItem })
541 }
542 }
544 Connections {
545 ignoreUnknownSignals: true
546 target: item
547 onClose: {
548 previewListView.open = false
549 }
550 }
552 function closePreviewSpinner() {
553 if (item) {
554 item.showProcessingAction = false;
555 }
556 }
557 }
558 }
560 Image {
561 objectName: "pointerArrow"
562 anchors {
563 top: previewListView.bottom
564 left: parent.left
565 leftMargin: previewListView.categoryDelegate !== undefined && previewListView.categoryDelegate.currentItem ?
566 previewListView.categoryDelegate.currentItem.center + (-width + margins) / 2 : 0
568 Behavior on leftMargin {
569 SmoothedAnimation {
570 duration: UbuntuAnimation.FastDuration
571 }
572 }
573 }
574 height: units.gu(1)
575 width: units.gu(2)
576 property int margins: previewListView.categoryDelegate ? previewListView.categoryDelegate.margins : 0
577 opacity: previewListView.open ? .5 : 0
579 source: "graphics/tooltip_arrow.png"
580 }
582 // TODO: Move as InverseMouseArea to DashPreview
583 MouseArea {
584 objectName: "closePreviewMouseArea"
585 enabled: previewListView.onScreen
586 anchors {
587 fill: parent
588 topMargin: effect.bottomGapPx
589 }
590 onClicked: {
591 previewListView.open = false;
592 }
593 }