finished up application

DasSchmalter.pro

@@ -1,4 +1,4 @@
-QT += quick
+QT += quick quick quickcontrols2
 CONFIG += c++11
 
 # The following define makes your compiler emit warnings if you use
@@ -13,7 +13,8 @@ DEFINES += QT_DEPRECATED_WARNINGS
 #DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0
 
 SOURCES += \
-        main.cpp
+        main.cpp \
+    appsettings.cpp
 
 RESOURCES += qml.qrc \
     shared.qrc
@@ -28,3 +29,6 @@ QML_DESIGNER_IMPORT_PATH =
 qnx: target.path = /tmp/$${TARGET}/bin
 else: unix:!android: target.path = /opt/$${TARGET}/bin
 !isEmpty(target.path): INSTALLS += target
+
+HEADERS += \
+    appsettings.h

appsettings.cpp

@@ -0,0 +1,40 @@
+#include "appsettings.h"
+
+AppSettings * pGlobalAppSettings = nullptr;
+
+AppSettings::AppSettings(QObject* parent)
+    :QObject(parent)
+{
+    qDebug() << "+----- AppSettings konstruktor -----+";
+
+    pGlobalAppSettings = this;
+
+    QString path = QStandardPaths::writableLocation(QStandardPaths::AppDataLocation);
+    qDebug() << "+----- Settings Path:" << path << " -----+";
+
+    this->settingsManager = new QSettings(path+"/fannyapp/settings.ini", QSettings::IniFormat);
+
+    this->filtersFile = new QFile(path + "/fannyapp/filters.json");
+}
+
+QString AppSettings::loadSetting(const QString &key)
+{
+    this->settingsManager->beginGroup("AppSettings");
+    QString value = this->settingsManager->value(key , false).toString();
+    this->settingsManager->endGroup();
+    return(value);
+}
+
+void AppSettings::writeSetting(const QString &key, const QVariant &variant)
+{
+    this->settingsManager->beginGroup("AppSettings");
+    this->settingsManager->setValue(key , variant);
+    this->settingsManager->endGroup();
+}
+
+AppSettings::~AppSettings()
+{
+    qDebug("+----- AppSettings destruktor -----+");
+    delete settingsManager;
+}
+

appsettings.h

@@ -0,0 +1,34 @@
+#ifndef APPSETTINGS_H
+#define APPSETTINGS_H
+
+#include <QFile>
+#include <QObject>
+#include <QtDebug>
+#include <QSettings>
+#include <QJsonArray>
+#include <QJsonDocument>
+#include <QStandardPaths>
+
+class AppSettings : public QObject
+{
+    Q_OBJECT
+public:
+    explicit AppSettings(QObject *parent = nullptr);
+    ~AppSettings();
+
+    Q_INVOKABLE QString loadSetting(const QString &key);
+    Q_INVOKABLE void writeSetting(const QString &key, const QVariant &variant);
+
+    QList<QStringList> readFilters();
+    void writeFilters(QList<QStringList> list);
+
+    QSettings *settingsManager;
+    QFile * filtersFile;
+
+signals:
+
+public slots:
+};
+extern AppSettings * pGlobalAppSettings;
+
+#endif // APPSETTINGS_H

main.cpp

@@ -1,14 +1,26 @@
 #include <QGuiApplication>
 #include <QQmlApplicationEngine>
+#include <QtQml/QQmlContext>
+#include <QQuickStyle>
+
+#include "appsettings.h"
 
 int main(int argc, char *argv[])
 {
+    AppSettings * pAppSettings = new AppSettings();
+
     QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
 
     QGuiApplication app(argc, argv);
 
+    QQuickStyle::setStyle("Material");
+
     QQmlApplicationEngine engine;
     engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
+
+    QQmlContext *context = engine.rootContext();
+    context->setContextProperty("_cppAppSettings", pAppSettings);
+
     if (engine.rootObjects().isEmpty())
         return -1;
 

main.qml

@@ -10,24 +10,35 @@ Window {
 
     Page {
         id: app
-        state: "off"
+        state: "OFF"
         anchors.fill: parent
 
+        property string ipAdress: _cppAppSettings.loadSetting("ip-adress")
+
+        Label {
+            id: currentStateLa
+
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.topMargin: parent.height * 0.01
+            anchors.top: parent.top
+            font.pixelSize: app.landscape() ? parent.height * 0.1:parent.width * 0.1
+
+            text: "current state: " + app.state
+        }
+
         Button {
             id: onOffBt
 
-            width: 400
+            property int animationDuration: 300
+            property int animationDelay: 50
+
+            width: app.landscape() ?  parent.height * 0.8:parent.width * 0.8
             height: width
             anchors.centerIn: parent
 
             background: Item {
                 id: lamp
-                Image {
+
-                    id: lampOn0
-                    source: "on0.png"
-                    anchors.fill: parent
-                    scale: 0
-                }
                 Image {
                     id: lampOn1
                     source: "on1.png"
@@ -36,13 +47,13 @@ Window {
                     Behavior on scale {
                         SequentialAnimation {
                             PauseAnimation {
-                                duration: 200
+                                duration: onOffBt.animationDelay * 0
                             }
                             NumberAnimation {
-                                duration: 200
+                                duration: onOffBt.animationDuration
                                 properties: "scale"
-                                from: app.state === "on" ? 0:1
+                                from: app.state === "ON" ? 0:1
-                                to: app.state === "on" ? 1:0
+                                to: app.state === "ON" ? 1:0
                                 target: lampOn1
                             }
                         }
@@ -56,13 +67,13 @@ Window {
                     Behavior on scale {
                         SequentialAnimation {
                             PauseAnimation {
-                                duration: 400
+                                duration: onOffBt.animationDelay * 1
                             }
                             NumberAnimation {
-                                duration: 200
+                                duration: onOffBt.animationDuration
                                 properties: "scale"
-                                from: app.state === "on" ? 0:1
+                                from: app.state === "ON" ? 0:1
-                                to: app.state === "on" ? 1:0
+                                to: app.state === "ON" ? 1:0
                                 target: lampOn2
                             }
                         }
@@ -76,13 +87,13 @@ Window {
                     Behavior on scale {
                         SequentialAnimation {
                             PauseAnimation {
-                                duration: 600
+                                duration: onOffBt.animationDelay * 2
                             }
                             NumberAnimation {
-                                duration: 200
+                                duration: onOffBt.animationDuration
                                 properties: "scale"
-                                from: app.state === "on" ? 0:1
+                                from: app.state === "ON" ? 0:1
-                                to: app.state === "on" ? 1:0
+                                to: app.state === "ON" ? 1:0
                                 target: lampOn3
                             }
                         }
@@ -96,13 +107,13 @@ Window {
                     Behavior on scale {
                         SequentialAnimation {
                             PauseAnimation {
-                                duration: 800
+                                duration: onOffBt.animationDelay * 3
                             }
                             NumberAnimation {
-                                duration: 200
+                                duration: onOffBt.animationDuration
                                 properties: "scale"
-                                from: app.state === "on" ? 0:1
+                                from: app.state === "ON" ? 0:1
-                                to: app.state === "on" ? 1:0
+                                to: app.state === "ON" ? 1:0
                                 target: lampOn4
                             }
                         }
@@ -116,13 +127,13 @@ Window {
                     Behavior on scale {
                         SequentialAnimation {
                             PauseAnimation {
-                                duration: 1000
+                                duration: onOffBt.animationDelay * 4
                             }
                             NumberAnimation {
-                                duration: 200
+                                duration: onOffBt.animationDuration
                                 properties: "scale"
-                                from: app.state === "on" ? 0:1
+                                from: app.state === "ON" ? 0:1
-                                to: app.state === "on" ? 1:0
+                                to: app.state === "ON" ? 1:0
                                 target: lampOn5
                             }
                         }
@@ -134,22 +145,172 @@ Window {
                     anchors.fill: parent
                     scale: 1
                 }
+                Image {
+                    id: lampOn0
+                    source: "on0.png"
+                    anchors.fill: parent
+                    opacity: 0
+
+                    Behavior on opacity {
+                        NumberAnimation {
+                            duration: 200
                         }
+                    }
+                }
+            }
+
             onClicked: {
-                if (app.state === "on") {
+                app.toggleLigth()
-                    app.state = "off"
-                } else {
-                    app.state = "on"
             }
         }
+
+        Button {
+            id: settingsBt
+            anchors {
+                bottom: parent.bottom
+                left: parent.left
+                leftMargin: ( app.width - width ) * 0.5
+            }
+
+            text: "settings"
+
+            onClicked: {
+                settingsDia.open()
+            }
+        }
+
+        Dialog {
+            id: settingsDia
+
+            modal: true
+
+            x: ( app.width - width ) * 0.5
+            y: ( app.height - height ) * 0.5
+
+            title: "Settings"
+
+            contentItem: Item {
+                Row {
+                    spacing: 10
+                    Label {
+                        id: settingsIpAdressLa
+                        text: "ip-adress"
+                    }
+                    TextField {
+                        id: settingsIpAdressTf
+                        text: _cppAppSettings.loadSetting("ip-adress")
+                        anchors.verticalCenter: settingsIpAdressLa.verticalCenter
+                        onTextChanged: {
+                            _cppAppSettings.writeSetting("ip-adress", text)
+                            app.ipAdress = text
+                        }
+                    }
+                }
+            }
+
+        }
+
+        function getState(){
+            sendRequest("http://"+app.ipAdress+"/api/state")
+        }
+
+        function requestFinished(){
+
+        }
+
+        function toggleLigth(){
+            if(app.state == 'OFF'){
+                sendRequest("http://"+app.ipAdress+"/api/on")
+            }
+            else if(app.state == 'ON'){
+                sendRequest("http://"+app.ipAdress+"/api/off")
+            }
+            else{
+                alert("ERROR! " + currentState);
+            }
+            getState();
+        }
+
+        function sendRequest(link){
+            var xmlhttp = new XMLHttpRequest();
+            xmlhttp.onreadystatechange = (function(response) {
+                return function(){
+                    if(response.readyState === 4 && response.status === 200){
+                        console.log(response.responseText)
+                if(response.responseText !== ""){
+
+                    var responseObj = JSON.parse(response.responseText);
+
+                    if(responseObj["command"] === "state"){
+
+                        if(app.state === responseObj["response"]){
+                            return;
+                        }
+
+                        console.log("statechanged")
+                        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";
+
+
+                        }
+                    }
+
+
+                }
+                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(){
+            return(app.width > app.height)
+        }
+
+        Timer {
+            id: refreshTimer
+            running: true
+            interval: 200
+            onTriggered: {
+                app.getState();
+                refreshTimer.start()
+            }
         }
 
         states: [
             State {
-                name: "on"
+                name: "ON"
                 PropertyChanges {
                     target: lampOn0
-                    scale: 1
+                    opacity: 1
                 }
                 PropertyChanges {
                     target: lampOn1
@@ -171,13 +332,33 @@ Window {
                     target: lampOn5
                     scale: 1
                 }
-                PropertyChanges {
-                    target: lampOff
-                    scale: 0
-                }
             },
             State {
-                name: "off"
+                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
+                }
             }
         ]
     }