livechat 0.5.0 → 0.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: c43b02b890218a998865cc1e5e48d03aa292a120cac3a07045bf18e52f92f33b
4
- data.tar.gz: eb8be46400159aef252e0d2bcd2ffed67a086f9c98cc7b4e2d055543e52e657c
3
+ metadata.gz: 36140a155cb2d4c5a88370e3664bf7e78d8515f391f9f199c874bff34f0a2339
4
+ data.tar.gz: c210bf87c74cf690d18ecbd9c467c49fdd70c10edf48fe502aa133e1333ce016
5
5
  SHA512:
6
- metadata.gz: a73f3a61db23291760581906d03b2886dff33ff58a68eeceb5f52ce1826deff66e2c0867d3ac4d058824ba297aa923515e9c42a5675d8a9b5705977b945223b6
7
- data.tar.gz: 81b7e4f24815ccd1c549f7fbc885ed108a800e3906e7d168f91c4a33a4a269dd596ee14ac2066d6a98e0f34e13c10caba60fb0702b0569a3f89540466173db11
6
+ metadata.gz: 29f26f94a9e00ddac306fa329043d75d1201a90b45e38d6fde1b09d87aa46877f4ce5a763c263aface6df1987ba4925ff3e47652ed754a8857ab392d858348a6
7
+ data.tar.gz: 804d3dde0b5969c44ba81fdf3b918dc1fc17e9ae294fcdbc0f8a544f415cca4d0ba845697b0a83202e3a198b9fae49501dca7645c1698b4e9391f6ecbb237ede
data/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # Changelog
2
2
 
3
+ ## 0.5.1
4
+
5
+ - Fixed the mobile chat panel letting the page scroll behind it (and the host
6
+ page showing through above/below the panel) while the keyboard was open.
7
+ The scroll lock now pins `<body>` with `position: fixed` — `overflow:hidden`
8
+ alone is ignored by iOS Safari for touch — so the background is truly frozen
9
+ and the keyboard-pinned panel covers the visible area with no gaps.
10
+
3
11
  ## 0.5.0
4
12
 
5
13
  - The full-screen mobile panel now survives the on-screen keyboard. On phones
@@ -1,5 +1,5 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module Livechat
4
- VERSION = '0.5.0'
4
+ VERSION = '0.5.1'
5
5
  end
@@ -46,7 +46,8 @@
46
46
  // On phones the panel is a full-screen modal (focus trapped, page scroll
47
47
  // locked); on desktop it stays a non-modal popover you can chat alongside.
48
48
  var mobileModal = window.matchMedia ? window.matchMedia("(max-width: 480px)") : null;
49
- var savedOverflow = null;
49
+ var savedBodyStyle = null; // body's style while the mobile scroll lock is on
50
+ var savedScrollY = 0;
50
51
  // The id of the newest message actually RENDERED into the list — never
51
52
  // advanced by background polls, so reopening the panel refetches exactly
52
53
  // the messages it hasn't shown yet.
@@ -536,16 +537,32 @@
536
537
  }
537
538
  }
538
539
 
540
+ // A real iOS scroll lock. `overflow:hidden` on <html> is ignored by Safari
541
+ // for touch scrolling, so the page slid behind the full-screen panel — and
542
+ // because the panel has no backdrop, that scrolling showed through as the
543
+ // pinned panel chased visualViewport.offsetTop. Pinning <body> with
544
+ // position:fixed genuinely freezes the page (offsetTop then stays 0 and the
545
+ // panel covers the visible area exactly). We snapshot the body's style and
546
+ // scroll position and restore both on unlock. Mobile modal only; the desktop
547
+ // popover never locks.
539
548
  function lockScroll() {
540
- if (savedOverflow !== null) return;
541
- savedOverflow = document.documentElement.style.overflow;
542
- document.documentElement.style.overflow = "hidden";
549
+ if (savedBodyStyle !== null) return;
550
+ savedScrollY = window.pageYOffset || document.documentElement.scrollTop || 0;
551
+ savedBodyStyle = document.body.getAttribute("style") || "";
552
+ var s = document.body.style;
553
+ s.position = "fixed";
554
+ s.top = -savedScrollY + "px";
555
+ s.left = "0";
556
+ s.right = "0";
557
+ s.width = "100%";
558
+ s.overflow = "hidden";
543
559
  }
544
560
 
545
561
  function unlockScroll() {
546
- if (savedOverflow === null) return;
547
- document.documentElement.style.overflow = savedOverflow;
548
- savedOverflow = null;
562
+ if (savedBodyStyle === null) return;
563
+ document.body.setAttribute("style", savedBodyStyle);
564
+ savedBodyStyle = null;
565
+ window.scrollTo(0, savedScrollY);
549
566
  }
550
567
 
551
568
  // --- mobile keyboard: keep the full-screen panel above the keyboard ---------
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: livechat
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.5.0
4
+ version: 0.5.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - Yaroslav Shmarov