From 321216b7b3ea56a6616fea374a408ffccc5163d2 Mon Sep 17 00:00:00 2001
From: Mahayoga <myoga.bahtiar@gmail.com>
Date: Tue, 14 Apr 2026 19:05:57 +0700
Subject: [PATCH] test websocket

---
 .../user/pages/tutorial_tes/index.blade.php   | 53 +++++++++++++------
 1 file changed, 36 insertions(+), 17 deletions(-)

diff --git a/resources/views/user/pages/tutorial_tes/index.blade.php b/resources/views/user/pages/tutorial_tes/index.blade.php
index 1f881e8..3d43339 100644
--- a/resources/views/user/pages/tutorial_tes/index.blade.php
+++ b/resources/views/user/pages/tutorial_tes/index.blade.php
@@ -120,6 +120,8 @@
   <script>
     let getDataInterval = false;
     let checkTobiiInterval = null;
+    let tobiiConnectedStatus = true;
+    const ws = new WebSocket("ws://localhost:8080");
 
     function showTutorial(step, tutorialId) {
       $(`#${tutorialId}`).hide();
@@ -224,23 +226,30 @@ function copyLinkApiTobii() {
     }
 
     function checkTobiiConnection() {
-      $.ajax({
-        url: '{{ route("tobii-receiver.show", ['tobii_receiver' => $data_session->id_test_sessions]) }}',
-        method: 'GET',
-        success: function(response) {
-          if (response.connected) {
-            $('#status_tobii').text('Status Tobii: Terhubung').removeClass('text-danger').addClass('text-success');
-            $('#next_btn_connect_tobii').show();
-          } else {
-            $('#status_tobii').text('Status Tobii: Tidak Terhubung').removeClass('text-success').addClass('text-danger');
-            $('#next_btn_connect_tobii').hide();
-          }
-        },
-        error: function() {
-          $('#status_tobii').text('Status Tobii: Tidak Terhubung').removeClass('text-success').addClass('text-danger');
-          $('#next_btn_connect_tobii').hide();
-        }
-      });
+      // $.ajax({
+      //   url: '{{ route("tobii-receiver.show", ['tobii_receiver' => $data_session->id_test_sessions]) }}',
+      //   method: 'GET',
+      //   success: function(response) {
+      //     if (response.connected) {
+      //       $('#status_tobii').text('Status Tobii: Terhubung').removeClass('text-danger').addClass('text-success');
+      //       $('#next_btn_connect_tobii').show();
+      //     } else {
+      //       $('#status_tobii').text('Status Tobii: Tidak Terhubung').removeClass('text-success').addClass('text-danger');
+      //       $('#next_btn_connect_tobii').hide();
+      //     }
+      //   },
+      //   error: function() {
+      //     $('#status_tobii').text('Status Tobii: Tidak Terhubung').removeClass('text-success').addClass('text-danger');
+      //     $('#next_btn_connect_tobii').hide();
+      //   }
+      // });
+      if(tobiiConnectedStatus) {
+        $('#status_tobii').text('Status Tobii: Terhubung').removeClass('text-danger').addClass('text-success');
+        $('#next_btn_connect_tobii').show();
+      } else {
+        $('#status_tobii').text('Status Tobii: Tidak Terhubung').removeClass('text-success').addClass('text-danger');
+        $('#next_btn_connect_tobii').hide();
+      }
     }
 
     async function fetchDataTobii() {
@@ -263,6 +272,16 @@ function checkTobiiConnection() {
       $('#calibration_point').hide();
       $('#show_calibration').hide();
       generateLinkApiTobii();
+
+      ws.onopen = () => {
+          console.log("Connected to WebSocket");
+      };
+
+      ws.onmessage = (event) => {
+        const data = JSON.parse(event.data);
+        console.log("DATA MASUK:", data);
+        moveTheEye(data.gaze_x, data.gaze_y);
+      };
     });
 
   </script>