Allow watchers to play in addition to pause

closes #110

server.js

@@ -201,19 +201,19 @@ ptserver_io.on('connection', (socket) => {
     socket.emit('party-pausing-changed', { value, user });
     return true;
   });
-  socket.on('party_pausing_send', () => {
+  socket.on('party_pausing_send', (isPause) => {
     const user = socket.selfUser;
     const room = ptserver_io.sockets.adapter.rooms[user.room];
     if (!room || !room.partyPausing) {
       return false;
     }
-    socket.broadcast.to(socket.selfUser.room).emit('party-pausing-pause', user);
-    socket.emit('party-pausing-pause', user);
+    socket.broadcast.to(socket.selfUser.room).emit('party-pausing-pause', { isPause, user });
+    socket.emit('party-pausing-pause', { isPause, user });
     return true;
   });
   socket.on('transfer_host', (data) => {
     if (socket.ourRoom == null) {
-      socket.emit('flowerror', 'You aren\' connected to a room! Use join');
+      socket.emit('flowerror', 'You aren\'t connected to a room! Use join');
       socket.emit('rejoin');
       return;
     }

src/sidebar.vue

@@ -44,10 +44,12 @@
                     color="primary"
                     slot="activator"
                     :disabled="!partyPausing"
-                    block
-                    @click="sendPartyPauseLocal()"
+                    style="min-width: 0; float: right;"
+                    @click="sendPartyPauseLocal(playerState(host) === 'play_arrow')"
+                    v-if="playerState(host) !== 'stop'"
                   >
-                    Pause
+                    <v-icon v-if="playerState(host) === 'play_arrow'">pause</v-icon>
+                    <v-icon v-else>play_arrow</v-icon>
                   </v-btn>
                   <span> Party Pausing is currently {{ partyPausing ? 'enabled' : 'disabled' }} by the host </span>
                 </v-tooltip>
@@ -179,6 +181,9 @@ export default {
     me() {
       return this.$store.state.me;
     },
+    host() {
+      return this.$store.getters.getUsers.find(user => user.role === 'host')
+    },
     chosenClient() {
       return this.$store.getters.getChosenClient;
     },
@@ -285,12 +290,12 @@ export default {
     isHost(user) {
       return user.role === 'host';
     },
-    sendPartyPauseLocal() {
+    sendPartyPauseLocal(isPause) {
       this.localPauseTimeout = true;
       setTimeout(() => {
         this.localPauseTimeout = false;
       }, 3000);
-      this.sendPartyPause();
+      this.sendPartyPause(isPause);
     },
     getUserColor(user) {
       if (user.status === 'good' || user.role === 'host') {

src/store/modules/synclounge.js

@@ -213,15 +213,20 @@ export default {
               });
               commit('SET_PARTYPAUSING', value);
             });
-            state._socket.on('party-pausing-pause', (user) => {
+            state._socket.on('party-pausing-pause', ({ isPause, user }) => {
+              const messageText = `${user.username} pressed ${isPause ? 'pause' : 'play'}`
               commit('ADD_MESSAGE', {
-                msg: `${user.username} pressed pause`,
+                msg: messageText,
                 user,
                 type: 'alert',
               });
-              sendNotification(`${user.username} pressed pause`);
+              sendNotification(messageText);
               if (rootState.chosenClient) {
-                rootState.chosenClient.pressPause();
+                if (isPause) {
+                  rootState.chosenClient.pressPause();
+                } else {
+                  rootState.chosenClient.pressPlay();
+                }
               }
             });
             state._socket.on('user-joined', (users, user, commandId) => {
@@ -496,11 +501,17 @@ export default {
         state._socket.emit('party_pausing_change', value);
       }
     },
-    sendPartyPause({ rootState, state, commit }) {
+    sendPartyPause({ rootState, state, commit }, isPause) {
       if (state._socket.connected) {
-        state._socket.emit('party_pausing_send', (response) => {
+        state._socket.emit('party_pausing_send', isPause, (response) => {
           console.log('Response from send', response);
-          if (response) rootState.chosenClient.pressPause();
+          if (response) {
+            if (isPause) {
+              rootState.chosenClient.pressPause();
+            } else {
+              rootState.chosenClient.pressPlay();
+            }
+          }
         });
       }
     },