r4sas/tweb-i2p
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix topbar width with context menu

Browse Source 
Context menu close with Escape
This commit is contained in:
Eduard Kuzmenko 2020-11-12 23:17:39 +02:00
parent e5f8bd010c
commit 220eefe116
2 changed files with 14 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/components/misc.ts
View File

@ -1,4 +1,5 @@
import Countries, { Country, PhoneCodesMain } from "../countries"; import Countries, { Country, PhoneCodesMain } from "../countries";
import { cancelEvent } from "../helpers/dom";
import mediaSizes from "../helpers/mediaSizes"; import mediaSizes from "../helpers/mediaSizes";
import { clamp } from "../helpers/number"; import { clamp } from "../helpers/number";
import { isTouchSupported } from "../helpers/touchSupport"; import { isTouchSupported } from "../helpers/touchSupport";
@ -116,26 +117,17 @@ let onMouseMove = (e: MouseEvent) => {
//console.log('mousemove', diffX, diffY); //console.log('mousemove', diffX, diffY);
}; };
let onClick = (e: MouseEvent | TouchEvent) => { const onClick = (e: MouseEvent | TouchEvent) => {
/* if(touchSupport && e.type == 'touchstart') {
const target = findUpClassName(e.target, 'btn-menu');
if(!target) {
window.addEventListener('touchend', (e) => {
return cancelEvent(e);
}, {once: true});
}
} *//* else if(!touchSupport && e.type == 'mousedown') {
const target = findUpClassName(e.target, 'btn-menu');
if(!target) {
closeBtnMenu();
return cancelEvent(e);
}
} */
//e.preventDefault();
closeBtnMenu(); closeBtnMenu();
}; };
const onKeyDown = (e: KeyboardEvent) => {
if(e.key == 'Escape') {
closeBtnMenu();
cancelEvent(e);
}
};
export const closeBtnMenu = () => { export const closeBtnMenu = () => {
if(openedMenu) { if(openedMenu) {
openedMenu.classList.remove('active'); openedMenu.classList.remove('active');
@ -149,17 +141,13 @@ export const closeBtnMenu = () => {
openedMenuOnClose = null; openedMenuOnClose = null;
} }
//document.body.classList.remove('disable-hover');
if(isTouchSupported) { if(isTouchSupported) {
window.removeEventListener('touchmove', onClick); window.removeEventListener('touchmove', onClick);
//window.removeEventListener('touchstart', onClick);
} else { } else {
window.removeEventListener('mousemove', onMouseMove); window.removeEventListener('mousemove', onMouseMove);
//window.removeEventListener('mousedown', onClick);
//window.removeEventListener('click', onClick);
} }
window.removeEventListener('keydown', onKeyDown, {capture: true});
window.removeEventListener('click', onClick); window.removeEventListener('click', onClick);
window.removeEventListener('contextmenu', onClick); window.removeEventListener('contextmenu', onClick);
}; };
@ -194,13 +182,11 @@ export function openBtnMenu(menuElement: HTMLElement, onClose?: () => void) {
if(isTouchSupported) { if(isTouchSupported) {
window.addEventListener('touchmove', onClick, {once: true}); window.addEventListener('touchmove', onClick, {once: true});
//window.addEventListener('touchstart', onClick);
} else { } else {
window.addEventListener('mousemove', onMouseMove); window.addEventListener('mousemove', onMouseMove);
//window.addEventListener('mousedown', onClick);
//window.addEventListener('click', onClick, {once: true});
} }
window.addEventListener('keydown', onKeyDown, {capture: true});
window.addEventListener('click', onClick, {once: true}); window.addEventListener('click', onClick, {once: true});
window.addEventListener('contextmenu', onClick, {once: true}); window.addEventListener('contextmenu', onClick, {once: true});
} }

5
src/lib/appManagers/appImManager.ts
View File

@ -187,8 +187,9 @@ export class AppImManager {
// * fix topbar overflow section // * fix topbar overflow section
const setUtilsWidth = () => { const setUtilsWidth = () => {
this.log('utils width:', chatUtils.scrollWidth); const width = /* chatUtils.scrollWidth */chatUtils.getBoundingClientRect().width;
this.chatInfo.style.setProperty('--utils-width', chatUtils.scrollWidth + 'px'); this.log('utils width:', width);
this.chatInfo.style.setProperty('--utils-width', width + 'px');
}; };
let mutationRAF: number; let mutationRAF: number;