akilesh-io / app.ruscello

Watch Movies Together

Filmingo - Watch Movies Together

A video player that allows you to watch synchronized content with your friends and family.


Application Link

---

Getting Started

🌀Spin, local development server:

# install dependencies
$ yarn install

# serve at localhost:3000
$ yarn dev

Open http://localhost:3000 with your browser to see the app.

Note: You can also test peer to peer connection locally by opening multiple tabs.

‼️ Note

This is the frontend of the web app. You can get the server here

🌳 Environment Variables

Set API_URL env var to the server's url

Note: If you are running the server locally, set API_URL=http://localhost:5000 and make sure the server is running on port 5000

👣 Steps

1. Create a room ➕
2. Invite your friends 🕺
3. Add video 🎬
4. Chill 🍿

✨ Features

✅ Minimal UI 🔮
✅ Floating video 📺
✅ Stream youtube videos ▶️
✅ Local media playback 📁
✅ Sync playback 🔄
🔳 Stream online videos 🌐
🔳 Torrent Streaming 🧲
🔳 Subtitles 📄
🔳 No refreshes needed ⌛️

Reference:

• React Video controler: https://code.pieces.app/blog/react-player-customized-controls

• Responsive aspect ratio: https://www.w3schools.com/howto/howto_css_responsive_iframes.asp

• customize MUI theme https://mui.com/material-ui/customization/how-to-customize/

• Full screen both video and face-time http://jsfiddle.net/zrxewhgL/ http://jsfiddle.net/j40s2bvd/

• To implement video call feature Refer this code: https://github.com/Alamir151/zoom-clone

• Torrent streaming: https://codesandbox.io/s/github/dbrowne24/webtorrent-react/tree/master/?file=/src/App.js https://github.com/dbrowne24/webtorrent-react/tree/master/ https://github.com/qqdaiyu55/YanQi/blob/ab61d5933dd106fbed33ee4b6681907353c1bbc2/src/client/containers/Video.js#L9

• Additional Reference In Notion