Mobile Safari seems to be the only browser that does *not* resize the
viewport when the keyboard shows and hides. Instead the window is moved
to make room for the keyboard which moves content at the top off screen.
This uses the VisualViewport API to manually resize the `SessionView`
in response to keyboard display events. Additionally, if a DOM element
exists that has the `bottom-aligned-scroll` CSS class, its scroll
position is retained. Currently this only applies to the `Timeline`.
Note that the VisualViewport API was only introduced with iOS 13.
According to [statista.com], versions below 13 made up for 19% of
all iOS users in summer 2020, with the share continuing to fall off.
As a result, this seems like an acceptable workaround.
Fixes: #181
[statista.com]: https://www.statista.com/statistics/565270/apple-devices-ios-version-share-worldwide/
Signed-off-by: Johannes Marbach <n0-0ne+github@mailbox.org>
- we don't close them when receiving a push message without event_id
as we always need to have a notification open after a push message
and replacing them with a generic one like we did is worse than just
leaving it open
- after the second notification for a room, we just show "New messages"
and you don't get binged again for new messages after that.
- You will still have a notification for every room, and on Android
you will just see the one for the last room as it only shows one
notification at a time.
- also here don't use client.url to figure out if a session is open
as that doesn't work in FF
- use tag to make sure we're dealing with the right type of notif
- use findClient function
- use event.waitUntil to prevent default notification
- replace notifications for same room
- replace notifications when receiving unread=0 with "Read messages"
to prevent default notification
- don't rely on client.url to figure out if a room is open as FF
does not update this field on hash changes.
Without an explicit height defined on the container, Safari
fails to expand the `.picture` content. On desktop this results
in the image showing too small and at the top of the screen.
On mobile the picture ends up with zero height and is completely
hidden.
This commit fixes the issue by defining a height of 100% on the
`.lightbox` border box.
Fixes: #278
Signed-off-by: Johannes Marbach <n0-0ne+github@mailbox.org>
