v1.6.4/release

website/index.html

@@ -12,99 +12,37 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
 ------------------------------------------------------------------------->
 <html>
   <head>
-    <link
+    <link rel="apple-touch-icon" sizes="57x57" href="./icons/apple-icon-57x57.png" />
-      rel="apple-touch-icon"
+    <link rel="apple-touch-icon" sizes="60x60" href="./icons/apple-icon-60x60.png" />
-      sizes="57x57"
+    <link rel="apple-touch-icon" sizes="72x72" href="./icons/apple-icon-72x72.png" />
-      href="./icons/apple-icon-57x57.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
+    <link rel="apple-touch-icon" sizes="120x120" href="./icons/apple-icon-120x120.png" />
-      rel="apple-touch-icon"
+    <link rel="apple-touch-icon" sizes="144x144" href="./icons/apple-icon-144x144.png" />
-      sizes="60x60"
+    <link rel="apple-touch-icon" sizes="152x152" href="./icons/apple-icon-152x152.png" />
-      href="./icons/apple-icon-60x60.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
+    <link rel="icon" type="image/png" sizes="32x32" href="./icons/favicon-32x32.png" />
-      rel="apple-touch-icon"
+    <link rel="icon" type="image/png" sizes="96x96" href="./icons/favicon-96x96.png" />
-      sizes="72x72"
+    <link rel="icon" type="image/png" sizes="16x16" href="./icons/favicon-16x16.png" />
-      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
+    <meta name="msapplication-TileImage" content="./icons/ms-icon-144x144.png" />
-      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
+  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-87498806-2"></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('js', new Date());
 
-    gtag("config", "UA-87498806-2");
+    gtag('config', 'UA-87498806-2');
   </script>
   <body class="home">
     <div class="landing">
@@ -116,9 +54,7 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
       <h5 data-font="sans" class="logo-tag">
         WATCH YOUR FAVORITES,<br />WITH YOUR FAVORITE PEOPLE
       </h5>
-      <p data-font="sans-bold" class="title subtitle">
+      <p data-font="sans-bold" class="title subtitle">FREE. NO SIGNUP. NO BS.<br />WORKS WITH</p>
-        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>
@@ -128,16 +64,11 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
         <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
+        <div data-full-support class="supported-logo" id="googleplay"></div>
-          data-upcoming-support="In v1.6.0"
+        <div data-full-support class="supported-logo" id="crunchyroll"></div>
-          class="supported-logo"
+        <div data-beta-support class="supported-logo" id="appletv"></div>
-          id="googleplay"
+        <div data-beta-support class="supported-logo" id="viki"></div>
-        ></div>
+        <div data-beta-support class="supported-logo" id="funimation"></div>
-        <div
-          data-upcoming-support="In v1.6.0"
-          class="supported-logo"
-          id="crunchyroll"
-        ></div>
       </div>
       <a
         data-font="sans-bold"
@@ -146,11 +77,7 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
       >
         Get Chrome Extension
       </a>
-      <a
+      <a data-font="sans-bold" href="https://request.chromewatchparty.com" class="link-button">
-        data-font="sans-bold"
-        href="https://request.chromewatchparty.com"
-        class="link-button"
-      >
         Get Chrome Extension
       </a>
     </div>
@@ -160,9 +87,7 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
         <div class="feature-icon" id="sync">
           <video loop muted autoplay src="./media/features/Sync.mp4"></video>
         </div>
-        <p data-font="sans" class="feature-text">
+        <p data-font="sans" class="feature-text">Watch Party syncs play, pause and timestamp.</p>
-          Watch Party syncs play, pause and timestamp.
-        </p>
       </div>
       <div class="feature-card">
         <div class="feature-icon" id="phone">
@@ -176,27 +101,19 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
         <div class="feature-icon" id="chat">
           <video loop muted autoplay src="./media/features/Chat.mp4"></video>
         </div>
-        <p data-font="sans" class="feature-text">
+        <p data-font="sans" class="feature-text">Unlimited gifs from Giphy in chat.</p>
-          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
+          What happens in Watch Party, stays in Watch Party - for 24 hours, then it's all gone.
-          it's all gone.
         </p>
       </div>
       <div class="feature-card">
         <div class="feature-icon" id="hideable">
-          <video
+          <video loop muted autoplay src="./media/features/Hideable.mp4"></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.
@@ -214,15 +131,11 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
         <div class="feature-icon" id="signup">
           <video loop muted autoplay src="./media/features/Signup.mp4"></video>
         </div>
-        <p data-font="sans" class="feature-text">
+        <p data-font="sans" class="feature-text">No sign up, no login, no data taken from you.</p>
-          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">
+      <p data-font="sans-bold" class="title subtitle">GETTING STARTED</p>
-        GETTING STARTED
-      </p>
       <div class="pop-feature">
         <div id="title-card-container">
           <div id="title-card">
@@ -234,10 +147,9 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
           <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
+              Watch Party is built to not be in your way. There when you need it, gone when you
-              it, gone when you don't. The sidebar is now resizeable, and now
+              don't. The sidebar is now resizeable, and now supports having access to Watch Party in
-              supports having access to Watch Party in fullscreen. (Use the
+              fullscreen. (Use the fullscreen button in the sidebar)
-              fullscreen button in the sidebar)
             </p>
           </div>
         </div>
@@ -254,10 +166,7 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
             </p>
             <p data-font="sans" id="control-autorejoin">
               Allow Watch Party to auto rejoin
-              <span
+              <span>Automatically rejoin party if you return to the page within 1 minute</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
@@ -269,8 +178,8 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
           <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
+              Find your settings by clicking on title card (when you're in a party) or in the
-              party) or in the settings panel (when you're creating or joining)
+              settings panel (when you're creating or joining)
             </p>
           </div>
         </div>
@@ -279,9 +188,7 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
       <div class="pop-feature">
         <div id="title-card-container">
           <div id="title-card">
-            <h5 data-font="sans-bold" id="system-message">
+            <h5 data-font="sans-bold" id="system-message">Ayushya started the party.</h5>
-              Ayushya started the party.
-            </h5>
 
             <div id="ti">
               <div id="tn">SOMEONE</div>
@@ -311,17 +218,13 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
                   <span>12:00:00 PM</span>
                   <div id="ri"></div>
                 </div>
-                <img
+                <img src="https://media.giphy.com/media/d10dMmzqCYqQ0/giphy.gif" />
-                  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
+                <img src="https://media.giphy.com/media/d10dMmzqCYqQ0/giphy.gif" />
-                  src="https://media.giphy.com/media/d10dMmzqCYqQ0/giphy.gif"
-                />
               </div>
               <div id="tm">
                 <div id="tt">
@@ -337,8 +240,8 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
           <div>
             <h4 data-font="sans-bold">FULL FEATURED CHAT</h4>
             <p data-font="sans">
-              A brand new, completely revamped chat user interface, now has
+              A brand new, completely revamped chat user interface, now has replies, shows pending
-              replies, shows pending messages, and improves the Giphy GIF picker
+              messages, and improves the Giphy GIF picker
             </p>
           </div>
         </div>
@@ -356,9 +259,7 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
             <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">
+            <p data-font="sans" id="call-user-chip" class="not-me-user-chip">Someone</p>
-              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" />
@@ -369,8 +270,8 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
           <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
+              See who's in your party, get on a call with your party, and volume control for the
-              control for the person who just won't stop talking.
+              person who just won't stop talking.
             </p>
           </div>
         </div>
@@ -378,30 +279,20 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
     </div>
     <footer data-font="sans">
       <p class="title built-with">
-        <a href="./copyright/">COPYRIGHT</a> &copy; 2020 AYUSHYA AMITABH. ALL
+        <a href="./copyright/">COPYRIGHT</a> &copy; 2020 AYUSHYA AMITABH. ALL RIGHTS RESERVED.
-        RIGHTS RESERVED.
       </p>
       <p class="title built-with">
         BUILT WITH &#x1F49A; 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://reactjs.org/">REACT JS</a>, <a href="https://nodejs.org/en/">NODE 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>.
-        <a href="https://giphy.com/">GIPHY</a>, &
-        <a href="https://dolby.io/">DOLBY VOXEET</a>.
       </p>
-      <a
+      <a data-font="sans-bold" href="https://paypal.me/Ayushya" class="link-button">
-        data-font="sans-bold"
-        href="https://paypal.me/Ayushya"
-        class="link-button"
-      >
         Support Watch Party
       </a>
-      <a
+      <a data-font="sans-bold" href="https://request.chromewatchparty.com" class="link-button"
-        data-font="sans-bold"
-        href="https://request.chromewatchparty.com"
-        class="link-button"
         >Get Chrome Extension</a
       >
       <a
@@ -411,12 +302,8 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
       >
         Give Feedback
       </a>
-      <a data-font="sans-bold" href="./welcome/" class="link-button">
+      <a data-font="sans-bold" href="./welcome/" class="link-button"> Getting Started </a>
-        Getting Started
+      <a data-font="sans-bold" href="./changes/" class="link-button"> Changelog </a>
-      </a>
-      <a data-font="sans-bold" href="./changes/" class="link-button">
-        Changelog
-      </a>
     </footer>
   </body>
 </html>

website/styles/variables-dark.css

@@ -35,3 +35,13 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
 .supported-logo#peacock {
   background-image: url('../media/logos/Peacock.png');
 }
+.supported-logo#appletv {
+  background-image: url('../media/logos/AppleTVWhite.png');
+}
+.supported-logo#viki {
+  background-image: url('../media/logos/Viki.png');
+}
+.supported-logo#funimation {
+  background-image: url('../media/logos/FunimationWhite.png');
+  background-size: 60% !important;
+}

website/styles/variables.css

@@ -19,32 +19,42 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
   font-size: 10px;
 }
 .supported-logo#netflix {
-  background-image: url("../media/logos/Netflix.png");
+  background-image: url('../media/logos/Netflix.png');
 }
 .supported-logo#hulu {
-  background-image: url("../media/logos/Hulu.png");
+  background-image: url('../media/logos/Hulu.png');
 }
 .supported-logo#disney {
-  background-image: url("../media/logos/DisneyColor.png");
+  background-image: url('../media/logos/DisneyColor.png');
 }
 .supported-logo#prime {
-  background-image: url("../media/logos/PrimeColor.png");
+  background-image: url('../media/logos/PrimeColor.png');
 }
 .supported-logo#youtube {
-  background-image: url("../media/logos/YoutubeColor.png");
+  background-image: url('../media/logos/YoutubeColor.png');
 }
 .supported-logo#hbonow {
-  background-image: url("../media/logos/HBONowBlack.png");
+  background-image: url('../media/logos/HBONowBlack.png');
 }
 .supported-logo#hbomax {
-  background-image: url("../media/logos/HBOMax.png");
+  background-image: url('../media/logos/HBOMax.png');
 }
 .supported-logo#peacock {
-  background-image: url("../media/logos/PeacockColor.png");
+  background-image: url('../media/logos/PeacockColor.png');
 }
 .supported-logo#googleplay {
-  background-image: url("../media/logos/GooglePlay.png");
+  background-image: url('../media/logos/GooglePlay.png');
 }
 .supported-logo#crunchyroll {
-  background-image: url("../media/logos/Crunchyroll.png");
+  background-image: url('../media/logos/Crunchyroll.png');
+}
+.supported-logo#appletv {
+  background-image: url('../media/logos/AppleTVBlack.png');
+}
+.supported-logo#viki {
+  background-image: url('../media/logos/Viki.png');
+}
+.supported-logo#funimation {
+  background-image: url('../media/logos/FunimationColor.png');
+  background-size: 60% !important;
 }

website/welcome/index.html

@@ -67,6 +67,9 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
         <a href="https://www.peacocktv.com"><div class="supported-logo" id="peacock"></div></a>  
         <a href="https://play.google.com/movies"><div class="supported-logo" id="googleplay"></div></a>  
         <a href="https://www.crunchyroll.com"><div class="supported-logo" id="crunchyroll"></div></a>  
+        <a href="https://tv.apple.com"><div class="supported-logo" id="appletv"></div></a>  
+        <a href="https://www.viki.com"><div class="supported-logo" id="viki"></div></a>  
+        <a href="https://www.funimation.com"><div class="supported-logo" id="funimation"></div></a>  
         </div>
       </div>
     </div>