v1.6.0/admin only mode

app/src/Api.js

@@ -18,7 +18,7 @@ HBO Now and HBO Max logos are trademark and intellectual property of WarnerMedia
 ************************************************************************/
 /*global chrome*/
 
-const API_HOST = 'https://us-central1-watch-party-crx.cloudfunctions.net/widgets2';
+const API_HOST = 'https://us-central1-watch-party-crx.cloudfunctions.net/widgets';
 
 export const PLAYER_STATUS = {
   PLAYING: 'PLAYING',
@@ -170,3 +170,10 @@ export const UpdateVoxeetApi = async (data) => {
     body: JSON.stringify(data),
   });
 };
+
+export const UpdateAdminOnly = async (data) => {
+  return fetcher({
+    endpoint: `updateAdminOnly/${data.partyName}/${data.adminOnly}`,
+    method: 'PUT',
+  });
+}

app/src/Chat.js

@@ -50,6 +50,7 @@ import {
   PLAYER_STATUS,
   emptyLocalData,
   updateLocalData,
+  UpdateAdminOnly,
 } from './Api';
 import {
   Send,
@@ -76,17 +77,6 @@ import CallManager from './CallManager';
 import VideoListener from './VideoListener';
 
 const giphyFetch = new GiphyFetch('ojJbIMUN6XRMn4mHiFFav3rMCpXUg8sq');
-const alerts = [
-  {
-    condition: () =>
-      getPlayerSource() === PLAYER_SOURCE.HBOMAX || getPlayerSource() === PLAYER_SOURCE.HBONOW,
-    message: 'Functionality may be buggy, HBO has a horrible design.',
-  },
-  {
-    condition: () => getPlayerSource() === PLAYER_SOURCE.PEACOCK,
-    message: 'Functionality may be buggy, support on this site is in testing.',
-  },
-];
 export default class Chat extends Component {
   constructor(props) {
     super(props);
@@ -95,6 +85,8 @@ export default class Chat extends Component {
       messages: [],
       newMessage: '',
       admin: null,
+      adminOnly: false,
+      adminModeUpdate: false,
       users: [],
       usersOnCall: {},
       gif: false,
@@ -125,6 +117,7 @@ export default class Chat extends Component {
     this.updateAllowAutoRejoin = this.updateAllowAutoRejoin.bind(this);
     this.updateAllowChatNotification = this.updateAllowChatNotification.bind(this);
     this.mCallManager = new CallManager(this.callEventListener, this.props.notify);
+    this.updateAdminOnly = this.updateAdminOnly.bind(this);
   }
   componentDidMount() {
     // EVENT CAPTURE FOR ENTER TO SEND
@@ -186,6 +179,10 @@ export default class Chat extends Component {
           this.props.notify(notificationMessage);
         }
       }
+      // ADMIN MODE UPDATE COMPLETE
+      if (response.adminOnly !== this.state.adminOnly) {
+        this.setState({ adminModeUpdate: false });
+      }
       this.setState(response);
       if (response.player) this.mVideoListener.doUpdate(response.player);
       const pcc = document.querySelector('.thread-container');
@@ -200,7 +197,10 @@ export default class Chat extends Component {
     this.leaveParty();
   }
   videoEventListener(video) {
-    this.syncPlayer(video);
+    const { adminOnly, admin } = this.state;
+    if (!adminOnly || (adminOnly && admin)) {
+      this.syncPlayer(video);
+    }
   }
   callEventListener(event) {
     this.setState(event);
@@ -337,7 +337,7 @@ export default class Chat extends Component {
             );
           });
       } catch (err) {
-        console.log(err);
+        console.error('Handle Phone Call Error', err);
       }
     } else this.mCallManager.toggleCall(onCall, conference, admin);
   }
@@ -364,6 +364,16 @@ export default class Chat extends Component {
       document.documentElement.requestFullscreen();
     }
   }
+  updateAdminOnly() {
+    this.setState({ adminModeUpdate: true });
+    UpdateAdminOnly({
+      partyName: this.state.name,
+      adminOnly: !this.state.adminOnly,
+    }).catch((err) => {
+      this.props.notify(err.message || err.statusText);
+      console.error('Update Admin Only API error', err);
+    });
+  }
   render() {
     const {
       admin,
@@ -380,7 +390,24 @@ export default class Chat extends Component {
       allowAutoRejoin,
       usersOnCall,
       isFullscreen,
+      adminModeUpdate,
+      adminOnly,
     } = this.state;
+    const alerts = [
+      {
+        condition: () =>
+          getPlayerSource() === PLAYER_SOURCE.HBOMAX || getPlayerSource() === PLAYER_SOURCE.HBONOW,
+        message: 'Functionality may be buggy, HBO has a horrible design.',
+      },
+      {
+        condition: () => getPlayerSource() === PLAYER_SOURCE.PEACOCK,
+        message: 'Functionality may be buggy, support on this site is in testing.',
+      },
+      {
+        condition: () => adminOnly,
+        message: 'Party is currently in admin only mode.'
+      }
+    ];
     return (
       <div className="party-chat-container">
         <div className="party-chat-header">
@@ -497,6 +524,31 @@ export default class Chat extends Component {
                 }
                 labelPlacement="end"
               />
+              {
+                admin ? 
+                <FormControlLabel
+                  className="notification-switch"
+                  control={
+                    <Switch
+                      checked={adminOnly}
+                      onChange={this.updateAdminOnly}
+                      name="adminOnly"
+                      color={adminOnly ? 'secondary' : 'primary'}
+                      disabled={adminModeUpdate}
+                    />
+                  }
+                  label={
+                    <span>
+                      Admin Only Mode (can be changed later)
+                      <br />
+                      <span style={{ color: '#8a8a8a' }}>
+                        {adminOnly ? 'Only admin can update player right now' : 'All party members can update player right now'}
+                      </span>
+                    </span>
+                  }
+                  labelPlacement="end"
+                /> : null
+              }
               <Typography className="party-controls-users-title" variant="overline">
                 PARTY MEMBERS
               </Typography>

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, TextField, Typography, Paper, ButtonGroup } from '@material-ui/core';
+import { Button, FormControlLabel, Switch, TextField, Typography, Paper, ButtonGroup } from '@material-ui/core';
 import {
   JoinRoomApi,
   CreateRoomApi,
@@ -52,7 +52,8 @@ export default class Create extends Component {
       name: '',
       pin: '',
       mode: defaultMode,
-      parties: []
+      parties: [],
+      adminOnly: false,
     };
     this.createCall = this.createCall.bind(this);
     this.joinCall = this.joinCall.bind(this);
@@ -72,7 +73,7 @@ export default class Create extends Component {
         type: 'GET_PARTIES'
       },
       (response) => {
-        this.setState({parties: response});
+        this.setState({ parties: response });
       }
     );
   }
@@ -133,6 +134,7 @@ export default class Create extends Component {
         time: 0,
         url: window.location.href,
       },
+      adminOnly: this.state.adminOnly,
     };
     CreateRoomApi(apidata)
       .then((res) => res.json())
@@ -179,21 +181,21 @@ export default class Create extends Component {
     this.props.updateLoading(false);
     goTo(Chat, this.props);
   }
-  partyNameAutocompleteProcessor (v) {
+  partyNameAutocompleteProcessor(v) {
-    if (v  !== null && v !== undefined && typeof(v) === 'object') {
+    if (v !== null && v !== undefined && typeof (v) === 'object') {
       if (v.name) this.partyNameChange(v.name);
       else this.partyNameChange('');
       if (v.pin) this.partyPinChange(v.pin);
       else this.partyPinChange('');
-    } else if (typeof(v) === 'object' && (v  === null || v === undefined)) {
+    } else if (typeof (v) === 'object' && (v === null || v === undefined)) {
       this.partyNameChange('');
       this.partyPinChange('');
-    } else if (v !== undefined && v !== null && typeof(v) === 'string') {
+    } else if (v !== undefined && v !== null && typeof (v) === 'string') {
       this.partyNameChange(v);
     }
-  } 
+  }
   render() {
-    const { mode, name, pin, userName, parties } = this.state;
+    const { mode, name, pin, userName, parties, adminOnly } = this.state;
     return (
       <div className="party-create-container">
         <Typography
@@ -245,9 +247,9 @@ export default class Create extends Component {
             autoComplete
             freeSolo
             inputValue={name}
-            onInputChange={(e,v,r) => this.partyNameAutocompleteProcessor(v)}
+            onInputChange={(e, v, r) => this.partyNameAutocompleteProcessor(v)}
             onChange={(e, v) => this.partyNameAutocompleteProcessor(v)}
-            renderInput={(params) => 
+            renderInput={(params) =>
               <TextField
                 color="secondary"
                 size="small"
@@ -256,7 +258,7 @@ export default class Create extends Component {
                 label="Party Name"
                 variant="outlined"
                 helperText={name ? `${name.length}/${CONSTANTS.NAME_LENGTH} Characters` : null}
-            />}
+              />}
           />
           <TextField
             color="secondary"
@@ -269,6 +271,30 @@ export default class Create extends Component {
             onChange={(e) => this.partyPinChange(e.target.value)}
             helperText={pin ? `${pin.length}/${CONSTANTS.PIN_LENGTH} Digits` : null}
           />
+          {
+            mode === 'create' ?
+              <FormControlLabel
+                className="notification-switch admin-only-switch"
+                control={
+                  <Switch
+                    checked={adminOnly}
+                    onChange={() => this.setState({ adminOnly: !adminOnly })}
+                    name="adminOnly"
+                    color={adminOnly ? 'secondary' : 'primary'}
+                  />
+                }
+                label={
+                  <span>
+                    Admin Only Mode (can be changed later)
+                <br />
+                    <span style={{ color: '#8a8a8a' }}>
+                      {adminOnly ? 'Only admin will update currently playing' : 'All members will update currently playing'}
+                    </span>
+                  </span>
+                }
+                labelPlacement="end"
+              /> : null
+          }
           <Button
             size="small"
             variant="contained"

app/src/index.css

@@ -614,4 +614,8 @@ body.amazon-prime .notification-switch .MuiSwitch-thumb {
 
 .MuiAutocomplete-popper {
   z-index: 99999 !important;
+}
+
+.admin-only-switch {
+  margin-bottom: 20px !important;
 }

functions/app.js

@@ -16,6 +16,7 @@ app.post('/updatePlayer', FunctionModules.updatePlayer);
 app.post('/updateVoxeet', FunctionModules.updateVoxeet);
 app.delete('/leave/:rid/users/:uid', FunctionModules.leaveRoom);
 app.delete('/delete/:rid', FunctionModules.deleteRoom);
+app.put('/updateAdminOnly/:rid/:adminOnly', FunctionModules.updateAdminOnly);
 
 // VERSION 2
 const app2 = express();

functions/modules/authenticator.js

@@ -22,7 +22,7 @@ module.exports = (req, res, next) => {
               bodydata.uid = user.uid;
               req.body = JSON.stringify(bodydata);
             }
-            if (req.method === 'GET' || req.method === 'DELETE') {
+            if (req.method === 'GET' || req.method === 'DELETE' || req.method === 'PUT') {
               req.body = JSON.stringify({ uid: user.uid });
             }
             return next();

functions/modules/createRoom.js

@@ -24,6 +24,7 @@ module.exports = async (req, res) => {
       createdAt: new Date(),
       updatedAt: new Date(),
       adminUid: bodydata.uid,
+      adminOnly: bodydata.adminOnly,
     })
     .catch((err) => {
       res.status(500).send({ message: 'Unable to start party.' });
@@ -46,23 +47,6 @@ module.exports = async (req, res) => {
         err
       );
     });
-  await admin
-    .firestore()
-    .collection('rooms')
-    .doc(bodydata.partyName)
-    .collection('messages')
-    .add({
-      uid: '<system>',
-      name: '',
-      text: `Voice calls are unavailable temporarily. Voice calls will be back within 12 hours.`,
-      time: new Date(),
-    })
-    .catch((err) => {
-      console.error(
-        `Failed to add system voice call message : \n\t Room: ${bodydata.partyName}`,
-        err
-      );
-    });
   await admin
     .firestore()
     .collection('rooms')

functions/modules/deleteRoom.js

@@ -2,7 +2,6 @@ const admin = require('firebase-admin');
 
 module.exports = async (req, res) => {
   console.log('Requested Delete - Room - ', req.params.rid);
-  console.log(req.body);
   const isAdmin = await admin
     .firestore()
     .collection('rooms')

functions/modules/index.js

@@ -11,6 +11,7 @@ const updatePlayer = require('./updatePlayer');
 const tokenValidator = require('./tokenValidator');
 const tokenRefresher = require('./tokenRefresher');
 const updateVoxeet = require('./updateVoxeet');
+const updateAdminOnly = require('./updateAdminOnly');
 
 module.exports = {
   authenticator,
@@ -26,4 +27,5 @@ module.exports = {
   tokenValidator,
   tokenRefresher,
   updateVoxeet,
+  updateAdminOnly,
 };

functions/modules/joinRoom.js

@@ -1,5 +1,4 @@
 const admin = require('firebase-admin');
-const { firestore } = require('firebase-admin');
 
 module.exports = async (req, res) => {
   const bodydata = JSON.parse(req.body);
@@ -137,7 +136,7 @@ module.exports = async (req, res) => {
         .update({
           player: {
             showName: null,
-            source: null,
+            source: bodydata.source,
             status: 'NOT_PLAYING',
             time: 0,
             updatedBy: bodydata.uid,

functions/modules/tokenRefresher.js

@@ -1,21 +1,20 @@
 const VoxeetSecret = require('../VoxeetSecret.json');
 module.exports = async (req, res) => {
-  res.status(403).send({ message: 'Voice calls are unavailable temporarily.' });
+  const { key, secret } = VoxeetSecret;
-  // const { key, secret } = VoxeetSecret;
+  const credentials = btoa(encodeURI(key) + ':' + encodeURI(secret));
-  // const credentials = btoa(encodeURI(key) + ':' + encodeURI(secret));
+  const headers = {
-  // const headers = {
+    'Content-Type': 'application/json',
-  //   'Content-Type': 'application/json',
+    'Cache-Control': 'no-cache',
-  //   'Cache-Control': 'no-cache',
+    Authorization: 'Basic ' + credentials,
-  //   Authorization: 'Basic ' + credentials,
+  };
-  // };
+  const oauth = await fetch(VoxeetSecret.refreshURL, {
-  // const oauth = await fetch(VoxeetSecret.refreshURL, {
+    method: 'POST',
-  //   method: 'POST',
+    headers,
-  //   headers,
+    body: JSON.stringify({
-  //   body: JSON.stringify({
+      refresh_token: req.params.token,
-  //     refresh_token: req.params.token,
+    }),
-  //   }),
+  })
-  // })
+    .then((oauthResponse) => oauthResponse.json())
-  //   .then((oauthResponse) => oauthResponse.json())
+    .catch((err) => res.status(500).send(err));
-  //   .catch((err) => res.status(500).send(err));
+  if (oauth) res.status(200).send(oauth);
-  // if (oauth) res.status(200).send(oauth);
 };

functions/modules/tokenValidator.js

@@ -1,22 +1,21 @@
 const VoxeetSecret = require('../VoxeetSecret.json');
 const fetch = require('node-fetch');
 module.exports = async (req, res) => {
-  res.status(403).send({ message: 'Voice calls are unavailable temporarily.' });
+  const { key, secret } = VoxeetSecret;
-  // const { key, secret } = VoxeetSecret;
+  const credentials = Buffer.from(encodeURI(key) + ':' + encodeURI(secret)).toString('base64');
-  // const credentials = Buffer.from(encodeURI(key) + ':' + encodeURI(secret)).toString('base64');
+  const headers = {
-  // const headers = {
+    'Content-Type': 'application/json',
-  //   'Content-Type': 'application/json',
+    'Cache-Control': 'no-cache',
-  //   'Cache-Control': 'no-cache',
+    Authorization: 'Basic ' + credentials,
-  //   Authorization: 'Basic ' + credentials,
+  };
-  // };
+  const oauth = await fetch(VoxeetSecret.validateURL, {
-  // const oauth = await fetch(VoxeetSecret.validateURL, {
+    method: 'POST',
-  //   method: 'POST',
+    headers,
-  //   headers,
+    body: JSON.stringify({
-  //   body: JSON.stringify({
+      grant_type: 'client_credentials',
-  //     grant_type: 'client_credentials',
+    }),
-  //   }),
+  })
-  // })
+    .then((oauthResponse) => oauthResponse.json())
-  //   .then((oauthResponse) => oauthResponse.json())
+    .catch((err) => res.status(500).send(err));
-  //   .catch((err) => res.status(500).send(err));
+  if (oauth) res.status(200).send(oauth);
-  // if (oauth) res.status(200).send(oauth);
 };

functions/modules/updateAdminOnly.js

@@ -0,0 +1,36 @@
+const admin = require('firebase-admin');
+
+module.exports = async (req, res) => {
+  const bodydata = JSON.parse(req.body);
+  const isAdmin = await admin
+    .firestore()
+    .collection('rooms')
+    .doc(req.params.rid)
+    .collection('users')
+    .doc(bodydata.uid)
+    .get()
+    .then((v) => {
+      if (v.exists) {
+        return v.data().admin;
+      }
+      return false;
+    })
+    .catch((err) => {
+        console.err('Failed to get party to update adminOnly', err);
+        return res.status(404).send({ message: 'Failed to get party.' });
+    });
+  if (!isAdmin) {
+    console.log('[UNAUTHORIZED] Requested Admin Mode Update - Room - ', req.params.rid);
+    res.status(401).send({ message: 'Not authorized to update admin only mode for this party.' });
+    return;
+  }
+  const adminOnly = req.params.adminOnly === 'true';
+  await admin.firestore().collection('rooms').doc(req.params.rid).update({
+      adminOnly
+  }).catch((err) => {
+      console.err('Failed to update adminOnly for party', err);
+      res.status(409).send({ message: 'Failed to update party.' });
+  });
+  res.status(200).send({ message: 'Updated admin only mode for party' });
+  return;
+};

functions/modules/updatePlayer.js

@@ -14,6 +14,7 @@ module.exports = async (req, res) => {
   //   player.time > 3600
   //     ? new Date(player.time * 1000).toISOString().substr(11, 8)
   //     : new Date(player.time * 1000).toISOString().substr(14, 5);
+  if (!roomId) return res.status(204).send({ message: 'Party name not sent.' });
   const [roomExists, roomData] = await admin
     .firestore()
     .collection('rooms')
@@ -30,7 +31,7 @@ module.exports = async (req, res) => {
     .get()
     .then((userSnap) => userSnap.exists);
   if (userExists) {
-    if (showChanged === true) {
+    if (showChanged === true && player.showName) {
       await admin
         .firestore()
         .collection('rooms')

functions/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "watch-party-api",
-  "version": "1.2.1",
+  "version": "1.6.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1909,9 +1909,9 @@
       }
     },
     "lodash": {
-      "version": "4.17.15",
+      "version": "4.17.19",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.19.tgz",
-      "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A=="
+      "integrity": "sha512-JNvd8XER9GQX0v2qJgsaN/mzFCNA5BRe/j8JN9d+tWyGLSodKQHKFicdwNYzWwI3wjRnaKPsGj1XkBjx/F96DQ=="
     },
     "lodash.at": {
       "version": "4.6.0",