← Back to branch summary

~gerboland/unity/8-refactor-wm-and-test

« back to all changes in this revision

Viewing changes to Dash/People/CarouselDelegatePeople.qml

  • Committer: Michał Sawicz
  • Date: 2013-06-05 22:03:08 UTC
  • Revision ID: michal.sawicz@canonical.com-20130605220308-yny8fv3futtr04fg
Inital unity8 commit.

Previous history can be found at https://code.launchpad.net/~unity-team/unity/phablet

Show diffs side-by-side

added added

removed removed

Lines of Context:
Dash/People/CarouselDelegatePeople.qml
 
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
 */
 
16
 
 
17
import QtQuick 2.0
 
18
import Ubuntu.Components 0.1
 
19
import "../../Components"
 
20
 
 
21
BaseCarouselDelegate {
 
22
    id: item
 
23
 
 
24
    property var dataModel
 
25
    readonly property real frameHeight: Math.max(height / 3.6, units.gu(5.5))
 
26
 
 
27
    UbuntuShape {
 
28
        anchors.fill: parent
 
29
        radius: "medium"
 
30
        borderSource: ""
 
31
        image: Image {
 
32
            asynchronous: true
 
33
            sourceSize { width: item.width; height: item.height }
 
34
            source: dataModel.avatar ? dataModel.avatar : ""
 
35
            fillMode: Image.PreserveAspectCrop
 
36
        }
 
37
    }
 
38
 
 
39
    Component {
 
40
        id: component_frame
 
41
        Item {
 
42
            id: frame
 
43
 
 
44
            BorderImage {
 
45
                // TODO This will go away once we have 'clip: true' in UbuntuShape
 
46
                anchors.centerIn: parent
 
47
                width: parent.width + units.gu(1.5)
 
48
                height: parent.height + units.gu(1.5)
 
49
                visible: labelRemotePost.visible
 
50
                opacity: 0.9
 
51
                source: "graphics/bottomshape.sci"
 
52
            }
 
53
 
 
54
            property bool showRemoteDetails: true
 
55
            // To decide if the remote icon and time should be shown, its once layed out to do so.
 
56
            // Then it's checked if everything fits in the frame size. If not, showRemoteDetails is set false
 
57
            // Using bindings to do so cause a binding loop
 
58
            function checkSizeForRemoteDetails() {
 
59
                showRemoteDetails = true
 
60
                showRemoteDetails = (frame.height - column.minimumHeight) >= labelRemotePostTime.height
 
61
            }
 
62
 
 
63
            Item {
 
64
                id: remoteSourceIconContainer
 
65
 
 
66
                // TODO use proper asset and get rid of these dimensions
 
67
                width: units.gu(3)
 
68
                height: units.gu(4)
 
69
                visible: showRemoteDetails
 
70
 
 
71
                Image {
 
72
                    anchors.centerIn: parent
 
73
                    anchors.horizontalCenterOffset: units.gu(1)
 
74
                    source: dataModel.remoteSourceIcon ? dataModel.remoteSourceIcon : ""
 
75
                    fillMode: Image.PreserveAspectFit
 
76
                }
 
77
            }
 
78
 
 
79
            Column {
 
80
                id: column
 
81
 
 
82
                property real minimumHeight: labelName.height + labelRemotePost.height + anchors.topMargin + anchors.bottomMargin
 
83
 
 
84
                anchors {
 
85
                    left: remoteSourceIconContainer.visible ? remoteSourceIconContainer.right : parent.left
 
86
                    right: parent.right
 
87
                    top: remoteSourceIconContainer.visible ? parent.top : undefined
 
88
                    verticalCenter: remoteSourceIconContainer.visible ? undefined : parent.verticalCenter
 
89
                    margins: units.gu(1)
 
90
                }
 
91
 
 
92
                Label {
 
93
                    id: labelName
 
94
 
 
95
                    width: parent.width
 
96
                    text: dataModel.name ? dataModel.name : ""
 
97
                    color: "white"
 
98
                    fontSize: "x-small"
 
99
                    elide: Text.ElideRight
 
100
                    font.weight: Font.Bold
 
101
                    onTextChanged: checkSizeForRemoteDetails()
 
102
                }
 
103
 
 
104
                Label {
 
105
                    id: labelRemotePost
 
106
 
 
107
                    width: parent.width
 
108
                    text: dataModel.remotePost ? dataModel.remotePost : ""
 
109
                    color: "white"
 
110
                    opacity: 0.8
 
111
                    fontSize: "xx-small"
 
112
                    elide: Text.ElideRight
 
113
                    maximumLineCount: 2
 
114
                    wrapMode: Text.WordWrap
 
115
                    onTextChanged: checkSizeForRemoteDetails()
 
116
                }
 
117
 
 
118
                Label {
 
119
                    id: labelRemotePostTime
 
120
 
 
121
                    width: parent.width
 
122
                    text: model.remotePostTime ? model.remotePostTime : ""
 
123
                    color: "white"
 
124
                    opacity: 0.5
 
125
                    fontSize: "xx-small"
 
126
                    elide: Text.ElideRight
 
127
                    visible: showRemoteDetails
 
128
                    onTextChanged: checkSizeForRemoteDetails()
 
129
                }
 
130
            }
 
131
 
 
132
            onHeightChanged: checkSizeForRemoteDetails()
 
133
            onWidthChanged: checkSizeForRemoteDetails()
 
134
            Component.onCompleted: checkSizeForRemoteDetails()
 
135
        }
 
136
    }
 
137
 
 
138
    Loader {
 
139
        id: loader_frame
 
140
 
 
141
        anchors {
 
142
            left: parent.left
 
143
            right: parent.right
 
144
            bottom: parent.bottom
 
145
        }
 
146
        height: item.frameHeight
 
147
        opacity: item.explicitlyScaled ? 1.0 : 0
 
148
 
 
149
        Behavior on opacity {
 
150
            NumberAnimation {
 
151
                duration: 250
 
152
                easing.type: Easing.InOutQuad
 
153
            }
 
154
        }
 
155
 
 
156
        sourceComponent: opacity > 0 ? component_frame : undefined
 
157
    }
 
158
 
 
159
    BorderImage {
 
160
        anchors.centerIn: parent
 
161
        opacity: 0.6
 
162
        source: "../../Components/graphics/non-selected.sci"
 
163
        width: parent.width + units.gu(1.5)
 
164
        height: parent.height + units.gu(1.5)
 
165
    }
 
166
}