113 lines
4.9 KiB
QML
113 lines
4.9 KiB
QML
import QtQuick 2.5
|
|
import QtQuick.Controls 2.1
|
|
import QtQuick.Controls.Material 2.2
|
|
import QtQuick.Layouts 1.1
|
|
import Nymea 1.0
|
|
import "../components"
|
|
import "../customviews"
|
|
|
|
DevicePageBase {
|
|
id: root
|
|
|
|
readonly property bool landscape: width > height
|
|
readonly property var openState: device.states.getState(deviceClass.stateTypes.findByName("state").id)
|
|
readonly property var intermediatePositionState: device.states.getState(deviceClass.stateTypes.findByName("intermediatePosition").id)
|
|
readonly property var lightStateType: deviceClass.stateTypes.findByName("power")
|
|
readonly property var lightState: lightStateType ? device.states.getState(lightStateType.id) : null
|
|
|
|
GridLayout {
|
|
anchors.fill: parent
|
|
columns: root.landscape ? 2 : 1
|
|
|
|
ColorIcon {
|
|
id: shutterImage
|
|
Layout.preferredWidth: root.landscape ? Math.min(parent.width - shutterControlsContainer.width, parent.height) - app.margins : parent.width
|
|
Layout.preferredHeight: width
|
|
property string currentImage: root.openState.value === "closed" ? "100" :
|
|
root.openState.value === "open" && root.intermediatePositionState.value === false ? "000" : "050"
|
|
name: "../images/shutter/shutter-" + currentImage + ".svg"
|
|
|
|
Item {
|
|
id: arrows
|
|
anchors.centerIn: parent
|
|
width: app.iconSize * 2
|
|
height: parent.height * .6
|
|
clip: true
|
|
visible: root.openState.value === "opening" || root.openState.value === "closing"
|
|
property bool up: root.openState.value === "opening"
|
|
|
|
// NumberAnimation doesn't reload to/from while it's running. If we switch from closing to opening or vice versa
|
|
// we need to somehow stop and start the animation
|
|
property bool animationHack: true
|
|
onAnimationHackChanged: {
|
|
if (!animationHack) hackTimer.start();
|
|
}
|
|
Timer { id: hackTimer; interval: 1; onTriggered: arrows.animationHack = true }
|
|
Connections { target: root.openState; onValueChanged: arrows.animationHack = false }
|
|
|
|
NumberAnimation {
|
|
target: arrowColumn
|
|
property: "y"
|
|
duration: 500
|
|
easing.type: Easing.Linear
|
|
from: arrows.up ? app.iconSize : -app.iconSize
|
|
to: arrows.up ? -app.iconSize : app.iconSize
|
|
loops: Animation.Infinite
|
|
running: arrows.animationHack && (root.openState.value === "opening" || root.openState.value === "closing")
|
|
}
|
|
|
|
Column {
|
|
id: arrowColumn
|
|
width: parent.width
|
|
|
|
Repeater {
|
|
model: arrows.height / app.iconSize + 1
|
|
ColorIcon {
|
|
name: arrows.up ? "../images/up.svg" : "../images/down.svg"
|
|
width: parent.width
|
|
height: width
|
|
color: app.accentColor
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
Item {
|
|
id: shutterControlsContainer
|
|
Layout.preferredWidth: root.landscape ? Math.max(parent.width / 2, shutterControls.implicitWidth) : parent.width
|
|
Layout.minimumWidth: shutterControls.implicitWidth
|
|
Layout.fillHeight: true
|
|
Layout.minimumHeight: app.iconSize * 2.5
|
|
|
|
ShutterControls {
|
|
id: shutterControls
|
|
device: root.device
|
|
anchors.centerIn: parent
|
|
|
|
ItemDelegate {
|
|
Layout.preferredWidth: app.iconSize * 2
|
|
Layout.preferredHeight: width
|
|
visible: root.lightStateType !== null
|
|
|
|
ColorIcon {
|
|
anchors.fill: parent
|
|
anchors.margins: app.margins
|
|
name: "../images/light-" + (root.lightState && root.lightState.value === true ? "on" : "off") + ".svg"
|
|
color: root.lightState && root.lightState.value === true ? Material.accent : keyColor
|
|
}
|
|
onClicked: {
|
|
print("blabla", root.lightState, root.lightState.value, root.lightStateType.name, root.lightState.stateTypeId, root.lightStateType.id)
|
|
var params = [];
|
|
var param = {};
|
|
param["paramTypeId"] = root.lightStateType.id;
|
|
param["value"] = !root.lightState.value;
|
|
params.push(param)
|
|
engine.deviceManager.executeAction(root.device.id, root.lightStateType.id, params)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|