← Back to branch summary

~mterry/+junk/u8.2

« back to all changes in this revision

Viewing changes to qml/Notifications/Notification.qml

  • Committer: Michael Terry
  • Date: 2014-11-17 14:56:04 UTC
  • mfrom: (1317.1.118 unity8)
  • Revision ID: michael.terry@canonical.com-20141117145604-96dn9p5nwkifq2f4
Merge from trunk

Show diffs side-by-side

added added

removed removed

Lines of Context:
qml/Notifications/Notification.qml
20
20
import Unity.Notifications 1.0
21
21
import QMenuModel 0.1
22
22
import Utils 0.1
23
 
import "../Components/Flickables" as Flickables
24
23
 
25
24
import Ubuntu.Components.ListItems 0.1 as ListItem
26
25
 
31
30
    property alias secondaryIconSource: secondaryIcon.source
32
31
    property alias summary: summaryLabel.text
33
32
    property alias body: bodyLabel.text
 
33
    property alias value: valueIndicator.value
34
34
    property var actions
35
35
    property var notificationId
36
36
    property var type
40
40
    property bool fullscreen: false
41
41
    property int maxHeight
42
42
    property int margins
 
43
    readonly property bool darkOnBright: panel.indicators.shown || type === Notification.SnapDecision
43
44
    readonly property color red: "#fc4949"
44
45
    readonly property color green: "#3fb24f"
45
46
    readonly property color sdLightGrey: "#eaeaea"
48
49
    readonly property real contentSpacing: units.gu(2)
49
50
 
50
51
    objectName: "background"
51
 
    implicitHeight: type !== Notification.PlaceHolder ? (fullscreen ? maxHeight : outterColumn.height + contentSpacing * 2) : 0
 
52
    implicitHeight: type !== Notification.PlaceHolder ? (fullscreen ? maxHeight : outterColumn.height - shapedBack.anchors.topMargin + contentSpacing * 2) : 0
52
53
 
53
 
    color: type == Notification.SnapDecision ? sdLightGrey : Qt.rgba(0.132, 0.117, 0.109, 0.97)
 
54
    color: (type === Notification.Confirmation && notificationList.useModal && !greeter.shown) || darkOnBright ? sdLightGrey : Qt.rgba(0.132, 0.117, 0.109, 0.97)
54
55
    opacity: 1 // FIXME: 1 because of LP: #1354406 workaround, has to be 0 really
55
56
 
56
57
    state: {
78
79
    Audio {
79
80
        id: sound
80
81
        objectName: "sound"
 
82
        audioRole: MediaPlayer.alert
81
83
        source: hints["suppress-sound"] != "true" && hints["sound-file"] != undefined ? hints["sound-file"] : ""
82
84
    }
83
85
 
88
90
        }
89
91
    }
90
92
 
 
93
    onHintsChanged: {
 
94
        if (type === Notification.Confirmation && opacity == 1.0 && hints["suppress-sound"] != "true" && sound.source != "") {
 
95
            sound.play();
 
96
        }
 
97
    }
 
98
 
91
99
    Behavior on height {
92
100
        id: normalHeightBehavior
93
101
 
94
102
        //enabled: menuItemFactory.progress == 1
95
103
        enabled: true
96
 
        SequentialAnimation {
97
 
            PauseAnimation {
98
 
                duration: UbuntuAnimation.SnapDuration
99
 
            }
100
 
            UbuntuNumberAnimation {
101
 
                duration: UbuntuAnimation.SnapDuration
102
 
            }
 
104
        UbuntuNumberAnimation {
 
105
            duration: UbuntuAnimation.SnapDuration
103
106
        }
104
107
    }
105
108
 
126
129
            fill: parent
127
130
            leftMargin: notification.margins
128
131
            rightMargin: notification.margins
 
132
            topMargin: type === Notification.Confirmation ? units.gu(.5) : 0
129
133
        }
130
134
        color: parent.color
131
135
        opacity: parent.opacity
172
176
            }
173
177
        }
174
178
 
175
 
        Behavior on implicitHeight {
176
 
            id: heightBehavior
177
 
 
178
 
            enabled: false
179
 
            UbuntuNumberAnimation {
180
 
                duration: UbuntuAnimation.SnapDuration
181
 
            }
182
 
        }
183
 
 
184
 
        // delay enabling height behavior until the add transition is complete
185
 
        onOpacityChanged: if (opacity == 1) heightBehavior.enabled = true
186
 
 
187
179
        MouseArea {
188
180
            id: interactiveArea
189
181
 
206
198
                right: parent.right
207
199
                top: parent.top
208
200
                margins: 0
209
 
                topMargin: fullscreen ? 0 : units.gu(2)
 
201
                topMargin: fullscreen ? 0 : type === Notification.Confirmation ? units.gu(1) : units.gu(2)
210
202
            }
211
203
 
212
 
            spacing: units.gu(2)
 
204
            spacing: type === Notification.Confirmation ? units.gu(1) : units.gu(2)
213
205
 
214
206
            Row {
215
207
                id: topRow
228
220
                    width: type == Notification.Ephemeral && !bodyLabel.visible ? units.gu(3) : units.gu(6)
229
221
                    height: width
230
222
                    shaped: notification.hints["x-canonical-non-shaped-icon"] == "true" ? false : true
231
 
                    visible: iconSource !== undefined && iconSource != ""
 
223
                    visible: iconSource !== undefined && iconSource !== "" && type !== Notification.Confirmation
232
224
                }
233
225
 
234
226
                Column {
245
237
                            left: parent.left
246
238
                            right: parent.right
247
239
                        }
 
240
                        visible: type !== Notification.Confirmation
248
241
                        fontSize: "medium"
249
 
                        color: type == Notification.SnapDecision ? sdFontColor : Theme.palette.selected.backgroundText
 
242
                        color: darkOnBright ? sdFontColor : Theme.palette.selected.backgroundText
250
243
                        elide: Text.ElideRight
251
244
                        textFormat: Text.PlainText
252
245
                    }
259
252
                            left: parent.left
260
253
                            right: parent.right
261
254
                        }
262
 
                        visible: body != ""
 
255
                        visible: body != "" && type !== Notification.Confirmation
263
256
                        fontSize: "small"
264
 
                        color: type == Notification.SnapDecision ? sdFontColor : Theme.palette.selected.backgroundText
 
257
                        color: darkOnBright ? sdFontColor : Theme.palette.selected.backgroundText
265
258
                        wrapMode: Text.WordWrap
266
259
                        maximumLineCount: type == Notification.SnapDecision ? 12 : 2
267
260
                        elide: Text.ElideRight
284
277
                visible: type == Notification.SnapDecision
285
278
            }
286
279
 
 
280
            ShapedIcon {
 
281
                id: centeredIcon
 
282
                objectName: "centeredIcon"
 
283
                width: units.gu(5)
 
284
                height: width
 
285
                shaped: notification.hints["x-canonical-non-shaped-icon"] == "true" ? false : true
 
286
                fileSource: icon.fileSource
 
287
                visible: fileSource !== undefined && fileSource !== "" && type === Notification.Confirmation
 
288
                anchors.horizontalCenter: parent.horizontalCenter
 
289
            }
 
290
 
 
291
            Label {
 
292
                id: valueLabel
 
293
                objectName: "valueLabel"
 
294
                text: body
 
295
                anchors.horizontalCenter: parent.horizontalCenter
 
296
                visible: type === Notification.Confirmation && body !== ""
 
297
                fontSize: "medium"
 
298
                color: darkOnBright ? sdFontColor : Theme.palette.selected.backgroundText
 
299
                wrapMode: Text.WordWrap
 
300
                maximumLineCount: 1
 
301
                elide: Text.ElideRight
 
302
                textFormat: Text.PlainText
 
303
            }
 
304
 
 
305
            UbuntuShape {
 
306
                id: valueIndicator
 
307
                objectName: "valueIndicator"
 
308
                visible: type === Notification.Confirmation
 
309
                property double value
 
310
 
 
311
                anchors {
 
312
                    left: parent.left
 
313
                    right: parent.right
 
314
                    margins: contentSpacing
 
315
                }
 
316
 
 
317
                height: units.gu(1)
 
318
                color: darkOnBright ? UbuntuColors.darkGrey : UbuntuColors.lightGrey
 
319
                borderSource: "none"
 
320
                radius: "small"
 
321
 
 
322
                UbuntuShape {
 
323
                    id: innerBar
 
324
                    objectName: "innerBar"
 
325
                    width: valueIndicator.width * valueIndicator.value / 100
 
326
                    height: units.gu(1)
 
327
                    color: notification.hints["x-canonical-value-bar-tint"] === "true" ? UbuntuColors.orange : darkOnBright ? UbuntuColors.lightGrey : "white"
 
328
                    borderSource: "none"
 
329
                    radius: "small"
 
330
                }
 
331
            }
 
332
 
287
333
            Column {
288
334
                id: dialogColumn
289
335
                objectName: "dialogListView"
335
381
 
336
382
                spacing: contentSpacing
337
383
 
338
 
                visible: notification.type == Notification.SnapDecision && oneOverTwoRepeaterTop.count == 3
 
384
                visible: notification.type === Notification.SnapDecision && oneOverTwoRepeaterTop.count === 3
339
385
 
340
386
                Repeater {
341
387
                    id: oneOverTwoRepeaterTop
405
451
                spacing: units.gu(2)
406
452
                layoutDirection: Qt.RightToLeft
407
453
 
 
454
                Loader {
 
455
                    id: notifySwipeButtonLoader
 
456
                    active: notification.hints["x-canonical-snap-decisions-swipe"] === "true"
 
457
 
 
458
                    sourceComponent: SwipeToAct  {
 
459
                        objectName: "notify_swipe_button"
 
460
                        width: buttonRow.width
 
461
                        leftIconName: "call-end"
 
462
                        rightIconName: "call-start"
 
463
                        onRightTriggered: {
 
464
                            notification.notification.invokeAction(notification.actions.data(0, ActionModel.RoleActionId))
 
465
                        }
 
466
 
 
467
                        onLeftTriggered: {
 
468
                            notification.notification.invokeAction(notification.actions.data(1, ActionModel.RoleActionId))
 
469
                        }
 
470
                    }
 
471
                }
 
472
 
408
473
                Repeater {
409
474
                    id: actionRepeater
410
 
 
411
475
                    model: notification.actions
412
476
                    delegate: Loader {
413
477
                        id: loader
414
478
 
415
479
                        property string actionId: id
416
480
                        property string actionLabel: label
 
481
                        active: !notifySwipeButtonLoader.active
417
482
 
418
483
                        Component {
419
484
                            id: actionButton
420
485
 
421
486
                            Button {
422
487
                                objectName: "notify_button" + index
423
 
                                width: buttonRow.width / 2 - spacing*2
 
488
                                width: buttonRow.width / 2 - spacing * 2
424
489
                                text: loader.actionLabel
425
490
                                color: {
426
491
                                    var result = sdDarkGrey;
440
505
                }
441
506
            }
442
507
 
443
 
            ComboButton {
444
 
                id: comboButton
445
 
 
 
508
            OptionToggle {
 
509
                id: optionToggle
446
510
                objectName: "notify_button2"
447
511
                width: parent.width
448
512
                anchors {
452
516
                }
453
517
 
454
518
                visible: notification.type == Notification.SnapDecision && actionRepeater.count > 3 && !oneOverTwoCase.visible
455
 
                color: sdDarkGrey
456
 
                onClicked: notification.notification.invokeAction(comboRepeater.itemAt(2).actionId)
 
519
                model: notification.actions
457
520
                expanded: false
458
 
                expandedHeight: (comboRepeater.count - 2) * units.gu(4) + units.gu(.5)
459
 
                comboList: Flickables.Flickable {
460
 
                    // this has to be wrapped inside a flickable
461
 
                    // to work around a feature/bug? of the
462
 
                    // ComboButton SDK-element, making a regular
463
 
                    // unwrapped Column item flickable
464
 
                    // see LP: #1332590
465
 
                    interactive: false
466
 
                    Column {
467
 
                        Repeater {
468
 
                            id: comboRepeater
469
 
 
470
 
                            onVisibleChanged: {
471
 
                                comboButton.text = comboRepeater.count >= 3 ? comboRepeater.itemAt(2).actionLabel : ""
472
 
                            }
473
 
 
474
 
                            model: notification.actions
475
 
                            delegate: Loader {
476
 
                                id: comboLoader
477
 
 
478
 
                                asynchronous: true
479
 
                                visible: status == Loader.Ready
480
 
                                property string actionId: id
481
 
                                property string actionLabel: label
482
 
                                readonly property var splitLabel: actionLabel.match(/(^([-a-z0-9]+):)?(.*)$/)
483
 
                                Component {
484
 
                                    id: comboEntry
485
 
 
486
 
                                    MouseArea {
487
 
                                        id: comboInputArea
488
 
 
489
 
                                        objectName: "notify_button" + index
490
 
                                        width: comboButton.width
491
 
                                        height: comboIcon.height + units.gu(2)
492
 
 
493
 
                                        onClicked: {
494
 
                                            notification.notification.invokeAction(actionId)
495
 
                                        }
496
 
 
497
 
                                        ListItem.ThinDivider {
498
 
                                            visible: index > 3
499
 
                                        }
500
 
 
501
 
                                        Icon {
502
 
                                            id: comboIcon
503
 
 
504
 
                                            anchors {
505
 
                                                left: parent.left
506
 
                                                leftMargin: units.gu(.5)
507
 
                                                verticalCenter: parent.verticalCenter
508
 
                                            }
509
 
                                            width: units.gu(2)
510
 
                                            height: units.gu(2)
511
 
                                            color: sdFontColor
512
 
                                            name: splitLabel[2]
513
 
                                        }
514
 
 
515
 
                                        Label {
516
 
                                            id: comboLabel
517
 
 
518
 
                                            anchors {
519
 
                                                left: comboIcon.right
520
 
                                                leftMargin: units.gu(1)
521
 
                                                verticalCenter: comboIcon.verticalCenter
522
 
                                            }
523
 
                                            fontSize: "small"
524
 
                                            color: sdFontColor
525
 
                                            text: splitLabel[3]
526
 
                                        }
527
 
                                    }
528
 
                                }
529
 
                                sourceComponent: (index > 2) ? comboEntry : undefined
530
 
                            }
531
 
                        }
532
 
                    }
 
521
                startIndex: 2
 
522
                onTriggered: {
 
523
                    notification.notification.invokeAction(id)
533
524
                }
534
525
            }
535
526
        }