- New Design almost finished

- further implementation of in-app event display but stiff having problems
2018-12-23 00:06:05 +01:00 · 2018-12-23 00:06:05 +01:00 · 99fd686c65
commit 99fd686c65
parent 5dec809af1
22 changed files with 1067 additions and 702 deletions
--- a/android-sources/AndroidManifest.xml
+++ b/android-sources/AndroidManifest.xml
@ -61,14 +61,8 @@
            <meta-data android:name="android.app.extract_android_style" android:value="full"/>
            <!-- extract android style -->

-            <provider
-                android:name="android.support.v4.content.FileProvider"
-                android:authorities="${applicationId}"
-                android:exported="false"
-                android:grantUriPermissions="true">
-              <meta-data
-                  android:name="android.support.FILE_PROVIDER_PATHS"
-                  android:resource="@xml/provider_paths"/>
+            <provider android:name="android.support.v4.content.FileProvider" android:authorities="${applicationId}" android:exported="false" android:grantUriPermissions="true">
+              <meta-data android:name="android.support.FILE_PROVIDER_PATHS" android:resource="@xml/provider_paths"/>
            </provider>


--- a/fannyapp.pro
+++ b/fannyapp.pro
@ -1,4 +1,4 @@
-QT += qml quick quickcontrols2 xml #webview
+QT += qml quick quickcontrols2 xml webview
 CONFIG += c++11

 # The following define makes your compiler emit warnings if you use
--- a/headers/serverconn.h
+++ b/headers/serverconn.h
@ -44,7 +44,7 @@ public:
    Q_INVOKABLE int getFoodPlan();
    Q_INVOKABLE QVariantMap getFoodPlanData(int index);
    Q_INVOKABLE QVariantMap getEventData(int index);
-    Q_INVOKABLE int getEvents();
+    Q_INVOKABLE int getEvents(QString day);
    Q_INVOKABLE int getEventCount();
    ReturnData_t senddata(QUrl serviceUrl, QUrlQuery postData);

--- a/qml/Components/AppToolBar.qml
+++ b/qml/Components/AppToolBar.qml
@ -1,51 +1,73 @@
 import QtQuick 2.6
 import QtQuick.Controls 2.1
-import QtQuick.Controls.Material 2.1
+import QtGraphicalEffects 1.0

-ToolBar {
-    id: toolBar
+Item {
+    id: control
+    height: 50
    property bool showErrorBar: true
-    Material.theme: Material.Light
-    Rectangle {
-        id: errorField
-        width: parent.width
-        height: 30
-        enabled: app.is_error & app.state !== "notLoggedIn" & showErrorBar
-        anchors.top: parent.bottom

-        color: "red"
-        onEnabledChanged: {
-            if(enabled){
-                toolBar.state = 'moveIn'
-            }
-            else {
-                toolBar.state = 'moveOut'
-            }
-        }
-
-        MouseArea { anchors.fill: parent; onClicked: {
-                toolBar.state = 'moveOut'
-
-                console.log("clicked")
-            }
-        }
-
-        Text {
-            anchors {
-                horizontalCenter: parent.horizontalCenter
-                verticalCenter: parent.verticalCenter
-            }
-
-            id: errorText
-            font.family: "Helvetica"
-            color: "White"
-            font.pointSize: 8
-            visible: parent.height !== 0
-            text: app.error
-        }
+    RectangularGlow {
+        id: toolBarEffect
+        glowRadius: 3
+        spread: 0.2
+        color: "black"
+        opacity: 0.3
+        anchors.fill: toolBar
    }

-    states: [
+    Rectangle {
+        id: toolBar
+        color: "white"
+        anchors.fill: parent
+
+//        anchors {
+//            top: parent.top
+//            left: parent.left
+//            right: parent.right
+//            topMargin: -60
+//        }
+
+        Rectangle {
+            id: errorField
+            width: parent.width
+            height: 30
+            enabled: app.is_error & app.state !== "notLoggedIn" & control.showErrorBar
+            anchors.top: parent.bottom
+
+            color: "red"
+            onEnabledChanged: {
+                if(enabled){
+                    toolBar.state = 'moveIn'
+                }
+                else {
+                    toolBar.state = 'moveOut'
+                }
+            }
+
+            MouseArea { anchors.fill: parent; onClicked: {
+                    toolBar.state = 'moveOut'
+
+                    console.log("clicked")
+                }
+            }
+
+            Text {
+                anchors {
+                    horizontalCenter: parent.horizontalCenter
+                    verticalCenter: parent.verticalCenter
+                }
+
+                id: errorText
+                font.family: "Helvetica"
+                color: "White"
+                font.pointSize: 8
+                visible: parent.height !== 0
+                text: app.error
+            }
+        }
+
+        states: [
            State {
                name: "moveOut"
                PropertyChanges { target: errorField; height: 0 }
@ -56,14 +78,15 @@ ToolBar {
            }
        ]

-    transitions: [
-        Transition {
-            to: "moveOut"
-            NumberAnimation { properties: "height"; easing.type: Easing.InOutQuad; duration: 200 }
-        },
-        Transition {
-            to: "moveIn"
-            NumberAnimation { properties: "height"; easing.type: Easing.InOutQuad; duration: 200 }
-        }
-    ]
+        transitions: [
+            Transition {
+                to: "moveOut"
+                NumberAnimation { properties: "height"; easing.type: Easing.InOutQuad; duration: 200 }
+            },
+            Transition {
+                to: "moveIn"
+                NumberAnimation { properties: "height"; easing.type: Easing.InOutQuad; duration: 200 }
+            }
+        ]
+    }
 }
--- a/qml/Components/EventDisplay.qml
+++ b/qml/Components/EventDisplay.qml
@ -0,0 +1,123 @@
+import QtQuick 2.9
+import QtQuick.Controls 2.4
+
+Item {
+    id: control
+
+
+    ScrollView {
+        id:scroll
+        anchors.fill: parent
+
+        ListView {
+            id: listView
+            //width: 514
+            model: _cppServerConn.getEventCount()
+            spacing: 0
+            property var today: new Date
+            anchors {
+                right: parent.right
+                left: parent.left
+                top: parent.top
+                bottom: parent.bottom
+                leftMargin: 5
+                rightMargin: 5
+                topMargin: 3
+            }
+
+            delegate: Button {
+
+                width: listView.width
+                id: delegate
+                height: visible ? cookteam.height + date.height + text.height + cust_spacing*9 + 5:0
+                visible: listView.isDayVisible(index)
+
+                property int cust_spacing: 5
+
+                Label {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.top: parent.top
+                    anchors.topMargin: 10
+                    font.bold: true
+                    font.pixelSize: date.font.pixelSize * 1.5
+                    id: cookteam
+                    text: _cppServerConn.getEventData(index).grade
+                    width: parent.width - 10
+                    wrapMode: Label.Wrap
+                    height: text!==""? undefined:0
+                }
+                Label {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.top: cookteam.bottom
+                    id: date
+                    text: _cppServerConn.getEventData(index).hour + " | "
+                          + _cppServerConn.getEventData(index).replace + " | "
+                          + _cppServerConn.getEventData(index).subject + " | "
+                          + _cppServerConn.getEventData(index).room + " | "
+
+                    width: parent.width - 10
+                    wrapMode: Label.Wrap
+                }
+
+                Label {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.top: date.bottom
+                    anchors.topMargin: cust_spacing
+                    font.pixelSize: date.font.pixelSize * 2
+                    font.bold: true
+                    id: text
+                    text: _cppServerConn.getEventData(index).to + " " + _cppServerConn.getEventData(index).text
+                }
+            }
+
+            function getDateString(index){
+                var date = _cppServerConn.getEventData(index).date
+                console.log(date.getTime())
+                console.log(today.getTime())
+                if(date.getDate() === today.getDate()){
+                    return("Heute")
+                }
+                else if(date.getTime() < (today.getTime() + (24 * 60 * 60 * 1000) )/*date.getDate() === today.getDate() + 1 || (date.getDate() === 1 && date.getMonth() === today.getMonth() + 1)*/){
+                    return("Morgen")
+                }
+                else {
+                    return(Qt.formatDateTime(_cppServerConn.getEventData(index).date, "dddd, d.M.yy"))
+                }
+
+            }
+            function isDayVisible(index){
+                return(true)
+            }
+        }
+    }
+
+    Rectangle {
+        id: errorRect
+
+        anchors {
+            left: parent.left
+            right: parent.right
+            verticalCenter: parent.verticalCenter
+            margins: parent.width * 0.15
+        }
+
+        radius: height * 0.5
+        height: width
+
+        color: "transparent"
+        border.width: 5
+        border.color: "red"
+
+        visible: _cppServerConn.getEventCount() === 0
+
+        Label {
+            anchors.centerIn: parent
+            text: "keine Daten..."
+        }
+    }
+
+}
+
--- a/qml/Components/FancyButton.qml
+++ b/qml/Components/FancyButton.qml
@ -1,5 +1,6 @@
 import QtQuick 2.9
 import QtQuick.Controls 2.4
+import QtGraphicalEffects 1.0

 Button {
    id: control
@ -7,10 +8,8 @@ Button {
    property string image
    property real imageScale: 1

-    background: Rectangle {
-        id: smorgenBackground
-        height: control.height
-        width: height
+    background: Item {
+        id: controlBackgroundContainer

        scale: control.pressed ? 0.8:1

@ -20,29 +19,48 @@ Button {
            }
        }

-        Image {
-            id: smorgenImage
-            source: control.image
+        RectangularGlow {
+            id: effect
+            glowRadius: 0.001
+            spread: 0.2
+            color: "black"
+            opacity: 1
+            cornerRadius: controlBackground.radius
+            anchors.fill: controlBackground
+            scale: 0.75
+        }

-            anchors.centerIn: parent
-            height: parent.height * 0.5
-            width: height
+        Rectangle {
+            id: controlBackground

-            visible: false
+            anchors.fill: parent

-            mipmap: true
+            radius: height * 0.5

-            fillMode: Image.PreserveAspectFit
+            Image {
+                id: buttonIcon
+                source: control.image

-            scale: control.imageScale
+                anchors.centerIn: parent
+                height: parent.height * 0.5
+                width: height

-            Behavior on scale {
-                PropertyAnimation {
-                    duration: 100
+                mipmap: true
+
+                fillMode: Image.PreserveAspectFit
+
+                scale: control.imageScale
+
+                Behavior on scale {
+                    PropertyAnimation {
+                        duration: 100
+                    }
                }
            }
        }
    }
+
+}
 /*
    background: Image {
        id: smorgenBackground
@ -86,4 +104,4 @@ Button {
        }
    }
    */
-}
+
--- a/qml/Components/FoodPlanDisplay.qml
+++ b/qml/Components/FoodPlanDisplay.qml
@ -0,0 +1,213 @@
+import QtQuick 2.9
+import QtQuick.Controls 2.4
+
+Item {
+    id: control
+
+    ScrollView {
+        id:scroll
+        anchors.fill: parent
+        visible: _cppServerConn.getFoodPlanData(0).cookteam !== ""
+
+        ListView {
+            id: listView
+            //width: 514
+            model: 8
+            spacing: 0
+            property var today: new Date
+            anchors {
+                right: parent.right
+                left: parent.left
+                top: parent.top
+                bottom: parent.bottom
+                leftMargin: 5
+                rightMargin: 5
+                topMargin: 3
+            }
+
+            delegate: Button {
+
+                width: listView.width
+                id: delegate
+                height: visible ? cookteam.height + date.height + main_dish.height + main_dish_veg.height + garnish.height + dessert.height + spacer.height + cust_spacing*9 + 5:0
+                visible: listView.isDayVisible(index)
+
+                property int cust_spacing: 5
+
+                Label {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.top: parent.top
+                    anchors.topMargin: 10
+                    font.bold: true
+                    id: cookteam
+                    text: _cppServerConn.getFoodPlanData(index).cookteam
+                    width: parent.width - 10
+                    wrapMode: Label.Wrap
+                    height: text!=""? undefined:0
+                }
+                Label {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.top: cookteam.bottom
+                    font.bold: true
+                    id: date
+                    text: listView.getDateString(index)
+                    width: parent.width - 10
+                    wrapMode: Label.Wrap
+                }
+                Rectangle {
+                    anchors.top:  date.bottom
+                    anchors.topMargin: cust_spacing
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.right: parent.right
+                    anchors.rightMargin: 10
+                    height: 2
+                    color: "grey"
+
+                }
+
+                Label {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.top: date.bottom
+                    anchors.topMargin: cust_spacing * 2
+                    width: parent.width - 10
+                    wrapMode: Label.Wrap
+                    id: main_dish
+                    text: _cppServerConn.getFoodPlanData(index).main_dish
+                    height: text!=""? undefined:0
+                }
+
+                Rectangle {
+                    anchors.top:  main_dish.bottom
+                    anchors.topMargin: cust_spacing
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    width: parent.width / 10
+                    height: main_dish_veg.text!=""? 1:0
+                    color: "grey"
+
+                }
+
+                Label {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.top: main_dish.bottom
+                    anchors.topMargin: cust_spacing * 2
+                    id: main_dish_veg
+                    text: _cppServerConn.getFoodPlanData(index).main_dish_veg
+                    width: parent.width - 10
+                    wrapMode: Label.Wrap
+                    height: text!=""? undefined:0
+                }
+
+                Rectangle {
+                    anchors.top:  main_dish_veg.bottom
+                    anchors.topMargin: cust_spacing
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    width: parent.width / 10
+                    height: garnish.text!=""? 1:0
+                    color: "grey"
+                }
+
+                Label {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.top: main_dish_veg.bottom
+                    anchors.topMargin: cust_spacing * 2
+                    id: garnish
+                    text: _cppServerConn.getFoodPlanData(index).garnish
+                    width: parent.width - 10
+                    wrapMode: Label.Wrap
+                    height: text!=""? undefined:0
+                }
+
+                Rectangle {
+                    anchors.top:  garnish.bottom
+                    anchors.topMargin: cust_spacing
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    width: parent.width / 10
+                    height: dessert.text!=""? 1:0
+                    color: "grey"
+
+                }
+
+                Label {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.top: garnish.bottom
+                    anchors.topMargin: cust_spacing * 2
+                    id: dessert
+                    text: _cppServerConn.getFoodPlanData(index).dessert
+                    width: parent.width - 10
+                    wrapMode: Label.Wrap
+                    height: text!=""? undefined:0
+                }
+
+                Label {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.top: dessert.bottom
+                    anchors.topMargin: cust_spacing
+                    id: spacer
+                    text: ""
+                }
+            }
+
+            function getDateString(index){
+                var date = _cppServerConn.getFoodPlanData(index).date
+                console.log(date.getTime())
+                console.log(today.getTime())
+                if(date.getDate() === today.getDate()){
+                    return("Heute")
+                }
+                else if(date.getTime() < (today.getTime() + (24 * 60 * 60 * 1000) )/*date.getDate() === today.getDate() + 1 || (date.getDate() === 1 && date.getMonth() === today.getMonth() + 1)*/){
+                    return("Morgen")
+                }
+                else {
+                    return(Qt.formatDateTime(_cppServerConn.getFoodPlanData(index).date, "dddd, d.M.yy"))
+                }
+
+            }
+            function isDayVisible(index){
+                var date = _cppServerConn.getFoodPlanData(index).date
+    //            console.warn(date.getTime())
+    //            console.warn(today.getTime())
+    //            console.log("")
+                return( date.getTime() > today.getTime() || date.getDate() === today.getDate()/*(date.getDate() >= today.getDate() && date.getMonth() >= today.getMonth()) || (date.getDate() < today.getDate() && date.getMonth() >= today.getMonth())*/)
+            }
+        }
+    }
+
+    Rectangle {
+        id: errorRect
+
+        anchors {
+            left: parent.left
+            right: parent.right
+            verticalCenter: parent.verticalCenter
+            margins: parent.width * 0.15
+        }
+
+        radius: height * 0.5
+        height: width
+
+        color: "transparent"
+        border.width: 5
+        border.color: "red"
+
+        visible: _cppServerConn.getFoodPlanData(0).cookteam === ""
+
+        Label {
+            anchors.centerIn: parent
+            text: "keine Daten..."
+        }
+    }
+}
+
+
+
--- a/qml/Forms/EventForm.qml
+++ b/qml/Forms/EventForm.qml
@ -3,13 +3,18 @@ import QtQuick.Controls 2.2
 import QtGraphicalEffects 1.0

 Page {
-    id:root
+    id: root
    //anchors.fill: parent
-    property bool cookplanChanged
+    property string day
    title: qsTr("Vertretungsplan")
    property string icon: "qrc:/graphics/FannyLogo_small.png"
    property string link: "http://www.fanny-leicht.de/j34"

+    signal opened()
+
+    onOpened: {
+    }
+
 //    Image{
 //        source: "qrc:/graphics/chat_background.jpg";
 //        height: parent.height
@ -28,112 +33,31 @@ Page {
 //        }
 //    }

-    Timer {
-        id: firstLoadTimer
-        interval: 1;
-        running: true
-        repeat: false
+    Loader {
+        id: pageLoader
+        anchors.fill: parent
+        source: "./LoadingForm.qml"

-        onTriggered: {
-            _cppServerConn.getFoodPlan()
-            cookplanChanged = true
+        onSourceChanged: animation.start()
+
+        NumberAnimation {
+            id: animation
+            target: pageLoader.item
+            property: "opacity"
+            from: 0
+            to: 100
+            duration: 500
+            easing.type: Easing.InExpo
        }
    }

-    ScrollView {
-        id:scroll
-        anchors.fill: parent
-        ListView {
-            id: listView
-            //width: 514
-            model: _cppServerConn.getEventCount()
-            spacing: 0
-            property var today: new Date
-            anchors {
-                right: parent.right
-                left: parent.left
-                top: parent.top
-                bottom: parent.bottom
-                leftMargin: 5
-                rightMargin: 5
-                topMargin: 3
-            }
-
-            delegate: Button {
-
-                width: listView.width
-                id: delegate
-                height: visible ? cookteam.height + date.height + text.height + spacer.height + cust_spacing*9 + 5:0
-                visible: listView.isDayVisible(index)
-
-                property int cust_spacing: 5
-
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: parent.top
-                    anchors.topMargin: 10
-                    font.bold: true
-                    font.pixelSize: date.font.pixelSize * 1.5
-                    id: cookteam
-                    text: _cppServerConn.getEventData(index).grade
-                    width: parent.width - 10
-                    wrapMode: Label.Wrap
-                    height: text!==""? undefined:0
-                }
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: cookteam.bottom
-                    id: date
-                    text: _cppServerConn.getEventData(index).hour + " | "
-                          + _cppServerConn.getEventData(index).replace + " | "
-                          + _cppServerConn.getEventData(index).subject + " | "
-                          + _cppServerConn.getEventData(index).room + " | "
-
-                    width: parent.width - 10
-                    wrapMode: Label.Wrap
-                }
-
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: date.bottom
-                    anchors.topMargin: cust_spacing
-                    font.pixelSize: date.font.pixelSize * 2
-                    font.bold: true
-                    id: text
-                    text: _cppServerConn.getEventData(index).to + " " + _cppServerConn.getEventData(index).text
-                }
-
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: text.bottom
-                    anchors.topMargin: cust_spacing
-                    id: spacer
-                    text: ""
-                }
-            }
-
-            function getDateString(index){
-                var date = _cppServerConn.getEventData(index).date
-                console.log(date.getTime())
-                console.log(today.getTime())
-                if(date.getDate() === today.getDate()){
-                    return("Heute")
-                }
-                else if(date.getTime() < (today.getTime() + (24 * 60 * 60 * 1000) )/*date.getDate() === today.getDate() + 1 || (date.getDate() === 1 && date.getMonth() === today.getMonth() + 1)*/){
-                    return("Morgen")
-                }
-                else {
-                    return(Qt.formatDateTime(_cppServerConn.getEventData(index).date, "dddd, d.M.yy"))
-                }
-
-            }
-            function isDayVisible(index){
-            return(true)
-            }
+    Timer {
+        interval: 500
+        running: true
+        repeat: false
+        onTriggered: {
+            _cppServerConn.getEvents(day);
+            pageLoader.source = "../Components/EventDisplay.qml"
        }
    }
 }
--- a/qml/Forms/FoodPlanForm.qml
+++ b/qml/Forms/FoodPlanForm.qml
@ -1,5 +1,5 @@
 import QtQuick 2.9
-import QtQuick.Controls 2.2
+import QtQuick.Controls 2.4
 import QtGraphicalEffects 1.0

 Page {
@ -10,6 +10,12 @@ Page {
    property string icon: "qrc:/graphics/images/TreffpunktFannyLogo.png"
    property string link: "http://www.treffpunkt-fanny.de"

+    signal opened()
+
+    onOpened: {
+        console.warn("foodplan opened")
+    }
+
 //    Image{
 //        source: "qrc:/graphics/chat_background.jpg";
 //        height: parent.height
@ -28,192 +34,33 @@ Page {
 //        }
 //    }

+    Loader {
+        id: pageLoader
+        anchors.fill: parent
+        source: "./LoadingForm.qml"
+
+        onSourceChanged: animation.start()
+
+        NumberAnimation {
+            id: animation
+            target: pageLoader.item
+            property: "opacity"
+            from: 0
+            to: 100
+            duration: 500
+            easing.type: Easing.InExpo
+        }
+    }
+
    Timer {
-        id: firstLoadTimer
-        interval: 1;
+        interval: 500
        running: true
        repeat: false
-
        onTriggered: {
            _cppServerConn.getFoodPlan()
-            cookplanChanged = true
+            pageLoader.source = "../Components/FoodPlanDisplay.qml"
        }
    }

-    ScrollView {
-        id:scroll
-        anchors.fill: parent
-        ListView {
-            id: listView
-            //width: 514
-            model: 8
-            spacing: 0
-            property var today: new Date
-            anchors {
-                right: parent.right
-                left: parent.left
-                top: parent.top
-                bottom: parent.bottom
-                leftMargin: 5
-                rightMargin: 5
-                topMargin: 3
-            }

-            delegate: Button {
-
-                width: listView.width
-                id: delegate
-                height: visible ? cookteam.height + date.height + main_dish.height + main_dish_veg.height + garnish.height + dessert.height + spacer.height + cust_spacing*9 + 5:0
-                visible: listView.isDayVisible(index)
-
-                property int cust_spacing: 5
-
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: parent.top
-                    anchors.topMargin: 10
-                    font.bold: true
-                    id: cookteam
-                    text: _cppServerConn.getFoodPlanData(index).cookteam
-                    width: parent.width - 10
-                    wrapMode: Label.Wrap
-                    height: text!=""? undefined:0
-                }
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: cookteam.bottom
-                    font.bold: true
-                    id: date
-                    text: listView.getDateString(index)
-                    width: parent.width - 10
-                    wrapMode: Label.Wrap
-                }
-                Rectangle {
-                    anchors.top:  date.bottom
-                    anchors.topMargin: cust_spacing
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.right: parent.right
-                    anchors.rightMargin: 10
-                    height: 2
-                    color: "grey"
-
-                }
-
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: date.bottom
-                    anchors.topMargin: cust_spacing * 2
-                    width: parent.width - 10
-                    wrapMode: Label.Wrap
-                    id: main_dish
-                    text: _cppServerConn.getFoodPlanData(index).main_dish
-                    height: text!=""? undefined:0
-                }
-
-                Rectangle {
-                    anchors.top:  main_dish.bottom
-                    anchors.topMargin: cust_spacing
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    width: parent.width / 10
-                    height: main_dish_veg.text!=""? 1:0
-                    color: "grey"
-
-                }
-
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: main_dish.bottom
-                    anchors.topMargin: cust_spacing * 2
-                    id: main_dish_veg
-                    text: _cppServerConn.getFoodPlanData(index).main_dish_veg
-                    width: parent.width - 10
-                    wrapMode: Label.Wrap
-                    height: text!=""? undefined:0
-                }
-
-                Rectangle {
-                    anchors.top:  main_dish_veg.bottom
-                    anchors.topMargin: cust_spacing
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    width: parent.width / 10
-                    height: garnish.text!=""? 1:0
-                    color: "grey"
-                }
-
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: main_dish_veg.bottom
-                    anchors.topMargin: cust_spacing * 2
-                    id: garnish
-                    text: _cppServerConn.getFoodPlanData(index).garnish
-                    width: parent.width - 10
-                    wrapMode: Label.Wrap
-                    height: text!=""? undefined:0
-                }
-
-                Rectangle {
-                    anchors.top:  garnish.bottom
-                    anchors.topMargin: cust_spacing
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    width: parent.width / 10
-                    height: dessert.text!=""? 1:0
-                    color: "grey"
-
-                }
-
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: garnish.bottom
-                    anchors.topMargin: cust_spacing * 2
-                    id: dessert
-                    text: _cppServerConn.getFoodPlanData(index).dessert
-                    width: parent.width - 10
-                    wrapMode: Label.Wrap
-                    height: text!=""? undefined:0
-                }
-
-                Label {
-                    anchors.left: parent.left
-                    anchors.leftMargin: 10
-                    anchors.top: dessert.bottom
-                    anchors.topMargin: cust_spacing
-                    id: spacer
-                    text: ""
-                }
-            }
-
-            function getDateString(index){
-                var date = _cppServerConn.getFoodPlanData(index).date
-                console.log(date.getTime())
-                console.log(today.getTime())
-                if(date.getDate() === today.getDate()){
-                    return("Heute")
-                }
-                else if(date.getTime() < (today.getTime() + (24 * 60 * 60 * 1000) )/*date.getDate() === today.getDate() + 1 || (date.getDate() === 1 && date.getMonth() === today.getMonth() + 1)*/){
-                    return("Morgen")
-                }
-                else {
-                    return(Qt.formatDateTime(_cppServerConn.getFoodPlanData(index).date, "dddd, d.M.yy"))
-                }
-
-            }
-            function isDayVisible(index){
-                var date = _cppServerConn.getFoodPlanData(index).date
-                console.log(date.getTime())
-                console.log(today.getTime())
-                console.log("")
-                return( date.getTime() > today.getTime() || date.getDate() === today.getDate()/*(date.getDate() >= today.getDate() && date.getMonth() >= today.getMonth()) || (date.getDate() < today.getDate() && date.getMonth() >= today.getMonth())*/)
-            }
-        }
-    }
 }
--- a/qml/Forms/HomeForm.qml
+++ b/qml/Forms/HomeForm.qml
@ -1,210 +1,187 @@
 import QtQuick 2.9
-import QtQuick.Controls 2.2
-import QtGraphicalEffects 1.0
+import QtQuick.Controls 2.4

 import "../Components"

 Page {
-    //anchors.fill: parent
+    id: root

-    title: qsTr("Vertretungsplan")
-    property string icon: "qrc:/graphics/images/FannyLogo_small.png"
-    property string link: "http://www.fanny-leicht.de/j34"
+    signal opened()

-//    Image{
-//        source: "qrc:/graphics/chat_background.jpg";
-//        height: parent.height
-//        width: parent.width
-//        fillMode: Image.Tile
-//        horizontalAlignment: Image.AlignLeft
-//        verticalAlignment: Image.AlignTop
-//    }
+    onOpened: {
+        console.log("Home Form opened")
+    }

+    Column {
+        id: mainMenu
+        spacing: buttonWidth * 0.1

-//    LinearGradient {
-//        anchors.fill: parent
-//        start: Qt.point(0, 0)
-//        end: Qt.point(0, parent.height)
-//        gradient: Gradient {
-//            GradientStop { position: 0.0; color: "#4db2b3" }
-//            GradientStop { position: 1.0; color: "#8f4dae" }
-//        }
-//    }
-
-    Label {
-        id: laWelcome
-        text: "Hier kannst du dir den Vertretungsplan des Fannys anschauen"
-        font.pixelSize: 20
-        wrapMode: Label.Wrap
-        width: window.width / 1.2
-        color: app.text_color
        anchors {
-            top: parent.top
-            topMargin: window.height / 8 - laWelcome.height / 2
            horizontalCenter: parent.horizontalCenter
-        }
-    }
-
-    Button {
-        id:buttToday
-        enabled: window.is_error === false
-        anchors {
-            left: parent.left
-            leftMargin: (window.width / 4) -  (buttToday.width / 2)
            verticalCenter: parent.verticalCenter
        }

-        onClicked: {
-            verificationDialog.day = "sheute"
-            verificationDialog.open()
+//        width: childrenRect.width
+//        height: childrenRect.height
+
+        property int buttonHeight: app.landscape() ? root.height * (0.5*0.8):buttonWidth
+        property int buttonWidth: app.landscape() ? buttonHeight:root.width * (0.5*0.8)
+
+        Row {
+            id: bigMenu
+            spacing: mainMenu.buttonWidth * 0.1
+            anchors.horizontalCenter: parent.horizontalCenter
+
+            FancyButton {
+                id: todayButton
+
+                image: "qrc:/graphics/sheute.png"
+
+                width: mainMenu.buttonWidth
+                height: mainMenu.buttonHeight
+
+                onClicked: {
+                    eventConfirmationDialog.openDay("sheute")
+                }
+            }
+
+            FancyButton {
+                id: tomorrowButton
+
+                image: "qrc:/graphics/smorgen.png"
+
+                width: mainMenu.buttonWidth
+                height: mainMenu.buttonHeight
+
+                onClicked: {
+                    eventConfirmationDialog.openDay("smorgen")
+                }
+            }
+
+            Dialog {
+                property string day
+                id: eventConfirmationDialog
+
+                modal: true
+                focus: true
+
+                title: "Bedingung"
+
+                x: (app.width - eventConfirmationDialog.width) / 2
+                y: (app.height - eventConfirmationDialog.height) / 2
+                parent: Overlay.overlay
+                width: Math.min(root.width, root.height) / 3 * 2
+                contentHeight: aboutColumn.height
+                standardButtons: Dialog.Ok | Dialog.Cancel
+
+                onAccepted: {
+                    formStack.eventDay = day
+                    formStack.push(eventForm)
+                }
+
+                Column {
+                    id: aboutColumn
+                    spacing: 20
+                    Label {
+                        id: text
+                        visible: true
+                        width: eventConfirmationDialog.availableWidth
+                        wrapMode: Label.Wrap
+                        text: "Vertretungsplan, vertraulich, nur zum persönlichen Gebrauch, keine Speicherung!"
+                    }
+                }
+
+                function openDay(day){
+                    eventConfirmationDialog.day = day
+                    eventConfirmationDialog.open()
+                }
+            }
+
        }

-        onPressed: sheuteImage.scale = 0.9
-        onReleased: sheuteImage.scale = 1.0
+        Grid {
+            id: smallMenu
+            columns: app.landscape() ? 4:2
+            spacing: mainMenu.buttonWidth * 0.1

-        background: Image {
-            id: sheuteImage
-            source: "qrc:/graphics/sheute.png"
+            anchors.horizontalCenter: parent.horizontalCenter

-            Behavior on scale {
-                PropertyAnimation {
-                    duration: 100
+            property int buttonHeight: mainMenu.buttonHeight * 0.7
+            property int buttonWidth: mainMenu.buttonWidth * 0.7
+
+            FancyButton {
+                id: foodplanButton
+
+                image: "qrc:/graphics/images/TreffpunktFannyLogoDark.png"
+
+                width: smallMenu.buttonWidth
+                height: smallMenu.buttonHeight
+
+                onClicked: {
+                    formStack.push(foodPlanForm)
+                }
+            }
+
+            FancyButton {
+                id: fannyButton
+
+                image: "qrc:/graphics/images/FannyLogoDark.jpg"
+                imageScale: 1.2
+
+                width: smallMenu.buttonWidth
+                height: smallMenu.buttonHeight
+
+                onClicked: {
+                    Qt.openUrlExternally("http://www.fanny-leicht.de")
+                }
+            }
+
+            FancyButton {
+                id: settingsButton
+
+                image: "qrc:/graphics/icons/settingsBlack.png"
+                imageScale: 0.8
+
+                width: smallMenu.buttonWidth
+                height: smallMenu.buttonHeight
+            }
+
+            FancyButton {
+                id: logoutButton
+
+                image: "qrc:/graphics/icons/logoutRed.png"
+                imageScale: 0.8
+
+                width: smallMenu.buttonWidth
+                height: smallMenu.buttonHeight
+
+                onClicked: {
+                    logoutConfirmationDialog.open()
+                }
+
+                Dialog {
+                    id: logoutConfirmationDialog
+
+                    x: (app.width - width) / 2
+                    y: (app.height - height) / 2
+                    parent: Overlay.overlay
+
+                    modal: true
+                    standardButtons: Dialog.Cancel | Dialog.Ok
+                    Column {
+                        spacing: 20
+                        anchors.fill: parent
+                        Label {
+                            text: "Möchtest du dich wirklich abmelden?"
+                        }
+                    }
+                    onAccepted: {
+                        _cppServerConn.logout()
+                        app.state = "notLoggedInu"
+                    }
                }
            }
        }
    }

-    Button {
-        id: buttTomorrow
-        enabled: window.is_error === false
-        anchors {
-            right: parent.right
-            rightMargin: (window.width / 4) -  (buttTomorrow.width / 2)
-            verticalCenter: parent.verticalCenter
-        }
-
-        onClicked: {
-            verificationDialog.day = "smorgen"
-            verificationDialog.open()
-        }
-
-        onPressed: smorgenImage.scale = 0.9
-        onReleased: smorgenImage.scale = 1.0
-
-        background: Image {
-            id: smorgenImage
-            source: "qrc:/graphics/smorgen.png"
-
-            Behavior on scale {
-                PropertyAnimation {
-                    duration: 100
-                }
-            }
-        }
-
-    }
-
-    Rectangle {
-        id: buttonsDisabled
-        anchors.left: buttToday.left
-        anchors.right: buttTomorrow.right
-        anchors.top: buttToday.top
-        anchors.bottom: buttToday.bottom
-        color: "white"
-        opacity: 0.7
-        visible: app.is_error
-    }
-
-    Dialog {
-        property string day
-        id: verificationDialog
-        modal: true
-        focus: true
-        title: "Bedingung"
-        x: (window.width - width) / 2
-        y: window.height / 6
-        width: Math.min(window.width, window.height) / 3 * 2
-        contentHeight: aboutColumn.height
-        standardButtons: Dialog.Ok | Dialog.Cancel
-        onAccepted: {
-            _cppServerConn.updateProgress(0,100)
-            busyDialog.open()
-            text.visible = false
-            var ret = _cppServerConn.getDay(day)
-            progressCircle.arcEnd = 36000
-            progress.text = "100%"
-            busyDialog.close()
-            text.visible = true
-            if(ret.startsWith("OK")){
-                var path = ret.replace("OK_", "");
-                Qt.openUrlExternally(path);
-                return
-            }
-            else if(ret === "Ungültige Benutzerdaten."){
-                root.StackView.view.pop()
-            }
-            else {
-                error.text = ret
-                window.is_error = true
-                window.error = ret
-                error.visible = true
-            }
-        }
-
-        Column {
-            id: aboutColumn
-            spacing: 20
-            Label {
-                id: text
-                visible: true
-                width: verificationDialog.availableWidth
-                wrapMode: Label.Wrap
-                text: "Vertretungsplan, vertraulich, nur zum persönlichen Gebrauch, keine Speicherung!"
-            }
-        }
-    }
-
-    Dialog {
-        id: busyDialog
-        modal: true
-        closePolicy: "NoAutoClose"
-        focus: true
-        //title: "Please wait..."
-        x: (window.width - width) / 2
-        y: window.height / 6
-        //width: Math.min(window.width, window.height) / 3 * 2
-        height: contentHeight * 1.5
-        width: contentWidth * 1.5
-        contentHeight: progressCircle.height
-        contentWidth: progressCircle.width
-
-        ProgressCircle {
-            id: progressCircle
-            size: 50
-            lineWidth: 5
-            anchors.centerIn: parent
-            colorCircle: "#FF3333"
-            colorBackground: "#E6E6E6"
-             showBackground: true
-             arcBegin: 0
-             arcEnd: 0
-             Label {
-                 id: progress
-                 anchors.centerIn: parent
-                 text: "0%"
-             }
-             Timer {
-                 id: refreshTimer
-                 interval: 1;
-                 running: busyDialog.visible
-                 repeat: true
-                 onTriggered: {
-                     var ret = _cppServerConn.getProgress()
-
-                     progressCircle.arcEnd = 360 * ret * 1.2
-                     progress.text = Math.round( ret * 100 ) + "%"
-                 }
-             }
-        }
-    }
 }
--- a/qml/Forms/HomeForm[old].qml
+++ b/qml/Forms/HomeForm[old].qml
@ -0,0 +1,210 @@
+import QtQuick 2.9
+import QtQuick.Controls 2.2
+import QtGraphicalEffects 1.0
+
+import "../Components"
+
+Page {
+    //anchors.fill: parent
+
+    title: qsTr("Vertretungsplan")
+    property string icon: "qrc:/graphics/images/FannyLogo_small.png"
+    property string link: "http://www.fanny-leicht.de/j34"
+
+//    Image{
+//        source: "qrc:/graphics/chat_background.jpg";
+//        height: parent.height
+//        width: parent.width
+//        fillMode: Image.Tile
+//        horizontalAlignment: Image.AlignLeft
+//        verticalAlignment: Image.AlignTop
+//    }
+
+
+//    LinearGradient {
+//        anchors.fill: parent
+//        start: Qt.point(0, 0)
+//        end: Qt.point(0, parent.height)
+//        gradient: Gradient {
+//            GradientStop { position: 0.0; color: "#4db2b3" }
+//            GradientStop { position: 1.0; color: "#8f4dae" }
+//        }
+//    }
+
+    Label {
+        id: laWelcome
+        text: "Hier kannst du dir den Vertretungsplan des Fannys anschauen"
+        font.pixelSize: 20
+        wrapMode: Label.Wrap
+        width: window.width / 1.2
+        color: app.text_color
+        anchors {
+            top: parent.top
+            topMargin: window.height / 8 - laWelcome.height / 2
+            horizontalCenter: parent.horizontalCenter
+        }
+    }
+
+    Button {
+        id:buttToday
+        enabled: window.is_error === false
+        anchors {
+            left: parent.left
+            leftMargin: (window.width / 4) -  (buttToday.width / 2)
+            verticalCenter: parent.verticalCenter
+        }
+
+        onClicked: {
+            verificationDialog.day = "sheute"
+            verificationDialog.open()
+        }
+
+        onPressed: sheuteImage.scale = 0.9
+        onReleased: sheuteImage.scale = 1.0
+
+        background: Image {
+            id: sheuteImage
+            source: "qrc:/graphics/sheute.png"
+
+            Behavior on scale {
+                PropertyAnimation {
+                    duration: 100
+                }
+            }
+        }
+    }
+
+    Button {
+        id: buttTomorrow
+        enabled: window.is_error === false
+        anchors {
+            right: parent.right
+            rightMargin: (window.width / 4) -  (buttTomorrow.width / 2)
+            verticalCenter: parent.verticalCenter
+        }
+
+        onClicked: {
+            verificationDialog.day = "smorgen"
+            verificationDialog.open()
+        }
+
+        onPressed: smorgenImage.scale = 0.9
+        onReleased: smorgenImage.scale = 1.0
+
+        background: Image {
+            id: smorgenImage
+            source: "qrc:/graphics/smorgen.png"
+
+            Behavior on scale {
+                PropertyAnimation {
+                    duration: 100
+                }
+            }
+        }
+
+    }
+
+    Rectangle {
+        id: buttonsDisabled
+        anchors.left: buttToday.left
+        anchors.right: buttTomorrow.right
+        anchors.top: buttToday.top
+        anchors.bottom: buttToday.bottom
+        color: "white"
+        opacity: 0.7
+        visible: app.is_error
+    }
+
+    Dialog {
+        property string day
+        id: verificationDialog
+        modal: true
+        focus: true
+        title: "Bedingung"
+        x: (window.width - width) / 2
+        y: window.height / 6
+        width: Math.min(window.width, window.height) / 3 * 2
+        contentHeight: aboutColumn.height
+        standardButtons: Dialog.Ok | Dialog.Cancel
+        onAccepted: {
+            _cppServerConn.updateProgress(0,100)
+            busyDialog.open()
+            text.visible = false
+            var ret = _cppServerConn.getDay(day)
+            progressCircle.arcEnd = 36000
+            progress.text = "100%"
+            busyDialog.close()
+            text.visible = true
+            if(ret.startsWith("OK")){
+                var path = ret.replace("OK_", "");
+                Qt.openUrlExternally(path);
+                return
+            }
+            else if(ret === "Ungültige Benutzerdaten."){
+                root.StackView.view.pop()
+            }
+            else {
+                error.text = ret
+                window.is_error = true
+                window.error = ret
+                error.visible = true
+            }
+        }
+
+        Column {
+            id: aboutColumn
+            spacing: 20
+            Label {
+                id: text
+                visible: true
+                width: verificationDialog.availableWidth
+                wrapMode: Label.Wrap
+                text: "Vertretungsplan, vertraulich, nur zum persönlichen Gebrauch, keine Speicherung!"
+            }
+        }
+    }
+
+    Dialog {
+        id: busyDialog
+        modal: true
+        closePolicy: "NoAutoClose"
+        focus: true
+        //title: "Please wait..."
+        x: (window.width - width) / 2
+        y: window.height / 6
+        //width: Math.min(window.width, window.height) / 3 * 2
+        height: contentHeight * 1.5
+        width: contentWidth * 1.5
+        contentHeight: progressCircle.height
+        contentWidth: progressCircle.width
+
+        ProgressCircle {
+            id: progressCircle
+            size: 50
+            lineWidth: 5
+            anchors.centerIn: parent
+            colorCircle: "#FF3333"
+            colorBackground: "#E6E6E6"
+             showBackground: true
+             arcBegin: 0
+             arcEnd: 0
+             Label {
+                 id: progress
+                 anchors.centerIn: parent
+                 text: "0%"
+             }
+             Timer {
+                 id: refreshTimer
+                 interval: 1;
+                 running: busyDialog.visible
+                 repeat: true
+                 onTriggered: {
+                     var ret = _cppServerConn.getProgress()
+
+                     progressCircle.arcEnd = 360 * ret * 1.2
+                     progress.text = Math.round( ret * 100 ) + "%"
+                 }
+             }
+        }
+    }
+}
--- a/qml/Forms/LoadingForm.qml
+++ b/qml/Forms/LoadingForm.qml
@ -0,0 +1,10 @@
+import QtQuick 2.9
+import QtQuick.Controls 2.4
+
+Page {
+    id: root
+
+    BusyIndicator {
+        anchors.centerIn: parent
+    }
+}
--- a/qml/Forms/WebsiteForm.qml
+++ b/qml/Forms/WebsiteForm.qml
@ -1,8 +1,7 @@
-import QtQuick 2.9
+import QtQuick 2.2
 import QtWebView 1.1
 import QtQuick.Controls 2.2

-import QtQuick.Layouts 1.1
 import QtQuick.Controls.Styles 1.2

 Page {
--- a/qml/Pages/LoginPage.qml
+++ b/qml/Pages/LoginPage.qml
@ -15,7 +15,7 @@ Page {
        Label {
            text: "Anmeldung"
            anchors.centerIn: parent
-            color: "white"
+            color: "black"
        }
    }

@ -72,7 +72,6 @@ Page {
                right: parent.right
                rightMargin: root.width * 0.05
            }
-
        }


@ -222,8 +221,8 @@ Page {
        loginButton.text = "Login"
        if(ret === "OK"){
            _cppAppSettings.writeSetting("init", 1);
-            window.is_error = false;
-            root.StackView.view.push("MainPage.qml")
+            app.is_error = false;
+            app.state = "loggedIn"
        }
        else{
            if(_cppAppSettings.loadSetting("permanent") === "1"){
@ -244,7 +243,7 @@ Page {
        closePolicy: "NoAutoClose"
        focus: true
        title: "Please wait..."
-        x: (window.width - width) / 2
+        x: (app.width - width) / 2
        y: window.height / 6
        width: Math.min(window.width, window.height) / 3 * 2
        height: 150
--- a/qml/Pages/StartPage.qml
+++ b/qml/Pages/StartPage.qml
@ -1,7 +1,9 @@
 import QtQuick 2.9
 import QtQuick.Controls 2.4
+import QtGraphicalEffects 1.0

 import "../Components"
+import "../Forms"

 Page {
    id: root
@ -9,111 +11,169 @@ Page {

    Shortcut {
        sequences: ["Esc", "Back"]
-        enabled: stackView.depth > 1
+        enabled: formStack.depth > 1
        onActivated: {
-            stackView.pop()
+            formStack.pop()
        }
    }

-    Item {
-        id: mainMenu
+    StackView {
+        id: formStack
+        property var currPage
+        property string eventDay: ""

        anchors {
-            horizontalCenter: parent.horizontalCenter
-            verticalCenter: parent.verticalCenter
+            top: toolBar.bottom
+            left: parent.left
+            right: parent.right
+            bottom: parent.bottom
        }

-        width: childrenRect.width
-        height: childrenRect.height
-
-        property int buttonHeight: app.landscape() ? root.height * (0.3*0.8):buttonWidth
-        property int buttonWidth: app.landscape() ? buttonHeight:root.width * (0.5*0.8)
-
-
-        FancyButton {
-            id: todayButton
-
-            image: "qrc:/graphics/sheute.png"
-
-            anchors {
-                left: parent.left
-                top: parent.top
-            }
-
-            width: mainMenu.buttonWidth
-            height: mainMenu.buttonHeight
+        onCurrPageChanged: {
+            mainStack.replace(currPage)
        }

-        FancyButton {
-            id: tomorrowButton
-
-            image: "qrc:/graphics/smorgen.png"
-
-            anchors {
-                left: todayButton.right
-                verticalCenter: todayButton.verticalCenter
-            }
-
-            width: mainMenu.buttonWidth
-            height: mainMenu.buttonHeight
+        onCurrentItemChanged: {
+            formStack.currentItem.opened()
        }

-        FancyButton {
-            id: foodplanButton
+        initialItem: homeForm

-            image: "qrc:/graphics/images/TreffpunktFannyLogoDark.png"
-
-            anchors {
-                top: todayButton.bottom
-                horizontalCenter: todayButton.horizontalCenter
-            }
-
-            width: mainMenu.buttonWidth
-            height: mainMenu.buttonHeight
+        Component {
+            id: homeForm
+            HomeForm {}
        }

-        FancyButton {
-            id: fannyButton
-
-            image: "qrc:/graphics/images/FannyLogoDark.jpg"
-
-            anchors {
-                top: tomorrowButton.bottom
-                horizontalCenter: tomorrowButton.horizontalCenter
-            }
-
-            width: mainMenu.buttonWidth
-            height: mainMenu.buttonHeight
+        Component {
+            id: foodPlanForm
+            FoodPlanForm {}
        }

-        FancyButton {
-            id: logoutButton
-
-            image: "qrc:/graphics/icons/logoutRed.png"
-            imageScale: 0.8
-
-            anchors {
-                top: foodplanButton.bottom
-                horizontalCenter: foodplanButton.horizontalCenter
+        Component {
+            id: eventForm
+            EventForm {
+                day: formStack.eventDay
            }
-
-            width: mainMenu.buttonWidth
-            height: mainMenu.buttonHeight
        }

-        FancyButton {
-            id: settingsButton
-
-            image: "qrc:/graphics/icons/settingsBlack.png"
-            imageScale: 0.8
-
-            anchors {
-                top: fannyButton.bottom
-                horizontalCenter: fannyButton.horizontalCenter
+        popEnter: Transition {
+            XAnimator {
+                from: (formStack.mirrored ? -1 : 1) * -formStack.width
+                to: 0
+                duration: 500
+                easing.type: Easing.OutCubic
            }
+        }

-            width: mainMenu.buttonWidth
-            height: mainMenu.buttonHeight
+        popExit: Transition {
+            XAnimator {
+                from: 0
+                to: (formStack.mirrored ? -1 : 1) * formStack.width
+                duration: 500
+                easing.type: Easing.OutCubic
+            }
+        }
+
+        pushEnter: Transition {
+            XAnimator {
+                from: (formStack.mirrored ? -1 : 1) * formStack.width
+                to: 0
+                duration: 500
+                easing.type: Easing.OutCubic
+            }
+        }
+
+        pushExit: Transition {
+            XAnimator {
+                from: 0
+                to: (formStack.mirrored ? -1 : 1) * -formStack.width
+                duration: 500
+                easing.type: Easing.OutCubic
+            }
        }
    }
+
+    AppToolBar {
+        id: toolBar
+
+        anchors {
+            top: parent.top
+            left: parent.left
+            right: parent.right
+            topMargin: -60
+        }
+
+        height: 50
+
+        Button {
+            id:toolButton
+            enabled: true
+            anchors {
+                left: parent.left
+                verticalCenter: parent.verticalCenter
+                leftMargin: parent.width *0.02
+            }
+            height: parent.height - parent.height * 0.5
+            width: height
+
+            onClicked: {
+                if (formStack.depth > 1) {
+                    formStack.pop()
+                } else {
+                    drawer.open()
+                }
+            }
+
+            onPressed: toolButton.scale = 0.9
+            onReleased: toolButton.scale = 1.0
+
+            background: Image {
+                source: formStack.depth > 1 ? "qrc:/graphics/icons/backDark.png" : "qrc:/graphics/icons/drawer.png"
+                height: parent.height
+                width: parent.width
+                Behavior on scale {
+                    PropertyAnimation {
+                        duration: 100
+                    }
+                }
+            }
+        }
+
+        Label {
+            text: formStack.currentItem.title
+            anchors {
+                verticalCenter: parent.verticalCenter
+                left: toolButton.right
+                leftMargin: parent.width * 0.02
+            }
+            font.bold: true
+            color: "black"
+        }
+
+        Behavior on anchors.topMargin {
+            NumberAnimation {
+                duration: 500
+                easing.type: Easing.OutCubic
+            }
+        }
+
+        states: [
+            State {
+                name: "closed"
+                when: formStack.depth === 1
+                PropertyChanges {
+                    target: toolBar
+                    anchors.topMargin: -60
+                }
+            },
+            State {
+                name: "open"
+                when: formStack.depth > 1
+                PropertyChanges {
+                    target: toolBar
+                    anchors.topMargin: 0
+                }
+            }
+        ]
+    }
 }
--- a/qml/main.qml
+++ b/qml/main.qml
@ -146,9 +146,9 @@ ApplicationWindow {
                _cppAppSettings.writeSetting("permanent", 0)
                _cppAppSettings.writeSetting("username", "")
                _cppAppSettings.writeSetting("password", "")
-                if(["LoginPage"].indexOf(stackView.currentItem.objectName) < 0){
+                if(app.state !== "notLoggedIn"){
                    console.log("switching to login page")
-                    stackView.push("./Pages/LoginPage.qml");
+                    app.state = "notLoggedIn"
                }
                app.is_error = true;
                app.error = "Nicht angemeldet!!";
--- a/qml/qml.qrc
+++ b/qml/qml.qrc
@ -1,8 +1,7 @@
 <RCC>
    <qresource prefix="/">
        <file>main.qml</file>
-        <file>Forms/HomeForm.qml</file>
-        <file>qtquickcontrols2.conf</file>
+        <file>Forms/HomeForm[old].qml</file>
        <file>Pages/LoginPage.qml</file>
        <file>Pages/MainPage.qml</file>
        <file>Components/AppToolBar.qml</file>
@ -12,5 +11,9 @@
        <file>Forms/EventForm.qml</file>
        <file>Pages/StartPage.qml</file>
        <file>Components/FancyButton.qml</file>
+        <file>Forms/HomeForm.qml</file>
+        <file>Components/FoodPlanDisplay.qml</file>
+        <file>Forms/LoadingForm.qml</file>
+        <file>Components/EventDisplay.qml</file>
    </qresource>
 </RCC>
--- a/qml/qtquickcontrols2.conf
+++ b/qml/qtquickcontrols2.conf
@ -1,9 +0,0 @@
-; This file can be edited to change the style of the application
-; Read "Qt Quick Controls 2 Configuration File" for details:
-; http://doc.qt.io/qt-5/qtquickcontrols2-configuration.html
-
-[Controls]
-Style=Material
-
-[Material]
-; Primary="#312f38"
--- a/shared/graphics/icons/back_black.png
+++ b/shared/graphics/icons/back_black.png
--- a/shared/shared.qrc
+++ b/shared/shared.qrc
@ -22,5 +22,6 @@
        <file>graphics/icons/logoutBlack.png</file>
        <file>graphics/icons/logoutRed.png</file>
        <file>graphics/icons/settingsBlack.png</file>
+        <file>graphics/icons/backDark.png</file>
    </qresource>
 </RCC>
--- a/sources/main.cpp
+++ b/sources/main.cpp
@ -1,12 +1,5 @@
-//#include <QtWebView/QtWebView>
-
-#include <QGuiApplication>
-#include <QQmlApplicationEngine>
-#include <QGuiApplication>
-#include <QQuickView>
 #include <QQuickStyle>
 #include <QStandardPaths>
-#include <QtQml>
 #include <QtNetwork>
 #include <QQmlApplicationEngine>
 #include <QFile>
@ -20,8 +13,7 @@
 #include <QScreen>
 #include <QQmlApplicationEngine>
 #include <QtQml/QQmlContext>
-//#include <QtWebView>
-
+#include <QtWebView/QtWebView>
 #include "headers/serverconn.h"
 #include "headers/appsettings.h"

@ -35,16 +27,21 @@ int main(int argc, char *argv[])
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);


-    QGuiApplication app(argc, argv);
-    //QtWebView::initialize();
+    //! [0]
+        QGuiApplication app(argc, argv);
+        QtWebView::initialize();
+    //! [0]

    QQuickStyle::setStyle("Material");
    QQmlApplicationEngine engine;
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
+    QQmlContext *context = engine.rootContext();
+
+    context->setContextProperty("_cppServerConn", pServerConn);
+    context->setContextProperty("_cppAppSettings", pAppSettings);
+
    if (engine.rootObjects().isEmpty())
        return -1;
-    engine.rootContext()->setContextProperty("_cppServerConn", pServerConn);
-    engine.rootContext()->setContextProperty("_cppAppSettings", pAppSettings);

    int ret;
    ret = app.exec();
--- a/sources/serverconn.cpp
+++ b/sources/serverconn.cpp
@ -181,17 +181,16 @@ float ServerConn::getProgress()
    return(this->progress);
 }

-int ServerConn::getEvents(){
-    /*
+int ServerConn::getEvents(QString day){
+
    this->progress = 0;
    ReturnData_t ret; //this is a custom type to store the returned data
    // Call the webservice

-    QNetworkRequest request(QUrl("http://api.itsblue.de/fanny/vertretung.php?uname=ZedlerDo&passwd=LxyJQB&day=smorgen&agree=true"));
+    QNetworkRequest request(QUrl("http://api.itsblue.de/fanny/vertretung.php?uname=" + this->username + "&passwd=" + this->password + "&day=" + day + "&agree=true"));
    request.setHeader(QNetworkRequest::ContentTypeHeader,
                      "application/x-www-form-urlencoded");

-    //set ssl configuration
    //send a POST request with the given url and data to the server
    QNetworkReply* reply;

@ -213,39 +212,16 @@ int ServerConn::getEvents(){
    }

    QString eventString = reply->readAll();
-    eventString.replace(" - ", "-");
-    eventString.replace(" / ", "/");
-    eventString.replace("<pre>", "");
-    eventString.replace("</pre>", "");
-    eventString.replace("Entfall für Lehrer", "Entfall_für_Lehrer");

-    QStringList tmp = eventString.split("\f");
-    QStringList rawEvents;
-    QList<QStringList> tmpEvents;
-    for(int i=0; i<tmp.length(); i++){
-        QStringList dayEventList = tmp[i].split("\n");
-        for(int a=0; a<9; a++){
-            dayEventList.removeAt(0);
-        }
-        rawEvents.append(dayEventList);
-    }
-
-    for(int i=0; i<rawEvents.length(); i++){
-        tmpEvents.append(rawEvents[i].split(" "));
-    }
-    tmpEvents.takeLast();
-    m_eventlist = tmpEvents;
-    qDebug() << tmpEvents;
-    */

    qDebug() << "reading xml file";
-    QFile * xmlFile = new QFile(":/samplehtml/Download File.xml");
-            if (!xmlFile->open(QIODevice::ReadOnly | QIODevice::Text)) {
-                    qDebug() << "Load XML File Problem Couldn't open xmlfile.xml to load settings for download";
-                    return 900;
-            }
+//    QFile * xmlFile = new QFile(":/samplehtml/Download File.xml");
+//            if (!xmlFile->open(QIODevice::ReadOnly | QIODevice::Text)) {
+//                    qDebug() << "Load XML File Problem Couldn't open xmlfile.xml to load settings for download";
+//                    return 900;
+//            }

-    QXmlStreamReader * xmlReader = new QXmlStreamReader(xmlFile);
+    QXmlStreamReader * xmlReader = new QXmlStreamReader(eventString);
    //qDebug() << xmlFile->readAll();
    QList<QStringList> tmpEvents;
    QStringList dayList;
@ -300,7 +276,7 @@ int ServerConn::getEvents(){

    //close reader and flush file
    xmlReader->clear();
-    xmlFile->close();
+    //xmlFile->close();

    return(200);
 }
@ -430,15 +406,15 @@ QVariantMap ServerConn::getFoodPlanData(int index)
                //qDebug() << i << m_weekplan[index][i];
            }
            else {
-                ret.append(NULL);
+                ret.append(nullptr);
            }
        }
        else {
-            ret.append(NULL);
+            ret.append(nullptr);
        }
    }
    QString date_string_on_db = ret[1];
-    QDate Date = QDate::fromString(date_string_on_db," dd.MM.yyyy");
+    QDate Date = QDate::fromString(date_string_on_db,"dd.MM.yyyy");
    //date_string_on_db
    qDebug() << Date;
    qDebug() << ret;