502 lines
21 KiB
QML
502 lines
21 KiB
QML
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
|
|
*
|
|
* Copyright 2013 - 2020, nymea GmbH
|
|
* Contact: contact@nymea.io
|
|
*
|
|
* This file is part of nymea.
|
|
* This project including source code and documentation is protected by
|
|
* copyright law, and remains the property of nymea GmbH. All rights, including
|
|
* reproduction, publication, editing and translation, are reserved. The use of
|
|
* this project is subject to the terms of a license agreement to be concluded
|
|
* with nymea GmbH in accordance with the terms of use of nymea GmbH, available
|
|
* under https://nymea.io/license
|
|
*
|
|
* GNU General Public License Usage
|
|
* Alternatively, this project may be redistributed and/or modified under the
|
|
* terms of the GNU General Public License as published by the Free Software
|
|
* Foundation, GNU version 3. This project is distributed in the hope that it
|
|
* will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty
|
|
* of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General
|
|
* Public License for more details.
|
|
*
|
|
* You should have received a copy of the GNU General Public License along with
|
|
* this project. If not, see <https://www.gnu.org/licenses/>.
|
|
*
|
|
* For any further details and any questions please contact us under
|
|
* contact@nymea.io or see our FAQ/Licensing Information on
|
|
* https://nymea.io/license/faq
|
|
*
|
|
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
|
|
|
|
import QtQuick 2.9
|
|
import QtQuick.Controls 2.2
|
|
import QtQuick.Layouts 1.3
|
|
import Nymea 1.0
|
|
import QtQuick.Controls.Material 2.2
|
|
import "../components"
|
|
|
|
MainViewBase {
|
|
id: root
|
|
|
|
GridView {
|
|
id: groupsGridView
|
|
anchors.fill: parent
|
|
anchors.margins: app.margins / 2
|
|
|
|
|
|
readonly property int minTileWidth: 172
|
|
readonly property int tilesPerRow: root.width / minTileWidth
|
|
|
|
model: TagListModel {
|
|
tagsProxy: TagsProxyModel {
|
|
tags: engine.tagsManager.tags
|
|
filterTagId: "group-.*"
|
|
}
|
|
}
|
|
cellWidth: width / tilesPerRow
|
|
cellHeight: cellWidth
|
|
|
|
delegate: MainPageTile {
|
|
width: groupsGridView.cellWidth
|
|
height: groupsGridView.cellHeight
|
|
iconName: "../images/view-grid-symbolic.svg"
|
|
iconColor: app.accentColor
|
|
text: model.tagId.substring(6)
|
|
onClicked: {
|
|
pageStack.push(Qt.resolvedUrl("../grouping/GroupInterfacesPage.qml"), {groupTag: model.tagId})
|
|
}
|
|
|
|
// delegate: Item {
|
|
// id: groupDelegate
|
|
// width: groupsGridView.cellWidth
|
|
// height: groupsGridView.cellHeight
|
|
|
|
// Pane {
|
|
// anchors.fill: parent
|
|
// anchors.margins: app.margins / 2
|
|
// Material.elevation: 2
|
|
// padding: 0
|
|
|
|
// DevicesProxy {
|
|
// id: devicesInGroup
|
|
// engine: _engine
|
|
// filterTagId: model.tagId
|
|
// filterTagValue: model.value
|
|
// }
|
|
|
|
// contentItem: ColumnLayout {
|
|
|
|
// ColorIcon {
|
|
// name: "../images/view-grid-symbolic.svg"
|
|
// }
|
|
|
|
// Label {
|
|
// text: model
|
|
// }
|
|
// }
|
|
|
|
|
|
// InterfacesProxy {
|
|
// id: controlsInGroup
|
|
// shownInterfaces: ["light", "simpleclosable", "mediacontroller", "powersocket"]
|
|
// devicesProxyFilter: devicesInGroup
|
|
// showStates: true
|
|
// showActions: true
|
|
// }
|
|
// InterfacesProxy {
|
|
// id: sensorsInGroup
|
|
// shownInterfaces: ["temperaturesensor", "lightsensor", "presencesensor"]
|
|
// devicesProxyFilter: devicesInGroup
|
|
// showStates: true
|
|
// }
|
|
|
|
|
|
// contentItem: ItemDelegate {
|
|
// leftPadding: 0
|
|
// topPadding: 0
|
|
// rightPadding: 0
|
|
// bottomPadding: 0
|
|
|
|
// onClicked: {
|
|
// pageStack.push(Qt.resolvedUrl("../grouping/GroupInterfacesPage.qml"), {groupTag: model.tagId})
|
|
// }
|
|
|
|
// contentItem: ColumnLayout {
|
|
// Rectangle {
|
|
// Layout.fillWidth: true
|
|
// Layout.preferredHeight: 30
|
|
// color: Qt.rgba(app.foregroundColor.r, app.foregroundColor.g, app.foregroundColor.b, .05)
|
|
// Label {
|
|
// anchors.fill: parent
|
|
// verticalAlignment: Text.AlignVCenter
|
|
// anchors { leftMargin: app.margins; rightMargin: app.margins }
|
|
// text: model.tagId.substring(6)
|
|
// elide: Text.ElideRight
|
|
// }
|
|
// }
|
|
// Item {
|
|
// Layout.fillHeight: true
|
|
// Layout.fillWidth: true
|
|
|
|
// ColorIcon {
|
|
// anchors.centerIn: parent
|
|
// height: app.iconSize * 2
|
|
// width: height
|
|
// visible: controlsInGroup.count == 0
|
|
// color: app.accentColor
|
|
// name: "../images/view-grid-symbolic.svg"
|
|
// }
|
|
|
|
// ColumnLayout {
|
|
// anchors.fill: parent
|
|
|
|
// Repeater {
|
|
//// model: Math.min(controlsInGroup.count, parent.height / 50)
|
|
// model: controlsInGroup.count
|
|
// delegate: Loader {
|
|
// id: controlLoader
|
|
// Layout.fillWidth: true
|
|
// Layout.leftMargin: app.margins / 2
|
|
// Layout.rightMargin: app.margins / 2
|
|
// property string interfaceName: controlsInGroup.get(index).name
|
|
// sourceComponent: {
|
|
// switch (interfaceName) {
|
|
// case "simpleclosable":
|
|
// return closableDelegate
|
|
// case "light":
|
|
// return lightDelegate
|
|
// case "mediacontroller":
|
|
// return mediaControllerDelegate
|
|
// case "powersocket":
|
|
// return powerSocketDelegate
|
|
// }
|
|
// }
|
|
// Binding {
|
|
// target: controlLoader.item
|
|
// property: "devices"
|
|
// value: devicesInGroup
|
|
// }
|
|
// }
|
|
// }
|
|
// Item {
|
|
// Layout.fillHeight: true
|
|
// Layout.fillWidth: true
|
|
// }
|
|
// }
|
|
|
|
// }
|
|
// Rectangle {
|
|
// Layout.fillWidth: true
|
|
// Layout.preferredHeight: app.iconSize * 1.2
|
|
// color: Qt.rgba(app.foregroundColor.r, app.foregroundColor.g, app.foregroundColor.b, 0.05)
|
|
|
|
// RowLayout {
|
|
// anchors.fill: parent
|
|
|
|
// Repeater {
|
|
// model: sensorsInGroup
|
|
// delegate: Row {
|
|
// height: parent.height
|
|
|
|
// ColorIcon {
|
|
// height: app.iconSize * .8
|
|
// width: height
|
|
// name: app.interfaceToIcon(model.name)
|
|
// color: app.interfaceToColor(model.name)
|
|
// }
|
|
// DevicesProxy {
|
|
// id: innerProxy
|
|
// engine: _engine
|
|
// parentProxy: devicesInGroup
|
|
// shownInterfaces: [model.name]
|
|
// }
|
|
|
|
// Led {
|
|
// visible: ["presencesensor"].indexOf(model.name) >= 0
|
|
// state: {
|
|
// var stateName = null
|
|
// switch (model.name) {
|
|
// case "presencesensor":
|
|
// stateName = "isPresent"
|
|
// break;
|
|
// }
|
|
// if (!stateName) {
|
|
// return "off";
|
|
// }
|
|
// var ret = false;
|
|
// for (var i = 0; i < innerProxy.count; i++) {
|
|
// ret |= innerProxy.get(i).states.getState(innerProxy.get(i).deviceClass.stateTypes.findByName(stateName).id).value
|
|
// }
|
|
// return ret ? "on" : "off";
|
|
// }
|
|
// }
|
|
|
|
// Label {
|
|
// height: parent.height
|
|
// verticalAlignment: Text.AlignVCenter
|
|
// text: {
|
|
// var stateName = null;
|
|
// switch (model.name) {
|
|
// case "temperaturesensor":
|
|
// stateName = "temperature";
|
|
// break;
|
|
// case "lightsensor":
|
|
// stateName = "lightIntensity"
|
|
// break;
|
|
// }
|
|
// if (!stateName) {
|
|
// return "";
|
|
// }
|
|
|
|
// var ret = 0
|
|
// for (var i = 0; i < innerProxy.count; i++) {
|
|
// ret += innerProxy.get(i).states.getState(innerProxy.get(i).deviceClass.stateTypes.findByName(stateName).id).value
|
|
// }
|
|
// return (ret / innerProxy.count).toFixed(1)
|
|
// }
|
|
// }
|
|
// }
|
|
// }
|
|
// }
|
|
// }
|
|
// }
|
|
// }
|
|
// }
|
|
}
|
|
}
|
|
|
|
Component {
|
|
id: powerSocketDelegate
|
|
RowLayout {
|
|
property var devices
|
|
|
|
Layout.alignment: Layout.Right
|
|
|
|
DevicesProxy {
|
|
id: sockets
|
|
engine: _engine
|
|
parentProxy: devices
|
|
shownInterfaces: ["powersocket"]
|
|
}
|
|
|
|
ColorIcon {
|
|
Layout.preferredHeight: app.iconSize
|
|
Layout.preferredWidth: app.iconSize
|
|
name: "../images/powersocket.svg"
|
|
color: isOn ? app.accentColor : keyColor
|
|
|
|
property bool isOn: {
|
|
for (var i = 0; i < sockets.count; i++) {
|
|
var device = sockets.get(i)
|
|
var powerId = device.deviceClass.stateTypes.findByName("power").id
|
|
if (device.states.getState(powerId).value === true) {
|
|
return true
|
|
}
|
|
}
|
|
return false;
|
|
}
|
|
|
|
MouseArea {
|
|
anchors.fill: parent
|
|
onClicked: {
|
|
for (var i = 0; i < sockets.count; i++) {
|
|
var device = sockets.get(i)
|
|
var powerId = device.deviceClass.stateTypes.findByName("power").id
|
|
engine.deviceManager.executeAction(device.id, powerId, [{paramTypeId: powerId, value: !parent.isOn}])
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
Component {
|
|
id: lightDelegate
|
|
RowLayout {
|
|
property var devices
|
|
|
|
DevicesProxy {
|
|
id: lights
|
|
engine: _engine
|
|
parentProxy: devices
|
|
shownInterfaces: ["light"]
|
|
}
|
|
|
|
DevicesProxy {
|
|
id: dimmableLights
|
|
engine: _engine
|
|
parentProxy: devices
|
|
shownInterfaces: ["dimmablelight"]
|
|
}
|
|
|
|
Label {
|
|
text: qsTr("Lighting")
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: slider.height
|
|
verticalAlignment: Text.AlignVCenter
|
|
visible: dimmableLights.count == 0
|
|
}
|
|
|
|
Slider {
|
|
id: slider
|
|
from: 0
|
|
to: 100
|
|
visible: dimmableLights.count > 0
|
|
value: {
|
|
var median = 0
|
|
var count = 0;
|
|
for (var i = 0; i < dimmableLights.count; i++) {
|
|
var device = dimmableLights.get(i);
|
|
var brightnessId = device.deviceClass.stateTypes.findByName("brightness").id
|
|
median += device.states.getState(brightnessId).value
|
|
count++
|
|
}
|
|
return median / count;
|
|
}
|
|
|
|
Layout.fillWidth: true
|
|
onPressedChanged: {
|
|
for (var i = 0; i < dimmableLights.count; i++) {
|
|
var device = dimmableLights.get(i);
|
|
var brightnessId = device.deviceClass.actionTypes.findByName("brightness").id
|
|
engine.deviceManager.executeAction(device.id, brightnessId, [{paramTypeId: brightnessId, value: value}]);
|
|
}
|
|
}
|
|
}
|
|
ColorIcon {
|
|
Layout.preferredHeight: app.iconSize
|
|
Layout.preferredWidth: app.iconSize
|
|
name: isOn ? "../images/light-on.svg" : "../images/light-off.svg"
|
|
color: isOn ? app.accentColor : keyColor
|
|
|
|
property bool isOn: {
|
|
for (var i = 0; i < lights.count; i++) {
|
|
var device = lights.get(i)
|
|
var powerId = device.deviceClass.stateTypes.findByName("power").id
|
|
if (device.states.getState(powerId).value === true) {
|
|
return true
|
|
}
|
|
}
|
|
return false;
|
|
}
|
|
|
|
MouseArea {
|
|
anchors.fill: parent
|
|
onClicked: {
|
|
for (var i = 0; i < lights.count; i++) {
|
|
var device = lights.get(i)
|
|
var powerId = device.deviceClass.stateTypes.findByName("power").id
|
|
engine.deviceManager.executeAction(device.id, powerId, [{paramTypeId: powerId, value: !parent.isOn}])
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
Component {
|
|
id: closableDelegate
|
|
|
|
RowLayout {
|
|
|
|
property var devices: null
|
|
DevicesProxy {
|
|
id: simpleClosables
|
|
engine: _engine
|
|
parentProxy: devices
|
|
shownInterfaces: ["simpleclosable"]
|
|
}
|
|
DevicesProxy {
|
|
id: closables
|
|
engine: _engine
|
|
parentProxy: devices
|
|
shownInterfaces: ["closable"]
|
|
}
|
|
|
|
ItemDelegate {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: app.iconSize
|
|
|
|
ColorIcon {
|
|
height: parent.height
|
|
width: height
|
|
anchors.centerIn: parent
|
|
name: Qt.resolvedUrl("../images/up.svg")
|
|
}
|
|
onClicked: {
|
|
for (var i = 0; i < simpleClosables.count; i++) {
|
|
var device = simpleClosables.get(i)
|
|
var openId = device.deviceClass.actionTypes.findByName("open").id
|
|
engine.deviceManager.executeAction(device.id, openId)
|
|
}
|
|
}
|
|
}
|
|
ItemDelegate {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: app.iconSize
|
|
visible: closables.count > 0
|
|
|
|
ColorIcon {
|
|
height: parent.height
|
|
width: height
|
|
anchors.centerIn: parent
|
|
name: Qt.resolvedUrl("../images/media-playback-stop.svg")
|
|
}
|
|
onClicked: {
|
|
for (var i = 0; i < closables.count; i++) {
|
|
var device = closables.get(i)
|
|
var openId = device.deviceClass.actionTypes.findByName("stop").id
|
|
engine.deviceManager.executeAction(device.id, openId)
|
|
}
|
|
}
|
|
}
|
|
ItemDelegate {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: app.iconSize
|
|
|
|
ColorIcon {
|
|
height: parent.height
|
|
width: height
|
|
anchors.centerIn: parent
|
|
name: Qt.resolvedUrl("../images/down.svg")
|
|
}
|
|
onClicked: {
|
|
for (var i = 0; i < simpleClosables.count; i++) {
|
|
var device = simpleClosables.get(i)
|
|
var closeId = device.deviceClass.actionTypes.findByName("close").id
|
|
engine.deviceManager.executeAction(device.id, closeId)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
Component {
|
|
id: mediaControllerDelegate
|
|
MediaControls {
|
|
property var devices: null
|
|
iconSize: app.iconSize
|
|
DevicesProxy {
|
|
id: mediaControllers
|
|
engine: _engine
|
|
parentProxy: devices
|
|
shownInterfaces: ["mediacontroller"]
|
|
}
|
|
|
|
// involve count in the statement to make the binding re-evaluate when the group is changed
|
|
thing: mediaControllers.count > 0 ? mediaControllers.get(0) : null
|
|
}
|
|
}
|
|
|
|
EmptyViewPlaceholder {
|
|
anchors { left: parent.left; right: parent.right; margins: app.margins }
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
visible: groupsGridView.count == 0 && !engine.deviceManager.fetchingData && !engine.tagsManager.busy
|
|
title: qsTr("There are no groups set up yet.")
|
|
text: qsTr("Grouping things can be useful to control multiple devices at once, for example an entire room. Watch out for the group symbol when interacting with things and use it to add them to groups.")
|
|
imageSource: "../images/view-grid-symbolic.svg"
|
|
buttonVisible: false
|
|
}
|
|
|
|
}
|