on 7a1bfb2 help sign in
unity8/qml/Notifications/Notification.qml
584 lines 21 kB history raw
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 */
17import QtQuick 2.4
18import Powerd 0.1
19import Ubuntu.Components 1.3
20import Ubuntu.Components.ListItems 1.3 as ListItem
21import Unity.Notifications 1.0
22import QMenuModel 0.1
23import Utils 0.1
24import "../Components"
26StyledItem {
27 id: notification
29 property alias iconSource: icon.fileSource
30 property alias secondaryIconSource: secondaryIcon.source
31 property alias summary: summaryLabel.text
32 property alias body: bodyLabel.text
33 property alias value: valueIndicator.value
34 property var actions
35 property var notificationId
36 property var type
37 property var hints
38 property var notification
39 property color color: theme.palette.normal.background
40 property bool fullscreen: false
41 property int maxHeight
42 property int margins: units.gu(1)
44 readonly property real defaultOpacity: 1.0
45 property bool hasMouse
46 property url background: ""
48 objectName: "background"
49 implicitHeight: type !== Notification.PlaceHolder ? (fullscreen ? maxHeight : outterColumn.height + shapedBack.anchors.topMargin + margins * 2) : 0
51 // FIXME: non-zero initially because of LP: #1354406 workaround, we want this to start at 0 upon creation eventually
52 opacity: defaultOpacity - Math.abs(x / notification.width)
54 theme: ThemeSettings {
55 name: "Ubuntu.Components.Themes.Ambiance"
56 }
58 readonly property bool expanded: {
59 var result = false;
61 if (type === Notification.SnapDecision) {
62 if (ListView.view.currentIndex === index) {
63 result = true;
64 } else {
65 if (ListView.view.count > 1) {
66 if (ListView.view.currentIndex === -1 && index == 1) {
67 result = true;
68 } else {
69 result = false;
70 }
71 } else {
72 result = true;
73 }
74 }
75 }
77 return result;
78 }
80 NotificationAudio {
81 id: sound
82 objectName: "sound"
83 source: hints["suppress-sound"] !== "true" && hints["sound-file"] !== undefined ? hints["sound-file"] : ""
84 }
86 Component.onCompleted: {
87 // Turn on screen as needed (Powerd.Notification means the screen
88 // stays on for a shorter amount of time)
89 if (type === Notification.SnapDecision) {
90 Powerd.setStatus(Powerd.On, Powerd.SnapDecision);
91 } else if (type !== Notification.Confirmation) {
92 Powerd.setStatus(Powerd.On, Powerd.Notification);
93 }
95 // FIXME: using onCompleted because of LP: #1354406 workaround, has to be onOpacityChanged really
96 if (opacity == defaultOpacity && hints["suppress-sound"] !== "true" && sound.source !== "") {
97 sound.play();
98 }
99 }
101 function closeNotification() {
102 if (index === ListView.view.currentIndex) { // reset to get the 1st snap decision expanded
103 ListView.view.currentIndex = -1;
104 }
106 if (notification.actions.count > 1) { // perform the "reject" action
107 notification.notification.invokeAction(notification.actions.data(1, ActionModel.RoleActionId));
108 }
109 notification.notification.close();
110 }
112 Behavior on x {
113 UbuntuNumberAnimation { easing.type: Easing.OutBounce }
114 }
116 onHintsChanged: {
117 if (type === Notification.Confirmation && opacity == defaultOpacity && hints["suppress-sound"] !== "true" && sound.source !== "") {
118 sound.play();
119 }
120 }
122 Behavior on height {
123 UbuntuNumberAnimation {
124 duration: UbuntuAnimation.SnapDuration
125 }
126 }
128 visible: type !== Notification.PlaceHolder
130 BorderImage {
131 anchors {
132 fill: contents
133 margins: shapedBack.visible ? -units.gu(1) : -units.gu(1.5)
134 }
135 source: "../Stages/graphics/dropshadow2gu.sci"
136 opacity: notification.opacity * 0.5
137 enabled: !fullscreen
138 }
140 UbuntuShape {
141 id: shapedBack
142 objectName: "shapedBack"
144 visible: !fullscreen
145 anchors {
146 fill: parent
147 leftMargin: notification.margins
148 rightMargin: notification.margins
149 topMargin: index == 0 ? notification.margins : 0
150 }
151 backgroundColor: parent.color
152 radius: "small"
153 aspect: UbuntuShape.Flat
154 }
156 Rectangle {
157 id: nonShapedBack
159 visible: fullscreen
160 anchors.fill: parent
161 color: parent.color
162 }
164 onXChanged: {
165 if (Math.abs(notification.x) > 0.75 * notification.width) {
166 closeNotification();
167 }
168 }
170 Item {
171 id: contents
172 anchors.fill: fullscreen ? nonShapedBack : shapedBack
174 UnityMenuModelPaths {
175 id: paths
177 source: hints["x-canonical-private-menu-model"]
179 busNameHint: "busName"
180 actionsHint: "actions"
181 menuObjectPathHint: "menuPath"
182 }
184 UnityMenuModel {
185 id: unityMenuModel
187 property string lastNameOwner: ""
189 busName: paths.busName
190 actions: paths.actions
191 menuObjectPath: paths.menuObjectPath
192 onNameOwnerChanged: {
193 if (lastNameOwner !== "" && nameOwner === "" && notification.notification !== undefined) {
194 notification.notification.close()
195 }
196 lastNameOwner = nameOwner
197 }
198 }
200 MouseArea {
201 id: interactiveArea
203 anchors.fill: parent
204 objectName: "interactiveArea"
206 drag.target: notification
207 drag.axis: Drag.XAxis
208 drag.minimumX: -notification.width
209 drag.maximumX: notification.width
210 hoverEnabled: true
212 onClicked: {
213 if (notification.type === Notification.Interactive) {
214 notification.notification.invokeAction(actionRepeater.itemAt(0).actionId)
215 } else {
216 notificationList.currentIndex = index;
217 }
218 }
219 onReleased: {
220 if (Math.abs(notification.x) < notification.width / 2) {
221 notification.x = 0
222 } else {
223 notification.x = notification.width
224 }
225 }
226 }
228 NotificationButton {
229 objectName: "closeButton"
230 width: units.gu(2)
231 height: width
232 radius: width / 2
233 visible: hasMouse && (containsMouse || interactiveArea.containsMouse)
234 iconName: "close"
235 outline: false
236 hoverEnabled: true
237 color: theme.palette.normal.negative
238 anchors.horizontalCenter: parent.left
239 anchors.horizontalCenterOffset: notification.parent.state === "narrow" ? notification.margins / 2 : 0
240 anchors.verticalCenter: parent.top
241 anchors.verticalCenterOffset: notification.parent.state === "narrow" ? notification.margins / 2 : 0
243 onClicked: closeNotification();
244 }
246 Column {
247 id: outterColumn
248 objectName: "outterColumn"
250 anchors {
251 left: parent.left
252 right: parent.right
253 top: parent.top
254 margins: !fullscreen ? notification.margins : 0
255 }
257 spacing: notification.margins
259 Row {
260 id: topRow
262 spacing: notification.margins
263 anchors {
264 left: parent.left
265 right: parent.right
266 }
268 ShapedIcon {
269 id: icon
271 objectName: "icon"
272 width: units.gu(6)
273 height: width
274 shaped: notification.hints["x-canonical-non-shaped-icon"] !== "true"
275 visible: iconSource !== "" && type !== Notification.Confirmation
276 }
278 Column {
279 id: labelColumn
280 width: secondaryIcon.visible ? parent.width - x - units.gu(3) : parent.width - x
281 anchors.verticalCenter: (icon.visible && !bodyLabel.visible) ? icon.verticalCenter : undefined
282 spacing: units.gu(.4)
284 Label {
285 id: summaryLabel
287 objectName: "summaryLabel"
288 anchors {
289 left: parent.left
290 right: parent.right
291 }
292 visible: type !== Notification.Confirmation
293 fontSize: "medium"
294 font.weight: Font.Light
295 color: theme.palette.normal.backgroundSecondaryText
296 elide: Text.ElideRight
297 textFormat: Text.PlainText
298 }
300 Label {
301 id: bodyLabel
303 objectName: "bodyLabel"
304 anchors {
305 left: parent.left
306 right: parent.right
307 }
308 visible: body != "" && type !== Notification.Confirmation
309 fontSize: "small"
310 font.weight: Font.Light
311 color: theme.palette.normal.backgroundTertiaryText
312 wrapMode: Text.Wrap
313 maximumLineCount: type === Notification.SnapDecision ? 12 : 2
314 elide: Text.ElideRight
315 textFormat: Text.PlainText
316 lineHeight: 1.1
317 }
318 }
320 Image {
321 id: secondaryIcon
323 objectName: "secondaryIcon"
324 width: units.gu(2)
325 height: width
326 visible: status === Image.Ready
327 fillMode: Image.PreserveAspectCrop
328 }
329 }
331 ListItem.ThinDivider {
332 visible: type === Notification.SnapDecision && notification.expanded
333 }
335 Icon {
336 name: "toolkit_chevron-down_3gu"
337 visible: type === Notification.SnapDecision && !notification.expanded
338 width: units.gu(2)
339 height: width
340 anchors.horizontalCenter: parent.horizontalCenter
341 color: theme.palette.normal.base
342 }
344 ShapedIcon {
345 id: centeredIcon
346 objectName: "centeredIcon"
347 width: units.gu(4)
348 height: width
349 shaped: notification.hints["x-canonical-non-shaped-icon"] !== "true"
350 fileSource: icon.fileSource
351 visible: fileSource !== "" && type === Notification.Confirmation
352 anchors.horizontalCenter: parent.horizontalCenter
353 }
355 Label {
356 id: valueLabel
357 objectName: "valueLabel"
358 text: body
359 anchors.horizontalCenter: parent.horizontalCenter
360 visible: type === Notification.Confirmation && body !== ""
361 fontSize: "medium"
362 font.weight: Font.Light
363 color: theme.palette.normal.backgroundSecondaryText
364 wrapMode: Text.WordWrap
365 maximumLineCount: 1
366 elide: Text.ElideRight
367 textFormat: Text.PlainText
368 }
370 ProgressBar {
371 id: valueIndicator
372 objectName: "valueIndicator"
373 visible: type === Notification.Confirmation
374 minimumValue: 0
375 maximumValue: 100
376 showProgressPercentage: false
377 anchors {
378 left: parent.left
379 right: parent.right
380 }
381 height: units.gu(1)
382 }
384 Column {
385 id: dialogColumn
386 objectName: "dialogListView"
387 spacing: notification.margins
389 visible: count > 0
391 anchors {
392 left: parent.left
393 right: parent.right
394 top: fullscreen ? parent.top : undefined
395 bottom: fullscreen ? parent.bottom : undefined
396 }
398 Repeater {
399 model: unityMenuModel
401 NotificationMenuItemFactory {
402 id: menuItemFactory
404 anchors {
405 left: dialogColumn.left
406 right: dialogColumn.right
407 }
409 menuModel: unityMenuModel
410 menuData: model
411 menuIndex: index
412 maxHeight: notification.maxHeight
413 background: notification.background
415 onLoaded: {
416 notification.fullscreen = Qt.binding(function() { return fullscreen; });
417 }
418 onAccepted: {
419 notification.notification.invokeAction(actionRepeater.itemAt(0).actionId)
420 }
421 }
422 }
423 }
425 Column {
426 id: oneOverTwoCase
428 anchors {
429 left: parent.left
430 right: parent.right
431 }
433 spacing: notification.margins
435 visible: notification.type === Notification.SnapDecision && oneOverTwoRepeaterTop.count === 3 && notification.expanded
437 Repeater {
438 id: oneOverTwoRepeaterTop
440 model: notification.actions
441 delegate: Loader {
442 id: oneOverTwoLoaderTop
444 property string actionId: id
445 property string actionLabel: label
447 Component {
448 id: oneOverTwoButtonTop
450 NotificationButton {
451 objectName: "notify_oot_button" + index
452 width: oneOverTwoCase.width
453 text: oneOverTwoLoaderTop.actionLabel
454 outline: notification.hints["x-canonical-private-affirmative-tint"] !== "true"
455 color: notification.hints["x-canonical-private-affirmative-tint"] === "true" ? theme.palette.normal.positive
456 : theme.palette.normal.foreground
457 onClicked: notification.notification.invokeAction(oneOverTwoLoaderTop.actionId)
458 }
459 }
460 sourceComponent: index == 0 ? oneOverTwoButtonTop : undefined
461 }
462 }
464 Row {
465 spacing: notification.margins
467 Repeater {
468 id: oneOverTwoRepeaterBottom
470 model: notification.actions
471 delegate: Loader {
472 id: oneOverTwoLoaderBottom
474 property string actionId: id
475 property string actionLabel: label
477 Component {
478 id: oneOverTwoButtonBottom
480 NotificationButton {
481 objectName: "notify_oot_button" + index
482 width: oneOverTwoCase.width / 2 - spacing / 2
483 text: oneOverTwoLoaderBottom.actionLabel
484 outline: notification.hints["x-canonical-private-rejection-tint"] !== "true"
485 color: index == 1 && notification.hints["x-canonical-private-rejection-tint"] === "true" ? theme.palette.normal.negative
486 : theme.palette.normal.foreground
487 onClicked: notification.notification.invokeAction(oneOverTwoLoaderBottom.actionId)
488 }
489 }
490 sourceComponent: (index == 1 || index == 2) ? oneOverTwoButtonBottom : undefined
491 }
492 }
493 }
494 }
496 Row {
497 id: buttonRow
499 objectName: "buttonRow"
500 anchors {
501 left: parent.left
502 right: parent.right
503 }
504 visible: notification.type === Notification.SnapDecision && actionRepeater.count > 0 && !oneOverTwoCase.visible && notification.expanded
505 spacing: notification.margins
506 layoutDirection: Qt.RightToLeft
508 Loader {
509 id: notifySwipeButtonLoader
510 active: notification.hints["x-canonical-snap-decisions-swipe"] === "true"
512 sourceComponent: SwipeToAct {
513 objectName: "notify_swipe_button"
514 width: buttonRow.width
515 leftIconName: "call-end"
516 rightIconName: "call-start"
517 clickToAct: notification.hasMouse
518 onRightTriggered: {
519 notification.notification.invokeAction(notification.actions.data(0, ActionModel.RoleActionId))
520 }
522 onLeftTriggered: {
523 notification.notification.invokeAction(notification.actions.data(1, ActionModel.RoleActionId))
524 }
525 }
526 }
528 Repeater {
529 id: actionRepeater
530 model: notification.actions
531 delegate: Loader {
532 id: loader
534 property string actionId: id
535 property string actionLabel: label
536 active: !notifySwipeButtonLoader.active
538 Component {
539 id: actionButton
541 NotificationButton {
542 objectName: "notify_button" + index
543 width: buttonRow.width / 2 - spacing / 2
544 text: loader.actionLabel
545 outline: (index == 0 && notification.hints["x-canonical-private-affirmative-tint"] !== "true") ||
546 (index == 1 && notification.hints["x-canonical-private-rejection-tint"] !== "true")
547 color: {
548 var result = theme.palette.normal.foreground;
549 if (index == 0 && notification.hints["x-canonical-private-affirmative-tint"] === "true") {
550 result = theme.palette.normal.positive;
551 }
552 if (index == 1 && notification.hints["x-canonical-private-rejection-tint"] === "true") {
553 result = theme.palette.normal.negative;
554 }
555 return result;
556 }
557 onClicked: notification.notification.invokeAction(loader.actionId)
558 }
559 }
560 sourceComponent: (index == 0 || index == 1) ? actionButton : undefined
561 }
562 }
563 }
565 OptionToggle {
566 id: optionToggle
567 objectName: "notify_button2"
568 width: parent.width
569 anchors {
570 left: parent.left
571 right: parent.right
572 }
574 visible: notification.type === Notification.SnapDecision && actionRepeater.count > 3 && !oneOverTwoCase.visible && notification.expanded
575 model: notification.actions
576 expanded: false
577 startIndex: 2
578 onTriggered: {
579 notification.notification.invokeAction(id)
580 }
581 }
582 }
583 }