- major cleanup
- added states for 'connecting' and 'error'
This commit is contained in:
parent
ab97b22ac9
commit
c227748ff6
2 changed files with 128 additions and 108 deletions
|
|
@ -16,7 +16,8 @@ SOURCES += \
|
|||
main.cpp \
|
||||
appsettings.cpp
|
||||
|
||||
RESOURCES += qml.qrc \
|
||||
RESOURCES += \
|
||||
qml.qrc \
|
||||
shared.qrc
|
||||
|
||||
# Additional import path used to resolve QML modules in Qt Creator's code model
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ Window {
|
|||
|
||||
Page {
|
||||
id: app
|
||||
state: "OFF"
|
||||
state: "CONNECTING"
|
||||
anchors.fill: parent
|
||||
|
||||
property string ipAdress: _cppAppSettings.loadSetting("ip-adress")
|
||||
|
|
@ -164,6 +164,28 @@ Window {
|
|||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: lampCrossLineRa
|
||||
|
||||
anchors.centerIn: onOffBt
|
||||
anchors.verticalCenterOffset: 15
|
||||
height: onOffBt.height * 0.7
|
||||
width: onOffBt.width * 0.03
|
||||
|
||||
radius: width * 0.2
|
||||
|
||||
rotation: 30
|
||||
opacity: 1
|
||||
|
||||
color: Qt.darker("grey", 1.5)
|
||||
|
||||
Behavior on opacity {
|
||||
NumberAnimation {
|
||||
duration: 200
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Button {
|
||||
id: settingsBt
|
||||
anchors {
|
||||
|
|
@ -211,14 +233,13 @@ Window {
|
|||
}
|
||||
|
||||
function getState(){
|
||||
// function to sync the state of the app with the state of the schmalter
|
||||
sendRequest("http://"+app.ipAdress+"/api/state")
|
||||
}
|
||||
|
||||
function requestFinished(){
|
||||
|
||||
}
|
||||
|
||||
function toggleLigth(){
|
||||
// function to toggle the remote schmalter
|
||||
|
||||
if(app.state == 'OFF'){
|
||||
sendRequest("http://"+app.ipAdress+"/api/on")
|
||||
}
|
||||
|
|
@ -228,67 +249,66 @@ Window {
|
|||
else{
|
||||
alert("ERROR! " + currentState);
|
||||
}
|
||||
|
||||
// sync state
|
||||
getState();
|
||||
}
|
||||
|
||||
function sendRequest(link){
|
||||
// function to send a http request
|
||||
|
||||
// create request object
|
||||
var xmlhttp = new XMLHttpRequest();
|
||||
|
||||
// define a function to be executed after the request finished
|
||||
xmlhttp.onreadystatechange = (function(response) {
|
||||
return function(){
|
||||
if(response.readyState === 4 && response.status === 200){
|
||||
console.log(response.responseText)
|
||||
if(response.responseText !== ""){
|
||||
app.processResponse(response)
|
||||
}})(xmlhttp);
|
||||
|
||||
// prepare the request
|
||||
xmlhttp.open("GET", link);
|
||||
|
||||
// send the request
|
||||
xmlhttp.send();
|
||||
}
|
||||
|
||||
function processResponse(response){
|
||||
// function to handle sensponses from das schmalter
|
||||
|
||||
if(response.readyState === 4){
|
||||
switch (response.status){
|
||||
case 200: {
|
||||
// success
|
||||
|
||||
if(response.responseText !== ""){
|
||||
// if the response was not empty
|
||||
|
||||
// get the data out of the json formatted string
|
||||
var responseObj = JSON.parse(response.responseText);
|
||||
|
||||
if(responseObj["command"] === "state"){
|
||||
// if the request was a state check
|
||||
|
||||
if(app.state === responseObj["response"]){
|
||||
return;
|
||||
}
|
||||
|
||||
console.log("statechanged")
|
||||
if(app.state !== responseObj["response"]){
|
||||
// if the current state of the schmalter doesn't match the current state of the app -> update the app's state
|
||||
app.state = responseObj["response"]
|
||||
|
||||
if(currentState == 'OFF'){
|
||||
|
||||
document.getElementById("toggleLightBt").classList.remove("disabled")
|
||||
|
||||
document.getElementById("toggleLightBt").innerHTML = "Turn on";
|
||||
|
||||
}
|
||||
|
||||
else if(currentState == 'ON'){
|
||||
|
||||
document.getElementById("toggleLightBt").classList.remove("disabled")
|
||||
|
||||
document.getElementById("toggleLightBt").innerHTML = "Turn off";
|
||||
|
||||
}
|
||||
|
||||
else{
|
||||
|
||||
document.getElementById("toggleLightBt").classList.add("disabled")
|
||||
|
||||
document.getElementById("toggleLightBt").innerHTML = "ERROR";
|
||||
|
||||
document.getElementById("toggleLightBt").innerHTML = "Unkwon error while connecting to Das Schmalter";
|
||||
|
||||
|
||||
}
|
||||
break
|
||||
}
|
||||
default: {
|
||||
// error
|
||||
console.log("ERROR: " + response.status)
|
||||
// set the app state to ERROR
|
||||
app.state = "ERROR"
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// start the refresh timer
|
||||
refreshTimer.start()
|
||||
}
|
||||
else if(this.readyState === 4){
|
||||
document.getElementById("errorDiv").innerHTML = "Error while connecting to Das Schmalter: "+this.status
|
||||
}
|
||||
}
|
||||
}})(xmlhttp);
|
||||
|
||||
xmlhttp.open("GET", link);
|
||||
xmlhttp.send();
|
||||
console.log("request sent")
|
||||
}
|
||||
|
||||
function landscape(){
|
||||
|
|
@ -298,67 +318,66 @@ Window {
|
|||
Timer {
|
||||
id: refreshTimer
|
||||
running: true
|
||||
interval: 200
|
||||
repeat: false
|
||||
interval: 100
|
||||
onTriggered: {
|
||||
// sync state
|
||||
app.getState();
|
||||
refreshTimer.start()
|
||||
}
|
||||
}
|
||||
|
||||
states: [
|
||||
State {
|
||||
name: "ON"
|
||||
PropertyChanges {
|
||||
target: lampOn0
|
||||
opacity: 1
|
||||
}
|
||||
PropertyChanges {
|
||||
target: lampOn1
|
||||
scale: 1
|
||||
}
|
||||
PropertyChanges {
|
||||
target: lampOn2
|
||||
scale: 1
|
||||
}
|
||||
PropertyChanges {
|
||||
target: lampOn3
|
||||
scale: 1
|
||||
}
|
||||
PropertyChanges {
|
||||
target: lampOn4
|
||||
scale: 1
|
||||
}
|
||||
PropertyChanges {
|
||||
target: lampOn5
|
||||
scale: 1
|
||||
}
|
||||
PropertyChanges { target: onOffBt; opacity: 1; enabled: true; }
|
||||
|
||||
PropertyChanges { target: lampOn0; opacity: 1; }
|
||||
PropertyChanges { target: lampOn1; scale: 1; }
|
||||
PropertyChanges { target: lampOn2; scale: 1; }
|
||||
PropertyChanges { target: lampOn3; scale: 1; }
|
||||
PropertyChanges { target: lampOn4; scale: 1; }
|
||||
PropertyChanges { target: lampOn5; scale: 1; }
|
||||
|
||||
PropertyChanges { target: lampCrossLineRa; opacity: 0; }
|
||||
},
|
||||
State {
|
||||
name: "OFF"
|
||||
PropertyChanges {
|
||||
target: lampOn0
|
||||
opacity: 0
|
||||
}
|
||||
PropertyChanges {
|
||||
target: lampOn1
|
||||
scale: 0
|
||||
}
|
||||
PropertyChanges {
|
||||
target: lampOn2
|
||||
scale: 0
|
||||
}
|
||||
PropertyChanges {
|
||||
target: lampOn3
|
||||
scale: 0
|
||||
}
|
||||
PropertyChanges {
|
||||
target: lampOn4
|
||||
scale: 0
|
||||
}
|
||||
PropertyChanges {
|
||||
target: lampOn5
|
||||
scale: 0
|
||||
}
|
||||
PropertyChanges { target: onOffBt; opacity: 1; enabled: true; }
|
||||
|
||||
PropertyChanges { target: lampOn0; opacity: 0; }
|
||||
PropertyChanges { target: lampOn1; scale: 0; }
|
||||
PropertyChanges { target: lampOn2; scale: 0; }
|
||||
PropertyChanges { target: lampOn3; scale: 0; }
|
||||
PropertyChanges { target: lampOn4; scale: 0; }
|
||||
PropertyChanges { target: lampOn5; scale: 0; }
|
||||
|
||||
PropertyChanges { target: lampCrossLineRa; opacity: 0; }
|
||||
},
|
||||
State {
|
||||
name: "ERROR"
|
||||
PropertyChanges { target: onOffBt; opacity: 0.5; enabled: false; }
|
||||
|
||||
PropertyChanges { target: lampOn0; opacity: 0; }
|
||||
PropertyChanges { target: lampOn1; scale: 0; }
|
||||
PropertyChanges { target: lampOn2; scale: 0; }
|
||||
PropertyChanges { target: lampOn3; scale: 0; }
|
||||
PropertyChanges { target: lampOn4; scale: 0; }
|
||||
PropertyChanges { target: lampOn5; scale: 0; }
|
||||
|
||||
PropertyChanges { target: lampCrossLineRa; opacity: 1; }
|
||||
},
|
||||
State {
|
||||
name: "CONNECTING"
|
||||
PropertyChanges { target: onOffBt; opacity: 0.5; enabled: false; }
|
||||
|
||||
PropertyChanges { target: lampOn0; opacity: 0; }
|
||||
PropertyChanges { target: lampOn1; scale: 0; }
|
||||
PropertyChanges { target: lampOn2; scale: 0; }
|
||||
PropertyChanges { target: lampOn3; scale: 0; }
|
||||
PropertyChanges { target: lampOn4; scale: 0; }
|
||||
PropertyChanges { target: lampOn5; scale: 0; }
|
||||
|
||||
PropertyChanges { target: lampCrossLineRa; opacity: 0; }
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
Reference in a new issue