From 680ea51ab4a0e9565f44acada982c5161122d31a Mon Sep 17 00:00:00 2001
From: Mohammed <61502453+mk-Guvi@users.noreply.github.com>
Date: Mon, 12 Apr 2021 10:38:06 +0530
Subject: [PATCH] initial commit

---
 public/script.js | 157 +++++++++++++++++++++++------------------------
 1 file changed, 78 insertions(+), 79 deletions(-)

diff --git a/public/script.js b/public/script.js
index d61df4a..f09c6b5 100644
--- a/public/script.js
+++ b/public/script.js
@@ -1,82 +1,81 @@
-const socket = io('/')
-const videoGrid = document.getElementById('video-grid')
+const socket = io("/");
+const videoGrid = document.getElementById("video-grid");
 const myPeer = new Peer(undefined, {
-  path: '/peerjs',
-  host: '/',
-  port: '443'
-})
+  path: "/peerjs",
+  host: "/",
+  port: "3030"
+});
 let myVideoStream;
-const myVideo = document.createElement('video')
+const myVideo = document.createElement("video");
 myVideo.muted = true;
-const peers = {}
-navigator.mediaDevices.getUserMedia({
-  video: true,
-  audio: true
-}).then(stream => {
-  myVideoStream = stream;
-  addVideoStream(myVideo, stream)
-  myPeer.on('call', call => {
-    call.answer(stream)
-    const video = document.createElement('video')
-    call.on('stream', userVideoStream => {
-      addVideoStream(video, userVideoStream)
-    })
+const peers = {};
+navigator.mediaDevices
+  .getUserMedia({
+    video: true,
+    audio: true
   })
-
-  socket.on('user-connected', userId => {
-    connectToNewUser(userId, stream)
-  })
-  // input value
-  let text = $("input");
-  // when press enter send message
-  $('html').keydown(function (e) {
-    if (e.which == 13 && text.val().length !== 0) {
-      socket.emit('message', text.val());
-      text.val('')
-    }
+  .then((stream) => {
+    myVideoStream = stream;
+    addVideoStream(myVideo, stream);
+    myPeer.on("call", (call) => {
+      call.answer(stream);
+      const video = document.createElement("video");
+      call.on("stream", (userVideoStream) => {
+        addVideoStream(video, userVideoStream);
+      });
+    });
+
+    socket.on("user-connected", (userId) => {
+      connectToNewUser(userId, stream);
+    });
+    // input value
+    let text = $("input");
+    // when press enter send message
+    $("html").keydown(function (e) {
+      if (e.which == 13 && text.val().length !== 0) {
+        socket.emit("message", text.val());
+        text.val("");
+      }
+    });
+    socket.on("createMessage", (message) => {
+      $("ul").append(`<li class="message"><b>user</b><br/>${message}</li>`);
+      scrollToBottom();
+    });
   });
-  socket.on("createMessage", message => {
-    $("ul").append(`<li class="message"><b>user</b><br/>${message}</li>`);
-    scrollToBottom()
-  })
-})
 
-socket.on('user-disconnected', userId => {
-  if (peers[userId]) peers[userId].close()
-})
+socket.on("user-disconnected", (userId) => {
+  if (peers[userId]) peers[userId].close();
+});
 
-myPeer.on('open', id => {
-  socket.emit('join-room', ROOM_ID, id)
-})
+myPeer.on("open", (id) => {
+  socket.emit("join-room", ROOM_ID, id);
+});
 
 function connectToNewUser(userId, stream) {
-  const call = myPeer.call(userId, stream)
-  const video = document.createElement('video')
-  call.on('stream', userVideoStream => {
-    addVideoStream(video, userVideoStream)
-  })
-  call.on('close', () => {
-    video.remove()
-  })
+  const call = myPeer.call(userId, stream);
+  const video = document.createElement("video");
+  call.on("stream", (userVideoStream) => {
+    addVideoStream(video, userVideoStream);
+  });
+  call.on("close", () => {
+    video.remove();
+  });
 
-  peers[userId] = call
+  peers[userId] = call;
 }
 
 function addVideoStream(video, stream) {
-  video.srcObject = stream
-  video.addEventListener('loadedmetadata', () => {
-    video.play()
-  })
-  videoGrid.append(video)
+  video.srcObject = stream;
+  video.addEventListener("loadedmetadata", () => {
+    video.play();
+  });
+  videoGrid.append(video);
 }
 
-
-
 const scrollToBottom = () => {
-  var d = $('.main__chat_window');
+  var d = $(".main__chat_window");
   d.scrollTop(d.prop("scrollHeight"));
-}
-
+};
 
 const muteUnmute = () => {
   const enabled = myVideoStream.getAudioTracks()[0].enabled;
@@ -87,48 +86,48 @@ const muteUnmute = () => {
     setMuteButton();
     myVideoStream.getAudioTracks()[0].enabled = true;
   }
-}
+};
 
 const playStop = () => {
-  console.log('object')
+  console.log("object");
   let enabled = myVideoStream.getVideoTracks()[0].enabled;
   if (enabled) {
     myVideoStream.getVideoTracks()[0].enabled = false;
-    setPlayVideo()
+    setPlayVideo();
   } else {
-    setStopVideo()
+    setStopVideo();
     myVideoStream.getVideoTracks()[0].enabled = true;
   }
-}
+};
 
 const setMuteButton = () => {
   const html = `
     <i class="fas fa-microphone"></i>
     <span>Mute</span>
-  `
-  document.querySelector('.main__mute_button').innerHTML = html;
-}
+  `;
+  document.querySelector(".main__mute_button").innerHTML = html;
+};
 
 const setUnmuteButton = () => {
   const html = `
     <i class="unmute fas fa-microphone-slash"></i>
     <span>Unmute</span>
-  `
-  document.querySelector('.main__mute_button').innerHTML = html;
-}
+  `;
+  document.querySelector(".main__mute_button").innerHTML = html;
+};
 
 const setStopVideo = () => {
   const html = `
     <i class="fas fa-video"></i>
     <span>Stop Video</span>
-  `
-  document.querySelector('.main__video_button').innerHTML = html;
-}
+  `;
+  document.querySelector(".main__video_button").innerHTML = html;
+};
 
 const setPlayVideo = () => {
   const html = `
   <i class="stop fas fa-video-slash"></i>
     <span>Play Video</span>
-  `
-  document.querySelector('.main__video_button').innerHTML = html;
-}
+  `;
+  document.querySelector(".main__video_button").innerHTML = html;
+};