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