From 5de6ff7cdfaca99ed28fc66b02a25c1d9d253e59 Mon Sep 17 00:00:00 2001
From: Ayushya Amitabh <ayushyamitabh@gmail.com>
Date: Fri, 7 Aug 2020 18:21:51 -0400
Subject: [PATCH] v1.6.0/fix peacock sync

---
 app/src/VideoListener.js | 43 ++++++++++++++++++++--------------------
 1 file changed, 22 insertions(+), 21 deletions(-)

diff --git a/app/src/VideoListener.js b/app/src/VideoListener.js
index 88bab53..4abf07f 100644
--- a/app/src/VideoListener.js
+++ b/app/src/VideoListener.js
@@ -86,6 +86,7 @@ export default class VideoListener {
                 await this.video.element
                   .play()
                   .catch((err) => console.error('WatchParty erred when syncing time.'));
+              await this.timeout(250);
               this.video.element.currentTime = serverPlayer.time;
               await this.timeout(500);
               break;
@@ -104,14 +105,14 @@ export default class VideoListener {
               this.video.element.currentTime = serverPlayer.time;
               break;
             case PLAYER_SOURCE.PEACOCK:
-              const sliderHead = document.body.querySelector(
-                '.playback-scrubber-bar .rc-slider-handle'
+              window.postMessage(
+                JSON.stringify({
+                  watchPartyDirection: 'TO_SCRIPT',
+                  type: 'WATCH_PARTY_SEEK',
+                  status: serverPlayer.status,
+                  time: serverPlayer.time,
+                })
               );
-              sliderHead.style.left =
-                ((serverPlayer.time * 1000) / sliderHead.getAttribute('aria-valueMax')) * 100 + '%';
-              simulate(sliderHead, 'mousedown');
-              simulate(sliderHead, 'mouseup');
-              await this.timeout(500);
               break;
             case PLAYER_SOURCE.GOOGLEPLAY:
               this.video.element.currentTime = serverPlayer.time;
@@ -140,7 +141,10 @@ export default class VideoListener {
               PLAYER_SOURCE.HBONOW === this.video.source
             ) {
               window.postMessage({ type: 'PAUSE', time: serverPlayer.time }, '*');
-            } else if (PLAYER_SOURCE.CRUNCHYROLL === this.video.source) {
+            } else if (
+              PLAYER_SOURCE.CRUNCHYROLL === this.video.source ||
+              PLAYER_SOURCE.PEACOCK === this.video.source
+            ) {
               window.postMessage(
                 JSON.stringify({
                   watchPartyDirection: 'TO_SCRIPT',
@@ -161,7 +165,10 @@ export default class VideoListener {
               PLAYER_SOURCE.HBONOW === this.video.source
             ) {
               window.postMessage({ type: 'PLAY', time: serverPlayer.time }, '*');
-            } else if (PLAYER_SOURCE.CRUNCHYROLL === this.video.source) {
+            } else if (
+              PLAYER_SOURCE.CRUNCHYROLL === this.video.source ||
+              PLAYER_SOURCE.PEACOCK === this.video.source
+            ) {
               window.postMessage(
                 JSON.stringify({
                   watchPartyDirection: 'TO_SCRIPT',
@@ -304,12 +311,6 @@ export default class VideoListener {
     this.updateStatus({
       element: videoElement,
     });
-    // if (videoElement.currentTime > 0 && !videoElement.paused) {
-    //   this.updateStatus({
-    //     time: videoElement.currentTime,
-    //     status: PLAYER_STATUS.PLAYING,
-    //   });
-    // }
     this.updateStatus({
       showName: await this.getShowName(),
     });
@@ -510,9 +511,11 @@ export default class VideoListener {
         }
         break;
       case PLAYER_SOURCE.PEACOCK:
-        const peacockVideoElement = document.querySelector(
-          '#mount > div > div > div > div > div > div.video-player-component.playback-component > div > video'
-        );
+        const peacockInject = `var watchPartyInteraction=function(e){if(e.source===window){const data=JSON.parse(e.data);const playerReactElement=document.querySelector(".video-player-component.playback-component > div");if(data.watchPartyDirection==='TO_SCRIPT'){if(data.type==='WATCH_PARTY_SEEK'){if(playerReactElement&&playerReactElement.player){playerReactElement.player.seek(data.time)}}else if(data.type==='WATCH_PARTY_STATUS'){if(playerReactElement&&playerReactElement.player){if(data.status==='PAUSED')playerReactElement.player.pause();if(data.status==='PLAYING')playerReactElement.player.play()}}}}};window.addEventListener("message",watchPartyInteraction);`;
+        const peacockInjectScript = document.createElement('script');
+        peacockInjectScript.text = peacockInject;
+        document.head.appendChild(peacockInjectScript);
+        const peacockVideoElement = document.querySelector(".video-player-component.playback-component video")
         if (peacockVideoElement) {
           this.firstTimeSync(peacockVideoElement);
         } else {
@@ -520,9 +523,7 @@ export default class VideoListener {
             this.video.element
               ? null
               : () => {
-                  var pve = document.querySelector(
-                    '#mount > div > div > div > div > div > div.video-player-component.playback-component > div > video'
-                  );
+                  var pve = document.querySelector(".video-player-component.playback-component video");
                   if (
                     pve !== null &&
                     pve !== undefined &&