Lomiri
Loading...
Searching...
No Matches
LauncherPanel.qml
1/*
2 * Copyright (C) 2013-2016 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 */
16
17import QtQuick 2.12
18import QtQml.StateMachine 1.0 as DSM
19import Lomiri.Components 1.3
20import Lomiri.Launcher 0.1
21import Lomiri.Components.Popups 1.3
22import Utils 0.1
23import "../Components"
24
25Rectangle {
26 id: root
27 color: "#F2111111"
28
29 rotation: inverted ? 180 : 0
30
31 property var model
32 property bool inverted: false
33 property bool privateMode: false
34 property bool moving: launcherListView.moving || launcherListView.flicking
35 property bool preventHiding: moving || dndArea.draggedIndex >= 0 || quickList.state === "open" || dndArea.pressed
36 || dndArea.containsMouse || dashItem.hovered
37 property int highlightIndex: -2
38 property bool shortcutHintsShown: false
39 readonly property bool quickListOpen: quickList.state === "open"
40 readonly property bool dragging: launcherListView.dragging || dndArea.dragging
41
42 signal applicationSelected(string appId)
43 signal showDashHome()
44 signal kbdNavigationCancelled()
45
46 onXChanged: {
47 if (quickList.state === "open") {
48 quickList.state = ""
49 }
50 }
51
52 function highlightNext() {
53 highlightIndex++;
54 if (highlightIndex >= launcherListView.count) {
55 highlightIndex = -1;
56 }
57 launcherListView.moveToIndex(Math.max(highlightIndex, 0));
58 }
59 function highlightPrevious() {
60 highlightIndex--;
61 if (highlightIndex <= -2) {
62 highlightIndex = launcherListView.count - 1;
63 }
64 launcherListView.moveToIndex(Math.max(highlightIndex, 0));
65 }
66 function openQuicklist(index) {
67 quickList.open(index);
68 quickList.selectedIndex = 0;
69 quickList.focus = true;
70 }
71
72 MouseArea {
73 id: mouseEventEater
74 anchors.fill: parent
75 acceptedButtons: Qt.AllButtons
76 onWheel: wheel.accepted = true;
77 }
78
79 Column {
80 id: mainColumn
81 anchors {
82 fill: parent
83 }
84
85 Rectangle {
86 id: bfb
87 objectName: "buttonShowDashHome"
88 width: parent.width
89 height: width * .9
90 color: LomiriColors.orange
91 readonly property bool highlighted: root.highlightIndex == -1;
92
93 Icon {
94 objectName: "dashItem"
95 width: parent.width * .6
96 height: width
97 anchors.centerIn: parent
98 source: "graphics/home.svg"
99 color: "white"
100 rotation: root.rotation
101 }
102
103 AbstractButton {
104 id: dashItem
105 anchors.fill: parent
106 activeFocusOnPress: false
107 onClicked: root.showDashHome()
108 }
109
110 StyledItem {
111 styleName: "FocusShape"
112 anchors.fill: parent
113 anchors.margins: units.gu(.5)
114 StyleHints {
115 visible: bfb.highlighted
116 radius: 0
117 }
118 }
119 }
120
121 Item {
122 anchors.left: parent.left
123 anchors.right: parent.right
124 height: parent.height - dashItem.height - parent.spacing*2
125
126 Item {
127 id: launcherListViewItem
128 anchors.fill: parent
129 clip: true
130
131 ListView {
132 id: launcherListView
133 objectName: "launcherListView"
134 anchors {
135 fill: parent
136 topMargin: -extensionSize + width * .15
137 bottomMargin: -extensionSize + width * .15
138 }
139 topMargin: extensionSize
140 bottomMargin: extensionSize
141 height: parent.height - dashItem.height - parent.spacing*2
142 model: root.model
143 cacheBuffer: itemHeight * 3
144 snapMode: interactive ? ListView.SnapToItem : ListView.NoSnap
145 highlightRangeMode: ListView.ApplyRange
146 preferredHighlightBegin: (height - itemHeight) / 2
147 preferredHighlightEnd: (height + itemHeight) / 2
148
149 // for the single peeking icon, when alert-state is set on delegate
150 property int peekingIndex: -1
151
152 // The size of the area the ListView is extended to make sure items are not
153 // destroyed when dragging them outside the list. This needs to be at least
154 // itemHeight to prevent folded items from disappearing and DragArea limits
155 // need to be smaller than this size to avoid breakage.
156 property int extensionSize: itemHeight * 3
157
158 // Workaround: The snap settings in the launcher, will always try to
159 // snap to what we told it to do. However, we want the initial position
160 // of the launcher to not be centered, but instead start with the topmost
161 // item unfolded completely. Lets wait for the ListView to settle after
162 // creation and then reposition it to 0.
163 // https://bugreports.qt-project.org/browse/QTBUG-32251
164 Component.onCompleted: {
165 initTimer.start();
166 }
167 Timer {
168 id: initTimer
169 interval: 1
170 onTriggered: {
171 launcherListView.moveToIndex(0)
172 }
173 }
174
175 // The height of the area where icons start getting folded
176 property int foldingStartHeight: itemHeight
177 // The height of the area where the items reach the final folding angle
178 property int foldingStopHeight: foldingStartHeight - itemHeight - spacing
179 property int itemWidth: width * .75
180 property int itemHeight: itemWidth * 15 / 16 + units.gu(1)
181 property int clickFlickSpeed: units.gu(60)
182 property int draggedIndex: dndArea.draggedIndex
183 property real realContentY: contentY - originY + topMargin
184 property int realItemHeight: itemHeight + spacing
185
186 // In case the start dragging transition is running, we need to delay the
187 // move because the displaced transition would clash with it and cause items
188 // to be moved to wrong places
189 property bool draggingTransitionRunning: false
190 property int scheduledMoveTo: -1
191
192 LomiriNumberAnimation {
193 id: snapToBottomAnimation
194 target: launcherListView
195 property: "contentY"
196 to: launcherListView.originY + launcherListView.topMargin
197 }
198
199 LomiriNumberAnimation {
200 id: snapToTopAnimation
201 target: launcherListView
202 property: "contentY"
203 to: launcherListView.contentHeight - launcherListView.height + launcherListView.originY - launcherListView.topMargin
204 }
205
206 LomiriNumberAnimation {
207 id: moveAnimation
208 objectName: "moveAnimation"
209 target: launcherListView
210 property: "contentY"
211 function moveTo(contentY) {
212 from = launcherListView.contentY;
213 to = contentY;
214 restart();
215 }
216 }
217 function moveToIndex(index) {
218 var totalItemHeight = launcherListView.itemHeight + launcherListView.spacing
219 var itemPosition = index * totalItemHeight;
220 var height = launcherListView.height - launcherListView.topMargin - launcherListView.bottomMargin
221 var distanceToEnd = index == 0 || index == launcherListView.count - 1 ? 0 : totalItemHeight
222 if (itemPosition + totalItemHeight + distanceToEnd > launcherListView.contentY + launcherListView.originY + launcherListView.topMargin + height) {
223 moveAnimation.moveTo(itemPosition + launcherListView.itemHeight - launcherListView.topMargin - height + distanceToEnd - launcherListView.originY);
224 } else if (itemPosition - distanceToEnd < launcherListView.contentY - launcherListView.originY + launcherListView.topMargin) {
225 moveAnimation.moveTo(itemPosition - distanceToEnd - launcherListView.topMargin + launcherListView.originY);
226 }
227 }
228
229 displaced: Transition {
230 NumberAnimation { properties: "x,y"; duration: LomiriAnimation.FastDuration; easing: LomiriAnimation.StandardEasing }
231 }
232
233 delegate: FoldingLauncherDelegate {
234 id: launcherDelegate
235 objectName: "launcherDelegate" + index
236 // We need the appId in the delegate in order to find
237 // the right app when running autopilot tests for
238 // multiple apps.
239 readonly property string appId: model.appId
240 name: model.name
241 itemIndex: index
242 itemHeight: launcherListView.itemHeight
243 itemWidth: launcherListView.itemWidth
244 width: parent.width
245 height: itemHeight
246 iconName: model.icon
247 count: model.count
248 countVisible: model.countVisible
249 progress: model.progress
250 itemRunning: model.running
251 itemFocused: model.focused
252 inverted: root.inverted
253 alerting: model.alerting
254 highlighted: root.highlightIndex == index
255 shortcutHintShown: root.shortcutHintsShown && index <= 9
256 surfaceCount: model.surfaceCount
257 z: -Math.abs(offset)
258 maxAngle: 55
259 property bool dragging: false
260
261 SequentialAnimation {
262 id: peekingAnimation
263 objectName: "peekingAnimation" + index
264
265 // revealing
266 PropertyAction { target: root; property: "visible"; value: (launcher.visibleWidth === 0) ? 1 : 0 }
267 PropertyAction { target: launcherListViewItem; property: "clip"; value: 0 }
268
269 LomiriNumberAnimation {
270 target: launcherDelegate
271 alwaysRunToEnd: true
272 loops: 1
273 properties: "x"
274 to: (units.gu(.5) + launcherListView.width * .5) * (root.inverted ? -1 : 1)
275 duration: LomiriAnimation.BriskDuration
276 }
277
278 // hiding
279 LomiriNumberAnimation {
280 target: launcherDelegate
281 alwaysRunToEnd: true
282 loops: 1
283 properties: "x"
284 to: 0
285 duration: LomiriAnimation.BriskDuration
286 }
287
288 PropertyAction { target: launcherListViewItem; property: "clip"; value: 1 }
289 PropertyAction { target: root; property: "visible"; value: (launcher.visibleWidth === 0) ? 1 : 0 }
290 PropertyAction { target: launcherListView; property: "peekingIndex"; value: -1 }
291 }
292
293 onAlertingChanged: {
294 if(alerting) {
295 if (!dragging && (launcherListView.peekingIndex === -1 || launcher.visibleWidth > 0)) {
296 launcherListView.moveToIndex(index)
297 if (!dragging && launcher.state !== "visible" && launcher.state !== "drawer") {
298 peekingAnimation.start()
299 }
300 }
301
302 if (launcherListView.peekingIndex === -1) {
303 launcherListView.peekingIndex = index
304 }
305 } else {
306 if (launcherListView.peekingIndex === index) {
307 launcherListView.peekingIndex = -1
308 }
309 }
310 }
311
312 Image {
313 id: dropIndicator
314 objectName: "dropIndicator"
315 anchors.centerIn: parent
316 height: visible ? units.dp(2) : 0
317 width: parent.width + mainColumn.anchors.leftMargin + mainColumn.anchors.rightMargin
318 opacity: 0
319 source: "graphics/divider-line.png"
320 }
321
322 states: [
323 State {
324 name: "selected"
325 when: dndArea.selectedItem === launcherDelegate && fakeDragItem.visible && !dragging
326 PropertyChanges {
327 target: launcherDelegate
328 itemOpacity: 0
329 }
330 },
331 State {
332 name: "dragging"
333 when: dragging
334 PropertyChanges {
335 target: launcherDelegate
336 height: units.gu(1)
337 itemOpacity: 0
338 }
339 PropertyChanges {
340 target: dropIndicator
341 opacity: 1
342 }
343 },
344 State {
345 name: "expanded"
346 when: dndArea.draggedIndex >= 0 && (dndArea.preDragging || dndArea.dragging || dndArea.postDragging) && dndArea.draggedIndex != index
347 PropertyChanges {
348 target: launcherDelegate
349 angle: 0
350 offset: 0
351 itemOpacity: 0.6
352 }
353 }
354 ]
355
356 transitions: [
357 Transition {
358 from: ""
359 to: "selected"
360 NumberAnimation { properties: "itemOpacity"; duration: LomiriAnimation.FastDuration }
361 },
362 Transition {
363 from: "*"
364 to: "expanded"
365 NumberAnimation { properties: "itemOpacity"; duration: LomiriAnimation.FastDuration }
366 LomiriNumberAnimation { properties: "angle,offset" }
367 },
368 Transition {
369 from: "expanded"
370 to: ""
371 NumberAnimation { properties: "itemOpacity"; duration: LomiriAnimation.BriskDuration }
372 LomiriNumberAnimation { properties: "angle,offset" }
373 },
374 Transition {
375 id: draggingTransition
376 from: "selected"
377 to: "dragging"
378 SequentialAnimation {
379 PropertyAction { target: launcherListView; property: "draggingTransitionRunning"; value: true }
380 ParallelAnimation {
381 LomiriNumberAnimation { properties: "height" }
382 NumberAnimation { target: dropIndicator; properties: "opacity"; duration: LomiriAnimation.FastDuration }
383 }
384 ScriptAction {
385 script: {
386 if (launcherListView.scheduledMoveTo > -1) {
387 launcherListView.model.move(dndArea.draggedIndex, launcherListView.scheduledMoveTo)
388 dndArea.draggedIndex = launcherListView.scheduledMoveTo
389 launcherListView.scheduledMoveTo = -1
390 }
391 }
392 }
393 PropertyAction { target: launcherListView; property: "draggingTransitionRunning"; value: false }
394 }
395 },
396 Transition {
397 from: "dragging"
398 to: "*"
399 NumberAnimation { target: dropIndicator; properties: "opacity"; duration: LomiriAnimation.SnapDuration }
400 NumberAnimation { properties: "itemOpacity"; duration: LomiriAnimation.BriskDuration }
401 SequentialAnimation {
402 ScriptAction { script: if (index == launcherListView.count-1) launcherListView.flick(0, -launcherListView.clickFlickSpeed); }
403 LomiriNumberAnimation { properties: "height" }
404 ScriptAction { script: if (index == launcherListView.count-1) launcherListView.flick(0, -launcherListView.clickFlickSpeed); }
405 PropertyAction { target: dndArea; property: "postDragging"; value: false }
406 PropertyAction { target: dndArea; property: "draggedIndex"; value: -1 }
407 }
408 }
409 ]
410 }
411
412 MouseArea {
413 id: dndArea
414 objectName: "dndArea"
415 acceptedButtons: Qt.LeftButton | Qt.RightButton
416 hoverEnabled: true
417 anchors {
418 fill: parent
419 topMargin: launcherListView.topMargin
420 bottomMargin: launcherListView.bottomMargin
421 }
422 drag.minimumY: -launcherListView.topMargin
423 drag.maximumY: height + launcherListView.bottomMargin
424
425 property int draggedIndex: -1
426 property var selectedItem
427 property bool preDragging: false
428 property bool dragging: !!selectedItem && selectedItem.dragging
429 property bool postDragging: false
430 property int startX
431 property int startY
432
433 // This is a workaround for some issue in the QML ListView:
434 // When calling moveToItem(0), the listview visually positions itself
435 // correctly to display the first item expanded. However, some internal
436 // state seems to not be valid, and the next time the user clicks on it,
437 // it snaps back to the snap boundries before executing the onClicked handler.
438 // This can cause the listview getting stuck in a snapped position where you can't
439 // launch things without first dragging the launcher manually. So lets read the item
440 // angle before that happens and use that angle instead of the one we get in onClicked.
441 property real pressedStartAngle: 0
442 onPressed: {
443 var clickedItem = launcherListView.itemAt(mouseX, mouseY + launcherListView.realContentY)
444 pressedStartAngle = clickedItem.angle;
445 processPress(mouse);
446 }
447
448 function processPress(mouse) {
449 selectedItem = launcherListView.itemAt(mouse.x, mouse.y + launcherListView.realContentY)
450 }
451
452 onClicked: {
453 var index = Math.floor((mouseY + launcherListView.realContentY) / launcherListView.realItemHeight);
454 var clickedItem = launcherListView.itemAt(mouseX, mouseY + launcherListView.realContentY)
455
456 // Check if we actually clicked an item or only at the spacing in between
457 if (clickedItem === null) {
458 return;
459 }
460
461 if (mouse.button & Qt.RightButton) { // context menu
462 // Opening QuickList
463 quickList.open(index);
464 return;
465 }
466
467 Haptics.play();
468
469 // First/last item do the scrolling at more than 12 degrees
470 if (index == 0 || index == launcherListView.count - 1) {
471 launcherListView.moveToIndex(index);
472 if (pressedStartAngle <= 12 && pressedStartAngle >= -12) {
473 root.applicationSelected(LauncherModel.get(index).appId);
474 }
475 return;
476 }
477
478 // the rest launches apps up to an angle of 30 degrees
479 if (clickedItem.angle > 30 || clickedItem.angle < -30) {
480 launcherListView.moveToIndex(index);
481 } else {
482 root.applicationSelected(LauncherModel.get(index).appId);
483 }
484 }
485
486 onCanceled: {
487 endDrag(drag);
488 }
489
490 onReleased: {
491 endDrag(drag);
492 }
493
494 function endDrag(dragItem) {
495 var droppedIndex = draggedIndex;
496 if (dragging) {
497 postDragging = true;
498 } else {
499 draggedIndex = -1;
500 }
501
502 if (!selectedItem) {
503 return;
504 }
505
506 selectedItem.dragging = false;
507 selectedItem = undefined;
508 preDragging = false;
509
510 dragItem.target = undefined
511
512 progressiveScrollingTimer.stop();
513 launcherListView.interactive = true;
514 if (droppedIndex >= launcherListView.count - 2 && postDragging) {
515 snapToBottomAnimation.start();
516 } else if (droppedIndex < 2 && postDragging) {
517 snapToTopAnimation.start();
518 }
519 }
520
521 onPressAndHold: {
522 processPressAndHold(mouse, drag);
523 }
524
525 function processPressAndHold(mouse, dragItem) {
526 if (Math.abs(selectedItem.angle) > 30) {
527 return;
528 }
529
530 Haptics.play();
531
532 draggedIndex = Math.floor((mouse.y + launcherListView.realContentY) / launcherListView.realItemHeight);
533
534 quickList.open(draggedIndex)
535
536 launcherListView.interactive = false
537
538 var yOffset = draggedIndex > 0 ? (mouse.y + launcherListView.realContentY) % (draggedIndex * launcherListView.realItemHeight) : mouse.y + launcherListView.realContentY
539
540 fakeDragItem.iconName = launcherListView.model.get(draggedIndex).icon
541 fakeDragItem.x = units.gu(0.5)
542 fakeDragItem.y = mouse.y - yOffset + launcherListView.anchors.topMargin + launcherListView.topMargin
543 fakeDragItem.angle = selectedItem.angle * (root.inverted ? -1 : 1)
544 fakeDragItem.offset = selectedItem.offset * (root.inverted ? -1 : 1)
545 fakeDragItem.count = LauncherModel.get(draggedIndex).count
546 fakeDragItem.progress = LauncherModel.get(draggedIndex).progress
547 fakeDragItem.flatten()
548 dragItem.target = fakeDragItem
549
550 startX = mouse.x
551 startY = mouse.y
552 }
553
554 onPositionChanged: {
555 processPositionChanged(mouse)
556 }
557
558 function processPositionChanged(mouse) {
559 if (draggedIndex >= 0) {
560 if (selectedItem && !selectedItem.dragging) {
561 var distance = Math.max(Math.abs(mouse.x - startX), Math.abs(mouse.y - startY))
562 if (!preDragging && distance > units.gu(1.5)) {
563 preDragging = true;
564 quickList.state = "";
565 }
566 if (distance > launcherListView.itemHeight) {
567 selectedItem.dragging = true
568 preDragging = false;
569 }
570 return
571 }
572
573 var itemCenterY = fakeDragItem.y + fakeDragItem.height / 2
574
575 // Move it down by the the missing size to compensate index calculation with only expanded items
576 itemCenterY += (launcherListView.itemHeight - selectedItem.height) / 2
577
578 if (mouseY > launcherListView.height - launcherListView.topMargin - launcherListView.bottomMargin - launcherListView.realItemHeight) {
579 progressiveScrollingTimer.downwards = false
580 progressiveScrollingTimer.start()
581 } else if (mouseY < launcherListView.realItemHeight) {
582 progressiveScrollingTimer.downwards = true
583 progressiveScrollingTimer.start()
584 } else {
585 progressiveScrollingTimer.stop()
586 }
587
588 var newIndex = (itemCenterY + launcherListView.realContentY) / launcherListView.realItemHeight
589
590 if (newIndex > draggedIndex + 1) {
591 newIndex = draggedIndex + 1
592 } else if (newIndex < draggedIndex) {
593 newIndex = draggedIndex -1
594 } else {
595 return
596 }
597
598 if (newIndex >= 0 && newIndex < launcherListView.count) {
599 if (launcherListView.draggingTransitionRunning) {
600 launcherListView.scheduledMoveTo = newIndex
601 } else {
602 launcherListView.model.move(draggedIndex, newIndex)
603 draggedIndex = newIndex
604 }
605 }
606 }
607 }
608 }
609 Timer {
610 id: progressiveScrollingTimer
611 interval: 2
612 repeat: true
613 running: false
614 property bool downwards: true
615 onTriggered: {
616 if (downwards) {
617 var minY = -launcherListView.topMargin
618 if (launcherListView.contentY > minY) {
619 launcherListView.contentY = Math.max(launcherListView.contentY - units.dp(2), minY)
620 }
621 } else {
622 var maxY = launcherListView.contentHeight - launcherListView.height + launcherListView.topMargin + launcherListView.originY
623 if (launcherListView.contentY < maxY) {
624 launcherListView.contentY = Math.min(launcherListView.contentY + units.dp(2), maxY)
625 }
626 }
627 }
628 }
629 }
630 }
631
632 LauncherDelegate {
633 id: fakeDragItem
634 objectName: "fakeDragItem"
635 visible: dndArea.draggedIndex >= 0 && !dndArea.postDragging
636 itemWidth: launcherListView.itemWidth
637 itemHeight: launcherListView.itemHeight
638 height: itemHeight
639 width: itemWidth
640 rotation: root.rotation
641 itemOpacity: 0.9
642 onVisibleChanged: if (!visible) iconName = "";
643
644 function flatten() {
645 fakeDragItemAnimation.start();
646 }
647
648 LomiriNumberAnimation {
649 id: fakeDragItemAnimation
650 target: fakeDragItem;
651 properties: "angle,offset";
652 to: 0
653 }
654 }
655 }
656 }
657
658 LomiriShape {
659 id: quickListShape
660 objectName: "quickListShape"
661 anchors.fill: quickList
662 opacity: quickList.state === "open" ? 0.95 : 0
663 visible: opacity > 0
664 rotation: root.rotation
665 aspect: LomiriShape.Flat
666
667 // Denotes that the shape is not animating, to prevent race conditions during testing
668 readonly property bool ready: (visible && (!quickListShapeOpacityFade.running))
669
670 Behavior on opacity {
671 LomiriNumberAnimation {
672 id: quickListShapeOpacityFade
673 }
674 }
675
676 source: ShaderEffectSource {
677 sourceItem: quickList
678 hideSource: true
679 }
680
681 Image {
682 anchors {
683 right: parent.left
684 rightMargin: -units.dp(4)
685 verticalCenter: parent.verticalCenter
686 verticalCenterOffset: -quickList.offset * (root.inverted ? -1 : 1)
687 }
688 height: units.gu(1)
689 width: units.gu(2)
690 source: "graphics/quicklist_tooltip.png"
691 rotation: 90
692 }
693 }
694
695 InverseMouseArea {
696 anchors.fill: quickListShape
697 enabled: quickList.state == "open" || pressed
698 hoverEnabled: enabled
699 visible: enabled
700
701 onClicked: {
702 quickList.state = "";
703 quickList.focus = false;
704 root.kbdNavigationCancelled();
705 }
706
707 // Forward for dragging to work when quickList is open
708
709 onPressed: {
710 var m = mapToItem(dndArea, mouseX, mouseY)
711 dndArea.processPress(m)
712 }
713
714 onPressAndHold: {
715 var m = mapToItem(dndArea, mouseX, mouseY)
716 dndArea.processPressAndHold(m, drag)
717 }
718
719 onPositionChanged: {
720 var m = mapToItem(dndArea, mouseX, mouseY)
721 dndArea.processPositionChanged(m)
722 }
723
724 onCanceled: {
725 dndArea.endDrag(drag);
726 }
727
728 onReleased: {
729 dndArea.endDrag(drag);
730 }
731 }
732
733 Rectangle {
734 id: quickList
735 objectName: "quickList"
736 color: theme.palette.normal.background
737 // Because we're setting left/right anchors depending on orientation, it will break the
738 // width setting after rotating twice. This makes sure we also re-apply width on rotation
739 width: root.inverted ? units.gu(30) : units.gu(30)
740 height: quickListColumn.height
741 visible: quickListShape.visible
742 anchors {
743 left: root.inverted ? undefined : parent.right
744 right: root.inverted ? parent.left : undefined
745 margins: units.gu(1)
746 }
747 y: itemCenter - (height / 2) + offset
748 rotation: root.rotation
749
750 property var model
751 property string appId
752 property var item
753 property int selectedIndex: -1
754
755 Keys.onPressed: {
756 switch (event.key) {
757 case Qt.Key_Down:
758 var prevIndex = selectedIndex;
759 selectedIndex = (selectedIndex + 1 < popoverRepeater.count) ? selectedIndex + 1 : 0;
760 while (!popoverRepeater.itemAt(selectedIndex).clickable && selectedIndex != prevIndex) {
761 selectedIndex = (selectedIndex + 1 < popoverRepeater.count) ? selectedIndex + 1 : 0;
762 }
763 event.accepted = true;
764 break;
765 case Qt.Key_Up:
766 var prevIndex = selectedIndex;
767 selectedIndex = (selectedIndex > 0) ? selectedIndex - 1 : popoverRepeater.count - 1;
768 while (!popoverRepeater.itemAt(selectedIndex).clickable && selectedIndex != prevIndex) {
769 selectedIndex = (selectedIndex > 0) ? selectedIndex - 1 : popoverRepeater.count - 1;
770 }
771 event.accepted = true;
772 break;
773 case Qt.Key_Left:
774 case Qt.Key_Escape:
775 quickList.selectedIndex = -1;
776 quickList.focus = false;
777 quickList.state = ""
778 event.accepted = true;
779 break;
780 case Qt.Key_Enter:
781 case Qt.Key_Return:
782 case Qt.Key_Space:
783 if (quickList.selectedIndex >= 0) {
784 LauncherModel.quickListActionInvoked(quickList.appId, quickList.selectedIndex)
785 }
786 quickList.selectedIndex = -1;
787 quickList.focus = false;
788 quickList.state = ""
789 root.kbdNavigationCancelled();
790 event.accepted = true;
791 break;
792 }
793 }
794
795 // internal
796 property int itemCenter: item ? root.mapFromItem(quickList.item, 0, 0).y + (item.height / 2) + quickList.item.offset : units.gu(1)
797 property int offset: itemCenter + (height/2) + units.gu(1) > parent.height ? -itemCenter - (height/2) - units.gu(1) + parent.height :
798 itemCenter - (height/2) < units.gu(1) ? (height/2) - itemCenter + units.gu(1) : 0
799
800 function open(index) {
801 var itemPosition = index * launcherListView.itemHeight;
802 var height = launcherListView.height - launcherListView.topMargin - launcherListView.bottomMargin
803 item = launcherListView.itemAt(launcherListView.width / 2, itemPosition + launcherListView.itemHeight / 2);
804 quickList.model = launcherListView.model.get(index).quickList;
805 quickList.appId = launcherListView.model.get(index).appId;
806 quickList.state = "open";
807 root.highlightIndex = index;
808 quickList.forceActiveFocus();
809 }
810
811 Item {
812 width: parent.width
813 height: quickListColumn.height
814
815 MouseArea {
816 anchors.fill: parent
817 hoverEnabled: true
818 onPositionChanged: {
819 var item = quickListColumn.childAt(mouseX, mouseY);
820 if (item.clickable) {
821 quickList.selectedIndex = item.index;
822 } else {
823 quickList.selectedIndex = -1;
824 }
825 }
826 }
827
828 Column {
829 id: quickListColumn
830 width: parent.width
831 height: childrenRect.height
832
833 Repeater {
834 id: popoverRepeater
835 objectName: "popoverRepeater"
836 model: QuickListProxyModel {
837 source: quickList.model ? quickList.model : null
838 privateMode: root.privateMode
839 }
840
841 ListItem {
842 readonly property bool clickable: model.clickable
843 readonly property int index: model.index
844
845 objectName: "quickListEntry" + index
846 selected: index === quickList.selectedIndex
847 height: label.implicitHeight + label.anchors.topMargin + label.anchors.bottomMargin
848 color: model.clickable ? (selected ? theme.palette.highlighted.background : "transparent") : theme.palette.disabled.background
849 highlightColor: !model.clickable ? quickList.color : undefined // make disabled items visually unclickable
850 divider.colorFrom: LomiriColors.inkstone
851 divider.colorTo: LomiriColors.inkstone
852 divider.visible: model.hasSeparator
853
854 Label {
855 id: label
856 anchors.fill: parent
857 anchors.leftMargin: units.gu(3) // 2 GU for checkmark, 3 GU total
858 anchors.rightMargin: units.gu(2)
859 anchors.topMargin: units.gu(2)
860 anchors.bottomMargin: units.gu(2)
861 verticalAlignment: Label.AlignVCenter
862 text: model.label
863 fontSize: index == 0 ? "medium" : "small"
864 font.weight: index == 0 ? Font.Medium : Font.Light
865 color: model.clickable ? theme.palette.normal.backgroundText : theme.palette.disabled.backgroundText
866 elide: Text.ElideRight
867 }
868
869 onClicked: {
870 if (!model.clickable) {
871 return;
872 }
873 Haptics.play();
874 quickList.state = "";
875 // Unsetting model to prevent showing changing entries during fading out
876 // that may happen because of triggering an action.
877 LauncherModel.quickListActionInvoked(quickList.appId, index);
878 quickList.focus = false;
879 root.kbdNavigationCancelled();
880 quickList.model = undefined;
881 }
882 }
883 }
884 }
885 }
886 }
887
888 Tooltip {
889 id: tooltipShape
890 objectName: "tooltipShape"
891
892 visible: tooltipShownState.active
893 rotation: root.rotation
894 y: itemCenter - (height / 2)
895
896 anchors {
897 left: root.inverted ? undefined : parent.right
898 right: root.inverted ? parent.left : undefined
899 margins: units.gu(1)
900 }
901
902 readonly property var hoveredItem: dndArea.containsMouse ? launcherListView.itemAt(dndArea.mouseX, dndArea.mouseY + launcherListView.realContentY) : null
903 readonly property int itemCenter: !hoveredItem ? 0 : root.mapFromItem(hoveredItem, 0, 0).y + (hoveredItem.height / 2) + hoveredItem.offset
904
905 text: !hoveredItem ? "" : hoveredItem.name
906 }
907
908 DSM.StateMachine {
909 id: tooltipStateMachine
910 initialState: tooltipHiddenState
911 running: true
912
913 DSM.State {
914 id: tooltipHiddenState
915
916 DSM.SignalTransition {
917 targetState: tooltipShownState
918 signal: tooltipShape.hoveredItemChanged
919 // !dndArea.pressed allows us to filter out touch input events
920 guard: tooltipShape.hoveredItem !== null && !dndArea.pressed && !root.moving
921 }
922 }
923
924 DSM.State {
925 id: tooltipShownState
926
927 DSM.SignalTransition {
928 targetState: tooltipHiddenState
929 signal: tooltipShape.hoveredItemChanged
930 guard: tooltipShape.hoveredItem === null
931 }
932
933 DSM.SignalTransition {
934 targetState: tooltipDismissedState
935 signal: dndArea.onPressed
936 }
937
938 DSM.SignalTransition {
939 targetState: tooltipDismissedState
940 signal: quickList.stateChanged
941 guard: quickList.state === "open"
942 }
943 }
944
945 DSM.State {
946 id: tooltipDismissedState
947
948 DSM.SignalTransition {
949 targetState: tooltipHiddenState
950 signal: dndArea.positionChanged
951 guard: quickList.state != "open" && !dndArea.pressed && !dndArea.moving
952 }
953
954 DSM.SignalTransition {
955 targetState: tooltipHiddenState
956 signal: dndArea.exited
957 guard: quickList.state != "open"
958 }
959 }
960 }
961}