const statusLineElement = document.getElementById("status-line");
const statusLineElement2 = statusLineElement.cloneNode();
statusLineElement2.id = "status-line2";
document.body.appendChild(statusLineElement2);

let status = "Streamboy is connecting...";
let scroll = 0;

setInterval(() => {
  if (scroll >= status.length) scroll = 0;
  // if (scroll == 0) {
  //   statusLineElement.textContent = status;
  // } else {
  //   let string = "";
  //   string += status.slice(scroll);
  //   string += status.slice(0, scroll);
  //   statusLineElement.textContent = string;
  // }
  const stringWidth = 8 * status.length;
  statusLineElement.style.left = `${-8 * scroll}px`;
  statusLineElement2.style.left = `${-8 * scroll + stringWidth}px`;
  // console.log(statusLineElement.style.left)
  statusLineElement.textContent = status;
  statusLineElement2.textContent = status;
  scroll += 1;
}, 750);

const socket = new WebSocket("ws://localhost:8012");

socket.addEventListener("message", (event) => {
  const data = JSON.parse(event.data);

  let string = "";
  for (const block of data.blocks) {
    string += block.text;
    string += "    |    ";
  }
  status = string;
});

// const status = {
//   blocks: [
//     "Something Fun For Everyone With Streamboy!!!!!!!! git.jeevio.xyz/jeeves/streamboy",
//     "♪ Bonhomme de Neige (EarthBound) - Ridley Snipes feat. Earth Kid",
//   ],
// };