423 lines
14 KiB
HTML
423 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<!-----------------------------------------------------------------------
|
|
Copyright (C) Ayushya Amitabh - All Rights Reserved
|
|
Unauthorized copying of this file, via any medium is strictly prohibited
|
|
Proprietary and confidential
|
|
Written by Ayushya Amitabh <admin@chromewatchparty.com>, 2020
|
|
https://www.chromewatchparty.com/copyright
|
|
=========================================================================
|
|
ALL CONTENT ON WATCH PARTY'S WEBSITE OR IN WATCH PARTY'S CHROME EXTENSION APP, UNLESS OTHERWISE
|
|
CITED ARE THE SOLE INTELECTUAL PROPERTY OF AYUSHYA AMITABH, AND MAY NOT BE
|
|
COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
|
|
------------------------------------------------------------------------->
|
|
<html>
|
|
<head>
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="57x57"
|
|
href="./icons/apple-icon-57x57.png"
|
|
/>
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="60x60"
|
|
href="./icons/apple-icon-60x60.png"
|
|
/>
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="72x72"
|
|
href="./icons/apple-icon-72x72.png"
|
|
/>
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="76x76"
|
|
href="./icons/apple-icon-76x76.png"
|
|
/>
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="114x114"
|
|
href="./icons/apple-icon-114x114.png"
|
|
/>
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="120x120"
|
|
href="./icons/apple-icon-120x120.png"
|
|
/>
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="144x144"
|
|
href="./icons/apple-icon-144x144.png"
|
|
/>
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="152x152"
|
|
href="./icons/apple-icon-152x152.png"
|
|
/>
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="180x180"
|
|
href="./icons/apple-icon-180x180.png"
|
|
/>
|
|
<link
|
|
rel="icon"
|
|
type="image/png"
|
|
sizes="192x192"
|
|
href="./icons/android-icon-192x192.png"
|
|
/>
|
|
<link
|
|
rel="icon"
|
|
type="image/png"
|
|
sizes="32x32"
|
|
href="./icons/favicon-32x32.png"
|
|
/>
|
|
<link
|
|
rel="icon"
|
|
type="image/png"
|
|
sizes="96x96"
|
|
href="./icons/favicon-96x96.png"
|
|
/>
|
|
<link
|
|
rel="icon"
|
|
type="image/png"
|
|
sizes="16x16"
|
|
href="./icons/favicon-16x16.png"
|
|
/>
|
|
<link rel="icon" href="./icons/favicon.ico" />
|
|
<link rel="manifest" href="./manifest.json" />
|
|
<meta
|
|
name="msapplication-TileImage"
|
|
content="./icons/ms-icon-144x144.png"
|
|
/>
|
|
<link rel="stylesheet" type="text/css" href="./font.css" />
|
|
<link rel="stylesheet" type="text/css" href="./styles/index.css" />
|
|
<script src="./scripts/Stickied.js"></script>
|
|
<title>Watch Party</title>
|
|
</head>
|
|
<!-- Global site tag (gtag.js) - Google Analytics -->
|
|
<script
|
|
async
|
|
src="https://www.googletagmanager.com/gtag/js?id=UA-87498806-2"
|
|
></script>
|
|
<script>
|
|
window.dataLayer = window.dataLayer || [];
|
|
function gtag() {
|
|
dataLayer.push(arguments);
|
|
}
|
|
gtag("js", new Date());
|
|
|
|
gtag("config", "UA-87498806-2");
|
|
</script>
|
|
<body class="home">
|
|
<div class="landing">
|
|
<div class="logo-circle"></div>
|
|
<div class="logo-circle"></div>
|
|
<div class="logo-circle"></div>
|
|
<h1 data-font="serif" class="logo duplicate">WATCH PARTY</h1>
|
|
<h1 data-font="serif" class="logo">WATCH PARTY</h1>
|
|
<h5 data-font="sans" class="logo-tag">
|
|
WATCH YOUR FAVORITES,<br />WITH YOUR FAVORITE PEOPLE
|
|
</h5>
|
|
<p data-font="sans-bold" class="title subtitle">
|
|
FREE. NO SIGNUP. NO BS.<br />WORKS WITH
|
|
</p>
|
|
<div class="supported">
|
|
<div data-full-support class="supported-logo" id="netflix"></div>
|
|
<div data-full-support class="supported-logo" id="hulu"></div>
|
|
<div data-full-support class="supported-logo" id="disney"></div>
|
|
<div data-full-support class="supported-logo" id="prime"></div>
|
|
<div data-full-support class="supported-logo" id="youtube"></div>
|
|
<div data-full-support class="supported-logo" id="hbonow"></div>
|
|
<div data-full-support class="supported-logo" id="hbomax"></div>
|
|
<div data-full-support class="supported-logo" id="peacock"></div>
|
|
<div
|
|
data-upcoming-support="In v1.6.0"
|
|
class="supported-logo"
|
|
id="googleplay"
|
|
></div>
|
|
<div
|
|
data-upcoming-support="In v1.6.0"
|
|
class="supported-logo"
|
|
id="crunchyroll"
|
|
></div>
|
|
</div>
|
|
<a
|
|
data-font="sans-bold"
|
|
href="https://request.chromewatchparty.com"
|
|
class="link-button duplicate"
|
|
>
|
|
Get Chrome Extension
|
|
</a>
|
|
<a
|
|
data-font="sans-bold"
|
|
href="https://request.chromewatchparty.com"
|
|
class="link-button"
|
|
>
|
|
Get Chrome Extension
|
|
</a>
|
|
</div>
|
|
<div class="features">
|
|
<p data-font="sans-bold" class="title subtitle">FEATURES</p>
|
|
<div class="feature-card">
|
|
<div class="feature-icon" id="sync">
|
|
<video loop muted autoplay src="./media/features/Sync.mp4"></video>
|
|
</div>
|
|
<p data-font="sans" class="feature-text">
|
|
Watch Party syncs play, pause and timestamp.
|
|
</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon" id="phone">
|
|
<video loop muted autoplay src="./media/features/Phone.mp4"></video>
|
|
</div>
|
|
<p data-font="sans" class="feature-text">
|
|
Free group voice calls - for when text and GIFs just won't do.
|
|
</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon" id="chat">
|
|
<video loop muted autoplay src="./media/features/Chat.mp4"></video>
|
|
</div>
|
|
<p data-font="sans" class="feature-text">
|
|
Unlimited gifs from Giphy in chat.
|
|
</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon" id="delete">
|
|
<video loop muted autoplay src="./media/features/Delete.mp4"></video>
|
|
</div>
|
|
<p data-font="sans" class="feature-text">
|
|
What happens in Watch Party, stays in Watch Party - for 24 hours, then
|
|
it's all gone.
|
|
</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon" id="hideable">
|
|
<video
|
|
loop
|
|
muted
|
|
autoplay
|
|
src="./media/features/Hideable.mp4"
|
|
></video>
|
|
</div>
|
|
<p data-font="sans" class="feature-text">
|
|
There when you need it, hideable when you want to focus on the show.
|
|
</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon" id="custom">
|
|
<video loop muted autoplay src="./media/features/Custom.mp4"></video>
|
|
</div>
|
|
<p data-font="sans" class="feature-text">
|
|
No party crashers. Custom party names secured with custom pins.
|
|
</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon" id="signup">
|
|
<video loop muted autoplay src="./media/features/Signup.mp4"></video>
|
|
</div>
|
|
<p data-font="sans" class="feature-text">
|
|
No sign up, no login, no data taken from you.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div id="getting-started" class="pop-features">
|
|
<p data-font="sans-bold" class="title subtitle">
|
|
GETTING STARTED
|
|
</p>
|
|
<div class="pop-feature">
|
|
<div id="title-card-container">
|
|
<div id="title-card">
|
|
<div data-font="serif" id="fab">WP</div>
|
|
<div id="sidebar"></div>
|
|
</div>
|
|
</div>
|
|
<div class="explanation">
|
|
<div>
|
|
<h4 data-font="sans-bold">TO BE OR NOT TO BE</h4>
|
|
<p data-font="sans">
|
|
Watch Party is built to not be in your way. There when you need
|
|
it, gone when you don't. The sidebar is now resizeable, and now
|
|
supports having access to Watch Party in fullscreen. (Use the
|
|
fullscreen button in the sidebar)
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pop-feature alternate">
|
|
<div id="title-card-container">
|
|
<div id="title-card">
|
|
<h5 data-font="sans-bold" id="title-card-title">WATCH PARTY</h5>
|
|
<h3 data-font="sans" id="title-card-subtitle">YOUR PARTY NAME</h3>
|
|
<p data-font="sans" id="control-notification">
|
|
Allow chat notification when side panel is closed
|
|
<span>Notifications show up when the side bar is hidden</span>
|
|
</p>
|
|
<p data-font="sans" id="control-autorejoin">
|
|
Allow Watch Party to auto rejoin
|
|
<span
|
|
>Automatically rejoin party if you return to the page within 1
|
|
minute</span
|
|
>
|
|
</p>
|
|
<p data-font="sans" id="control-admin">
|
|
Enable admin only mode
|
|
<span>Only party admin can sync player and start calls</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="explanation">
|
|
<div>
|
|
<h4 data-font="sans-bold">Stay in control</h4>
|
|
<p data-font="sans">
|
|
Find your settings by clicking on title card (when you're in a
|
|
party) or in the settings panel (when you're creating or joining)
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pop-feature">
|
|
<div id="title-card-container">
|
|
<div id="title-card">
|
|
<h5 data-font="sans-bold" id="system-message">
|
|
Ayushya started the party.
|
|
</h5>
|
|
|
|
<div id="ti">
|
|
<div id="tn">SOMEONE</div>
|
|
<div id="tm">
|
|
<div id="tt">
|
|
<span>12:00:00 PM</span>
|
|
<div id="ri"></div>
|
|
</div>
|
|
<p>Hiya buddy!</p>
|
|
</div>
|
|
</div>
|
|
<div id="ti" class="mm">
|
|
<div id="tn">AYUSHYA</div>
|
|
<div id="tr">Hiya buddy!</div>
|
|
<div id="tm">
|
|
<div id="tt">
|
|
<span>12:00:00 PM</span>
|
|
<div id="ri"></div>
|
|
</div>
|
|
<p>OH GOD NO! PLEASE GOD NO! NO!</p>
|
|
</div>
|
|
</div>
|
|
<div id="ti">
|
|
<div id="tn">SOMEONE</div>
|
|
<div id="tm">
|
|
<div id="tt">
|
|
<span>12:00:00 PM</span>
|
|
<div id="ri"></div>
|
|
</div>
|
|
<img
|
|
src="https://media.giphy.com/media/d10dMmzqCYqQ0/giphy.gif"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div id="ti" class="mm">
|
|
<div id="tn">SOMEONE</div>
|
|
<div id="tr">
|
|
<img
|
|
src="https://media.giphy.com/media/d10dMmzqCYqQ0/giphy.gif"
|
|
/>
|
|
</div>
|
|
<div id="tm">
|
|
<div id="tt">
|
|
<span>12:00:00 PM</span>
|
|
<div id="ri"></div>
|
|
</div>
|
|
<p>Let's watch The Office</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="explanation">
|
|
<div>
|
|
<h4 data-font="sans-bold">FULL FEATURED CHAT</h4>
|
|
<p data-font="sans">
|
|
A brand new, completely revamped chat user interface, now has
|
|
replies, shows pending messages, and improves the Giphy GIF picker
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pop-feature alternate">
|
|
<div id="title-card-container">
|
|
<div id="title-card">
|
|
<h5 data-font="sans-bold" id="title-card-title">WATCH PARTY</h5>
|
|
<h3 data-font="sans" id="title-card-subtitle">ANIME WATCH PARTY</h3>
|
|
<h6 data-font="sans" id="title-card-tagline">USERS IN PARTY</h6>
|
|
<p data-font="sans" id="call-user-chip">Ayushya</p>
|
|
<p data-font="sans" id="call-user-chip">Someone</p>
|
|
<p data-font="sans" id="call-user-chip">Third Party</p>
|
|
<p data-font="sans" id="call-user-chip">Won't Stop Talking</p>
|
|
<h6 data-font="sans" id="title-card-tagline">USERS ON CALL</h6>
|
|
<p data-font="sans" id="call-user-chip">Ayushya</p>
|
|
<p data-font="sans" id="call-user-chip" class="not-me-user-chip">
|
|
Someone
|
|
</p>
|
|
<p data-font="sans" id="call-user-chip" class="not-me-user-chip">
|
|
Won't Stop Talking
|
|
<input type="range" value="2" min="0" max="10" />
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="explanation">
|
|
<div>
|
|
<h4 data-font="sans-bold">MADE FOR YOU & YOUR GANG</h4>
|
|
<p data-font="sans">
|
|
See who's in your party, get on a call with your party, and volume
|
|
control for the person who just won't stop talking.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<footer data-font="sans">
|
|
<p class="title built-with">
|
|
<a href="./copyright/">COPYRIGHT</a> © 2020 AYUSHYA AMITABH. ALL
|
|
RIGHTS RESERVED.
|
|
</p>
|
|
<p class="title built-with">
|
|
BUILT WITH 💚 FOR
|
|
<a href="https://www.google.com/chrome/">GOOGLE CHROME</a> USING
|
|
<a href="https://firebase.google.com/">FIREBASE</a>,
|
|
<a href="https://material-ui.com/">MATERIAL-UI</a>,
|
|
<a href="https://reactjs.org/">REACT JS</a>,
|
|
<a href="https://nodejs.org/en/">NODE JS</a>,
|
|
<a href="https://giphy.com/">GIPHY</a>, &
|
|
<a href="https://dolby.io/">DOLBY VOXEET</a>.
|
|
</p>
|
|
<a
|
|
data-font="sans-bold"
|
|
href="https://paypal.me/Ayushya"
|
|
class="link-button"
|
|
>
|
|
Support Watch Party
|
|
</a>
|
|
<a
|
|
data-font="sans-bold"
|
|
href="https://request.chromewatchparty.com"
|
|
class="link-button"
|
|
>Get Chrome Extension</a
|
|
>
|
|
<a
|
|
data-font="sans-bold"
|
|
href="mailto:admin@chromewatchparty.com?subject=User Feedback"
|
|
class="link-button"
|
|
>
|
|
Give Feedback
|
|
</a>
|
|
<a data-font="sans-bold" href="./welcome/" class="link-button">
|
|
Getting Started
|
|
</a>
|
|
<a data-font="sans-bold" href="./changes/" class="link-button">
|
|
Changelog
|
|
</a>
|
|
</footer>
|
|
</body>
|
|
</html>
|