on a9fab96 help sign in
unity8/qml/Notifications/Notification.qml
580 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 > 2) {
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 (notification.actions.count > 1) { // perform the "reject" action
103 notification.notification.invokeAction(notification.actions.data(1, ActionModel.RoleActionId));
104 }
105 notification.notification.close();
106 }
108 Behavior on x {
109 UbuntuNumberAnimation { easing.type: Easing.OutBounce }
110 }
112 onHintsChanged: {
113 if (type === Notification.Confirmation && opacity == defaultOpacity && hints["suppress-sound"] !== "true" && sound.source !== "") {
114 sound.play();
115 }
116 }
118 Behavior on height {
119 UbuntuNumberAnimation {
120 duration: UbuntuAnimation.SnapDuration
121 }
122 }
124 visible: type !== Notification.PlaceHolder
126 BorderImage {
127 anchors {
128 fill: contents
129 margins: shapedBack.visible ? -units.gu(1) : -units.gu(1.5)
130 }
131 source: "../Stages/graphics/dropshadow2gu.sci"
132 opacity: notification.opacity * 0.5
133 enabled: !fullscreen
134 }
136 UbuntuShape {
137 id: shapedBack
138 objectName: "shapedBack"
140 visible: !fullscreen
141 anchors {
142 fill: parent
143 leftMargin: notification.margins
144 rightMargin: notification.margins
145 topMargin: index == 0 ? notification.margins : 0
146 }
147 backgroundColor: parent.color
148 radius: "small"
149 aspect: UbuntuShape.Flat
150 }
152 Rectangle {
153 id: nonShapedBack
155 visible: fullscreen
156 anchors.fill: parent
157 color: parent.color
158 }
160 onXChanged: {
161 if (Math.abs(notification.x) > 0.75 * notification.width) {
162 closeNotification();
163 }
164 }
166 Item {
167 id: contents
168 anchors.fill: fullscreen ? nonShapedBack : shapedBack
170 UnityMenuModelPaths {
171 id: paths
173 source: hints["x-canonical-private-menu-model"]
175 busNameHint: "busName"
176 actionsHint: "actions"
177 menuObjectPathHint: "menuPath"
178 }
180 UnityMenuModel {
181 id: unityMenuModel
183 property string lastNameOwner: ""
185 busName: paths.busName
186 actions: paths.actions
187 menuObjectPath: paths.menuObjectPath
188 onNameOwnerChanged: {
189 if (lastNameOwner !== "" && nameOwner === "" && notification.notification !== undefined) {
190 notification.notification.close()
191 }
192 lastNameOwner = nameOwner
193 }
194 }
196 MouseArea {
197 id: interactiveArea
199 anchors.fill: parent
200 objectName: "interactiveArea"
202 drag.target: notification
203 drag.axis: Drag.XAxis
204 drag.minimumX: -notification.width
205 drag.maximumX: notification.width
206 hoverEnabled: true
208 onClicked: {
209 if (notification.type === Notification.Interactive) {
210 notification.notification.invokeAction(actionRepeater.itemAt(0).actionId)
211 } else {
212 notificationList.currentIndex = index;
213 }
214 }
215 onReleased: {
216 if (Math.abs(notification.x) < notification.width / 2) {
217 notification.x = 0
218 } else {
219 notification.x = notification.width
220 }
221 }
222 }
224 NotificationButton {
225 objectName: "closeButton"
226 width: units.gu(2)
227 height: width
228 radius: width / 2
229 visible: hasMouse && (containsMouse || interactiveArea.containsMouse)
230 iconName: "close"
231 outline: false
232 hoverEnabled: true
233 color: theme.palette.normal.negative
234 anchors.horizontalCenter: parent.left
235 anchors.horizontalCenterOffset: notification.parent.state === "narrow" ? notification.margins / 2 : 0
236 anchors.verticalCenter: parent.top
237 anchors.verticalCenterOffset: notification.parent.state === "narrow" ? notification.margins / 2 : 0
239 onClicked: closeNotification();
240 }
242 Column {
243 id: outterColumn
244 objectName: "outterColumn"
246 anchors {
247 left: parent.left
248 right: parent.right
249 top: parent.top
250 margins: !fullscreen ? notification.margins : 0
251 }
253 spacing: notification.margins
255 Row {
256 id: topRow
258 spacing: notification.margins
259 anchors {
260 left: parent.left
261 right: parent.right
262 }
264 ShapedIcon {
265 id: icon
267 objectName: "icon"
268 width: units.gu(6)
269 height: width
270 shaped: notification.hints["x-canonical-non-shaped-icon"] !== "true"
271 visible: iconSource !== "" && type !== Notification.Confirmation
272 }
274 Column {
275 id: labelColumn
276 width: secondaryIcon.visible ? parent.width - x - units.gu(3) : parent.width - x
277 anchors.verticalCenter: (icon.visible && !bodyLabel.visible) ? icon.verticalCenter : undefined
278 spacing: units.gu(.4)
280 Label {
281 id: summaryLabel
283 objectName: "summaryLabel"
284 anchors {
285 left: parent.left
286 right: parent.right
287 }
288 visible: type !== Notification.Confirmation
289 fontSize: "medium"
290 font.weight: Font.Light
291 color: theme.palette.normal.backgroundSecondaryText
292 elide: Text.ElideRight
293 textFormat: Text.PlainText
294 }
296 Label {
297 id: bodyLabel
299 objectName: "bodyLabel"
300 anchors {
301 left: parent.left
302 right: parent.right
303 }
304 visible: body != "" && type !== Notification.Confirmation
305 fontSize: "small"
306 font.weight: Font.Light
307 color: theme.palette.normal.backgroundTertiaryText
308 wrapMode: Text.Wrap
309 maximumLineCount: type === Notification.SnapDecision ? 12 : 2
310 elide: Text.ElideRight
311 textFormat: Text.PlainText
312 lineHeight: 1.1
313 }
314 }
316 Image {
317 id: secondaryIcon
319 objectName: "secondaryIcon"
320 width: units.gu(2)
321 height: width
322 visible: status === Image.Ready
323 fillMode: Image.PreserveAspectCrop
324 }
325 }
327 ListItem.ThinDivider {
328 visible: type === Notification.SnapDecision && notification.expanded
329 }
331 Icon {
332 name: "toolkit_chevron-down_3gu"
333 visible: type === Notification.SnapDecision && !notification.expanded
334 width: units.gu(2)
335 height: width
336 anchors.horizontalCenter: parent.horizontalCenter
337 color: theme.palette.normal.base
338 }
340 ShapedIcon {
341 id: centeredIcon
342 objectName: "centeredIcon"
343 width: units.gu(4)
344 height: width
345 shaped: notification.hints["x-canonical-non-shaped-icon"] !== "true"
346 fileSource: icon.fileSource
347 visible: fileSource !== "" && type === Notification.Confirmation
348 anchors.horizontalCenter: parent.horizontalCenter
349 }
351 Label {
352 id: valueLabel
353 objectName: "valueLabel"
354 text: body
355 anchors.horizontalCenter: parent.horizontalCenter
356 visible: type === Notification.Confirmation && body !== ""
357 fontSize: "medium"
358 font.weight: Font.Light
359 color: theme.palette.normal.backgroundSecondaryText
360 wrapMode: Text.WordWrap
361 maximumLineCount: 1
362 elide: Text.ElideRight
363 textFormat: Text.PlainText
364 }
366 ProgressBar {
367 id: valueIndicator
368 objectName: "valueIndicator"
369 visible: type === Notification.Confirmation
370 minimumValue: 0
371 maximumValue: 100
372 showProgressPercentage: false
373 anchors {
374 left: parent.left
375 right: parent.right
376 }
377 height: units.gu(1)
378 }
380 Column {
381 id: dialogColumn
382 objectName: "dialogListView"
383 spacing: notification.margins
385 visible: count > 0
387 anchors {
388 left: parent.left
389 right: parent.right
390 top: fullscreen ? parent.top : undefined
391 bottom: fullscreen ? parent.bottom : undefined
392 }
394 Repeater {
395 model: unityMenuModel
397 NotificationMenuItemFactory {
398 id: menuItemFactory
400 anchors {
401 left: dialogColumn.left
402 right: dialogColumn.right
403 }
405 menuModel: unityMenuModel
406 menuData: model
407 menuIndex: index
408 maxHeight: notification.maxHeight
409 background: notification.background
411 onLoaded: {
412 notification.fullscreen = Qt.binding(function() { return fullscreen; });
413 }
414 onAccepted: {
415 notification.notification.invokeAction(actionRepeater.itemAt(0).actionId)
416 }
417 }
418 }
419 }
421 Column {
422 id: oneOverTwoCase
424 anchors {
425 left: parent.left
426 right: parent.right
427 }
429 spacing: notification.margins
431 visible: notification.type === Notification.SnapDecision && oneOverTwoRepeaterTop.count === 3 && notification.expanded
433 Repeater {
434 id: oneOverTwoRepeaterTop
436 model: notification.actions
437 delegate: Loader {
438 id: oneOverTwoLoaderTop
440 property string actionId: id
441 property string actionLabel: label
443 Component {
444 id: oneOverTwoButtonTop
446 NotificationButton {
447 objectName: "notify_oot_button" + index
448 width: oneOverTwoCase.width
449 text: oneOverTwoLoaderTop.actionLabel
450 outline: notification.hints["x-canonical-private-affirmative-tint"] !== "true"
451 color: notification.hints["x-canonical-private-affirmative-tint"] === "true" ? theme.palette.normal.positive
452 : theme.palette.normal.foreground
453 onClicked: notification.notification.invokeAction(oneOverTwoLoaderTop.actionId)
454 }
455 }
456 sourceComponent: index == 0 ? oneOverTwoButtonTop : undefined
457 }
458 }
460 Row {
461 spacing: notification.margins
463 Repeater {
464 id: oneOverTwoRepeaterBottom
466 model: notification.actions
467 delegate: Loader {
468 id: oneOverTwoLoaderBottom
470 property string actionId: id
471 property string actionLabel: label
473 Component {
474 id: oneOverTwoButtonBottom
476 NotificationButton {
477 objectName: "notify_oot_button" + index
478 width: oneOverTwoCase.width / 2 - spacing / 2
479 text: oneOverTwoLoaderBottom.actionLabel
480 outline: notification.hints["x-canonical-private-rejection-tint"] !== "true"
481 color: index == 1 && notification.hints["x-canonical-private-rejection-tint"] === "true" ? theme.palette.normal.negative
482 : theme.palette.normal.foreground
483 onClicked: notification.notification.invokeAction(oneOverTwoLoaderBottom.actionId)
484 }
485 }
486 sourceComponent: (index == 1 || index == 2) ? oneOverTwoButtonBottom : undefined
487 }
488 }
489 }
490 }
492 Row {
493 id: buttonRow
495 objectName: "buttonRow"
496 anchors {
497 left: parent.left
498 right: parent.right
499 }
500 visible: notification.type === Notification.SnapDecision && actionRepeater.count > 0 && !oneOverTwoCase.visible && notification.expanded
501 spacing: notification.margins
502 layoutDirection: Qt.RightToLeft
504 Loader {
505 id: notifySwipeButtonLoader
506 active: notification.hints["x-canonical-snap-decisions-swipe"] === "true"
508 sourceComponent: SwipeToAct {
509 objectName: "notify_swipe_button"
510 width: buttonRow.width
511 leftIconName: "call-end"
512 rightIconName: "call-start"
513 clickToAct: notification.hasMouse
514 onRightTriggered: {
515 notification.notification.invokeAction(notification.actions.data(0, ActionModel.RoleActionId))
516 }
518 onLeftTriggered: {
519 notification.notification.invokeAction(notification.actions.data(1, ActionModel.RoleActionId))
520 }
521 }
522 }
524 Repeater {
525 id: actionRepeater
526 model: notification.actions
527 delegate: Loader {
528 id: loader
530 property string actionId: id
531 property string actionLabel: label
532 active: !notifySwipeButtonLoader.active
534 Component {
535 id: actionButton
537 NotificationButton {
538 objectName: "notify_button" + index
539 width: buttonRow.width / 2 - spacing / 2
540 text: loader.actionLabel
541 outline: (index == 0 && notification.hints["x-canonical-private-affirmative-tint"] !== "true") ||
542 (index == 1 && notification.hints["x-canonical-private-rejection-tint"] !== "true")
543 color: {
544 var result = theme.palette.normal.foreground;
545 if (index == 0 && notification.hints["x-canonical-private-affirmative-tint"] === "true") {
546 result = theme.palette.normal.positive;
547 }
548 if (index == 1 && notification.hints["x-canonical-private-rejection-tint"] === "true") {
549 result = theme.palette.normal.negative;
550 }
551 return result;
552 }
553 onClicked: notification.notification.invokeAction(loader.actionId)
554 }
555 }
556 sourceComponent: (index == 0 || index == 1) ? actionButton : undefined
557 }
558 }
559 }
561 OptionToggle {
562 id: optionToggle
563 objectName: "notify_button2"
564 width: parent.width
565 anchors {
566 left: parent.left
567 right: parent.right
568 }
570 visible: notification.type === Notification.SnapDecision && actionRepeater.count > 3 && !oneOverTwoCase.visible && notification.expanded
571 model: notification.actions
572 expanded: false
573 startIndex: 2
574 onTriggered: {
575 notification.notification.invokeAction(id)
576 }
577 }
578 }
579 }