import {WebRTCAdaptor} from "https://cdn.skypack.dev/@antmedia/webrtc_adaptor@SNAPSHOT";

//import { WebRTCAdaptor } from './node_modules/@antmedia/webrtc_adaptor/src/main/js/webrtc_adaptor.js';

var publishStreamId = "stream" + parseInt(Math.random()*999999);

var webRTCAdaptor = new WebRTCAdaptor({

  websocket_url: "wss://test.antmedia.io:5443/WebRTCAppEE/websocket",

  localVideoId: "localVideo",

  callback: (info, obj) => {

     console.log("callback info: " + info);

     if (info == "newTrackAvailable") {

            playVideo(obj);

          }

  },

});

var roomNameBox = document.getElementById("roomid");

var remotevideos = document.getElementById("players"); 

​

document.getElementById("joinroom").addEventListener("click",()=> {

  var roomid = document.getElementById("roomid").value;

  var status = document.getElementById("joinroom");

  if(status.innerHTML =="join"){

    status.innerHTML  = "leave";

        webRTCAdaptor.publish(publishStreamId, "", "", "", "",roomNameBox.value, JSON.stringify(""), "");

    webRTCAdaptor.play(roomNameBox.value, "", roomNameBox.value, [], "", "", null, "");

​

  }

  else{

    status.innerHTML  = "join";

    webRTCAdaptor.stop(roomid);

  }

})

function createRemoteVideo(trackLabel, kind) {

    var player = document.createElement("div");

    player.className = "col-sm-3";

    player.id = "player" + trackLabel;

​

    if (kind == "audio") {

      player.style.display = "none";

    }

​

    player.innerHTML = '<video id="remoteVideo' + trackLabel + '" controls autoplay playsinline></video>'

      +'<div id="overlay' + trackLabel + '" style="font-size: 10px;position: absolute; top: 5px; left: 50%; transform: translateX(-50%); color: white; background-color: rgba(0, 0, 0, 0.5); padding: 5px;">' + trackLabel + '</div>';

​

    document.getElementById("players").appendChild(player);

  }

​

  function playVideo(obj) {

​

    //In multitrack conferencing the stream is same, tracks are being and remove from the stream

    var roomId = roomNameBox.value;

    console.log("new track available with id: "

        + obj.trackId + " and kind: " + obj.track.kind + " on the room:" + roomId);

​

    //trackId is ARDAMSv+STREAM_ID or  ARDAMSa+STREAM_ID

    var incomingTrackId = obj.trackId.substring("ARDAMSx".length);

​

    if (incomingTrackId == roomId || incomingTrackId == publishStreamId) {

      return;

    }

​

    var video = document.getElementById("remoteVideo" + incomingTrackId);

​

    if (video == null) {

      createRemoteVideo(incomingTrackId, obj.track.kind);

      video = document.getElementById("remoteVideo" + incomingTrackId);

      video.srcObject = new MediaStream();

    }

​

    video.srcObject.addTrack(obj.track)

    remotevideos.appendChild(video);

    obj.track.onended = event => {

      console.log("track is ended with id: " + event.target.id)

​

    }

    obj.stream.onremovetrack = event => {

      console.log("track is removed with id: " + event.track.id)

      console.log(event);

      var removedTrackId = event.track.id.substring("ARDAMSx".length);

    }

  }