ab14a23c019240818a5200f3879880e93af9fafd
[apps/homescreen.git] / homescreen / qml / StatusArea.qml
1 /*
2  * Copyright (C) 2016 The Qt Company Ltd.
3  * Copyright (C) 2016, 2017 Mentor Graphics Development (Deutschland) GmbH
4  *
5  * Licensed under the Apache License, Version 2.0 (the "License");
6  * you may not use this file except in compliance with the License.
7  * You may obtain a copy of the License at
8  *
9  *      http://www.apache.org/licenses/LICENSE-2.0
10  *
11  * Unless required by applicable law or agreed to in writing, software
12  * distributed under the License is distributed on an "AS IS" BASIS,
13  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14  * See the License for the specific language governing permissions and
15  * limitations under the License.
16  */
17
18 import QtQuick 2.2
19 import QtQuick.Layouts 1.1
20 import HomeScreen 1.0
21
22 Item {
23     id: root
24     width: 295
25     height: 218
26
27     property date now: new Date
28     Timer {
29         interval: 100; running: true; repeat: true;
30         onTriggered: root.now = new Date
31     }
32
33     Connections {
34         target: weather
35
36         onConditionChanged: {
37             var icon = ''
38
39             if (condition.indexOf("clouds") != -1) {
40                 icon = "WeatherIcons_Cloudy-01.png"
41             } else if (condition.indexOf("thunderstorm") != -1) {
42                 icon = "WeatherIcons_Thunderstorm-01.png"
43             } else if (condition.indexOf("snow") != -1) {
44                 icon = "WeatherIcons_Snow-01.png"
45             } else if (condition.indexOf("rain") != -1) {
46                 icon = "WeatherIcons_Rain-01.png"
47             }
48
49             condition_item.source = icon ? './images/Weather/' + icon : ''
50         }
51
52         onTemperatureChanged: {
53             temperature_item.text = temperature.split(".")[0] + '°F'
54         }
55     }
56
57     RowLayout {
58         anchors.fill: parent
59         spacing: 0
60         Item {
61             Layout.fillWidth: true
62             Layout.fillHeight: true
63             Layout.preferredWidth: 295 - 76
64             ColumnLayout {
65                 anchors.fill: parent
66                 anchors.margins: 40
67                 spacing: 0
68                 Text {
69                     Layout.fillWidth: true
70                     Layout.fillHeight: true
71                     text: Qt.formatDate(now, 'dddd').toUpperCase()
72                     font.family: 'Roboto'
73                     font.pixelSize: 13
74                     color: 'white'
75                     verticalAlignment:  Text.AlignVCenter
76 //                    Rectangle {
77 //                        anchors.fill: parent
78 //                        anchors.margins: 5
79 //                        color: 'red'
80 //                        border.color: 'blue'
81 //                        border.width: 1
82 //                        z: -1
83 //                    }
84                 }
85                 Text {
86                     Layout.fillWidth: true
87                     Layout.fillHeight: true
88                     text: Qt.formatTime(now, 'h:mm ap').toUpperCase()
89                     font.family: 'Roboto'
90                     font.pixelSize: 40
91                     color: 'white'
92                     horizontalAlignment:  Text.AlignHCenter
93                     verticalAlignment:  Text.AlignVCenter
94                 }
95                 RowLayout {
96                     Layout.fillWidth: true
97                     Layout.fillHeight: true
98                     Layout.preferredHeight: 20
99                     Image {
100                         id: condition_item
101                         source: './images/Weather/WeatherIcons_Rain-01.png'
102                     }
103                     Text {
104                         id: temperature_item
105                         text: '64°F'
106                         color: 'white'
107                         font.family: 'Helvetica'
108                         font.pixelSize: 32
109                     }
110                 }
111             }
112         }
113         ColumnLayout {
114             id: icons
115             Layout.fillWidth: true
116             Layout.fillHeight: true
117             Layout.preferredWidth: 76
118             spacing: -10
119             Repeater {
120                 model: StatusBarModel {}
121                 delegate: Image {
122                     Layout.preferredWidth: 77
123                     Layout.preferredHeight: 73
124                     source: model.modelData
125                     fillMode: Image.PreserveAspectFit
126                 }
127             }
128         }
129     }
130 }