git.iko.soy/unity8
on 73aedc0 help sign in
unity8/qml/Notifications/Notification.qml
593 lines 22 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: notification.notification && typeof notification.notification.fullscreen != "undefined" ?
41 notification.notification.fullscreen : false // fullscreen prop only exists in the mock
42 property int maxHeight
43 property int margins: units.gu(1)
45 readonly property real defaultOpacity: 1.0
46 property bool hasMouse
47 property url background: ""
49 objectName: "background"
50 implicitHeight: type !== Notification.PlaceHolder ? (fullscreen ? maxHeight : outterColumn.height + shapedBack.anchors.topMargin + margins * 2) : 0
52 // FIXME: non-zero initially because of LP: #1354406 workaround, we want this to start at 0 upon creation eventually
53 opacity: defaultOpacity - Math.abs(x / notification.width)
55 theme: ThemeSettings {
56 name: "Ubuntu.Components.Themes.Ambiance"
57 }
59 readonly property bool expanded: type === Notification.SnapDecision && // expand only snap decisions, if...
60 (fullscreen || // - it's a fullscreen one
61 ListView.view.currentIndex === index || // - it's the one the user clicked on
62 (ListView.view.currentIndex === -1 && index == 0) // - the first one after the user closed the previous one
63 )
65 NotificationAudio {
66 id: sound
67 objectName: "sound"
68 source: hints["suppress-sound"] !== "true" && hints["sound-file"] !== undefined ? hints["sound-file"] : ""
69 }
71 Component.onCompleted: {
72 if (type === Notification.PlaceHolder) {
73 return;
74 }
76 // Turn on screen as needed (Powerd.Notification means the screen
77 // stays on for a shorter amount of time)
78 if (type === Notification.SnapDecision) {
79 Powerd.setStatus(Powerd.On, Powerd.SnapDecision);
80 } else if (type !== Notification.Confirmation) {
81 Powerd.setStatus(Powerd.On, Powerd.Notification);
82 }
84 // FIXME: using onCompleted because of LP: #1354406 workaround, has to be onOpacityChanged really
85 if (opacity == defaultOpacity && hints["suppress-sound"] !== "true" && sound.source !== "") {
86 sound.play();
87 }
88 }
90 Component.onDestruction: {
91 if (type === Notification.PlaceHolder) {
92 return;
93 }
95 if (type === Notification.SnapDecision) {
96 Powerd.setStatus(Powerd.Off, Powerd.SnapDecision);
97 } else if (type !== Notification.Confirmation) {
98 Powerd.setStatus(Powerd.Off, Powerd.Notification);
99 }
100 }
102 function closeNotification() {
103 if (index === ListView.view.currentIndex) { // reset to get the 1st snap decision expanded
104 ListView.view.currentIndex = -1;
105 }
107 // perform the "reject" action
108 notification.notification.invokeAction(notification.actions.data(1, ActionModel.RoleActionId));
110 notification.notification.close();
111 }
113 Behavior on x {
114 UbuntuNumberAnimation { easing.type: Easing.OutBounce }
115 }
117 onHintsChanged: {
118 if (type === Notification.Confirmation && opacity == defaultOpacity && hints["suppress-sound"] !== "true" && sound.source !== "") {
119 sound.play();
120 }
121 }
123 onFullscreenChanged: {
124 if (fullscreen) {
125 notification.notification.urgency = Notification.Critical;
126 }
127 ListView.view.topmostIsFullscreen = fullscreen;
128 }
130 Behavior on implicitHeight {
131 enabled: !fullscreen
132 UbuntuNumberAnimation {
133 duration: UbuntuAnimation.SnapDuration
134 }
135 }
137 visible: type !== Notification.PlaceHolder
139 BorderImage {
140 anchors {
141 fill: contents
142 margins: shapedBack.visible ? -units.gu(1) : -units.gu(1.5)
143 }
144 source: "../Stages/graphics/dropshadow2gu.sci"
145 opacity: notification.opacity * 0.5
146 enabled: !fullscreen
147 }
149 UbuntuShape {
150 id: shapedBack
151 objectName: "shapedBack"
153 visible: !fullscreen
154 anchors {
155 fill: parent
156 leftMargin: notification.margins
157 rightMargin: notification.margins
158 topMargin: index == 0 ? notification.margins : 0
159 }
160 backgroundColor: parent.color
161 radius: "small"
162 aspect: UbuntuShape.Flat
163 }
165 Rectangle {
166 id: nonShapedBack
168 visible: fullscreen
169 anchors.fill: parent
170 color: parent.color
171 }
173 onXChanged: {
174 if (Math.abs(notification.x) > 0.75 * notification.width) {
175 closeNotification();
176 }
177 }
179 Item {
180 id: contents
181 anchors.fill: fullscreen ? nonShapedBack : shapedBack
183 UnityMenuModelPaths {
184 id: paths
186 source: hints["x-canonical-private-menu-model"]
188 busNameHint: "busName"
189 actionsHint: "actions"
190 menuObjectPathHint: "menuPath"
191 }
193 UnityMenuModel {
194 id: unityMenuModel
196 property string lastNameOwner: ""
198 busName: paths.busName
199 actions: paths.actions
200 menuObjectPath: paths.menuObjectPath
201 onNameOwnerChanged: {
202 if (lastNameOwner !== "" && nameOwner === "" && notification.notification !== undefined) {
203 notification.notification.close()
204 }
205 lastNameOwner = nameOwner
206 }
207 }
209 MouseArea {
210 id: interactiveArea
212 anchors.fill: parent
213 objectName: "interactiveArea"
215 drag.target: !fullscreen ? notification : undefined
216 drag.axis: Drag.XAxis
217 drag.minimumX: -notification.width
218 drag.maximumX: notification.width
219 hoverEnabled: true
221 onClicked: {
222 if (notification.type === Notification.Interactive) {
223 notification.notification.invokeAction(actionRepeater.itemAt(0).actionId)
224 } else {
225 notification.ListView.view.currentIndex = index;
226 }
227 }
228 onReleased: {
229 if (Math.abs(notification.x) < notification.width / 2) {
230 notification.x = 0
231 } else {
232 notification.x = notification.width
233 }
234 }
235 }
237 NotificationButton {
238 objectName: "closeButton"
239 width: units.gu(2)
240 height: width
241 radius: width / 2
242 visible: hasMouse && (containsMouse || interactiveArea.containsMouse)
243 iconName: "close"
244 outline: false
245 hoverEnabled: true
246 color: theme.palette.normal.negative
247 anchors.horizontalCenter: parent.left
248 anchors.horizontalCenterOffset: notification.parent.state === "narrow" ? notification.margins / 2 : 0
249 anchors.verticalCenter: parent.top
250 anchors.verticalCenterOffset: notification.parent.state === "narrow" ? notification.margins / 2 : 0
252 onClicked: closeNotification();
253 }
255 Column {
256 id: outterColumn
257 objectName: "outterColumn"
259 anchors {
260 left: parent.left
261 right: parent.right
262 top: parent.top
263 margins: !fullscreen ? notification.margins : 0
264 }
266 spacing: notification.margins
268 Row {
269 id: topRow
271 spacing: notification.margins
272 anchors {
273 left: parent.left
274 right: parent.right
275 }
277 ShapedIcon {
278 id: icon
280 objectName: "icon"
281 width: units.gu(6)
282 height: width
283 shaped: notification.hints["x-canonical-non-shaped-icon"] !== "true"
284 visible: iconSource !== "" && type !== Notification.Confirmation
285 }
287 Column {
288 id: labelColumn
289 width: secondaryIcon.visible ? parent.width - x - units.gu(3) : parent.width - x
290 anchors.verticalCenter: (icon.visible && !bodyLabel.visible) ? icon.verticalCenter : undefined
291 spacing: units.gu(.4)
293 Label {
294 id: summaryLabel
296 objectName: "summaryLabel"
297 anchors {
298 left: parent.left
299 right: parent.right
300 }
301 visible: type !== Notification.Confirmation
302 fontSize: "medium"
303 font.weight: Font.Light
304 color: theme.palette.normal.backgroundSecondaryText
305 elide: Text.ElideRight
306 textFormat: Text.PlainText
307 }
309 Label {
310 id: bodyLabel
312 objectName: "bodyLabel"
313 anchors {
314 left: parent.left
315 right: parent.right
316 }
317 visible: body != "" && type !== Notification.Confirmation
318 fontSize: "small"
319 font.weight: Font.Light
320 color: theme.palette.normal.backgroundTertiaryText
321 wrapMode: Text.Wrap
322 maximumLineCount: type === Notification.SnapDecision ? 12 : 2
323 elide: Text.ElideRight
324 textFormat: Text.PlainText
325 lineHeight: 1.1
326 }
327 }
329 Image {
330 id: secondaryIcon
332 objectName: "secondaryIcon"
333 width: units.gu(2)
334 height: width
335 visible: status === Image.Ready
336 fillMode: Image.PreserveAspectCrop
337 }
338 }
340 ListItem.ThinDivider {
341 visible: type === Notification.SnapDecision && notification.expanded
342 }
344 Icon {
345 name: "toolkit_chevron-down_3gu"
346 visible: type === Notification.SnapDecision && !notification.expanded
347 width: units.gu(2)
348 height: width
349 anchors.horizontalCenter: parent.horizontalCenter
350 color: theme.palette.normal.base
351 }
353 ShapedIcon {
354 id: centeredIcon
355 objectName: "centeredIcon"
356 width: units.gu(4)
357 height: width
358 shaped: notification.hints["x-canonical-non-shaped-icon"] !== "true"
359 fileSource: icon.fileSource
360 visible: fileSource !== "" && type === Notification.Confirmation
361 anchors.horizontalCenter: parent.horizontalCenter
362 }
364 Label {
365 id: valueLabel
366 objectName: "valueLabel"
367 text: body
368 anchors.horizontalCenter: parent.horizontalCenter
369 visible: type === Notification.Confirmation && body !== ""
370 fontSize: "medium"
371 font.weight: Font.Light
372 color: theme.palette.normal.backgroundSecondaryText
373 wrapMode: Text.WordWrap
374 maximumLineCount: 1
375 elide: Text.ElideRight
376 textFormat: Text.PlainText
377 }
379 ProgressBar {
380 id: valueIndicator
381 objectName: "valueIndicator"
382 visible: type === Notification.Confirmation
383 minimumValue: 0
384 maximumValue: 100
385 showProgressPercentage: false
386 anchors {
387 left: parent.left
388 right: parent.right
389 }
390 height: units.gu(1)
391 }
393 Column {
394 id: dialogColumn
395 objectName: "dialogListView"
396 spacing: notification.margins
398 visible: count > 0 && (notification.expanded || notification.fullscreen)
400 anchors {
401 left: parent.left
402 right: parent.right
403 top: fullscreen ? parent.top : undefined
404 bottom: fullscreen ? parent.bottom : undefined
405 }
407 Repeater {
408 model: unityMenuModel
410 NotificationMenuItemFactory {
411 id: menuItemFactory
413 anchors {
414 left: dialogColumn.left
415 right: dialogColumn.right
416 }
418 menuModel: unityMenuModel
419 menuData: model
420 menuIndex: index
421 maxHeight: notification.maxHeight
422 background: notification.background
424 onLoaded: {
425 notification.fullscreen = Qt.binding(function() { return fullscreen; });
426 }
427 onAccepted: {
428 notification.notification.invokeAction(actionRepeater.itemAt(0).actionId)
429 }
430 }
431 }
432 }
434 Column {
435 id: oneOverTwoCase
437 anchors {
438 left: parent.left
439 right: parent.right
440 }
442 spacing: notification.margins
444 visible: notification.type === Notification.SnapDecision && oneOverTwoRepeaterTop.count === 3 && notification.expanded
446 Repeater {
447 id: oneOverTwoRepeaterTop
449 model: notification.actions
450 delegate: Loader {
451 id: oneOverTwoLoaderTop
453 property string actionId: id
454 property string actionLabel: label
456 Component {
457 id: oneOverTwoButtonTop
459 NotificationButton {
460 objectName: "notify_oot_button" + index
461 width: oneOverTwoCase.width
462 text: oneOverTwoLoaderTop.actionLabel
463 outline: notification.hints["x-canonical-private-affirmative-tint"] !== "true"
464 color: notification.hints["x-canonical-private-affirmative-tint"] === "true" ? theme.palette.normal.positive
465 : theme.palette.normal.foreground
466 onClicked: notification.notification.invokeAction(oneOverTwoLoaderTop.actionId)
467 }
468 }
469 sourceComponent: index == 0 ? oneOverTwoButtonTop : undefined
470 }
471 }
473 Row {
474 spacing: notification.margins
476 Repeater {
477 id: oneOverTwoRepeaterBottom
479 model: notification.actions
480 delegate: Loader {
481 id: oneOverTwoLoaderBottom
483 property string actionId: id
484 property string actionLabel: label
486 Component {
487 id: oneOverTwoButtonBottom
489 NotificationButton {
490 objectName: "notify_oot_button" + index
491 width: oneOverTwoCase.width / 2 - spacing / 2
492 text: oneOverTwoLoaderBottom.actionLabel
493 outline: notification.hints["x-canonical-private-rejection-tint"] !== "true"
494 color: index == 1 && notification.hints["x-canonical-private-rejection-tint"] === "true" ? theme.palette.normal.negative
495 : theme.palette.normal.foreground
496 onClicked: notification.notification.invokeAction(oneOverTwoLoaderBottom.actionId)
497 }
498 }
499 sourceComponent: (index == 1 || index == 2) ? oneOverTwoButtonBottom : undefined
500 }
501 }
502 }
503 }
505 Row {
506 id: buttonRow
508 objectName: "buttonRow"
509 anchors {
510 left: parent.left
511 right: parent.right
512 }
513 visible: notification.type === Notification.SnapDecision && actionRepeater.count > 0 && !oneOverTwoCase.visible && notification.expanded
514 spacing: notification.margins
515 layoutDirection: Qt.RightToLeft
517 Loader {
518 id: notifySwipeButtonLoader
519 active: notification.hints["x-canonical-snap-decisions-swipe"] === "true"
521 sourceComponent: SwipeToAct {
522 objectName: "notify_swipe_button"
523 width: buttonRow.width
524 leftIconName: "call-end"
525 rightIconName: "call-start"
526 clickToAct: notification.hasMouse
527 onRightTriggered: {
528 notification.notification.invokeAction(notification.actions.data(0, ActionModel.RoleActionId))
529 }
531 onLeftTriggered: {
532 notification.notification.invokeAction(notification.actions.data(1, ActionModel.RoleActionId))
533 }
534 }
535 }
537 Repeater {
538 id: actionRepeater
539 model: notification.actions
540 delegate: Loader {
541 id: loader
543 property string actionId: id
544 property string actionLabel: label
545 active: !notifySwipeButtonLoader.active
547 Component {
548 id: actionButton
550 NotificationButton {
551 objectName: "notify_button" + index
552 width: buttonRow.width / 2 - spacing / 2
553 text: loader.actionLabel
554 outline: (index == 0 && notification.hints["x-canonical-private-affirmative-tint"] !== "true") ||
555 (index == 1 && notification.hints["x-canonical-private-rejection-tint"] !== "true")
556 color: {
557 var result = theme.palette.normal.foreground;
558 if (index == 0 && notification.hints["x-canonical-private-affirmative-tint"] === "true") {
559 result = theme.palette.normal.positive;
560 }
561 if (index == 1 && notification.hints["x-canonical-private-rejection-tint"] === "true") {
562 result = theme.palette.normal.negative;
563 }
564 return result;
565 }
566 onClicked: notification.notification.invokeAction(loader.actionId)
567 }
568 }
569 sourceComponent: (index == 0 || index == 1) ? actionButton : undefined
570 }
571 }
572 }
574 OptionToggle {
575 id: optionToggle
576 objectName: "notify_button2"
577 width: parent.width
578 anchors {
579 left: parent.left
580 right: parent.right
581 }
583 visible: notification.type === Notification.SnapDecision && actionRepeater.count > 3 && !oneOverTwoCase.visible && notification.expanded
584 model: notification.actions
585 expanded: false
586 startIndex: 2
587 onTriggered: {
588 notification.notification.invokeAction(id)
589 }
590 }
591 }
592 }