ayushya/watchparty
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v1.3.0-beta/start of voice call and custom code:

Browse Source
This commit is contained in:
Ayushya Amitabh
2020-05-29 17:43:10 -04:00
parent 2053c2860a
commit ccd7f1cfab
15 changed files with 396 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/src/Chat.js
+31 -26
View File
@@ -55,16 +55,18 @@ export default class Chat extends Component {
this.port = null;
this.gifClick = this.gifClick.bind(this);
this.endParty = this.endParty.bind(this);
this.handleMute = this.handleMute.bind(this);
this.leaveParty = this.leaveParty.bind(this);
this.shareParty = this.shareParty.bind(this);
this.syncPlayer = this.syncPlayer.bind(this);
this.sendMessage = this.sendMessage.bind(this);
this.getCarousel = this.getCarousel.bind(this);
this.handlePhoneCall = this.handlePhoneCall.bind(this);
this.callEventListener = this.callEventListener.bind(this);
this.mCallManager = new CallManager(this.callEventListener);
this.sendMessageInvoker = this.sendMessageInvoker.bind(this);
this.videoEventListener = this.videoEventListener.bind(this);
this.mVideoListener = new VideoListener(this.videoEventListener);
this.mCallManager = new CallManager();
}
componentDidMount() {
// EVENT CAPTURE FOR ENTER TO SEND
@@ -84,24 +86,24 @@ export default class Chat extends Component {
this.mVideoListener.start();
// CHROME FIREBASE FIRESTORE LISTENER
// this.port = chrome.runtime.connect({ name: window.localStorage.getItem('watchPartyRoomId') });
// // Initialize listener
// this.port.postMessage({
// type: 'INIT',
// roomId: window.localStorage.getItem('watchPartyRoomId'),
// });
// // Listener
// this.port.onMessage.addListener((response) => {
// if (response.isError === true) {
// this.props.notify('Uh oh. Got lost from the party.');
// goTo(Create, this.props);
// return;
// }
// this.setState(response);
// if (response.player) this.mVideoListener.doUpdate(response.player);
// const pcc = document.getElementsByClassName('thread-container')[0];
// if (pcc) pcc.scrollTop = pcc.scrollHeight;
// });
this.port = chrome.runtime.connect({ name: window.localStorage.getItem('watchPartyRoomId') });
// Initialize listener
this.port.postMessage({
type: 'INIT',
roomId: window.localStorage.getItem('watchPartyRoomId'),
});
// Listener
this.port.onMessage.addListener((response) => {
if (response.isError === true) {
this.props.notify('Uh oh. Got lost from the party.');
goTo(Create, this.props);
return;
}
this.setState(response);
if (response.player) this.mVideoListener.doUpdate(response.player);
const pcc = document.querySelector('.thread-container');
if (pcc) pcc.scrollTop = pcc.scrollHeight;
});
// DONE WITH MOUNTING TASKS
this.props.updateLoading(false);
@@ -112,6 +114,7 @@ export default class Chat extends Component {
videoEventListener(video) {
this.syncPlayer(video);
}
callEventListener(event) {}
syncPlayer(video) {
const { status, showName, time, source, element, showChanged } = video;
if (element) {
@@ -216,10 +219,12 @@ export default class Chat extends Component {
: giphyFetch.search(this.state.newMessage, { offset, limit: 1 });
}
async handlePhoneCall() {
if (!this.state.onCall) this.mCallManager.joinCall();
else this.mCallManager.leaveCall();
this.setState({ onCall: !this.state.onCall });
}
handleMute() {
this.mCallManager.toggleMute();
this.setState({ muted: !this.state.muted });
}
render() {
const { admin, name, messages, newMessage, gif, onCall, muted } = this.state;
if (getPlayerSource() === PLAYER_SOURCE.HBONOW && messages[0] !== alertMessage)
@@ -253,17 +258,17 @@ export default class Chat extends Component {
<Thread messages={messages} />
</div>
<div className="text-phone-panel">
{newMessage ? null : (
{gif || newMessage ? null : (
<IconButton onClick={this.handlePhoneCall} color={onCall ? 'secondary' : 'primary'}>
{onCall ? <PhoneDisable /> : <PhoneEnable />}
</IconButton>
)}
{!newMessage && onCall && !muted ? (
<IconButton onClick={() => this.mCallManager.toggleMute()} color="secondary">
{!gif && !newMessage && onCall && !muted ? (
<IconButton onClick={this.handleMute} color="secondary">
<MicOff />
</IconButton>
) : !newMessage && onCall && muted ? (
<IconButton onClick={() => this.mCallManager.toggleMute()} color="primary">
) : !gif && !newMessage && onCall && muted ? (
<IconButton onClick={this.handleMute} color="primary">
<MicOn />
</IconButton>
) : null}