v1.6.1/release

-amazon fix
-play movies fix
This commit is contained in:
2020-08-12 10:39:39 -04:00
parent e1cc9fa6f5
commit 0de3788e13
10 changed files with 410 additions and 267 deletions
+59 -38
View File
@@ -9,27 +9,33 @@ ALL CONTENT ON WATCH PARTY'S WEBSITE OR IN WATCH PARTY'S CHROME EXTENSION APP, U
CITED ARE THE SOLE INTELECTUAL PROPERTY OF AYUSHYA AMITABH, AND MAY NOT BE
COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
************************************************************************/
import React, { useState, useEffect } from 'react';
import Router from 'route-lite';
import { Fab, createMuiTheme, ThemeProvider, Snackbar, Tooltip } from '@material-ui/core';
import Create from './Create';
import Loading from './Loading';
import firebase from 'firebase/app';
import 'firebase/firestore';
import Inactive from './Inactive';
import { getUserUid, getPlayerSource, PLAYER_SOURCE } from './Api';
import React, { useState, useEffect } from "react";
import Router from "route-lite";
import {
Fab,
createMuiTheme,
ThemeProvider,
Snackbar,
Tooltip,
} from "@material-ui/core";
import Create from "./Create";
import Loading from "./Loading";
import firebase from "firebase/app";
import "firebase/firestore";
import Inactive from "./Inactive";
import { getUserUid, getPlayerSource, PLAYER_SOURCE } from "./Api";
const APP_VERSION = '1.6.0';
const APP_VERSION_STRING = APP_VERSION.replace(/\./g, '');
const APP_VERSION = "1.6.1";
const APP_VERSION_STRING = APP_VERSION.replace(/\./g, "");
const darkTheme = createMuiTheme({
palette: {
type: 'dark',
type: "dark",
primary: {
main: '#FF0000',
main: "#FF0000",
},
secondary: {
main: '#c0f300',
main: "#c0f300",
},
},
});
@@ -42,32 +48,41 @@ const Routes = (props) => (
const resetResize = () => {
const checkedX = 400;
document.documentElement.style.setProperty('--party-width', `${checkedX}px`);
document.documentElement.style.setProperty('--neg-party-width', `-${checkedX}px`);
document.documentElement.style.setProperty("--party-width", `${checkedX}px`);
document.documentElement.style.setProperty(
"--neg-party-width",
`-${checkedX}px`
);
};
const doResize = (ev) => {
const checkedX =
window.innerWidth -
Math.min(window.innerWidth - 300, Math.max(window.innerWidth * 0.5, ev.clientX));
document.documentElement.style.setProperty('--party-width', `${checkedX}px`);
document.documentElement.style.setProperty('--neg-party-width', `-${checkedX}px`);
Math.min(
window.innerWidth - 300,
Math.max(window.innerWidth * 0.5, ev.clientX)
);
document.documentElement.style.setProperty("--party-width", `${checkedX}px`);
document.documentElement.style.setProperty(
"--neg-party-width",
`-${checkedX}px`
);
};
const stopResize = (ev) => {
document.documentElement.removeEventListener('mousemove', doResize, false);
document.documentElement.removeEventListener('mouseup', stopResize, false);
document.documentElement.removeEventListener("mousemove", doResize, false);
document.documentElement.removeEventListener("mouseup", stopResize, false);
};
const startResize = (ev) => {
document.documentElement.addEventListener('mousemove', doResize, false);
document.documentElement.addEventListener('mouseup', stopResize, false);
document.documentElement.addEventListener("mousemove", doResize, false);
document.documentElement.addEventListener("mouseup", stopResize, false);
};
const App = () => {
const closedNotification = { open: false, message: '' };
const closedNotification = { open: false, message: "" };
const [status, setStatus] = useState({ active: false, message: '' });
const [status, setStatus] = useState({ active: false, message: "" });
const [visible, setVisible] = useState(false);
const [loading, setLoading] = useState(false);
const [notification, setNotification] = useState(closedNotification);
@@ -79,8 +94,8 @@ const App = () => {
getUserUid();
firebase
.firestore()
.collection('server')
.doc('status')
.collection("server")
.doc("status")
.onSnapshot((statusSnap) => {
setStatus(statusSnap.data());
setLoading(false);
@@ -88,18 +103,19 @@ const App = () => {
}, []);
// HANDLE VISIBILITY STYLING
const PartyRoutesWrapper = document.getElementById('party-routes-wrapper');
const PartyRoutesWrapper = document.getElementById("party-routes-wrapper");
if (visible) {
document.body.classList.add('visible');
PartyRoutesWrapper && PartyRoutesWrapper.classList.add('visible');
document.body.classList.add("visible");
PartyRoutesWrapper && PartyRoutesWrapper.classList.add("visible");
if (
!hasAttached &&
(getPlayerSource() === PLAYER_SOURCE.HBOMAX || getPlayerSource() === PLAYER_SOURCE.HBONOW)
(getPlayerSource() === PLAYER_SOURCE.HBOMAX ||
getPlayerSource() === PLAYER_SOURCE.HBONOW)
) {
document.addEventListener(
'mousedown',
"mousedown",
function (ev) {
if (document.body.querySelector('body.visible')) {
if (document.body.querySelector("body.visible")) {
ev.preventDefault();
ev.stopPropagation();
ev.stopImmediatePropagation();
@@ -110,8 +126,8 @@ const App = () => {
hasAttached = true;
}
} else {
document.body.classList.remove('visible');
PartyRoutesWrapper && PartyRoutesWrapper.classList.remove('visible');
document.body.classList.remove("visible");
PartyRoutesWrapper && PartyRoutesWrapper.classList.remove("visible");
}
// HANDLE FULLSCREEN EVENT
@@ -123,7 +139,7 @@ const App = () => {
<ThemeProvider theme={darkTheme}>
<Snackbar
className="party-notification-container"
anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}
anchorOrigin={{ vertical: "bottom", horizontal: "right" }}
open={notification.open}
onClose={() => setNotification(closedNotification)}
message={notification.message}
@@ -136,12 +152,17 @@ const App = () => {
title="Resize Sidebar / Double Click To Reset"
aria-label="Resize Sidebar / Double Click To Reset"
>
<div onDoubleClick={resetResize} onMouseDown={startResize} id="party-width-dragger">
<div
onDoubleClick={resetResize}
onMouseDown={startResize}
id="party-width-dragger"
>
||
</div>
</Tooltip>
{loading && <Loading />}
{status[APP_VERSION_STRING] && status[APP_VERSION_STRING].active === true ? (
{status[APP_VERSION_STRING] &&
status[APP_VERSION_STRING].active === true ? (
<Routes
updateLoading={setLoading}
notify={(message) => setNotification({ open: true, message })}
+207 -136
View File
@@ -9,17 +9,22 @@ ALL CONTENT ON WATCH PARTY'S WEBSITE OR IN WATCH PARTY'S CHROME EXTENSION APP, U
CITED ARE THE SOLE INTELECTUAL PROPERTY OF AYUSHYA AMITABH, AND MAY NOT BE
COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
************************************************************************/
import { PLAYER_STATUS, getPlayerSource, PLAYER_SOURCE, LocalData } from './Api';
import {
PLAYER_STATUS,
getPlayerSource,
PLAYER_SOURCE,
LocalData,
} from "./Api";
const templateListener = (video) => console.log('MISSING VIDEO LISTENER');
const templateListener = (video) => console.log("MISSING VIDEO LISTENER");
export default class VideoListener {
constructor(listener = templateListener) {
this.video = {
status: PLAYER_STATUS.NOT_PLAYING,
time: 0,
showName: '',
source: '',
showName: "",
source: "",
element: null,
};
this.isUpdating = false;
@@ -41,7 +46,7 @@ export default class VideoListener {
this.video.element !== null &&
this.video.element !== undefined &&
this.video.status !== PLAYER_STATUS.NOT_PLAYING &&
this.video.showName !== '' &&
this.video.showName !== "" &&
this.video.showName !== null &&
(this.video.status !== this.server.status ||
Math.abs(this.video.element.currentTime - this.server.time) > 1.5)
@@ -68,23 +73,30 @@ export default class VideoListener {
// REMOVE LISTENER BEFORE SYNCING
switch (this.video.source) {
case PLAYER_SOURCE.CRUNCHYROLL:
window.removeEventListener('watchParty', this.crunchyRollListener);
window.removeEventListener("watchParty", this.crunchyRollListener);
default:
this.video.element.removeEventListener('playing', this.onplay);
this.video.element.removeEventListener('pause', this.onpause);
this.video.element.removeEventListener("playing", this.onplay);
this.video.element.removeEventListener("pause", this.onpause);
}
await this.timeout(250);
// SEEK
if (Math.abs(serverPlayer.time - this.video.element.currentTime) > 1.5) {
if (
Math.abs(serverPlayer.time - this.video.element.currentTime) > 1.5
) {
switch (serverPlayer.source) {
case PLAYER_SOURCE.NETFLIX:
window.postMessage({ type: 'SEEK', time: serverPlayer.time * 1000 }, '*');
window.postMessage(
{ type: "SEEK", time: serverPlayer.time * 1000 },
"*"
);
break;
case PLAYER_SOURCE.AMAZON:
if (this.video.status === PLAYER_STATUS.PAUSED)
await this.video.element
.play()
.catch((err) => console.error('WatchParty erred when syncing time.'));
.catch((err) =>
console.error("WatchParty erred when syncing time.")
);
await this.timeout(250);
this.video.element.currentTime = serverPlayer.time;
await this.timeout(500);
@@ -97,7 +109,10 @@ export default class VideoListener {
this.video.element.currentTime = serverPlayer.time;
break;
case PLAYER_SOURCE.HULU:
window.postMessage({ type: 'SEEK', time: serverPlayer.time }, '*');
window.postMessage(
{ type: "SEEK", time: serverPlayer.time },
"*"
);
break;
case PLAYER_SOURCE.HBOMAX:
case PLAYER_SOURCE.HBONOW:
@@ -106,8 +121,8 @@ export default class VideoListener {
case PLAYER_SOURCE.PEACOCK:
window.postMessage(
JSON.stringify({
watchPartyDirection: 'TO_SCRIPT',
type: 'WATCH_PARTY_SEEK',
watchPartyDirection: "TO_SCRIPT",
type: "WATCH_PARTY_SEEK",
status: serverPlayer.status,
time: serverPlayer.time,
})
@@ -119,8 +134,8 @@ export default class VideoListener {
case PLAYER_SOURCE.CRUNCHYROLL:
window.postMessage(
JSON.stringify({
watchPartyDirection: 'TO_SCRIPT',
type: 'WATCH_PARTY_SEEK',
watchPartyDirection: "TO_SCRIPT",
type: "WATCH_PARTY_SEEK",
status: serverPlayer.status,
time: serverPlayer.time,
})
@@ -139,15 +154,18 @@ export default class VideoListener {
PLAYER_SOURCE.HBOMAX === this.video.source ||
PLAYER_SOURCE.HBONOW === this.video.source
) {
window.postMessage({ type: 'PAUSE', time: serverPlayer.time }, '*');
window.postMessage(
{ type: "PAUSE", time: serverPlayer.time },
"*"
);
} else if (
PLAYER_SOURCE.CRUNCHYROLL === this.video.source ||
PLAYER_SOURCE.PEACOCK === this.video.source
) {
window.postMessage(
JSON.stringify({
watchPartyDirection: 'TO_SCRIPT',
type: 'WATCH_PARTY_STATUS',
watchPartyDirection: "TO_SCRIPT",
type: "WATCH_PARTY_STATUS",
status: serverPlayer.status,
time: serverPlayer.time,
})
@@ -163,15 +181,18 @@ export default class VideoListener {
PLAYER_SOURCE.HBOMAX === this.video.source ||
PLAYER_SOURCE.HBONOW === this.video.source
) {
window.postMessage({ type: 'PLAY', time: serverPlayer.time }, '*');
window.postMessage(
{ type: "PLAY", time: serverPlayer.time },
"*"
);
} else if (
PLAYER_SOURCE.CRUNCHYROLL === this.video.source ||
PLAYER_SOURCE.PEACOCK === this.video.source
) {
window.postMessage(
JSON.stringify({
watchPartyDirection: 'TO_SCRIPT',
type: 'WATCH_PARTY_STATUS',
watchPartyDirection: "TO_SCRIPT",
type: "WATCH_PARTY_STATUS",
status: serverPlayer.status,
time: serverPlayer.time,
})
@@ -179,7 +200,9 @@ export default class VideoListener {
} else {
await this.video.element
.play()
.catch((err) => console.error('WatchParty erred when syncing play.'));
.catch((err) =>
console.error("WatchParty erred when syncing play.")
);
}
break;
default:
@@ -189,10 +212,10 @@ export default class VideoListener {
// RE-ADD LISTENERS FOR FUTURE SYNC
switch (this.video.source) {
case PLAYER_SOURCE.CRUNCHYROLL:
window.addEventListener('watchParty', this.crunchyRollListener);
window.addEventListener("watchParty", this.crunchyRollListener);
default:
this.video.element.addEventListener('playing', this.onplay);
this.video.element.addEventListener('pause', this.onpause);
this.video.element.addEventListener("playing", this.onplay);
this.video.element.addEventListener("pause", this.onpause);
}
}
this.isUpdating = false;
@@ -208,74 +231,89 @@ export default class VideoListener {
switch (this.video.source) {
case PLAYER_SOURCE.NETFLIX:
const titleContainerParent = document.querySelector(
'.PlayerControls--control-element.text-control.video-title'
".PlayerControls--control-element.text-control.video-title"
);
if (titleContainerParent) {
const titleContainer = titleContainerParent.firstChild;
const nshow = titleContainer.querySelector('h4')
? titleContainer.querySelector('h4').innerHTML
const nshow = titleContainer.querySelector("h4")
? titleContainer.querySelector("h4").innerHTML
: titleContainer.innerHTML;
let nepisode = '';
titleContainer.querySelectorAll('span').forEach((e) => {
if (e.innerHTML) nepisode += e.innerHTML + ' ';
let nepisode = "";
titleContainer.querySelectorAll("span").forEach((e) => {
if (e.innerHTML) nepisode += e.innerHTML + " ";
});
return nshow === '' && nepisode === '' ? null : nshow + '\n' + nepisode;
return nshow === "" && nepisode === ""
? null
: nshow + "\n" + nepisode;
}
break;
case PLAYER_SOURCE.AMAZON:
const ashow = document.querySelector('.f3w9jrr.ff48h02').firstChild.innerHTML;
const aepisode = document.querySelector('.f3w9jrr.ff48h02').lastChild.innerHTML;
return ashow === '' && aepisode === '' ? null : ashow + '\n' + aepisode;
const ashow =
document.querySelector(
"#dv-web-player > div > div:nth-child(1) > div > div > div.webPlayerSDKUiContainer > div > div > div > div > div > div > div > div:nth-child(2) > div:nth-child(2)"
).innerText || "";
return ashow === "" ? null : ashow;
case PLAYER_SOURCE.HULU:
const hshow = document.querySelector('.metadata-area__second-line').innerHTML;
const hepisode = document.querySelector('.metadata-area__third-line').innerHTML;
return hshow === '' && hepisode === '' ? null : hshow + '\n' + hepisode;
const hshow = document.querySelector(".metadata-area__second-line")
.innerHTML;
const hepisode = document.querySelector(".metadata-area__third-line")
.innerHTML;
return hshow === "" && hepisode === "" ? null : hshow + "\n" + hepisode;
case PLAYER_SOURCE.DISNEY:
this.video.element.parentElement.click();
await this.timeout(200);
const dshow = document.querySelector('.title-field')
? document.querySelector('.title-field').innerHTML
: '';
const depisode = document.querySelector('.subtitle-field')
? document.querySelector('.subtitle-field').innerHTML
: '';
return dshow === '' && depisode === '' ? null : dshow + '\n' + depisode;
const dshow = document.querySelector(".title-field")
? document.querySelector(".title-field").innerHTML
: "";
const depisode = document.querySelector(".subtitle-field")
? document.querySelector(".subtitle-field").innerHTML
: "";
return dshow === "" && depisode === "" ? null : dshow + "\n" + depisode;
case PLAYER_SOURCE.YOUTUBE:
const yshow = document.querySelector('h1.title').innerText;
const yepisode = document.querySelector('yt-formatted-string.super-title').innerText;
return yshow === '' && yepisode === '' ? null : yshow + '\n' + yepisode;
const yshow = document.querySelector("h1.title").innerText;
const yepisode = document.querySelector(
"yt-formatted-string.super-title"
).innerText;
return yshow === "" && yepisode === "" ? null : yshow + "\n" + yepisode;
case PLAYER_SOURCE.HBOMAX:
case PLAYER_SOURCE.HBONOW:
const bottomHalf = this.video.element.parentNode.parentNode.parentNode.parentNode.parentNode
.children[1];
bottomHalf.children[0].id = 'hboUpperTitle';
bottomHalf.children[1].id = 'hboLowerTitle';
const hboshow = document.querySelector('#hboUpperTitle').innerText;
const hboepisode = document.querySelector('#hboLowerTitle').innerText;
return hboshow === '' && hboepisode === '' ? null : hboshow + '\n' + hboepisode;
const bottomHalf = this.video.element.parentNode.parentNode.parentNode
.parentNode.parentNode.children[1];
bottomHalf.children[0].id = "hboUpperTitle";
bottomHalf.children[1].id = "hboLowerTitle";
const hboshow = document.querySelector("#hboUpperTitle").innerText;
const hboepisode = document.querySelector("#hboLowerTitle").innerText;
return hboshow === "" && hboepisode === ""
? null
: hboshow + "\n" + hboepisode;
case PLAYER_SOURCE.PEACOCK:
const peacockshow = document.querySelector(
'.item.playback-metadata__container-episode-metadata-info'
".item.playback-metadata__container-episode-metadata-info"
).innerText;
const peacockepisode = document.querySelector('.item.playback-metadata__container-title')
.innerText;
return peacockshow === '' && peacockepisode === ''
const peacockepisode = document.querySelector(
".item.playback-metadata__container-title"
).innerText;
return peacockshow === "" && peacockepisode === ""
? null
: peacockshow + '\n' + peacockepisode;
: peacockshow + "\n" + peacockepisode;
case PLAYER_SOURCE.GOOGLEPLAY:
const playerIframe = document.querySelector(
'#yDmH0d > div.llhEMd.bYEzqc.LAhoGb.iWO5td > div > div.LhXUod.XL54pf.J9Nfi.iWO5td > span > div > div > iframe'
);
var googleplayshow = '';
const playerIframe = document.querySelector("body span div iframe");
var googleplayshow = "";
if (playerIframe) {
const titleElement = playerIframe.contentWindow.document.querySelector('.playing-title');
googleplayshow = titleElement ? titleElement.innerText : '';
const titleElement = playerIframe.contentWindow.document.querySelector(
".playing-title"
);
googleplayshow = titleElement ? titleElement.innerText : "";
}
return googleplayshow === '' ? null : googleplayshow;
return googleplayshow === "" ? null : googleplayshow;
case PLAYER_SOURCE.CRUNCHYROLL:
const crunchyrollTitle = document.querySelector('#showmedia_about_media');
const crunchyrollshow = crunchyrollTitle ? crunchyrollTitle.innerText : '';
return crunchyrollshow === '' ? null : crunchyrollshow;
const crunchyrollTitle = document.querySelector(
"#showmedia_about_media"
);
const crunchyrollshow = crunchyrollTitle
? crunchyrollTitle.innerText
: "";
return crunchyrollshow === "" ? null : crunchyrollshow;
default:
break;
}
@@ -296,8 +334,8 @@ export default class VideoListener {
}
async crunchyRollListener(ev) {
if (
ev.detail.watchPartyDirection === 'TO_APP' &&
ev.detail.type === 'WATCH_PARTY_PLAYER_UPDATE'
ev.detail.watchPartyDirection === "TO_APP" &&
ev.detail.type === "WATCH_PARTY_PLAYER_UPDATE"
) {
this.updateStatus({
status: ev.detail.status,
@@ -317,29 +355,32 @@ export default class VideoListener {
case PLAYER_SOURCE.CRUNCHYROLL:
window.postMessage(
JSON.stringify({
watchPartyDirection: 'TO_SCRIPT',
type: 'WATCH_PARTY_ADD_LISTENERS',
watchPartyDirection: "TO_SCRIPT",
type: "WATCH_PARTY_ADD_LISTENERS",
})
);
window.addEventListener('watchParty', this.crunchyRollListener);
window.addEventListener("watchParty", this.crunchyRollListener);
break;
default:
videoElement.addEventListener('playing', this.onplay);
videoElement.addEventListener('pause', this.onpause);
videoElement.addEventListener("playing", this.onplay);
videoElement.addEventListener("pause", this.onpause);
}
}
async start() {
this.updateStatus({ source: getPlayerSource(), showName: await this.getShowName() });
this.updateStatus({
source: getPlayerSource(),
showName: await this.getShowName(),
});
switch (this.video.source) {
case PLAYER_SOURCE.NETFLIX:
const seekInject = `window.seekScriptLoaded=!0;var getVideoPlayer=function(){var e=window.netflix.appContext.state.playerApp.getAPI().videoPlayer,t=e.getAllPlayerSessionIds()[0];return e.getVideoPlayerBySessionId(t)},seekInteraction=function(e){if(e.source==window){if(e.data.type&&"SEEK"==e.data.type){getVideoPlayer().pause();getVideoPlayer().seek(e.data.time);}if(e.data.type&&e.data.type==="PAUSE"){getVideoPlayer().pause();}if(e.data.type&&e.data.type==="PLAY"){getVideoPlayer().play();}e.data.type&&"teardown"==e.data.type&&(window.removeEventListener("message",seekInteraction,!1),window.seekScriptLoaded=!1)}};window.addEventListener("message",seekInteraction,!1);`;
const seekInjectScript = document.createElement('script');
const seekInjectScript = document.createElement("script");
seekInjectScript.text = seekInject;
document.head.appendChild(seekInjectScript);
if (document.getElementsByClassName('AkiraPlayer')[0]) {
if (document.getElementsByClassName("AkiraPlayer")[0]) {
const videoElement = document
.getElementsByClassName('AkiraPlayer')[0]
.getElementsByTagName('video')[0];
.getElementsByClassName("AkiraPlayer")[0]
.getElementsByTagName("video")[0];
if (videoElement && !this.video.element) {
this.firstTimeSync(videoElement);
} else {
@@ -347,14 +388,15 @@ export default class VideoListener {
this.video.element
? null
: () => {
var nve = document.getElementsByClassName('AkiraPlayer')[0]
var nve = document.getElementsByClassName("AkiraPlayer")[0]
? document
.getElementsByClassName('AkiraPlayer')[0]
.getElementsByTagName('video')[0]
.getElementsByClassName("AkiraPlayer")[0]
.getElementsByTagName("video")[0]
: null;
if (
nve !== null &&
(this.video.element !== nve || this.video.element === null)
(this.video.element !== nve ||
this.video.element === null)
) {
this.firstTimeSync(nve);
}
@@ -367,12 +409,15 @@ export default class VideoListener {
this.video.element
? null
: () => {
var nve = document.getElementsByClassName('AkiraPlayer')[0]
var nve = document.getElementsByClassName("AkiraPlayer")[0]
? document
.getElementsByClassName('AkiraPlayer')[0]
.getElementsByTagName('video')[0]
.getElementsByClassName("AkiraPlayer")[0]
.getElementsByTagName("video")[0]
: null;
if (nve !== null && (this.video.element !== nve || this.video.element === null)) {
if (
nve !== null &&
(this.video.element !== nve || this.video.element === null)
) {
this.firstTimeSync(nve);
}
},
@@ -382,10 +427,12 @@ export default class VideoListener {
break;
case PLAYER_SOURCE.HULU:
const huluSeekInject = `window.seekScriptLoaded=!0;var getVideoPlayer=function(){var e=document.getElementsByClassName('content-video-player')[0].__HuluDashPlayer__;return e;},seekInteraction=function(e){if(e.source==window){if(e.data.type&&"SEEK"==e.data.type){getVideoPlayer().seek(e.data.time,e.data.time);}if(e.data.type&&e.data.type==="PAUSE"){getVideoPlayer().pause();}if(e.data.type&&e.data.type==="PLAY"){getVideoPlayer().play();}e.data.type&&"teardown"==e.data.type&&(window.removeEventListener("message",seekInteraction,!1),window.seekScriptLoaded=!1)}};window.addEventListener("message",seekInteraction,!1);`;
const huluSeekInjectScript = document.createElement('script');
const huluSeekInjectScript = document.createElement("script");
huluSeekInjectScript.text = huluSeekInject;
document.head.appendChild(huluSeekInjectScript);
const videoElement = document.getElementsByClassName('content-video-player')[0];
const videoElement = document.getElementsByClassName(
"content-video-player"
)[0];
if (videoElement) {
this.firstTimeSync(videoElement);
} else {
@@ -393,8 +440,13 @@ export default class VideoListener {
this.video.element
? null
: () => {
var hve = document.getElementsByClassName('content-video-player')[0];
if (hve !== null && (this.video.element !== hve || this.video.element === null)) {
var hve = document.getElementsByClassName(
"content-video-player"
)[0];
if (
hve !== null &&
(this.video.element !== hve || this.video.element === null)
) {
this.firstTimeSync(hve);
}
},
@@ -403,10 +455,10 @@ export default class VideoListener {
}
break;
case PLAYER_SOURCE.AMAZON:
if (document.getElementsByClassName('webPlayerSDKContainer')[0]) {
const videoElement = document
.getElementsByClassName('webPlayerSDKContainer')[0]
.getElementsByTagName('video')[0];
if (document.querySelector("webPlayerSDKContainer")) {
const videoElement = document.querySelector(
".webPlayerSDKContainer video"
);
if (videoElement) {
this.firstTimeSync(videoElement);
} else {
@@ -414,12 +466,13 @@ export default class VideoListener {
this.video.element
? null
: () => {
var ave = document
.getElementsByClassName('webPlayerSDKContainer')[0]
.getElementsByTagName('video')[0];
var ave = document.querySelector(
".webPlayerSDKContainer video"
);
if (
ave !== null &&
(this.video.element !== ave || this.video.element === null)
(this.video.element !== ave ||
this.video.element === null)
) {
this.firstTimeSync(ave);
}
@@ -433,9 +486,12 @@ export default class VideoListener {
? null
: () => {
var ave = document
.getElementsByClassName('webPlayerSDKContainer')[0]
.getElementsByTagName('video')[0];
if (ave !== null && (this.video.element !== ave || this.video.element === null)) {
.getElementsByClassName("webPlayerSDKContainer")[0]
.getElementsByTagName("video")[0];
if (
ave !== null &&
(this.video.element !== ave || this.video.element === null)
) {
this.firstTimeSync(ave);
}
},
@@ -444,7 +500,9 @@ export default class VideoListener {
}
break;
case PLAYER_SOURCE.DISNEY:
const disneyVideoElement = document.querySelector('video.btm-media-client-element');
const disneyVideoElement = document.querySelector(
"video.btm-media-client-element"
);
if (disneyVideoElement) {
this.firstTimeSync(disneyVideoElement);
} else {
@@ -452,8 +510,13 @@ export default class VideoListener {
this.video.element
? null
: () => {
var dve = document.querySelector('video.btm-media-client-element');
if (dve !== null && (this.video.element !== dve || this.video.element === null)) {
var dve = document.querySelector(
"video.btm-media-client-element"
);
if (
dve !== null &&
(this.video.element !== dve || this.video.element === null)
) {
this.firstTimeSync(dve);
}
},
@@ -462,15 +525,22 @@ export default class VideoListener {
}
break;
case PLAYER_SOURCE.YOUTUBE:
const youtubeVideoElement = document.querySelector('video.video-stream.html5-main-video');
const youtubeVideoElement = document.querySelector(
"video.video-stream.html5-main-video"
);
if (youtubeVideoElement) this.firstTimeSync(youtubeVideoElement);
else {
setInterval(
this.video.element
? null
: () => {
var yve = document.querySelector('video.video-stream.html5-main-video');
if (yve !== null && (this.video.element !== yve || this.video.element === null)) {
var yve = document.querySelector(
"video.video-stream.html5-main-video"
);
if (
yve !== null &&
(this.video.element !== yve || this.video.element === null)
) {
this.firstTimeSync(yve);
}
},
@@ -481,22 +551,23 @@ export default class VideoListener {
case PLAYER_SOURCE.HBOMAX:
case PLAYER_SOURCE.HBONOW:
const hboSeekInject = `window.seekScriptLoaded=!0;var getVideoPlayer=function(){var e=document.querySelector('video.default')._dispNode;return e;},seekInteraction=function(e){if(e.source==window){if(e.data.type&&e.data.type==="PAUSE"){getVideoPlayer().pause();}if(e.data.type&&e.data.type==="PLAY"){getVideoPlayer().play();}e.data.type&&"teardown"==e.data.type&&(window.removeEventListener("message",seekInteraction,!1),window.seekScriptLoaded=!1)}};window.addEventListener("message",seekInteraction,!1);`;
const hboSeekInjectScript = document.createElement('script');
const hboSeekInjectScript = document.createElement("script");
hboSeekInjectScript.text = hboSeekInject;
document.head.appendChild(hboSeekInjectScript);
const hboVideoElement = document.querySelector('video.default');
const hboVideoElement = document.querySelector("video.default");
if (hboVideoElement) {
const bottomHalf =
hboVideoElement.parentNode.parentNode.parentNode.parentNode.parentNode.children[1];
bottomHalf.children[0].id = 'hboUpperTitle';
bottomHalf.children[1].id = 'hboLowerTitle';
hboVideoElement.parentNode.parentNode.parentNode.parentNode
.parentNode.children[1];
bottomHalf.children[0].id = "hboUpperTitle";
bottomHalf.children[1].id = "hboLowerTitle";
this.firstTimeSync(hboVideoElement);
} else {
setInterval(
this.video.element
? null
: () => {
var hve = document.querySelector('video.default');
var hve = document.querySelector("video.default");
if (
hve !== null &&
hve !== undefined &&
@@ -511,11 +582,11 @@ export default class VideoListener {
break;
case PLAYER_SOURCE.PEACOCK:
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');
const peacockInjectScript = document.createElement("script");
peacockInjectScript.text = peacockInject;
document.head.appendChild(peacockInjectScript);
const peacockVideoElement = document.querySelector(
'.video-player-component.playback-component video'
".video-player-component.playback-component video"
);
if (peacockVideoElement) {
this.firstTimeSync(peacockVideoElement);
@@ -525,7 +596,7 @@ export default class VideoListener {
? null
: () => {
var pve = document.querySelector(
'.video-player-component.playback-component video'
".video-player-component.playback-component video"
);
if (
pve !== null &&
@@ -540,11 +611,11 @@ export default class VideoListener {
}
break;
case PLAYER_SOURCE.GOOGLEPLAY:
const playerIframe = document.querySelector(
'#yDmH0d > div.llhEMd.bYEzqc.LAhoGb.iWO5td > div > div.LhXUod.XL54pf.J9Nfi.iWO5td > span > div > div > iframe'
);
const playerIframe = document.querySelector("body span div iframe");
if (playerIframe) {
const googlePlayVideoElement = playerIframe.contentWindow.document.querySelector('video');
const googlePlayVideoElement = playerIframe.contentWindow.document.querySelector(
"video"
);
if (googlePlayVideoElement) {
this.firstTimeSync(googlePlayVideoElement);
}
@@ -553,11 +624,11 @@ export default class VideoListener {
this.video.element
? null
: () => {
const pif = document.querySelector(
'#yDmH0d > div.llhEMd.bYEzqc.LAhoGb.iWO5td > div > div.LhXUod.XL54pf.J9Nfi.iWO5td > span > div > div > iframe'
);
const pif = document.querySelector("body span div iframe");
if (pif) {
const gpve = pif.contentWindow.document.querySelector('video');
const gpve = pif.contentWindow.document.querySelector(
"video"
);
if (gpve) {
this.firstTimeSync(gpve);
}
@@ -568,10 +639,10 @@ export default class VideoListener {
}
case PLAYER_SOURCE.CRUNCHYROLL:
const crunchyRollInject = `var sendToWatchPartyApp = function(pS, pT) { var customWatchPartyEvent = new CustomEvent('watchParty', { detail: { watchPartyDirection: 'TO_APP', type: 'WATCH_PARTY_PLAYER_UPDATE', status: pS, time: pT } }); window.dispatchEvent(customWatchPartyEvent); }, watchPartyGetTimeAndSend = function(pS) { if (window.VILOS_PLAYERJS) { window.VILOS_PLAYERJS.getCurrentTime(function(pT) { sendToWatchPartyApp(pS, pT); }); } }, watchPartySendPlaying = function() { watchPartyGetTimeAndSend('PLAYING'); }, watchPartySendPaused = function() { watchPartyGetTimeAndSend('PAUSED'); }, watchPartyInteraction = function(e) { if (e.source === window) { const data = JSON.parse(e.data); if (data.watchPartyDirection === 'TO_SCRIPT') { if (data.type === 'WATCH_PARTY_ADD_LISTENERS') { if (window.VILOS_PLAYERJS) { window.VILOS_PLAYERJS.on('play', watchPartySendPlaying, 'player.js'); window.VILOS_PLAYERJS.on('pause', watchPartySendPaused, 'player.js'); } } else if (data.type === 'WATCH_PARTY_SEEK') { if (window.VILOS_PLAYERJS) { window.VILOS_PLAYERJS.setCurrentTime(data.time); } } else if (data.type === 'WATCH_PARTY_STATUS') { if (window.VILOS_PLAYERJS) { if (data.status === 'PAUSED') window.VILOS_PLAYERJS.pause(); if (data.status === 'PLAYING') window.VILOS_PLAYERJS.play(); } } } } }; window.addEventListener("message", watchPartyInteraction);`;
const crunchyRollInjectScript = document.createElement('script');
const crunchyRollInjectScript = document.createElement("script");
crunchyRollInjectScript.text = crunchyRollInject;
document.head.appendChild(crunchyRollInjectScript);
const crunchyrollIframe = document.getElementById('vilos-player');
const crunchyrollIframe = document.getElementById("vilos-player");
if (crunchyrollIframe) {
this.firstTimeSync(crunchyrollIframe);
} else {
@@ -579,7 +650,7 @@ export default class VideoListener {
this.video.element
? null
: () => {
const cif = document.getElementById('vilos-player');
const cif = document.getElementById("vilos-player");
if (cif) {
this.firstTimeSync(cif);
}
@@ -589,7 +660,7 @@ export default class VideoListener {
}
break;
case PLAYER_SOURCE.LOCAL:
const localVideoElement = document.getElementsByTagName('video')[0];
const localVideoElement = document.getElementsByTagName("video")[0];
if (localVideoElement) {
this.firstTimeSync(localVideoElement);
}
@@ -601,12 +672,12 @@ export default class VideoListener {
end() {
switch (this.video.source) {
case PLAYER_SOURCE.CRUNCHYROLL:
window.removeEventListener('watchParty', this.crunchyRollListener);
window.removeEventListener("watchParty", this.crunchyRollListener);
break;
default:
if (this.video.element) {
this.video.element.removeEventListener('playing', this.onplay);
this.video.element.removeEventListener('pause', this.onpause);
this.video.element.removeEventListener("playing", this.onplay);
this.video.element.removeEventListener("pause", this.onpause);
}
}
}