v1.0.0-beta

public/background.js

@@ -1,8 +1,117 @@
-// Called when the user clicks on the browser action
-chrome.browserAction.onClicked.addListener(function(tab) {
-  // Send a message to the active tab
-  chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {
-    var activeTab = tabs[0];
-    chrome.tabs.sendMessage(activeTab.id, { message: 'clicked_browser_action' });
+/* global chrome */
+/*global firebase*/
+
+const firebaseConfig = {
+  apiKey: 'AIzaSyCJLuYpzXLDRmu2ttzFuSGmYcpFxqToWFU',
+  authDomain: 'watch-party-crx.firebaseapp.com',
+  databaseURL: 'https://watch-party-crx.firebaseio.com',
+  projectId: 'watch-party-crx',
+  storageBucket: 'watch-party-crx.appspot.com',
+  messagingSenderId: '712242707190',
+  appId: '1:712242707190:web:65fa7f772e30da364b0ad7',
+  measurementId: 'G-EZS4PEVG4T',
+};
+
+firebase.initializeApp(firebaseConfig);
+firebase.auth().setPersistence(firebase.auth.Auth.Persistence.LOCAL);
+
+const isAuthed = () => true && firebase.auth().currentUser;
+const doAuth = () => firebase.auth().signInAnonymously();
+
+const fetcher = async (request, sendResponse) => {
+  if (!isAuthed()) await doAuth();
+  const { url, method } = request;
+  delete request.type;
+  delete request.url;
+  delete request.method;
+  const idToken = await firebase.auth().currentUser.getIdToken();
+  let resStatus = {};
+  fetch(url, {
+    method,
+    headers: {
+      Authorization: `Token ${idToken}:${firebase.auth().currentUser.uid}`,
+      'Access-Control-Allow-Origin': '*',
+    },
+    ...request,
+  })
+    .then((res) => {
+      resStatus = {
+        status: res.status,
+        statusText: res.statusText,
+      };
+      return res.json();
+    })
+    .then((res) => sendResponse({ ...res, ...resStatus }))
+    .catch((err) => sendResponse({ ...err, status: 503, statusText: "Couldn't talk to server" }));
+};
+
+const sendAuth = async (sendResponse) => {
+  if (!isAuthed()) await doAuth();
+  sendResponse(firebase.auth().currentUser);
+};
+
+chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
+  const { type } = request;
+  switch (type) {
+    case 'API_CALL':
+      fetcher(request, sendResponse);
+      break;
+    case 'GET_AUTH':
+      sendAuth(sendResponse);
+      break;
+    default:
+      console.warn('Unknown message type: <', type, '>');
+      break;
+  }
+  return true;
+});
+
+chrome.runtime.onConnect.addListener((port) => {
+  port.onDisconnect.addListener(() => {});
+  port.onMessage.addListener((request) => {
+    const { type, roomId } = request;
+    if (type === 'INIT') {
+      firebase
+        .firestore()
+        .collection('rooms')
+        .doc(roomId)
+        .onSnapshot(
+          (snap) => {
+            if (snap) {
+              port.postMessage(snap.data());
+            }
+          },
+          (err) => {}
+        );
+      firebase
+        .firestore()
+        .collection('rooms')
+        .doc(roomId)
+        .collection('users')
+        .onSnapshot(
+          (snap) => {
+            if (snap) {
+              const isAdmin = snap.docs
+                .filter((user) => user.id === firebase.auth().currentUser.uid)[0]
+                .data().admin;
+              port.postMessage({ admin: isAdmin });
+            }
+          },
+          (err) => {}
+        );
+      firebase
+        .firestore()
+        .collection('rooms')
+        .doc(roomId)
+        .collection('messages')
+        .orderBy('time')
+        .onSnapshot(
+          (snap) => {
+            if (snap)
+              port.postMessage({ messages: snap.docs.map((v) => ({ ...v.data(), id: v.id })) });
+          },
+          (err) => {}
+        );
+    }
   });
 });

public/manifest.json

@@ -1,15 +1,13 @@
 {
   "name": "WatchParty",
   "short_name": "WP",
-  "version": "1.0",
+  "version": "1.0.0",
   "description": "Watch streamed content together.",
   "background": {
-    "scripts": ["background.js"]
-  },
-  "browser_action": {
-    "default_popup": "popup.html"
+    "page": "popup.html"
   },
   "permissions": ["https://*.hulu.com/*", "https://*.netflix.com/*", "https://*.amazon.com/*"],
+  "content_security_policy": "script-src 'self' https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com; object-src 'self'",
   "content_scripts": [
     {
       "matches": ["https://*.hulu.com/*"],

public/popup.html

@@ -1,6 +1,10 @@
 <!DOCTYPE html>
 <html>
   <head>
+    <meta
+      http-equiv="Content-Security-Policy"
+      content="default-src *; style-src 'self' https://* 'unsafe-inline'; script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'"
+    />
     <style>
       html {
         height: fit-content;
@@ -39,6 +43,10 @@
     </style>
   </head>
   <body>
+    <script src="https://www.gstatic.com/firebasejs/7.14.1/firebase-app.js"></script>
+    <script src="https://www.gstatic.com/firebasejs/7.14.1/firebase-auth.js"></script>
+    <script src="https://www.gstatic.com/firebasejs/7.14.1/firebase-firestore.js"></script>
+    <script src="background.js"></script>
     <a target="_blank" href="https://www.hulu.com/">Hulu</a>
     <a target="_blank" href="https://www.netflix.com/browse">Netflix</a>
     <a target="_blank" href="https://www.amazon.com/gp/video/storefront">Prime Video</a>