Browse Source

add a delay before recalculating vh 😭

pull/5/head
Ginger Wong 5 years ago
parent
commit
59ab5e9e98
  1. 1
      webroot/index.html
  2. 3
      webroot/js/app.js
  3. 4
      webroot/js/message.js
  4. 6
      webroot/js/utils.js

1
webroot/index.html

@ -30,6 +30,7 @@ problems;
- chat windwo placementis messedup on orientation changes.. needs new vh. - chat windwo placementis messedup on orientation changes.. needs new vh.
orientationchange oly happens on mobile. orientationchange oly happens on mobile.
does orientationchange happen when keyboard appears? does orientationchange happen when keyboard appears?
- changing vh after orientation change sometimes yields same value
possible hacks possible hacks
- if mobile, don't show chat + chat icon in landscape?.. - if mobile, don't show chat + chat icon in landscape?..

3
webroot/js/app.js

@ -28,9 +28,8 @@ function setupApp() {
// style hackings // style hackings
window.VIDEOJS_NO_DYNAMIC_STYLE = true; window.VIDEOJS_NO_DYNAMIC_STYLE = true;
if (hasTouchScreen()) { if (hasTouchScreen()) {
mobileVHhack(); setVHvar();
window.onorientationchange = handleOrientationChange; window.onorientationchange = handleOrientationChange;
// document.addEventListener("orientationchange", handleOrientationChange);
} }

4
webroot/js/message.js

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

6
webroot/js/utils.js

@ -44,9 +44,9 @@ function setVHvar() {
document.documentElement.style.setProperty('--vh', `${vh}px`); document.documentElement.style.setProperty('--vh', `${vh}px`);
console.log("== new vh", vh) console.log("== new vh", vh)
} }
// delayed
function mobileVHhack() { function mobileVHhack() {
setVHvar(); setTimeout(setVHvar, 100);
// window.addEventListener("orientationchange", setVHvar);
} }
function isAndroidMobile() { function isAndroidMobile() {
@ -83,5 +83,5 @@ function hasTouchScreen() {
function handleOrientationChange(event) { function handleOrientationChange(event) {
console.log("====orientation change 123", event, window.screen.orientation, window.orientation) console.log("====orientation change 123", event, window.screen.orientation, window.orientation)
setVHvar(); mobileVHhack();
} }

Loading…
Cancel
Save