palavatv / palava-web Goto Github PK

When being the only one in a chat, the own video is appearing right aligned on the screen instead of being centered (horizontally) - in Chrome it works as expected.

• https://www.html5rocks.com/en/tutorials/getusermedia/intro/#toc-constraints
• https://webrtc.github.io/samples/src/content/getusermedia/resolution/

• See https://nightwatchjs.org/guide
• At the beginning, just having like 3 tests of basic user flows (enter something, join conference etc) would already be a huge step forward ("smoke testing"). We can get more sophisticated (cross-browser connection testing etc) afterwards.
• Simulating peer connections in the testing env (or ci) might be non-trivial, but let's see

On the media selection page, next to the media symbols (audio, video/audio, video), there are the list symbols which should be hidden (I guess: list-style:none ?)

See palavatv/palava-client#15

On small devices, the (lobby) peer buttons should disappear and be moved to some kind of context menu

The knobs currently use Unicode symbols, but this approach might be limited in the long run

Maybe it looks better without round corners or with less round corners?

When hovering with the mouse over the menu elements (copy link, hang up, etc.), there's immediately a tooltip with white background and then after a second another smaller black one with the same message.

When being in a conference with only audio, sometimes you only hear peers with video enabled instead of seeing the video. Might be a between firefox-chrome issue, but not sure yet.

• A user should be able to mute themself (or turn off their video stream)
• Important: This must change the actual peer session, so that the media does not get sent

• Is palava.tv usable in general?
• Are there WebRTC connection bugs?
• Are there any unpleasant layout bugs?
• Any ideas for improvements on this platform?

Currently, if signaling is not reachable and the room join does not succeed there is no error message

• Is palava.tv usable in general?
• Are there WebRTC connection bugs?
• Are there any unpleasant layout bugs?
• Any ideas for improvements on this platform?

• Basic styling
• I18n English
• I18n Deutsch
• Style buttons
• Style gum error message
• Room join error page

• Via data channels
• Im "Kachel"-style, einklappbar, wie ein Peer? oder als Sidebar

i have setup palava-web and get this error when access mydomain:8080

` Sorry, but we could not detect the required WebRTC technology in your web browser.

In order to be able to use palava.tv, you will need install a web browser which supports WebRTC, such as Firefox. If you are in luck, you just need to update your current browser to the latest version.

`

• Is palava.tv usable in general?
• Are there WebRTC connection bugs?
• Are there any unpleasant layout bugs?
• Any ideas for improvements on this platform?

From palavatv/palava#40

• Is palava.tv usable in general?
• Are there WebRTC connection bugs?
• Are there any unpleasant layout bugs?
• Any ideas for improvements on this platform?

There are at least two different cases in which we would want to identify a person by some unique "identifier":

• if somebody joins only via audio
• once we have a chat, to identify who writes there.

Possible solutions are:

1. let a user choose a name (and probably generate one for those who don't choose one)
2. choose some other identifier - I propose to have a combination of a logo and a color.

Choosing 2 could also have a security aspect: If it's possible to get a fingerprint or the whole public key of every participant - we may choose a logo/color combination matching that and so we see the same symbols/colors every time we chat with the same person (on the same device).

I would imagine this to appear as one more "bubble button" on the videos (or the audio field when only audio).

When somebody is in the Chat "only-audio" then it should be somehow visible when he/she speaks - probably a border around the peer that appears when he/she speaks?

Notes

• https://en.wikipedia.org/wiki/Progressive_web_application
• https://web.dev/pwa-checklist/ (from google)
• https://webrtchacks.com/pwa-webrtc/
• https://felixgerschau.com/service-worker-lifecycle-update/
• https://github.com/yyx990803/register-service-worker

Still Todo

• Service worker to create an offline version of the app (or the home page)
• Show close button (top left) in Android PWA
• Android PWA: Change back button to leave room / close app, instead of browser back functionality
• Offline mode for homepage: Indicate it is offline (instead of room input field?)
• Android masked favicons?
• ios?

What happens quite often with a not so good internet connection is the following: the peerconnection status goes to disconnected because some frames were not received, the "disconnected" warning is shown but then the connection is directly back and you only see the warning flicker for a single moment.

This is disturbing the chat experience and I would suggest either
A) don't completely replace the video but show a small loading icon over it or
B) have a timeout of e.g. 1s before the warning is shown
...or both?

I'd love to help with this one

Necessary steps

• Make existing codebase work with Vue 3 compatibility release #88
• Fix all console warnings and remove deprecated features/behavior
• Officially & fullly switch to Vue3

• Used for a single important message that should be shown to the user
• Disappears after some seconds, or on click
• Should have at least 2 states (positive or error), neutral 3rd state might also be worth considering
• Example usages: "Successfully copied to clipboard", "Language switched to English", "Server is going down for maintenance", maybe also #21
• Could be modal dialog or top bar, or something else ;)

• When the network is too bad / disconnected
• Maybe somehow similar to peer status "waiting"
• Maybe blocking whole UI, maybe not
• Maybe related to #23

The start page and the launch page (when choosing Video/Audio) should at least look as good as the current palava version. This is mostly a CSS task, I guess.

• Is palava.tv usable in general?
• Are there WebRTC connection bugs?
• Are there any unpleasant layout bugs?
• Any ideas for improvements on this platform?

Safari on desktop supports the navigator.share API, Currently, it takes precedence over the "copy to clipboard" functionality. This was fine, since navigator.share is mainly supported by mobile devices, where "share" often makes more sense than just "copy to clipboard".

On a Safari Desktop, however, you often want to just copy the link (especially since the address bar does not show the pathname of the url), so copying should be possible. I can think of three different ways to improve the current user interface:

• Always prefer "copy" on desktops (which means "share" functionality is not accessible on desktop safari anymore)
• Separate "copy" and "share" functionality into two different knobs, show both
• Separate "copy" and "share" functionality into two different knobs, but only show both on desktop

Currently, Palava.tv is not usable for me with FireFox since it can't detect media streams. No error logs in the console or other issues, just nothing happening where a prompt for camera/microphone would be expected

After #5

yarn audit v1.22.4
│ high │ Denial of Service │
│ Package │ http-proxy │
│ Patched in │ >=1.18.1 │
│ Dependency of │ @vue/cli-service │
│ Path │ @vue/cli-service > webpack-dev-server > │
│ │ http-proxy-middleware > http-proxy │
│ More info │ https://www.npmjs.com/advisories/1486 │

1 vulnerabilities found - Packages audited: 1564
Severity: 1 High
Done in 2.60s.

Even though this shall not be a focus, more than 6 participants should be possible. Maybe it makes sense to start filling additional participants in very small videos in a side bar and in mobile mode simply stay with the same look like with 6 people but with scrolling?

• See https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/pinnedTabs/pinnedTabs.html
• Please put under /puplic/favicons

• See: https://simpl.info/getusermedia/sources/
• Also: https://webrtchacks.github.io/WebRTC-Camera-Resolution/

Inline ("online") info pages, for example:

• network -- more info
• error -- more info
• also make other info pages (imprint etc) accessible

• No Video
• No Video / No Audio
• Loading
• Errors

Also: Still attach media for audio

• See: https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia

Someone has some good ideas for a "go" button asset? (on the home page)