Test websocket implementation into qml file

Change-Id: I01d6e8f2d9e21ed8b6ac7f925fb42703008a29c3
Signed-off-by: Romain Forlot <romain.forlot@iot.bzh>

1 files changed, 156 insertions, 118 deletions

diff --git a/app/hvac-demo.qml b/app/hvac-demo.qml
index 9474f53..a5c5825 100644
--- a/app/hvac-demo.qml
+++ b/app/hvac-demo.qml
@@ -21,126 +21,164 @@ import AGL.Demo.Controls 1.0
 import QtWebSockets 1.0
 
 ApplicationWindow {
-    id: root
+	id: root
 
-    // GET BINDINGS VARIABLES
-    property string port_str: Qt.application.arguments[1]
-    property string token_str: Qt.application.arguments[2]
-    property string address_str: "ws://localhost:"+port_str+"/api?token="+token_str
-    property string request_str: ""
-    property string status_str: "waiting..."
-    property var msgid_enu: { "call":2, "retok":3, "reterr":4, "event":5 }
+	// GET BINDINGS VARIABLES
+	property string port_str: Qt.application.arguments[1]
+	property string token_str: Qt.application.arguments[2]
+	property string address_str: "ws://localhost:"+port_str+"/api?token="+token_str
+	property string api_str: "hvac"
+	property string request_str: ""
+	property string status_str: "waiting..."
+	property var msgid_enu: { "call":2, "retok":3, "reterr":4, "event":5 }
 
-    ColumnLayout {
-        anchors.fill: parent
-        anchors.topMargin: width / 10
-        anchors.bottomMargin: width / 10
-        RowLayout {
-            Layout.fillHeight: true
-            Layout.alignment: Qt.AlignHCenter
-            Image {
-                source: './images/HMI_HVAC_Fan_Icon.svg'
-            }
-            Item {
-                width: root.width * 0.8
-                Slider {
-                    id: fanSpeed
-                    anchors.left: parent.left
-                    anchors.right: parent.right
-                    anchors.verticalCenter: parent.verticalCenter
-                    onValueChanged: {
-                        console.debug('Fan', value)
-                    }
-                }
-                Label {
-                    anchors.left: fanSpeed.left
-                    anchors.top: fanSpeed.bottom
-                    font.pixelSize: 32
-                    text: 'FAN SPEED'
-                }
-            }
-        }
-        RowLayout {
-            Layout.fillHeight: true
-            Layout.fillWidth: true
-            Layout.alignment: Layout.Center
-            spacing: 20
-            ColumnLayout {
-                Layout.fillWidth: true
-                spacing: 20
-                SeatHeatButton {
-                    id: leftSeat
-                    side: 'Left'
-                }
-                HeatDegree {
-                    enabled: leftSeat.headLevel > 0
-                }
-            }
-            ColumnLayout {
-                Layout.fillWidth: true
-                spacing: 20
-                ToggleButton {
-                    onImage: './images/HMI_HVAC_Active.svg'
-                    offImage: './images/HMI_HVAC_Inactive.svg'
-                    Label {
-                        anchors.centerIn: parent
-                        color: parent.checked ? '#66FF99' : '#848286'
-                        text: 'A/C'
-                        font.pixelSize: parent.height / 3
-                    }
-                    onCheckedChanged: {
-                        console.debug('A/C', checked)
-                    }
-                }
-                ToggleButton {
-                    onImage: './images/HMI_HVAC_Active.svg'
-                    offImage: './images/HMI_HVAC_Inactive.svg'
-                    Label {
-                        anchors.centerIn: parent
-                        color: parent.checked ? '#66FF99' : '#848286'
-                        text: 'AUTO'
-                        font.pixelSize: parent.height / 3
-                    }
-                    onCheckedChanged: {
-                        console.debug('AUTO', checked)
-                    }
-                }
-                ToggleButton {
-                    onImage: './images/HMI_HVAC_Circulation_Active.svg'
-                    offImage: './images/HMI_HVAC_Circulation_Inactive.svg'
-                    onCheckedChanged: {
-                        console.debug('Circulation', checked)
-                    }
-                }
-            }
+	// WEBSOCKET WIDGET (MAIN LOGIC)
 
-            ColumnLayout {
-                Layout.fillWidth: true
-                spacing: 20
-                SeatHeatButton {
-                    id: rightSeat
-                    side: 'Right'
-                }
-                HeatDegree {
-                    enabled: rightSeat.headLevel > 0
-                }
-            }
-        }
+	WebSocket {
+		id: websocket
+		url: address_str
+		onTextMessageReceived: {
+			 // VERB RESPONSE VALIDATION
+			var message_json = JSON.parse (message)
+			var request_json = message_json[2].request
+			if (message_json[0] != msgid_enu.retok) {
+				console.log ("Return value is not ok !")
+				status_str = "Bad return value, binding probably not installed"
+				return
+			}
+			 // VERB RESPONSE PARSING AND LOGIC
+			status_str = request_json.info
+		}
+		onStatusChanged: {
+			if (websocket.status == WebSocket.Error)
+				status_str = "WebSocket error: " + websocket.errorString
+		}
+		active: true
+	}
 
-        RowLayout {
-            Layout.fillHeight: true
-            Layout.alignment: Qt.AlignHCenter
-            spacing: root.width / 20
-            Repeater {
-                model: ['AirDown', 'AirUp', 'AirRight', 'Rear', 'Front']
-                ToggleButton {
-                    onImage: './images/HMI_HVAC_%1_Active.svg'.arg(model.modelData)
-                    offImage: './images/HMI_HVAC_%1_Inactive.svg'.arg(model.modelData)
-                    onCheckedChanged: {
-                        console.debug(model.modelData, checked)
-                    }
-                }
-            }
-        }
-    }
+	ColumnLayout {
+	    anchors.fill: parent
+	    anchors.topMargin: width / 10
+	    anchors.bottomMargin: width / 10
+	    RowLayout {
+	        Layout.fillHeight: true
+	        Layout.alignment: Qt.AlignHCenter
+	        Image {
+	            source: './images/HMI_HVAC_Fan_Icon.svg'
+	        }
+	        Item {
+	            width: root.width * 0.8
+	            Slider {
+	                id: fanSpeed
+	                anchors.left: parent.left
+	                anchors.right: parent.right
+	                anchors.verticalCenter: parent.verticalCenter
+	                onValueChanged: {
+			    request_str = '[' + msgid_enu.call + ',"99999","'+ api_str +'/ping", { "'+ id + '": '+ value +' } ]';
+	                    console.debug('Fan', value)
+	                }
+	            }
+	            Label {
+	                anchors.left: fanSpeed.left
+	                anchors.top: fanSpeed.bottom
+	                font.pixelSize: 32
+	                text: 'FAN SPEED'
+	            }
+	        }
+	    }
+	    RowLayout {
+		/*
+		 *
+		 * Button {
+			 id: LeftTemperature
+			 background: Image{
+				 source: './images/HMI_HVAC_Plus.svg'
+			}
+		 *	onClicked: {
+		 *		request_str = '[' + msgid_enu.call + ',"' + i +'","hvac/set", { "LeftTemperature": val++ ]';
+		 *		websocket.sendTextMessage (request_str)
+		 *	}
+		 */
+	        Layout.fillHeight: true
+	        Layout.fillWidth: true
+	        Layout.alignment: Layout.Center
+	        spacing: 20
+	        ColumnLayout {
+	            Layout.fillWidth: true
+	            spacing: 20
+	            SeatHeatButton {
+	                id: leftSeat
+	                side: 'Left'
+	            }
+	            HeatDegree {
+	                enabled: leftSeat.headLevel > 0
+	            }
+	        }
+	        ColumnLayout {
+	            Layout.fillWidth: true
+	            spacing: 20
+	            ToggleButton {
+	                onImage: './images/HMI_HVAC_Active.svg'
+	                offImage: './images/HMI_HVAC_Inactive.svg'
+	                Label {
+	                    anchors.centerIn: parent
+	                    color: parent.checked ? '#66FF99' : '#848286'
+	                    text: 'A/C'
+	                    font.pixelSize: parent.height / 3
+	                }
+	                onCheckedChanged: {
+	                    console.debug('A/C', checked)
+	                }
+	            }
+	            ToggleButton {
+	                onImage: './images/HMI_HVAC_Active.svg'
+	                offImage: './images/HMI_HVAC_Inactive.svg'
+	                Label {
+	                    anchors.centerIn: parent
+	                    color: parent.checked ? '#66FF99' : '#848286'
+	                    text: 'AUTO'
+	                    font.pixelSize: parent.height / 3
+	                }
+	                onCheckedChanged: {
+	                    console.debug('AUTO', checked)
+	                }
+	            }
+	            ToggleButton {
+	                onImage: './images/HMI_HVAC_Circulation_Active.svg'
+	                offImage: './images/HMI_HVAC_Circulation_Inactive.svg'
+	                onCheckedChanged: {
+	                    console.debug('Circulation', checked)
+	                }
+	            }
+	        }
+
+	        ColumnLayout {
+	            Layout.fillWidth: true
+	            spacing: 20
+	            SeatHeatButton {
+	                id: rightSeat
+	                side: 'Right'
+	            }
+	            HeatDegree {
+	                enabled: rightSeat.headLevel > 0
+	            }
+	        }
+	    }
+
+	    RowLayout {
+	        Layout.fillHeight: true
+	        Layout.alignment: Qt.AlignHCenter
+	        spacing: root.width / 20
+	        Repeater {
+	            model: ['AirDown', 'AirUp', 'AirRight', 'Rear', 'Front']
+	            ToggleButton {
+	                onImage: './images/HMI_HVAC_%1_Active.svg'.arg(model.modelData)
+	                offImage: './images/HMI_HVAC_%1_Inactive.svg'.arg(model.modelData)
+	                onCheckedChanged: {
+	                    console.debug(model.modelData, checked)
+	                }
+	            }
+	        }
+	    }
+	}
 }