Is there any way to blur the whole webpage, while user moves focus away ?

[princekhunt]

Is your feature request related to a problem? Please describe. We're trying to make the chat webpage screenshot proof, It is hard but exploring options.

Describe the solution you'd like We can use javascript, which blurs the page when user moves focus. and unblur when focused on page.

[sudarshankakde]

I can work on it!!

[princekhunt]

Could you explain approach first ?

1. How will you do it?
2. Which pages will be affected?
3. Will other components be affected negatively ?

[sudarshankakde]

so I plan to add js and use the visibility change event to add a class to the webpage (we can add this class directly to body or specifically to the main class where all chats are). I can Disable the Print Screen (Not Foolproof) functionality for screenshots, which will be done by adding some CSS only. overall base.html will be edited and there will be no negative affects.

[princekhunt]

visibilitychange works, when another app, other than browser is opened?

I checked, it works while another tab is opened, but not sure about the another app.

[sudarshankakde]

there are other events such as "blur", and "focus". we can use if the chat screen is not in focus we can blur the whole chat screen and if it is in focus we will remove blur

implemented overview-

https://github.com/princekhunt/privateping/assets/60603199/8ac5ba22-2676-4874-b105-588b3738cbcb

[princekhunt]

That's exactly what's required.

[sudarshankakde]

and here I disable the print screen functionality.

https://github.com/princekhunt/privateping/assets/60603199/e0872cca-4891-4667-97a2-dcc357cf6588

if every thing is fine for you I can create pull request right now!

[princekhunt]

and here I disable the print screen functionality.

Recording.2024-06-15.000008.mp4

if every thing is fine for you I can create pull request right now!

at 0:09 in this video, toast is also shown and message in back as well, maybe blur event didn't collaborate properly.

[sudarshankakde]

let me check and fix it!

[sudarshankakde]

done by my side

https://github.com/princekhunt/privateping/assets/60603199/c9b50de4-929d-4555-88c9-f1c9a7368234

should I create a pull request?

[princekhunt]

Okay, create PR. let me test from my end.

[sudarshankakde]

Done!

[sudarshankakde]

Will you merge it so that i will be open to create pull requests for other assigned issues.

[princekhunt]

I think you forgot to make PR. you pushed changes to your repo.

kindly create the pr.

[princekhunt]

Merged to main.