let user, socket, channel;
async function initiate() {
  const callbutton = document.getElementById("callbutton");
  callbutton.addEventListener("click", makecall);
  const sendbutton = document.getElementById("sendbutton");
  sendbutton.addEventListener("click", senddata);
 
  socket = new WebSocket("ws://localhost:12345");
  socket.addEventListener("message", received); 

  try {
    const stream = await navigator.mediaDevices.getUserMedia({ video: true, audio: true });
    setwebcam(stream);
  } catch (error) {
    showerror(error);
  }
}
function setwebcam(stream) {
  const video = document.getElementById("callermedia");
  video.srcObject = stream;
  video.muted = true;
  video.play();
 
  const servers = { iceServers: [{ urls: "stun:stun.l.google.com:19302" }] };
  user = new RTCPeerConnection(servers);
 
  stream.getTracks().forEach(function(track) {
    user.addTrack(track, stream);
  });
  user.addEventListener("track", setremotestream);
  user.addEventListener("icecandidate", setice);
  user.addEventListener("datachannel", function(event) {
    channel = event.channel;
    channel.addEventListener("message", receivedata);
  });
}
function showerror(error) {
  console.log(error);
}
async function makecall() {
  channel = user.createDataChannel("data");
  channel.addEventListener("message", receivedata);
 
  try {
    const offer = await user.createOffer();
    await setdescription(offer);
  } catch (error) {
    showerror(error);
  }
}
async function setdescription(sessionDescription) {
  await user.setLocalDescription(sessionDescription);
  sendmsg(sessionDescription);
}
function sendmsg(message) {
  const msg = JSON.stringify(message);
  socket.send(msg);
}
async function received(event) {
  const msg = JSON.parse(event.data);
  try {
    switch (msg.type) {
      case "offer": {
        await user.setRemoteDescription(new RTCSessionDescription(msg));
        const answer = await user.createAnswer();
        await setdescription(answer);
        break;
      }
      case "answer": {
        await user.setRemoteDescription(new RTCSessionDescription(msg));
        break;
      }
      case "candidate": {
        const candidate = new RTCIceCandidate(msg.candidate);
        await user.addIceCandidate(candidate);
        break;
      }
    }
  } catch (error) {
    showerror(error);
  }
}
function setremotestream(event) {
  const video = document.getElementById("receivermedia");
  video.srcObject = event.streams[0];
  video.play();
}
function setice(event) {
  if (event.candidate) {
    const message = {
      type: "candidate",
      candidate: event.candidate,
    };
    sendmsg(message);
  }
}
function senddata() {
  const databox = document.getElementById("databox");
  if (!channel || channel.readyState !== "open") {
    databox.innerHTML = "DataChannel is not ready, please try again";
  } else {
    const message = document.getElementById("myinput").value;
    const chatroom = databox.innerHTML;
    databox.innerHTML = "Local Says: " + message + "<br>";
    databox.innerHTML += chatroom;
    channel.send(message);
  }
}
function receivedata(event) {
  const databox = document.getElementById("databox");
  const chatroom = databox.innerHTML;
  databox.innerHTML = "Remote Says: " + event.data + "<br>";
  databox.innerHTML += chatroom;
}
window.addEventListener("DOMContentLoaded", initiate);