fix(mobile): keyboard lift via VisualViewport (measured gap, exact) not plugin height

The Keyboard plugin's reported height overshot. With resize:none the WebView stays full-size, so
window.innerHeight - visualViewport.height is the EXACT keyboard overlap -> composer lands on the
keyboard. Web-only, works on the resize:none build already installed.
Build marker -> 2026-07-18-batch101.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-07-18 01:05:12 +05:30
parent 357f0168ba
commit 233db2c140
+13 -10
View File
@@ -1112,7 +1112,7 @@
</head> </head>
<body> <body>
<script src="/icons.js?v=6"></script> <script src="/icons.js?v=6"></script>
<script>window.__BUILD='2026-07-18-batch100';console.log('%cBiz Connect','color:#1F3B73;font-weight:bold','build '+window.__BUILD); <script>window.__BUILD='2026-07-18-batch101';console.log('%cBiz Connect','color:#1F3B73;font-weight:bold','build '+window.__BUILD);
// Emoji are rendered with the OS's own (colour) emoji font — instant, zero network. // Emoji are rendered with the OS's own (colour) emoji font — instant, zero network.
// //
// We used to run Twemoji over every emoji, which swapped each one for an <img> pulled INDIVIDUALLY from // We used to run Twemoji over every emoji, which swapped each one for an <img> pulled INDIVIDUALLY from
@@ -1127,15 +1127,18 @@ function twemojify(_el){ /* native emoji: nothing to do */ }</script>
// juggling here — we only tag <html> so CSS can make small native-only tweaks if needed. // juggling here — we only tag <html> so CSS can make small native-only tweaks if needed.
(function(){ try{ var C=window.Capacitor; if(!C||!C.isNativePlatform||!C.isNativePlatform()) return; (function(){ try{ var C=window.Capacitor; if(!C||!C.isNativePlatform||!C.isNativePlatform()) return;
var p=(C.getPlatform&&C.getPlatform())||''; var r=document.documentElement; r.classList.add('native-app'); if(p) r.classList.add('native-'+p); var p=(C.getPlatform&&C.getPlatform())||''; var r=document.documentElement; r.classList.add('native-app'); if(p) r.classList.add('native-'+p);
// Keyboard: with resize:none the native layer does NOTHING, so we lift the composer ourselves by the // Keyboard: with resize:none the WebView never resizes, so we raise the composer to sit on the keyboard
// reported keyboard height (× a tunable factor). This is fully web-controllable now — if the lift is a // using the VisualViewport API — the ACTUAL amount the visible area shrinks by. This is measured, not the
// touch high/low we adjust KB_LIFT here and redeploy, no rebuild. // plugin's reported height (which overshot), so it lands exactly on the keyboard.
var KB_LIFT=1.0; // fraction of keyboardHeight to raise the composer by (calibrate via web if needed) if(window.visualViewport){
var KB=C.Plugins&&C.Plugins.Keyboard; var vv=window.visualViewport;
if(KB && KB.addListener){ var onVV=function(){
KB.addListener('keyboardWillShow', function(info){ var h=Math.round(((info&&info.keyboardHeight)||0)*KB_LIFT); r.style.setProperty('--kb', h+'px'); document.body.classList.add('kb-open'); }); var kb=Math.max(0, Math.round(window.innerHeight - vv.height - vv.offsetTop));
KB.addListener('keyboardDidShow', function(){ var b=document.getElementById('msgs'); if(b) b.scrollTop=b.scrollHeight; }); r.style.setProperty('--kb', kb+'px');
KB.addListener('keyboardWillHide', function(){ r.style.setProperty('--kb','0px'); document.body.classList.remove('kb-open'); }); var open=kb>4; document.body.classList.toggle('kb-open', open);
if(open){ var b=document.getElementById('msgs'); if(b) b.scrollTop=b.scrollHeight; }
};
vv.addEventListener('resize', onVV); vv.addEventListener('scroll', onVV);
} }
}catch(_){} })(); }catch(_){} })();
</script> </script>