abozanona/luca

Luca - Watch movies with friends

luca's Issues

Use classes in code

Use classes in code instead of functional programming

Use ts files instead of js files

Need to use ts in contsnt.js file.

Need to create an npm script to build the extension code.

https://docs.microsoft.com/en-us/visualstudio/javascript/compile-typescript-code-npm?view=vs-2022

Add support for RTL

The popup and injected components in screen should support RTL layouts.

RTL should load automatically based on the user's local.

Add popup UI logic

Every time the user opens the popup, display the popup content based on the status read from the current opened page.

List of possible status received from the content page:

Code	What is content status	What should show in popup
null/undefined/nothing	This is the default status code. It will return in cases when the content script is not loaded on page or the page doesn't support loading content script.	A message indicating that the script is not loaded. Please make sure that the page is valid and to refresh the page if it is a valid page.
WAITING_CREATE_ROOM	When the content script is loaded successfully but no video was selected by user and no room was created	Show two options to either create a new room or join a room. If the users creates a new room show him a message to select a video from page. If the user Selects a video from page, show him a screen with the party details and the ability to share party link.
WAITING_SELECT_VIDEO	Socket is opened but the user didn't select any video	show the user a message asking him to select a video from page. If the user Selects a video from page, show him a screen with the party details and the ability to share party link.
PARTY_SETUP_COMPLETED	Video is selected and socket is connected to party.	show user a screen with the party details wiith the ability to share party link.

Add rate us feature

Users should be able to rate the extension on chrome store.

Send actions in chat

When a user performs an action, show it in the chat

List of actions a user can make

• Play/pause/seek video
• Join party
• Makes a reaction

Re-Add the js for content page

Describe the bug
Add the content script that selects a video, starts stream and displays chat to users. You can find the original code in previous commits.

Add the ability to share party link with other users

Is your feature request related to a problem? Please describe.
Users should have the ability to share a party link with other users that want to join their party.

Describe the solution you'd like

• The user can generate a link for the current party. The link contains the party id and the URL of the most-top page in the current tab.
• When a user opens the link, it will show him a page that will either show him that the extension is not installed or to click on a button to join the button.
• Clicking on the above button will open a new tap and start a party there.

Socket messages keep sending infinitely.

When receiving a socket message, it's re-sent to the client. Then the client receives it and re-sends it.
So an infinite socket message will keep sending.

Add the ability to open chat panel in new window

More description to be added later.

Add donation button

Consider adding a donation button in the design of Luca extension.

@Mahmoud-Skafi to add a donation button/popup to the Figma design where users can support the extension developers.

The donation can be on PayPal, Buy me a coffee or any other service.

Luca extension general fixes

Need to do the following fixes:

• Allow user to join a party from link.
• add user ad to navbar.
• Show party users in popup and chat

Chat container doesn't scroll automatically when new messages arrive in some streaming websites.

The chat container doesn't scroll automatically when new messages arrive on streaming websites.

The easiest solution for that is to display chat bubbles from the newest to the oldest.

Update reactions icons

Update reactions icons

Show chat and reactions only once in the screen

When a user starts streaming in a page, the reactions and chat show more than once.

Chat should only show in the frame of the selected video.

Resolve bugs in Luca extension.

Describe the bug
Walk through Luca extension and fix bugs.

Push to talk voice messaging

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Store all streaming websites in DB

We should have a database that has links to all websites that the extension was run on.

We need to store links for the website that's running the video and for all parent pages if the page is displayed within a frame.

Extension doesn't work on Netflix

Describe the bug
Running Luca on Netflix causes the page to crash

To Reproduce
Steps to reproduce the behavior:

1. Go to any video on Netflix and start a party on two tabs
2. Perform any action on the vidoe
3. The page will crash

We should build custom clients for certain/different websites.

Run Luca on Edge and Firefox

Add the ability to run Luca on Edge and Firefox browsers.

Show connectivity status to the party

Show if the current user is still connected to the opened party. We can show a red bar at the top of chat and change the chat button color into red to indicate that the user has disconnected from the party socket.

Automatically try to reconnect disconnected users every 5,10,20,30,60 seconds.

Allow users to leave the party or reset the selected video in the party.

Chat and reactions don't show in full screen

When opening a video in full screen, chat and reactions don't show

Add support for different languages

Build the code structure to support different languages.

The structure should support adding translations for

• Content scripts
• Injected scripts
• HTML templates
• Manifest file
• Popup scripts
• Popup UI
• Core code and core classes

Create the following Luca features

Register users: Users in Luca can register using their Google account.
Users can follow other users.
Users can create rooms/join rooms.
Created rooms can be public or private.
Users can view all public Luca rooms from anywhere in the world.

Sound doesn't work when someone sends a message

When a user receives a messing, sound doesn't play.

Need to make sure sounds are played when someone receives or sends a message.

Create readme file

• Add readme file to the repo.
• Move code to src folder.

Mute sounds

Add the ability to mute Luca sounds in the settings page.

Sounds include

• Sending/receiving message sound

Reactions doesn't work in full screen mode.

Reactions doesn't show in full screen mode after clicking on one of the emojies.

Need to spawn reactions from the div that has the current full screen focus.

Link for the website that causes the issue https://suzihaza.com/v/-pdzztp24p1-m3j

Add design to pages in the extension

Refer to #14 to get more details about the pages that should be designed

Need to add design to the following pages in the extension

The not recognize page

The select video to proceed page

The splash screen

Edit user name and avatar page

This can be added in the settings page

Content page UI

Add the ability to leave a room

Add the ability to leave rooms.

Show new messages in a popup when chat is closed

Show new messages in a popup when chat is closed.

Popup messages should disappear when the chat container is expanded.

redesign settings page

Do some general redesign and fixes in the settings page

Add the ability to send voice messages

Users should have the ability to send voice messages to others users in the party. It should be a push-to-talk feature.

When a user pushes a button, it will show him a circular progress bar on the screen indicating that the user is talking now. The user can talk for no more than 10 seconds.

The voice message will be sent to other users in the party and will get played automatically based on users preferences in their settings.

Fix playing issues in Luca

• Chat should automatically scroll to bottom when it's opened
• You should not clear chat input when a user sends you a message.

Show party screen when the user click home button when the party is running

When the user is already in the party and click the home button in the popup navbar redirect the user to the party screen not the home screen

Use tsx instead of jsx

Use TypeScript with react.

Add Google Analytics to extension

See https://developer.chrome.com/docs/extensions/mv3/tut_analytics/

Show survey when the user uninstalls the extension

Create a survey when the user uninstalls the extension

Add dark mode

Need to activate dark mode button in the settings.

Party doesn't work probably on youtube when the user moves to another video.

@Mahmoud-Skafi Can you please add more details regarding this issue?

Create Front-End Structure

Create Webpack config for production/ development environment.

• Add Scss-loader
• Add ts-loader
• Add HTML-loader

Add tutorial for how to use the extension

Need to add a guide within the extension to show users how to use the Luca for the first time.

It could be a set of notes and a next buttons that shows on the screen.

Add the ability to auto select video when a user joins a party.

When a user creates a party, he have to select the video he wants to play the party on. But when a user wants to join a party, we can automatically select the video for him.

We can do that by reading the xpath for the video in the party creator screen, and select the video automatically in the other users screens.

Do not depend on IDs or classes since some website change them to prevent developers like us from parsing their website. Instead, you should only use elements names.

Need to develop a method that will generate the xPath for any element in page.