updated jsdoc for handleReceiveCall

Author: fraisai

dist/src/components/VideoCall.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 /**
  * @func VideoCall
- * @param {String} props.URL - ws or wss link
+ * @param {String} props.URL - ws or wss link that establishes a connection between the WebSocket object and the server
  * @param {object} props.mediaOptions video embed attributes
  
  * @desc Wrapper component containing the logic necessary for peer connections using WebRTC APIs (RTCPeerConnect API + MediaSession API) and WebSockets.

dist/src/components/VideoCall.js

@@ -45,7 +45,7 @@ const rtcConfiguration_1 = __importDefault(require("../constants/rtcConfiguratio
 const { LOGIN, ICECANDIDATE, OFFER, ANSWER, LEAVE } = actions_1.default;
 /**
  * @func VideoCall
- * @param {String} props.URL - ws or wss link
+ * @param {String} props.URL - ws or wss link that establishes a connection between the WebSocket object and the server
  * @param {object} props.mediaOptions video embed attributes
  
  * @desc Wrapper component containing the logic necessary for peer connections using WebRTC APIs (RTCPeerConnect API + MediaSession API) and WebSockets.
@@ -67,13 +67,14 @@ const VideoCall = ({ URL, mediaOptions }) => {
     /**
      * @type {mutable ref WebSocket object} ws is the mutable ref object that contains the WebSocket object in its .current property (ws.current). It cannot be null or undefined.
      *
-     * @desc ws.current property contains the WebSocket object, which is created using the useEffect hook and it establishes the WebSocket connection to the server. The useEffect Hook creates the WebSocket object using the URL parameter when the component mounts and the function openUserMedia() is invoked, which makes a permissions request for the client's video and audio.
+     * @desc ws.current property contains the WebSocket object, which is created using the useEffect hook and it establishes the WebSocket connection to the server. The useEffect Hook creates the WebSocket object using the URL parameter when the component mounts.
      *
      * ws.current.send enqueues the specified messages that need to be transmitted to the server over the WebSocket connection and this WebSocket connection is connected to the server by using RTConnect's importable SignalingChannel module.
      */
     const ws = (0, react_1.useRef)(null);
     /**
      * @type {mutable ref object} localVideo - video element of the local user. It will not be null or undefined.
+     * @property {HTMLVideoElement} localVideo.current
      */
     const localVideo = (0, react_1.useRef)(null);
     /**
@@ -162,19 +163,23 @@ const VideoCall = ({ URL, mediaOptions }) => {
     };
     /**
      * @function getUser
-     * @desc When data (the list of connected users) is received from the WebSocketServer/backend, getUser function is invoked and it updates the userList state so that the list of currently connected users can be displayed on the frontend.
-     * @param {Array<string>} parsedData - data (the array of usernames that are connected) that is returned from backend/WebSocketServer.
-     * @returns Re-renders the page with the new User List
+     * @desc When data (the list of connected users) is received from the WebSocketServer, getUser is invoked and it creates div tags to render the names of each of the connected users on the front end.
+     * @param {Object} parsedData - The object (containing the payload with the array of connected usernames) that is returned from backend/WebSocketServer. parsedData.payload contains the array with the strings of connected usernames
+     * @returns Re-renders the page with the new list of connected users
     */
     const getUsers = (parsedData) => {
         const userList = parsedData.payload.map((name, idx) => (react_1.default.createElement("div", { key: idx }, name)));
         setUsers(userList);
     };
     /**
      * @async
-     * @function openUserMedia: Invoked in useEffect Hook. openUserMedia uses the constraints provided Requests the clients' browser permissions to open their webcam and microphone.
+     * @function openUserMedia is invoked in the useEffect Hook after WebSocket connection is established.
+     * @desc If the localVideo.current property exists, openUserMedia invokes the MediaDevices interface getUserMedia() method to prompt the clients for audio and video permission.
+     *
+     * If clients grant permissions, getUserMedia() uses the video and audio constraints to assign the local MediaStream from the clients' cameras/microphones to the local <video> element.
+     *
      * @param {void}
-     * @desc  If the localVideo.current property exists, the MediaStream from the local camera is assigned to the local video element.
+     * @see https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
      */
     const openUserMedia = () => __awaiter(void 0, void 0, void 0, function* () {
         try {
@@ -251,28 +256,34 @@ const VideoCall = ({ URL, mediaOptions }) => {
     }
     /**
      * @namespace handleReceiveCall
-     * @function handleReceiveCall - When Peer A (caller) calls Peer B (callee), Peer B receives an Offer from the SignalingChannel and this function is invoked. It creates a new RTCPeerConnection with the Peer A's media attached and an Answer is created. The Answer is then sent back to Peer A through the SignalingChannel.
+     * @function handleReceiveCall
+     * @desc When Peer A (caller) calls Peer B (callee), Peer B receives an Offer from the SignalingChannel and this function is invoked. It creates a new RTCPeerConnection with the Peer A's media attached and an Answer is created. The Answer is then sent back to Peer A through the SignalingChannel.
      * @returns answerPayload object with ANSWER action type and the local description as the payload is sent via WebSocket.
      * @param {Object} data payload object
      * @property {string} data.sender is the person making the call
      * @property { RTCSessionDescriptionInit object } data.payload object providing the session description and it consists of a string containing a SDP message indicating an Offer from Peer A. This value is an empty string ("") by default and may not be null.
      *
-     * @function createPeer - Creates a new RTCPeerConnection object, which represents a WebRTC connection between the local device and a remote peer and adds event listeners to it
+     * @function createPeer
+     * @desc Creates a new RTCPeerConnection object, which represents a WebRTC connection between the local device and a remote peer and adds event listeners to it
      * @memberof handleReceiveCall
      *
-     * @function RTCSessionDescription - initializes a RTCSessionDescription object, which consists of a description type indicating which part of the offer/answer negotiation process it describes and of the SDP descriptor of the session.
+     * @function RTCSessionDescription
+     * @desc initializes a RTCSessionDescription object, which consists of a description type indicating which part of the offer/answer negotiation process it describes and of the SDP descriptor of the session.
      * @see https://developer.mozilla.org/en-US/docs/Web/API/RTCSessionDescription
      * @memberof handleReceiveCall
      *
-     * @function setRemoteDescription - If Peer B wants to accept the offer, setRemoteDescription() is called to set the RTCSessionDescriptionInit object's remote description to the incoming offer from Peer A. The description specifies the properties of the remote end of the connection, including the media format.
+     * @function setRemoteDescription
+     * @desc If Peer B wants to accept the offer, setRemoteDescription() is called to set the RTCSessionDescriptionInit object's remote description to the incoming offer from Peer A. The description specifies the properties of the remote end of the connection, including the media format.
      * @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/setRemoteDescription
      * @memberof handleReceiveCall
      *
-     * @function createAnswer - Creates an Answer to the Offer received from Peer A during the offer/answer negotiation of a WebRTC connection. The Answer contains information about any media already attached to the session, codecs and options supported by the browser, and any ICE candidates already gathered.
+     * @function createAnswer
+     * @desc Creates an Answer to the Offer received from Peer A during the offer/answer negotiation of a WebRTC connection. The Answer contains information about any media already attached to the session, codecs and options supported by the browser, and any ICE candidates already gathered.
      * @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/createAnswer
      * @memberof handleReceiveCall
      *
-     * @function setLocalDescription - WebRTC selects an appropriate local configuration by invoking setLocalDescription(), which automatically generates an appropriate Answer in response to the received Offer from Peer A. Then we send the Answer through the signaling channel back to Peer A.
+     * @function setLocalDescription
+     * @desc WebRTC selects an appropriate local configuration by invoking setLocalDescription(), which automatically generates an appropriate Answer in response to the received Offer from Peer A. Then we send the Answer through the signaling channel back to Peer A.
      * @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/setLocalDescription
      * @memberof handleReceiveCall
      *
@@ -284,8 +295,8 @@ const VideoCall = ({ URL, mediaOptions }) => {
         peerRef.current = createPeer(data.sender);
         /**
          * @type {RTCSessionDescriptionInit object} desc - consists of a description type indicating which part of the answer negotiation process it describes and the SDP descriptor of the session.
-         * @params {string} desc.type - description type with incoming offer
-         * @params {string} desc.sdp - string containing a SDP message, the format for describing multimedia communication sessions. SDP contains the codec, source address, and timing information of audio and video
+         * @property {string} desc.type - description type with incoming offer
+         * @property {string} desc.sdp - string containing a SDP message, the format for describing multimedia communication sessions. SDP contains the codec, source address, and timing information of audio and video
          * @see https://developer.mozilla.org/en-US/docs/Glossary/SDP
          */
         const desc = new RTCSessionDescription(data.payload);

dist/src/constants/mediaStreamConstraints.d.ts

@@ -1,11 +1,9 @@
 /**
    *
-   * @type {Object} A MediaStreamConstraints object is used when calling getUserMedia() to specify what kinds of tracks
+   * @type {Object} A MediaStreamConstraints object is used when the openUserMedia function is invoked and it calls the WebRTC API method of getUserMedia() to specify what kinds of tracks
    * should be included in the returned MediaStream and to establish video and audio constraints for
    * these tracks' settings.
-   * @property {object} video - The video constraint provides the constraints that must be met by the video track that is
-   * included in the returned MediaStream (essentially it gives constraints for the quality of the video
-   * streams returned by the users's webcams).
+   * @property {object} video - The video constraint provides the constraints that must be met by the video track that is included in the returned MediaStream (essentially it gives constraints for the quality of the video streams returned by the users's webcams).
    * @property {object} video.width - video width constraint (min:640, ideal:1920, max:1920)
    * @property {object} video.height - video height constraint (min:480, ideal:1080, max:1080)
    * @property {boolean} audio - audio constraint that indicates whether or not an audio track is requested.

dist/src/constants/mediaStreamConstraints.js

@@ -2,12 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 /**
    *
-   * @type {Object} A MediaStreamConstraints object is used when calling getUserMedia() to specify what kinds of tracks
+   * @type {Object} A MediaStreamConstraints object is used when the openUserMedia function is invoked and it calls the WebRTC API method of getUserMedia() to specify what kinds of tracks
    * should be included in the returned MediaStream and to establish video and audio constraints for
    * these tracks' settings.
-   * @property {object} video - The video constraint provides the constraints that must be met by the video track that is
-   * included in the returned MediaStream (essentially it gives constraints for the quality of the video
-   * streams returned by the users's webcams).
+   * @property {object} video - The video constraint provides the constraints that must be met by the video track that is included in the returned MediaStream (essentially it gives constraints for the quality of the video streams returned by the users's webcams).
    * @property {object} video.width - video width constraint (min:640, ideal:1920, max:1920)
    * @property {object} video.height - video height constraint (min:480, ideal:1080, max:1080)
    * @property {boolean} audio - audio constraint that indicates whether or not an audio track is requested.