Skip to content

Commit 65981cd

Browse files
fraisaifraisai
committed
cleaned up code
1 parent f399436 commit 65981cd

File tree

6 files changed

+21
-22
lines changed

6 files changed

+21
-22
lines changed

‎dist/src/components/Socket.d.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,9 +17,9 @@ declare type SocketType = {
1717
endCall: (parsedData: boolean) => void;
1818
};
1919
/**
20-
* @desc Using the initial websocket connection, this functional component provides the event listeners for each client socket to allow bi-lateral communication.
21-
* @param props containing the socket starting the connection with the websocket server and functions to be performed on each switch case event
22-
* @returns an empty element when rendered but populates the client's socket connection with event listeners to be able to handle the offer-answer model and SDP objects being communicated between both peers.
20+
* @desc Using the initial WebSocket connection, this functional component provides the event listeners for each client's socket connection to allow bilateral communication.
21+
* @param props ws is the socket that will initiate the connection with the WebSocket server and getUsers, handleReceiveCall, handleAnswer, handleNewIceCandidate, endCall are the functions that are executed upon on each switch case event.
22+
* @returns an empty element when rendered and populates the client's socket connection with event listeners that can handle the offer-answer model and SDP objects being exchanged between peers.
2323
*/
2424
declare const Socket: ({ ws, getUsers, handleReceiveCall, handleAnswer, handleNewIceCandidate, endCall }: SocketType) => JSX.Element;
2525
export default Socket;

‎dist/src/components/Socket.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,9 @@ const react_1 = __importDefault(require("react"));
77
const actions_1 = __importDefault(require("../constants/actions"));
88
const { LOGIN, ICECANDIDATE, OFFER, ANSWER, LEAVE } = actions_1.default;
99
/**
10-
* @desc Using the initial websocket connection, this functional component provides the event listeners for each client socket to allow bi-lateral communication.
11-
* @param props containing the socket starting the connection with the websocket server and functions to be performed on each switch case event
12-
* @returns an empty element when rendered but populates the client's socket connection with event listeners to be able to handle the offer-answer model and SDP objects being communicated between both peers.
10+
* @desc Using the initial WebSocket connection, this functional component provides the event listeners for each client's socket connection to allow bilateral communication.
11+
* @param props ws is the socket that will initiate the connection with the WebSocket server and getUsers, handleReceiveCall, handleAnswer, handleNewIceCandidate, endCall are the functions that are executed upon on each switch case event.
12+
* @returns an empty element when rendered and populates the client's socket connection with event listeners that can handle the offer-answer model and SDP objects being exchanged between peers.
1313
*/
1414
const Socket = ({ ws, getUsers, handleReceiveCall, handleAnswer, handleNewIceCandidate, endCall }) => {
1515
// IIFE, this function gets invoked when a new socket component is created

‎dist/src/components/VideoCall.js

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -349,23 +349,25 @@ const VideoCall = ({ URL, mediaOptions }) => {
349349
react_1.default.createElement(Socket_1.default, { ws: ws.current, getUsers: getUsers, handleReceiveCall: handleReceiveCall, handleAnswer: handleAnswer, handleNewIceCandidate: handleNewIceCandidate, endCall: endCall })
350350
: '',
351351
react_1.default.createElement("div", { className: '', style: { display: 'flex', justifyContent: 'space-around', flexDirection: 'column', padding: '10px', marginTop: '10%' } },
352-
username === '' ? react_1.default.createElement(react_1.default.Fragment, null,
353-
react_1.default.createElement("div", { className: 'input-div', style: { display: 'flex', flexDirection: 'column', top: '2%', left: '2%', margin: '0 auto', height: '100px', width: '100px', justifyContent: 'center', alignItems: 'center' } },
354-
react_1.default.createElement("input", { className: '', type: 'text', placeholder: 'username', id: "username-field", onChange: (e) => userField = e.target.value, style: { paddingBottom: '40px', width: '200px' } }),
355-
react_1.default.createElement("button", { className: '', onClick: () => handleUsername(), style: buttonStyling }, "Submit Username"))) :
356-
react_1.default.createElement("div", { className: 'users-list', style: { fontFamily: 'Arial, Helvetica, sans-serif', fontSize: '16px' } },
357-
"Users connected: ",
358-
users),
352+
username === '' ?
353+
react_1.default.createElement(react_1.default.Fragment, null,
354+
react_1.default.createElement("div", { className: 'input-div', style: { display: 'flex', flexDirection: 'column', top: '2%', left: '2%', margin: '0 auto', height: '100px', width: '100px', justifyContent: 'center', alignItems: 'center' } },
355+
react_1.default.createElement("input", { className: '', type: 'text', placeholder: 'username', id: "username-field", onChange: (e) => userField = e.target.value, style: { paddingBottom: '40px', width: '200px' } }),
356+
react_1.default.createElement("button", { className: '', "data-testid": 'submit-username-btn', onClick: () => handleUsername(), style: buttonStyling }, "Submit Username")))
357+
:
358+
react_1.default.createElement("div", { className: 'users-list', style: { fontFamily: 'Arial, Helvetica, sans-serif', fontSize: '16px' } },
359+
"Users connected: ",
360+
users),
359361
react_1.default.createElement("div", { id: "main-video-container", className: '', style: { display: 'flex', flexDirection: 'row', gap: '100px', justifyContent: 'center', alignItems: 'center' } },
360362
react_1.default.createElement("div", { id: "local-video-container", className: '', style: { display: 'flex', flexDirection: 'column', alignContent: 'center', justifyContent: 'center' } },
361363
react_1.default.createElement(VideoComponent_1.default, { video: localVideo, mediaOptions: mediaOptions }),
362364
react_1.default.createElement("div", { id: "local-button-container", className: '', style: { display: 'flex', flexDirection: 'row', gap: '10px', justifyContent: 'center', marginTop: '10px' } },
363-
react_1.default.createElement("button", { className: '', onClick: () => shareScreen(), style: buttonStyling }, "Share Screen"),
364-
react_1.default.createElement("button", { className: '', onClick: () => endCall(false), style: Object.assign(Object.assign({}, buttonStyling), { backgroundColor: '#ff6961', color: '#28282B' }) }, "End Call"))),
365+
react_1.default.createElement("button", { className: 'share-btn', "data-testid": 'share-screen-btn', onClick: () => shareScreen(), style: buttonStyling }, "Share Screen"),
366+
react_1.default.createElement("button", { className: 'end-btn', "data-testid": 'end-call-btn', onClick: () => endCall(false), style: Object.assign(Object.assign({}, buttonStyling), { backgroundColor: '#ff6961', color: '#28282B' }) }, "End Call"))),
365367
react_1.default.createElement("div", { id: "remote-video-container", className: '', style: { display: 'flex', flexDirection: 'column', alignContent: 'center', justifyContent: 'center' } },
366368
react_1.default.createElement(VideoComponent_1.default, { video: remoteVideo, mediaOptions: mediaOptions }),
367369
react_1.default.createElement("div", { id: "remote-button-container", className: '', style: { display: 'flex', flexDirection: 'row', gap: '10px', justifyContent: 'center', marginTop: '10px' } },
368-
react_1.default.createElement("button", { className: '', onClick: handleOffer, style: buttonStyling }, "Call"),
370+
react_1.default.createElement("button", { className: '', "data-testid": 'call-btn', onClick: handleOffer, style: buttonStyling }, "Call"),
369371
react_1.default.createElement("input", { className: '', type: 'text', id: 'receiverName', style: { marginLeft: '2%' } })))))));
370372
};
371373
exports.default = VideoCall;

‎dist/src/components/VideoComponent.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
44
};
55
Object.defineProperty(exports, "__esModule", { value: true });
66
const react_1 = __importDefault(require("react"));
7-
//{controls: true, style: {width: '', height: ''}}
87
/**
98
* @param {HTMLVideoElement} video
109
* @returns a video component that is either the local or remote video stream

‎lib/src/components/Socket.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,9 @@ type SocketType = {
1212
}
1313

1414
/**
15-
* @desc Using the initial websocket connection, this functional component provides the event listeners for each client socket to allow bi-lateral communication.
16-
* @param props containing the socket starting the connection with the websocket server and functions to be performed on each switch case event
17-
* @returns an empty element when rendered but populates the client's socket connection with event listeners to be able to handle the offer-answer model and SDP objects being communicated between both peers.
15+
* @desc Using the initial WebSocket connection, this functional component provides the event listeners for each client's socket connection to allow bilateral communication.
16+
* @param props ws is the socket that will initiate the connection with the WebSocket server and getUsers, handleReceiveCall, handleAnswer, handleNewIceCandidate, endCall are the functions that are executed upon on each switch case event.
17+
* @returns an empty element when rendered and populates the client's socket connection with event listeners that can handle the offer-answer model and SDP objects being exchanged between peers.
1818
*/
1919
const Socket = ({ ws, getUsers, handleReceiveCall, handleAnswer, handleNewIceCandidate, endCall }: SocketType): JSX.Element => {
2020

‎lib/src/components/VideoComponent.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,6 @@ type videoComponent = {
55
mediaOptions: { controls: boolean, style: { width: string, height: string }}
66
}
77

8-
//{controls: true, style: {width: '', height: ''}}
9-
108
/**
119
* @param {HTMLVideoElement} video
1210
* @returns a video component that is either the local or remote video stream

0 commit comments

Comments
 (0)