From ed00901a2ff732ee8e76fb09530b11355d0519b6 Mon Sep 17 00:00:00 2001
From: Kevin Whitaker <eyecreate@eyecreate.org>
Date: Mon, 11 Nov 2019 15:00:07 -0500
Subject: [PATCH] Add themed chart layout to gui. Needs backend code.

---
 CMakeLists.txt           |  2 +-
 src/CMakeLists.txt       |  2 +-
 src/contents/ui/main.qml | 35 ++++++++++++++++++++++++++++-------
 3 files changed, 30 insertions(+), 9 deletions(-)

diff --git a/CMakeLists.txt b/CMakeLists.txt
index f0f45bf..50d9fe3 100644
--- a/CMakeLists.txt
+++ b/CMakeLists.txt
@@ -28,7 +28,7 @@ include(KDECompilerSettings NO_POLICY_SCOPE)
 
 ################# Find dependencies #################
 
-find_package(Qt5 ${QT_MIN_VERSION} REQUIRED NO_MODULE COMPONENTS Core Quick Test Gui Svg QuickControls2 Bluetooth)
+find_package(Qt5 ${QT_MIN_VERSION} REQUIRED NO_MODULE COMPONENTS Core Quick Test Gui Svg QuickControls2 Bluetooth Charts)
 find_package(KF5Kirigami2 ${KF5_MIN_VERSION})
 
 ################# Enable C++11 features for clang and gcc #################
diff --git a/src/CMakeLists.txt b/src/CMakeLists.txt
index 1a048c9..224e441 100644
--- a/src/CMakeLists.txt
+++ b/src/CMakeLists.txt
@@ -7,5 +7,5 @@ set(qiflora_SRCS
 
 qt5_add_resources(RESOURCES resources.qrc)
 add_executable(qiflora ${qiflora_SRCS} ${RESOURCES})
-target_link_libraries(qiflora Qt5::Core Qt5::Qml Qt5::Quick Qt5::Svg Qt5::Bluetooth)
+target_link_libraries(qiflora Qt5::Core Qt5::Qml Qt5::Quick Qt5::Svg Qt5::Bluetooth Qt5::Charts)
 install(TARGETS qiflora ${KF5_INSTALL_TARGETS_DEFAULT_ARGS})
diff --git a/src/contents/ui/main.qml b/src/contents/ui/main.qml
index 117a457..038605c 100644
--- a/src/contents/ui/main.qml
+++ b/src/contents/ui/main.qml
@@ -2,6 +2,7 @@ import QtQuick 2.6
 import org.kde.kirigami 2.4 as Kirigami
 import QtQuick.Controls 2.0 as Controls
 import QtQuick.Layouts 1.12 as Layouts
+import QtCharts 2.3 as Charts
 import org.eyecreate.qiflora 1.0
 
 Kirigami.ApplicationWindow {
@@ -30,10 +31,10 @@ Kirigami.ApplicationWindow {
             title: "Monitor"
             
             Component.onCompleted: {
-                monitorTypes.append({"chartType": "temperature", "title": i18n("Temperature"), "icon": "filename-bpm-amarok"});
-                monitorTypes.append({"chartType": "moisture", "title": i18n("Moisture"), "icon": "colors-chromablue"});
-                monitorTypes.append({"chartType": "conductivity", "title": i18n("Conductivity"), "icon": "quickopen"});
-                monitorTypes.append({"chartType": "brightness", "title": i18n("Brightness"), "icon": "contrast"});
+                monitorTypes.append({"chartType": "temperature", "title": i18n("Temperature"), "icon": "filename-bpm-amarok", "lineColor": "red"});
+                monitorTypes.append({"chartType": "moisture", "title": i18n("Moisture"), "icon": "colors-chromablue", "lineColor": "cyan"});
+                monitorTypes.append({"chartType": "conductivity", "title": i18n("Conductivity"), "icon": "quickopen", "lineColor": "green"});
+                monitorTypes.append({"chartType": "brightness", "title": i18n("Brightness"), "icon": "contrast", "lineColor": "yellow"});
             }
 
             Kirigami.CardsListView {
@@ -71,10 +72,30 @@ Kirigami.ApplicationWindow {
                             }
                         }
                     }
-                    contentItem: Controls.Label {
-                            wrapMode: Text.WordWrap
-                            text: i18n("") //TODO: replace with graph?
+                    contentItem: Item {
+                            implicitWidth: 300
+                            implicitHeight: 200
+                            Charts.ChartView {
+                                antialiasing: true
+                                backgroundColor: Kirigami.Theme.backgroundColor
+                                titleColor: Kirigami.Theme.textColor
+                                legend.visible: false
+                                anchors.fill: parent
+                                Charts.LineSeries {
+                                    axisX: Charts.ValueAxis {
+                                        labelsColor: Kirigami.Theme.textColor
+                                        titleText: i18n("Hours")
+                                    }
+                                    axisY: Charts.ValueAxis {
+                                        labelsColor: Kirigami.Theme.textColor
+                                    }
+                                    color: model.lineColor
+                                    name: model.title
+                                    Charts.XYPoint{x: 1; y: 1}
+                                    Charts.XYPoint{x: 2; y: 2}
+                            }
                         }
+                    }
                 }
             }
             
-- 
GitLab