basic socket

main.qml

@@ -13,11 +13,38 @@ ApplicationWindow {
     color: "#fffffe"
 
     WebSocket {
+        property int total_slides: 5
         id: socket
-        url: "wss://ws.especificosba.com.ar"
+        url: "wss://wscasa.especificosba.com.ar"
         onTextMessageReceived: {
             console.log("\nReceived message: " + message)
+            var obj = JSON.parse(message);
+            switch(obj.type){
+            case "diapo":
+                canvas.clean_path();
+                item1.curPDF=obj.PDF;
+                item1.curImage=obj.slide; //automagically change_image
+                total_slides=obj.total_slides;
+            }
+        }
+        function send_obj(obj){
+            sendTextMessage(JSON.stringify(obj));
+        }
+
+        function prev_diapo(){
+            var curImage= Math.max(item1.curImage - 1, 1)
+            send_obj({type:"command",commandtype:"diapo", PDF: item1.curPDF, slide: curImage});
+        }
+
+        function next_diapo(){
+            var curImage= Math.min(item1.curImage + 1, total_slides)
+            send_obj({type:"command",commandtype:"diapo", PDF: item1.curPDF, slide: curImage});
+        }
+        function clear_path(){
+            send_obj({type:"clean"})
+            canvas.clean_path()
         }
+
         onStatusChanged: if (socket.status == WebSocket.Error) {
                              console.log("Error: " + socket.errorString)
                          } else if (socket.status == WebSocket.Open) {
@@ -40,10 +67,15 @@ ApplicationWindow {
         property alias button3: button3
         property alias button1: button1
         property int curImage: 1
+        property string curPDF: "EBA"
         anchors.fill: parent
 
+        onCurPDFChanged: {
+            canvas.change_image(curPDF, curImage)
+        }
+
         onCurImageChanged: {
-            canvas.change_image("EBA", curImage)
+            canvas.change_image(curPDF, curImage)
         }
 
         Grid {
@@ -72,7 +104,7 @@ ApplicationWindow {
                     property color strokeStyle: Qt.darker(fillStyle, 1.2)
                     property color fillStyle: "#6400aa"
 
-                    property int lineWidth: 2
+                    property int lineWidth: 3
                     property real px: width / 2
                     property real py: height / 2 + 10
                     property real alpha: 1.0
@@ -180,7 +212,7 @@ ApplicationWindow {
                     id: button2
                     text: qsTr("Anterior")
                     enabled: socket.active
-                    onClicked: item1.curImage = Math.max(item1.curImage - 1, 1)
+                    onClicked: socket.prev_diapo()
                 }
 
                 Button {
@@ -189,7 +221,7 @@ ApplicationWindow {
                     id: button1
                     text: qsTr("Siguiente")
                     enabled: socket.active
-                    onClicked: item1.curImage = Math.min(item1.curImage + 1, 5)
+                    onClicked: socket.next_diapo()
                 }
 
                 Button {
@@ -198,7 +230,7 @@ ApplicationWindow {
                     id: button4
                     text: qsTr("Limpiar")
                     enabled: socket.active
-                    onClicked: canvas.clean_path()
+                    onClicked: socket.clear_path()
                 }
                 Button {
                     height:80