steveseguin / vdo.ninja

VDO.Ninja is a powerful tool that lets you bring remote video feeds into OBS or other studio software via WebRTC.
https://vdo.ninja
Other
2.85k stars 810 forks source link

Feature Request: more harmless &sticky for better user experience #944

Open rse opened 2 years ago

rse commented 2 years ago

VDO.Ninja has a &sticky option. But it has an unusual user experience, as it creates a browser popup which completely confuses our users and it just remembers the entire URL. I would like to see a more harmless variant of &sticky: if enabled, VDO.Ninja on the device screen remembers just the device parameters in localStorage and when one enters the device screen again it silently picks up the remembered parameters as the new default and still presents the device screen. So, &sticky should just make the device parameters sticky (so the user has not to re-select the devices all the time) and nothing more. No popups and no fiddling with the particular URL.

steveseguin commented 2 years ago

Hey,

so I've just updated https://vdo.ninja/alpha/ so that when a user changes the audio/video device, it is remembered for next time. It does this automatically, without a URL parameter added.

This uses local storage and device IDs, so it's not 100% persistent, but should be fairly stable between refreshes/sessions.

rse commented 2 years ago

I've tried this alpha version and it seems to work just fine and as expected. The device selection page remembers the devices. The only thing which was a little bit confusing is that on a page reload I had to at least once click somewhere(!) to let the device selection proceeed. I guess Chrome blocked the camera init until any interaction occurred. I don't think VDO.Ninja can do anything on this, right?

steveseguin commented 2 years ago

Not sure I'm seeing that behaviour on my end; https://vdo.ninja/alpha/?webcam&autostart for example auto starts with the saved settings.

Clicking is needed for the video to auto play if audio is present of course.

Are you using an iframe or anything?

rse commented 2 years ago

No, I just used the following VDON-Call generated URL (I just manually inserted the /alpha/) in Google Chrome under macOS: https://vdo.ninja/alpha/?room=BC317F5D809EE4492992DD9C5D&push=BC317F5D809EE4492992DD9C5D_C1A&ssid=BC317F5D809EE4492992DD9C5D_C1B&label=Caller-1&sslabel=Caller-1%20(Content)&order=99&quality=1&maxframerate=24&noscale&mediasettings&ssq=0&ssfps=6&codec=vp8&videobitrate=2000&zoomedbitrate=2000&audiobitrate=256&roombitrate=2256&totalroombitrate=4512&limittotalbitrate=4512&stereo=1&screensharestereo=1&aec=1&ag=1&dn=1&ssdn=0&lowcut=80&compressor&showonly=BC317F5D809EE4492992DD9C5D_A1A,BC317F5D809EE4492992DD9C5D_A1B,BC317F5D809EE4492992DD9C5D_A2A,BC317F5D809EE4492992DD9C5D_A2B&noheader&preview&style=1&darkmode&nowebsite&forcedlandscape&showlist=1&nofileshare&grid&tallyoff&hand&beep&webcam&ssb&margin=10&fadein=1000&css=https%3A%2F%2Fcaller.studio%2Fvdon.css

There were no iframes or anything else. The effect is this: without /alpha/, the release version immediately shows the devices and nothing hangs. With /alpha/, I had to click ANYWHERE (not inside the preview area) in order to allow the device selection popups to really initially show anything and the preview to also show something initially. To me it looks as if Chrome prevents VDO.Ninja from proceeding unless a single interaction happens on the page. It might be related to the preview, but I actually can click also on the bottom of the page to let it proceed. Unless I perform any click, the page does not proceed, even for a very long time. So, Chrome expects an interaction for me... except for this required interaction, everything works as expected, of course.

rse commented 2 years ago

I guess the difference between you and me is my VDON-Call generated URL directs me directly to the device selection page and you perhaps started with the regular entry point and at the device selection page you already interacted once by selecting "Share your camera" before?

steveseguin commented 2 years ago

I looked into it and removing &ssq=0 seemed to fix the issue.

When I took at look at the code, it seemed &ssq=0 was trying to remove an element that was missing for some reason with your particular css/settings. This caused an unhandled error that prevented the auto-play logic from triggering I think.

Clicking the page checks if the video is paused, and play it if so, continuing the logic.

I added proper error handling and updated alpha, so things should work with &ssq=0 on alpha. I thought I already had error handling in place for missing elements, but apparently it didn't work as I expected.

rse commented 2 years ago

I've rechecked and indeed, yes, it now works without any hangs and this device selection remembering is now a lot greater user experience. Many thanks for your efforts, Steve. My users will be happy once this feature can be used in beta or the forthcoming release. Really awesome!