FIX: keyboard on android (#21505)

This commit is contained in:
Joffrey JAFFEUX 2023-05-11 16:12:48 +02:00 committed by GitHub
parent 26f9ccd8bb
commit 0c27baef76
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 25 deletions

View File

@ -3,7 +3,6 @@ import Component from "@ember/component";
import isZoomed from "discourse/plugins/chat/discourse/lib/zoom-check";
const CSS_VAR = "--chat-vh";
let pendingUpdate = false;
export default class ChatVh extends Component {
tagName = "";
@ -11,16 +10,16 @@ export default class ChatVh extends Component {
didInsertElement() {
this._super(...arguments);
this.setVHFromVisualViewPort();
if ("virtualKeyboard" in navigator) {
this.setVHFromKeyboard();
navigator.virtualKeyboard.overlaysContent = true;
navigator.virtualKeyboard.addEventListener(
"geometrychange",
this.setVHFromKeyboard
);
} else {
this.setVHFromVisualViewPort();
(window?.visualViewport || window).addEventListener(
"resize",
this.setVHFromVisualViewPort
@ -42,16 +41,10 @@ export default class ChatVh extends Component {
this.setVHFromVisualViewPort
);
}
pendingUpdate = false;
}
@bind
setVHFromKeyboard(event) {
if (pendingUpdate) {
return;
}
if (this.isDestroying || this.isDestroyed) {
return;
}
@ -60,24 +53,20 @@ export default class ChatVh extends Component {
return;
}
pendingUpdate = true;
requestAnimationFrame(() => {
const { height } = event.target.boundingRect;
const vhInPixels =
((window.visualViewport?.height || window.innerHeight) - height) * 0.01;
document.documentElement.style.setProperty(CSS_VAR, `${vhInPixels}px`);
requestAnimationFrame(() => {
const keyboardHeight = event.target.boundingRect.height;
const viewportHeight =
window.visualViewport?.height || window.innerHeight;
pendingUpdate = false;
const vhInPixels = (viewportHeight - keyboardHeight) * 0.01;
document.documentElement.style.setProperty(CSS_VAR, `${vhInPixels}px`);
});
});
}
@bind
setVHFromVisualViewPort() {
if (pendingUpdate) {
return;
}
if (this.isDestroying || this.isDestroyed) {
return;
}
@ -86,14 +75,10 @@ export default class ChatVh extends Component {
return;
}
pendingUpdate = true;
requestAnimationFrame(() => {
const vhInPixels =
(window.visualViewport?.height || window.innerHeight) * 0.01;
document.documentElement.style.setProperty(CSS_VAR, `${vhInPixels}px`);
pendingUpdate = false;
});
}
}