calc resize on android on message field focus

This commit is contained in:
Ginger Wong
2020-06-15 13:43:41 -07:00
parent 986c168d07
commit 567729f6f8
3 changed files with 15 additions and 2 deletions

View File

@@ -1,3 +1,4 @@
<html>
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>
@@ -15,7 +16,14 @@
<script src="vendor/autolink.js"></script> <script src="vendor/autolink.js"></script>
<link href="./styles/layout.css" rel="stylesheet" /> <link href="./styles/layout.css" rel="stylesheet" />
</head> </head>
<script>
/*
GW TODO:
- off line/ video done mode.
- remove listeners on unload?
*/
</script>
<body class="bg-gray-300 text-gray-800"> <body class="bg-gray-300 text-gray-800">
<div id="app-container" class="flex no-chat"> <div id="app-container" class="flex no-chat">
<header class="flex border-b border-gray-900 border-solid shadow-md"> <header class="flex border-b border-gray-900 border-solid shadow-md">

View File

@@ -105,9 +105,11 @@ class Messaging {
handleKeyboardAppear() { handleKeyboardAppear() {
this.tagAppContainer.classList.add("android-message-focus"); this.tagAppContainer.classList.add("android-message-focus");
setVHvar();
} }
handleKeyboardOut() { handleKeyboardOut() {
this.tagAppContainer.classList.remove("android-message-focus"); this.tagAppContainer.classList.remove("android-message-focus");
setVHvar();
} }
handleChatToggle() { handleChatToggle() {

View File

@@ -39,9 +39,10 @@ function uuidv4() {
} }
function setVHvar() { function setVHvar() {
let vh = window.innerHeight * 0.01; var vh = window.innerHeight * 0.01;
// Then we set the value in the --vh custom property to the root of the document // Then we set the value in the --vh custom property to the root of the document
document.documentElement.style.setProperty('--vh', `${vh}px`); document.documentElement.style.setProperty('--vh', `${vh}px`);
console.log("== new vh", vh)
} }
function mobileVHhack() { function mobileVHhack() {
setVHvar(); setVHvar();
@@ -53,3 +54,5 @@ function isAndroidMobile() {
//&& ua.indexOf("mobile"); //&& ua.indexOf("mobile");
return isAndroid; return isAndroid;
} }