falcon-web.js

import axios from "axios";

const hyperdrive = document.querySelector(".-hyperdrive");
const cockpit = document.querySelector(".-cockpit");
const headlights = document.querySelector(".-headlights");

let lights = {
  cockpit: 0,
  front: 0,
  hyperdrive: 0
};

const syncanoInstance = process.env.SYNCANO_INSTANCE

const wsUrl = `wss://api.syncano.io/v2/instances/${syncanoInstance}/endpoints/sockets/chewbacca/global-messages/?transport=websocket`

const ws = new WebSocket(wsUrl);
ws.onmessage = function(event) {
  const data = JSON.parse(event.data);
  if (data.payload.hasOwnProperty("cockpit")) {
    lights = data.payload;
    setLights(lights);
  }
};

hyperdrive.addEventListener("click", e => {
  axios.get(
    `https://${syncanoInstance}.syncano.space/chewbacca/cockpit/?light=hyperdrive&status=1`
  );
});

cockpit.addEventListener("click", e => {
  axios.get(
    `https://${syncanoInstance}.syncano.space/chewbacca/cockpit/?light=cockpit&status=${
      lights.cockpit ? 0 : 1
    }`
  );
});

headlights.addEventListener("click", e => {
  axios.get(
    `https://${syncanoInstance}.syncano.space/chewbacca/cockpit/?light=front&status=${
      lights.front ? 0 : 1
    }`
  );
});