meson.build: Use 0.0.24 as the agl compositor version
[apps/homescreen.git] / homescreen / qml / MediaAreaBlank.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 QtQuick.Controls 2.0
21 import AGL.Demo.Controls 1.0
22 import MasterVolume 1.0
23
24 Image {
25     anchors.fill: parent
26     source: './images/Utility_Logo_Background-01.svg'
27     property bool displayVolume: false;
28
29     MouseArea {
30         anchors.fill: parent
31         function enableVolumeDisplay() {
32             if (!displayVolume) {
33                 displayVolume = true
34                 master_volume.visible = true
35                 volume_timer.restart()
36             }
37         }
38         onClicked: enableVolumeDisplay()
39     }
40
41     Image {
42         id: logo_image
43         anchors.centerIn: parent
44         source: './images/Utility_Logo_Grey-01.svg'
45     }
46
47     Timer {
48         id: volume_timer
49         interval: 3000; running: false; repeat: false
50         onTriggered: displayVolume = false
51     }
52
53     states: [
54     State { when: displayVolume;
55     PropertyChanges { target: master_volume; opacity: 1.0 }
56     PropertyChanges { target: slider; enabled: true }
57     PropertyChanges { target: logo_image; opacity: 0.0 }
58     },
59     State { when: !displayVolume;
60     PropertyChanges { target: master_volume; opacity: 0.0 }
61     PropertyChanges { target: slider; enabled: false }
62     PropertyChanges { target: logo_image; opacity: 1.0 }
63     }
64     ]
65
66     transitions: Transition {
67     NumberAnimation { property: "opacity"; duration: 500}
68     }
69
70     MasterVolume {
71         id: mv
72         objectName: "mv"
73         onVolumeChanged: slider.value = volume
74     }
75
76     Item {
77         id: master_volume
78         anchors.fill: parent
79         anchors.centerIn: parent
80         visible: false
81
82         Label {
83             font.pixelSize: 36
84             anchors.horizontalCenter: parent.horizontalCenter
85             color: "white"
86             text: qsTr("Master Volume")
87         }
88
89         RowLayout {
90             anchors.fill: parent
91             anchors.centerIn: parent
92             anchors.margins: 20
93             spacing: 20
94             Label {
95                 font.pixelSize: 36
96                 color: "white"
97                 text: "0 %"
98             }
99             Slider {
100                 id: slider
101                 Layout.fillWidth: true
102                 from: 0
103                 to: 100
104                 stepSize: 1
105                 snapMode: Slider.SnapOnRelease
106                 onValueChanged: mv.volume = value
107                 Component.onCompleted: value = mv.volume
108
109                 onPressedChanged: {
110                     if (pressed) {volume_timer.stop()}
111                     else {volume_timer.restart()}
112                 }
113             }
114             Label {
115                 font.pixelSize: 36
116                 color: "white"
117                 text: "100 %"
118             }
119         }
120     }
121 }