diff --git a/app/public/background.js b/app/public/background.js index be9a26c..d71e7fd 100644 --- a/app/public/background.js +++ b/app/public/background.js @@ -119,6 +119,9 @@ chrome.runtime.onMessage.addListener((request, sender, sendResponse) => { case 'GET_PARTIES': sendResponse(window.localStorage.getItem('parties') ? JSON.parse(window.localStorage.getItem('parties')): []); break; + case 'EMPTY_PARTIES': + window.localStorage.removeItem('parties'); + break; default: console.warn('Unknown message type: <', type, '>'); break; diff --git a/app/src/App.js b/app/src/App.js index 7c233e3..7e8787b 100644 --- a/app/src/App.js +++ b/app/src/App.js @@ -150,13 +150,14 @@ const App = () => { notify={(message) => setNotification({ open: true, message })} appVersion={APP_VERSION} appVersionString={APP_VERSION_STRING} + status={status[APP_VERSION_STRING]} /> ) : ( )} diff --git a/app/src/Chat.js b/app/src/Chat.js index eb8f264..fe4710f 100644 --- a/app/src/Chat.js +++ b/app/src/Chat.js @@ -36,6 +36,8 @@ import { Chip, CircularProgress, Paper, + Grid, + Slider, } from '@material-ui/core'; import Thread from './Thread'; import { @@ -47,10 +49,10 @@ import { PLAYER_SOURCE, LocalData, PLAYER_STATUS, - emptyLocalData, updateLocalData, UpdateAdminOnly, scrollThread, + removeLocalData, } from './Api'; import { Send, @@ -70,6 +72,8 @@ import { Error, FullscreenExit, Fullscreen, + VolumeDown, + VolumeUp, CancelRounded, } from '@material-ui/icons'; import Create from './Create'; @@ -255,7 +259,8 @@ export default class Chat extends Component { DeleteRoomApi(data) .then((res) => { this.props.notify('Ended party'); - emptyLocalData(); + removeLocalData('partyPin'); + removeLocalData('partyName'); goTo(Create, this.props); this.props.updateLoading(false); }) @@ -282,7 +287,8 @@ export default class Chat extends Component { LeaveRoomApi(data) .then((res) => { this.props.notify('Left party'); - emptyLocalData(); + removeLocalData('partyPin'); + removeLocalData('partyName'); goTo(Create, this.props); this.props.updateLoading(false); }) @@ -434,6 +440,23 @@ export default class Chat extends Component { } return null; } + getVideoVolume (id) { + console.log('GET VIDEO VOLUME FOR USER', id); + if (document.getElementById(id)) { + return document.getElementById(id).volume * 10; + } else { + console.log('VIDEO NOT FOUND FOR USER', id); + } + return 0; + } + setVideoVolume (v,id) { + console.log('SET VIDEO VOLUME FOR USER', v, id); + if (document.getElementById(id)) { + return document.getElementById(id).volume = (v/10); + } else { + console.log('VIDEO NOT FOUND FOR USER', id); + } + } render() { const { admin, @@ -634,17 +657,33 @@ export default class Chat extends Component { {Object.keys(usersOnCall).map((id) => { return usersOnCall[id].status === 'Connected' || usersOnCall[id].status === 'Connecting' ? ( - + + + + + + this.setVideoVolume(v, id)} /> + + + + + + } + > + + ) : null; })} diff --git a/app/src/Create.js b/app/src/Create.js index efdbdc6..2ad015d 100644 --- a/app/src/Create.js +++ b/app/src/Create.js @@ -18,7 +18,7 @@ HBO Now and HBO Max logos are trademark and intellectual property of WarnerMedia ************************************************************************/ /*global chrome */ import React, { Component } from 'react'; -import { Button, FormControlLabel, Switch, TextField, Typography, Paper, ButtonGroup } from '@material-ui/core'; +import { Button, FormControlLabel, Switch, TextField, Typography, Paper, ButtonGroup, ExpansionPanel, ExpansionPanelSummary, ExpansionPanelDetails, MobileStepper, IconButton, Card, CardContent, CardActions } from '@material-ui/core'; import { JoinRoomApi, CreateRoomApi, @@ -36,6 +36,11 @@ import { InfoRounded, MonetizationOnRounded, RateReviewRounded, + Settings, + ExpandLess, + KeyboardArrowLeft, + KeyboardArrowRight, + Notifications } from '@material-ui/icons'; import { Autocomplete } from "@material-ui/lab"; @@ -55,11 +60,20 @@ export default class Create extends Component { mode: defaultMode, parties: [], adminOnly: false, + alertStep: this.props.status && this.props.status.importantAlert ? this.props.status.importantAlert : 0, + allowAutoRejoin: + LocalData().allowAutoRejoin !== undefined ? LocalData().allowAutoRejoin : true, + allowChatNotification: + LocalData().allowChatNotification !== undefined ? LocalData().allowChatNotification : true, }; this.createCall = this.createCall.bind(this); this.joinCall = this.joinCall.bind(this); this.success = this.success.bind(this); this.partyNameAutocompleteProcessor = this.partyNameAutocompleteProcessor.bind(this); + this.updateAllowAutoRejoin = this.updateAllowAutoRejoin.bind(this); + this.updateAllowChatNotification = this.updateAllowChatNotification.bind(this); + this.clearPartyHistory = this.clearPartyHistory.bind(this); + this.handleSteps = this.handleSteps.bind(this); } componentDidMount() { const { lastActive, userName, partyName, partyPin, allowAutoRejoin } = LocalData(); @@ -196,8 +210,39 @@ export default class Create extends Component { this.partyNameChange(v); } } + updateAllowChatNotification() { + updateLocalData({ allowChatNotification: !this.state.allowChatNotification }); + this.setState({ allowChatNotification: !this.state.allowChatNotification }); + } + updateAllowAutoRejoin() { + updateLocalData({ allowAutoRejoin: !this.state.allowAutoRejoin }); + this.setState({ allowAutoRejoin: !this.state.allowAutoRejoin }); + } + clearPartyHistory () { + this.setState({ + parties: [], + }); + chrome.runtime.sendMessage({type: 'EMPTY_PARTIES'}); + } + handleSteps (direction) { + const { alertStep } = this.state; + if (alertStep + direction < 0) return; + if (alertStep + direction >= this.props.status.alerts.length) return; + this.setState({ alertStep: alertStep + direction }); + } render() { - const { mode, name, pin, userName, parties, adminOnly } = this.state; + const { + mode, + name, + pin, + userName, + parties, + adminOnly, + allowAutoRejoin, + allowChatNotification, + alertStep + } = this.state; + const { status } = this.props; return (
this.partyPinChange(e.target.value)} helperText={pin ? `${pin.length}/${CONSTANTS.PIN_LENGTH} Digits` : null} /> - { - mode === 'create' ? - this.setState({ adminOnly: !adminOnly })} - name="adminOnly" - color={adminOnly ? 'secondary' : 'primary'} - /> - } - label={ - - Admin Only Mode (can be changed later) -
- - {adminOnly ? 'Only admin will update currently playing and start calls' : 'All members will update currently playing and start calls'} - - - } - labelPlacement="end" - /> : null - } + this.setState({ adminOnly: !adminOnly })} + name="adminOnly" + color={adminOnly ? 'secondary' : 'primary'} + /> + } + label={ + + Admin Only Mode (can be changed later) +
+ + {adminOnly ? 'Only admin will update currently playing and start calls' : 'All members will update currently playing and start calls'} + + + } + labelPlacement="end" + /> + + }> + + + Alerts + + + + {status ? +
+ + + + {status.alerts[alertStep].title} + + + {status.alerts[alertStep].description} + + + { + status.alerts[alertStep].link && + status.alerts[alertStep].linkText && + + + + } + + this.handleSteps(-1)}> } + nextButton={ this.handleSteps(1)}> } + steps={status.alerts ? status.alerts.length : 0} + /> +
+ : ( + No alerts right now + ) + } + + + + }> + + + Settings + + + + + } + label={ + + Allow chat notification when side panel is closed +
+ + {allowChatNotification ? 'Notifications Enabled' : 'Notifications Disabled'} + + + } + labelPlacement="end" + /> + + } + label={ + + Allow Watch Party to auto rejoin (within 1 minute) +
+ + {allowAutoRejoin ? 'Auto Rejoin Enabled' : 'Auto Rejoin Disabled'} + + + } + labelPlacement="end" + /> + + +