vercel shift and local peer server because heroku died

api/vercel.js

@@ -0,0 +1,7 @@
+export default function handler(request, response) {
+  response.status(200).json({
+    body: request.body,
+    query: request.query,
+    cookies: request.cookies,
+  });
+}

models/friends.js

@@ -2,12 +2,12 @@ const FriendsSchema = new mongoose.Schema({
     requester: { type: ObjectId, ref: 'Users'},
     recipient: { type: ObjectId, ref: 'Users'},
     status: {
-      type: Number,
+      type: String,
       enums: [
-          0,    //'add friend',
-          1,    //'requested',
-          2,    //'pending',
-          3,    //'friends'
+          'addFriend',    //'add friend',
+          'requested',    //'requested',
+          'pending',    //'pending',
+          'friends',    //'friends'
       ]
     }
   }, {timestamps: true})

models/user.js

@@ -8,7 +8,7 @@ const UserSchema = new mongoose.Schema(
     email: { type: String, required: true, unique: true },
     password: { type: String, required: true },
     friends: [{ type: ObjectId, ref: 'Friends'}],
-    enemies: [{ type: ObjectId , ref: 'User'}]
+    enemies: [{ type: ObjectId, ref: 'User'}]
 }, { collection: 'users' , timestamps: true})
 
 UserSchema.pre("save", function (next) {

public/scripts/cabin/UserStream.js

@@ -27,7 +27,7 @@ function constructLocalVideo(id, text, stream, self=false) {
         video.setAttribute('muted', '');
         video.setAttribute('playsinline', '');
 
-        video.setAttribute('id', id); 
+        video.setAttribute('id', `video-${id}`); 
         video.srcObject = stream
         if (self) video.muted = true
             const videoDiv = document.createElement('div')

public/scripts/cabin/cabin.js

@@ -4,9 +4,8 @@ import { UserStream } from "./UserStream.js"
 
 const socket = io('/')
 const peer = new Peer(USER_ID, {
-    secure: true,
-    host: 'firewood-peerjs-server.herokuapp.com',
-    port: 443
+    host: '/',
+    path: "/peerjs/firewood"
 })
 
 const videoGrid = "video-grid"
@@ -16,7 +15,7 @@ var userCount = 1;
 var users = {}
 var peers = {}
 
-var facing = "user"
+let facing = "user"
 var localVideo;
 
 var userLeaveSound = new Audio('.././sounds/userLeave.ogg')
@@ -25,20 +24,20 @@ var gridNumber = 1;
 // Checking the SupportedConstraints of the device
 const supports = navigator.mediaDevices.getSupportedConstraints();
 
-/* const flipButton = document.getElementById("flip-camera")
+// const flipButton = document.getElementById("flip-camera")
+
+// if (!supports.facingMode) {
+//     flipButton.remove()
+// }
+// else {
+//     flipButton.addEventListener('click', () => {
+//         flipCamera()
+//         console.log('flip')
+//     })
+// }
 
-if (!supports.facingMode) {
-    // flipButton.remove()
-}
-else {
-    flipButton.addEventListener('click', () => {
-        flipCamera()
-        console.log('flip')
-    })
-}
 
 
-*/
 console.log(supports)
 
 
@@ -168,49 +167,82 @@ async function connectToNewUser(username, userId, newUserId, newUsername, stream
     peers[newUserId] = call
 }
 
-
-/* async function flipCamera() {
-    console.log("Flipping camera...")
-    const tracks = localStream.getTracks()
-    const currFacingMode = localStream.getVideoTracks()[0].getSettings().facingMode
-    console.log(facing)
-    tracks.forEach(track => { if (track.kind === "video") track.stop;})
-
-    let flippedStream;
-
-    if (facing == "user") {
-        await navigator.mediaDevices.getUserMedia({
-            video: {
-                width: {ideal: 1920},
-                height: {ideal: 1080},
-                facingMode: 'environment'
-            },
-        }).then(stream => {flippedStream = stream}).catch(err => console.log(err))
-
-        facing = "environment"
-    }
-    else {
-        await navigator.mediaDevices.getUserMedia({
-            video: {
-                width: {ideal: 1920},
-                height: {ideal: 1080},
-                facingMode: 'user'
-            },
-        }).then(stream => {flippedStream = stream}).catch(err => console.log(err))
-
-        facing = "user"
-    }
-
-    for (let [key, value] of Object.entries(peer.connections)) {
-        console.log(peer.connections)
-        console.log(key)
-        console.log(peer.connections[key][0].peerConnection.getSenders()[1])
-        peer.connections[key][0].peerConnection.getSenders()[1].replaceTrack(flippedStream.getTracks()[0])
-    }
-
-    console.log(localStream.getVideoTracks()[0])
+// function replaceTracks(newStream) {
+//     let video = document.getElementById(`video-${USER_ID}`)
+
+//     if (video) {
+//         video.pause();
+
+//         if (typeof video.srcObject === 'object') {
+//             video.srcObject = null;
+//         }
+//         else {
+//             video.src = "";
+//         }
+//     }
+//     console.log(localStream.getTracks())
+//     newStream.getVideoTracks().forEach((track) => {
+//         console.log(track)
+//         localStream.addTrack(track)
+//     })
+//     console.log(localStream.getTracks())
+
+//     if (video) {
+//         if (typeof video.srcObject === "object") video.srcObject = newStream
+//         else {
+//             video.src = window.URL.createObjectURL(newStream)
+//         }
+
+//         video.onloadedmetadata = (e) => {
+//             video.play()
+//         }
+//     } else {
+//         throw new Error("Unable to flip!")
+//     }
+//     console.log(peer.connections)
+//     peer.getSenders().map((sender) => {
+//         sender.replaceTrack(newStream.getTracks().find(track => {
+//             return track.kind === sender.track.kind
+//         }))
+//     })
+// }
+
+// async function flipCamera() {
+//     console.log("Flipping camera...")
+//     const currFacingMode = localStream.getVideoTracks()[0].getSettings().facingMode
+//     console.log(facing)
+
+//     const tracks = localStream.getTracks()
+//     for (let track of tracks) {
+//         track.stop();
+//     }
+//     let flippedStream;
+
+//     if (facing == "user") {
+//         await navigator.mediaDevices.getUserMedia({
+//             video: {
+//                 width: {ideal: 1920},
+//                 height: {ideal: 1080},
+//                 facingMode: 'environment'
+//             },
+//             audio: true
+//         }).then(stream => replaceTracks(stream))
+
+//         facing = "environment"
+//     }
+//     else {
+//         await navigator.mediaDevices.getUserMedia({
+//             video: {
+//                 width: {ideal: 1920},
+//                 height: {ideal: 1080},
+//                 facingMode: 'user'
+//             }
+//         }).then(stream => replaceTracks(stream))
+
+//         facing = "user"
+//     }
 
-} */
+// }
 
 
 // Setting up flkty for carousels

server.js

@@ -19,7 +19,6 @@ import { ResetPassword } from "./models/reset.js"
 import { resetMail } from "./mail/ResetPassword.js"
 import { ObjectId } from "mongodb"
 
-
 const app = express()
 
 dotenv.config()
@@ -36,6 +35,13 @@ app.use(cookieParser())
 const server = http.Server(app)
 const io = new Server(server)
 
+// Peer Server
+const peerServer = ExpressPeerServer(server, {
+    path: '/firewood'
+  });
+
+app.use('/peerjs', peerServer);
+
 
 const cookieAge = 3 // in days
 
@@ -354,7 +360,7 @@ app.post('/api/register', async (req, res) => {
 
 })
 
-app.get('/api/state.json', (req, res) => {
+app.get('/api/state', (req, res) => {
     res.type('json')
     var state = null;
     var token = req.cookies['token']

views/cabin.ejs

@@ -76,10 +76,9 @@
             return new Promise(resolve => setTimeout(resolve, ms));
         }
     </script>
-    <script src="https://unpkg.com/peerjs@1.3.2/dist/peerjs.js" defer></script>
+    <script src="https://unpkg.com/peerjs@1.4.7/dist/peerjs.min.js" defer></script>
     <script src="/socket.io/socket.io.js" defer></script>
     <script src="../scripts/cabin/cabin.js" type="module" defer></script>
-    <script src="../scripts/cabin/grid.js" defer></script>
 </head>
 <body style="margin:0px;">
     <div class="main-gallery">