git.iko.soy/unity8
on 6231502 help sign in
unity8/qml/Notifications/Notification.qml
572 lines 20 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 QtMultimedia 5.0
19import Ubuntu.Components 1.1
20import Unity.Notifications 1.0
21import QMenuModel 0.1
22import Utils 0.1
24import Ubuntu.Components.ListItems 0.1 as ListItem
26Item {
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 var actions
34 property var notificationId
35 property var type
36 property var hints
37 property var notification
38 property color color
39 property bool fullscreen: false
40 property bool draggable: state == "contracted" || notification.type !== Notification.Confirmation
41 property int maxHeight
42 property int margins
43 readonly property color red: "#fc4949"
44 readonly property color green: "#3fb24f"
45 readonly property color sdLightGrey: "#eaeaea"
46 readonly property color sdDarkGrey: "#dddddd"
47 readonly property color sdFontColor: "#5d5d5d"
48 readonly property real contentSpacing: units.gu(2)
50 objectName: "background"
51 implicitHeight: type !== Notification.PlaceHolder ? (fullscreen ? maxHeight : outterColumn.height + contentSpacing * 2) : 0
53 color: type == Notification.SnapDecision ? sdLightGrey : Qt.rgba(0.132, 0.117, 0.109, 0.97)
54 opacity: 1 - (x / notification.width) // FIXME: 1 because of LP: #1354406 workaround, has to be 0 really
56 state: {
57 var result = "";
59 if (type == Notification.SnapDecision) {
60 if (ListView.view.currentIndex == index) {
61 result = "expanded";
62 } else {
63 if (ListView.view.count > 2) {
64 if (ListView.view.currentIndex == -1 && index == 1) {
65 result = "expanded";
66 } else {
67 result = "contracted";
68 }
69 } else {
70 result = "expanded";
71 }
72 }
73 }
75 return result;
76 }
78 Audio {
79 id: sound
80 objectName: "sound"
81 source: hints["suppress-sound"] != "true" && hints["sound-file"] != undefined ? hints["sound-file"] : ""
82 }
84 // FIXME: using onCompleted because of LP: #1354406 workaround, has to be onOpacityChanged really
85 Component.onCompleted: {
86 if (opacity == 1.0 && hints["suppress-sound"] != "true" && sound.source != "") {
87 sound.play();
88 }
89 }
91 Behavior on x {
92 id: normalXBehavior
94 enabled: draggable
95 UbuntuNumberAnimation {
96 duration: UbuntuAnimation.FastDuration
97 easing.type: Easing.OutBounce
98 }
99 }
101 Behavior on height {
102 id: normalHeightBehavior
104 //enabled: menuItemFactory.progress == 1
105 enabled: true
106 SequentialAnimation {
107 PauseAnimation {
108 duration: UbuntuAnimation.SnapDuration
109 }
110 UbuntuNumberAnimation {
111 duration: UbuntuAnimation.SnapDuration
112 }
113 }
114 }
116 states:[
117 State {
118 name: "contracted"
119 PropertyChanges {target: notification; height: units.gu(10)}
120 },
121 State {
122 name: "expanded"
123 PropertyChanges {target: notification; height: implicitHeight}
124 }
125 ]
127 clip: fullscreen ? false : true
129 visible: type != Notification.PlaceHolder
131 UbuntuShape {
132 id: shapedBack
134 visible: !fullscreen
135 anchors {
136 fill: parent
137 leftMargin: notification.margins
138 rightMargin: notification.margins
139 }
140 color: parent.color
141 opacity: parent.opacity
142 radius: "medium"
143 borderSource: "none"
144 }
146 Rectangle {
147 id: nonShapedBack
149 visible: fullscreen
150 anchors.fill: parent
151 color: parent.color
152 opacity: parent.opacity
153 }
155 onXChanged: {
156 if (draggable && notification.x > 0.75 * notification.width) {
157 notification.notification.close()
158 }
159 }
161 Item {
162 id: contents
163 anchors.fill: fullscreen ? nonShapedBack : shapedBack
165 UnityMenuModelPaths {
166 id: paths
168 source: hints["x-canonical-private-menu-model"]
170 busNameHint: "busName"
171 actionsHint: "actions"
172 menuObjectPathHint: "menuPath"
173 }
175 UnityMenuModel {
176 id: unityMenuModel
178 property string lastNameOwner: ""
180 busName: paths.busName
181 actions: paths.actions
182 menuObjectPath: paths.menuObjectPath
183 onNameOwnerChanged: {
184 if (lastNameOwner != "" && nameOwner == "" && notification.notification != undefined) {
185 notification.notification.close()
186 }
187 lastNameOwner = nameOwner
188 }
189 }
191 Behavior on implicitHeight {
192 id: heightBehavior
194 enabled: false
195 UbuntuNumberAnimation {
196 duration: UbuntuAnimation.SnapDuration
197 }
198 }
200 // delay enabling height behavior until the add transition is complete
201 onOpacityChanged: if (opacity == 1) heightBehavior.enabled = true
203 MouseArea {
204 id: interactiveArea
206 anchors.fill: parent
207 objectName: "interactiveArea"
209 drag.target: draggable ? notification : undefined
210 drag.axis: Drag.XAxis
211 drag.minimumX: 0
212 drag.maximumX: notification.width
214 onClicked: {
215 if (notification.type == Notification.Interactive) {
216 notification.notification.invokeAction(actionRepeater.itemAt(0).actionId)
217 } else {
218 notificationList.currentIndex = index;
219 }
220 }
221 onPressed: {
222 if (draggable) {
223 notification.anchors.left = undefined
224 notification.anchors.right = undefined
225 }
226 }
227 onReleased: {
228 if (notification.x < notification.width / 2) {
229 notification.x = 0
230 } else {
231 notification.x = notification.width
232 }
233 }
234 }
236 Column {
237 id: outterColumn
239 anchors {
240 left: parent.left
241 right: parent.right
242 top: parent.top
243 margins: 0
244 topMargin: fullscreen ? 0 : units.gu(2)
245 }
247 spacing: units.gu(2)
249 Row {
250 id: topRow
252 spacing: contentSpacing
253 anchors {
254 left: parent.left
255 right: parent.right
256 margins: contentSpacing
257 }
259 ShapedIcon {
260 id: icon
262 objectName: "icon"
263 width: type == Notification.Ephemeral && !bodyLabel.visible ? units.gu(3) : units.gu(6)
264 height: width
265 shaped: notification.hints["x-canonical-non-shaped-icon"] == "true" ? false : true
266 visible: iconSource !== undefined && iconSource != ""
267 }
269 Column {
270 id: labelColumn
271 width: secondaryIcon.visible ? parent.width - x - units.gu(4.5) : parent.width - x
273 anchors.verticalCenter: (icon.visible && !bodyLabel.visible) ? icon.verticalCenter : undefined
275 Label {
276 id: summaryLabel
278 objectName: "summaryLabel"
279 anchors {
280 left: parent.left
281 right: parent.right
282 }
283 fontSize: "medium"
284 color: type == Notification.SnapDecision ? sdFontColor : Theme.palette.selected.backgroundText
285 elide: Text.ElideRight
286 textFormat: Text.PlainText
287 }
289 Label {
290 id: bodyLabel
292 objectName: "bodyLabel"
293 anchors {
294 left: parent.left
295 right: parent.right
296 }
297 visible: body != ""
298 fontSize: "small"
299 color: type == Notification.SnapDecision ? sdFontColor : Theme.palette.selected.backgroundText
300 wrapMode: Text.WordWrap
301 maximumLineCount: type == Notification.SnapDecision ? 12 : 2
302 elide: Text.ElideRight
303 textFormat: Text.PlainText
304 }
305 }
307 Image {
308 id: secondaryIcon
310 objectName: "secondaryIcon"
311 width: units.gu(3)
312 height: units.gu(3)
313 visible: status === Image.Ready
314 fillMode: Image.PreserveAspectCrop
315 }
316 }
318 ListItem.ThinDivider {
319 visible: type == Notification.SnapDecision
320 }
322 Column {
323 id: dialogColumn
324 objectName: "dialogListView"
325 spacing: units.gu(2)
327 visible: count > 0
329 anchors {
330 left: parent.left
331 right: parent.right
332 top: fullscreen ? parent.top : undefined
333 bottom: fullscreen ? parent.bottom : undefined
334 }
336 Repeater {
337 model: unityMenuModel
339 NotificationMenuItemFactory {
340 id: menuItemFactory
342 anchors {
343 left: dialogColumn.left
344 right: dialogColumn.right
345 }
347 menuModel: unityMenuModel
348 menuData: model
349 menuIndex: index
350 maxHeight: notification.maxHeight
352 onLoaded: {
353 notification.fullscreen = Qt.binding(function() { return fullscreen; });
354 }
355 onAccepted: {
356 notification.notification.invokeAction(actionRepeater.itemAt(0).actionId)
357 }
358 }
359 }
360 }
362 Column {
363 id: oneOverTwoCase
365 anchors {
366 left: parent.left
367 right: parent.right
368 margins: contentSpacing
369 }
371 spacing: contentSpacing
373 visible: notification.type == Notification.SnapDecision && oneOverTwoRepeaterTop.count == 3
375 Repeater {
376 id: oneOverTwoRepeaterTop
378 model: notification.actions
379 delegate: Loader {
380 id: oneOverTwoLoaderTop
382 property string actionId: id
383 property string actionLabel: label
385 Component {
386 id: oneOverTwoButtonTop
388 Button {
389 objectName: "notify_oot_button" + index
390 width: oneOverTwoCase.width
391 text: oneOverTwoLoaderTop.actionLabel
392 color: notification.hints["x-canonical-private-affirmative-tint"] == "true" ? green : sdDarkGrey
393 onClicked: notification.notification.invokeAction(oneOverTwoLoaderTop.actionId)
394 }
395 }
396 sourceComponent: index == 0 ? oneOverTwoButtonTop : undefined
397 }
398 }
400 Row {
401 spacing: contentSpacing
403 Repeater {
404 id: oneOverTwoRepeaterBottom
406 model: notification.actions
407 delegate: Loader {
408 id: oneOverTwoLoaderBottom
410 property string actionId: id
411 property string actionLabel: label
413 Component {
414 id: oneOverTwoButtonBottom
416 Button {
417 objectName: "notify_oot_button" + index
418 width: oneOverTwoCase.width / 2 - spacing * 2
419 text: oneOverTwoLoaderBottom.actionLabel
420 color: index == 1 && notification.hints["x-canonical-private-rejection-tint"] == "true" ? red : sdDarkGrey
421 onClicked: notification.notification.invokeAction(oneOverTwoLoaderBottom.actionId)
422 }
423 }
424 sourceComponent: (index == 1 || index == 2) ? oneOverTwoButtonBottom : undefined
425 }
426 }
427 }
428 }
430 Row {
431 id: buttonRow
433 objectName: "buttonRow"
434 anchors {
435 left: parent.left
436 right: parent.right
437 margins: contentSpacing
438 }
439 visible: notification.type == Notification.SnapDecision && actionRepeater.count > 0 && !oneOverTwoCase.visible
440 spacing: units.gu(2)
441 layoutDirection: Qt.RightToLeft
443 Repeater {
444 id: actionRepeater
446 model: notification.actions
447 delegate: Loader {
448 id: loader
450 property string actionId: id
451 property string actionLabel: label
453 Component {
454 id: actionButton
456 Button {
457 objectName: "notify_button" + index
458 width: buttonRow.width / 2 - spacing*2
459 text: loader.actionLabel
460 color: {
461 var result = sdDarkGrey;
462 if (index == 0 && notification.hints["x-canonical-private-affirmative-tint"] == "true") {
463 result = green;
464 }
465 if (index == 1 && notification.hints["x-canonical-private-rejection-tint"] == "true") {
466 result = red;
467 }
468 return result;
469 }
470 onClicked: notification.notification.invokeAction(loader.actionId)
471 }
472 }
473 sourceComponent: (index == 0 || index == 1) ? actionButton : undefined
474 }
475 }
476 }
478 ComboButton {
479 id: comboButton
481 objectName: "notify_button2"
482 width: parent.width
483 anchors {
484 left: parent.left
485 right: parent.right
486 margins: contentSpacing
487 }
489 visible: notification.type == Notification.SnapDecision && actionRepeater.count > 3 && !oneOverTwoCase.visible
490 color: sdDarkGrey
491 onClicked: notification.notification.invokeAction(comboRepeater.itemAt(2).actionId)
492 expanded: false
493 expandedHeight: (comboRepeater.count - 2) * units.gu(4) + units.gu(.5)
494 comboList: Flickable {
495 // this has to be wrapped inside a flickable
496 // to work around a feature/bug? of the
497 // ComboButton SDK-element, making a regular
498 // unwrapped Column item flickable
499 // see LP: #1332590
500 interactive: false
501 Column {
502 Repeater {
503 id: comboRepeater
505 onVisibleChanged: {
506 comboButton.text = comboRepeater.count >= 3 ? comboRepeater.itemAt(2).actionLabel : ""
507 }
509 model: notification.actions
510 delegate: Loader {
511 id: comboLoader
513 asynchronous: true
514 visible: status == Loader.Ready
515 property string actionId: id
516 property string actionLabel: label
517 readonly property var splitLabel: actionLabel.match(/(^([-a-z0-9]+):)?(.*)$/)
518 Component {
519 id: comboEntry
521 MouseArea {
522 id: comboInputArea
524 objectName: "notify_button" + index
525 width: comboButton.width
526 height: comboIcon.height + units.gu(2)
528 onClicked: {
529 notification.notification.invokeAction(actionId)
530 }
532 ListItem.ThinDivider {
533 visible: index > 3
534 }
536 Icon {
537 id: comboIcon
539 anchors {
540 left: parent.left
541 leftMargin: units.gu(.5)
542 verticalCenter: parent.verticalCenter
543 }
544 width: units.gu(2)
545 height: units.gu(2)
546 color: sdFontColor
547 name: splitLabel[2]
548 }
550 Label {
551 id: comboLabel
553 anchors {
554 left: comboIcon.right
555 leftMargin: units.gu(1)
556 verticalCenter: comboIcon.verticalCenter
557 }
558 fontSize: "small"
559 color: sdFontColor
560 text: splitLabel[3]
561 }
562 }
563 }
564 sourceComponent: (index > 2) ? comboEntry : undefined
565 }
566 }
567 }
568 }
569 }
570 }
571 }