F

src/components/appMediaViewerBase.ts

@@ -42,7 +42,6 @@ import EventListenerBase from "../helpers/eventListenerBase";
 import { MyMessage } from "../lib/appManagers/appMessagesManager";
 import RichTextProcessor from "../lib/richtextprocessor";
 import { NULL_PEER_ID } from "../lib/mtproto/mtproto_config";
-import getKeyFromEventCaseInsensitive from "../helpers/dom/getKeyFromEventCaseInsensitive";
 
 const ZOOM_STEP = 0.5;
 const ZOOM_INITIAL_VALUE = 1;
@@ -493,7 +492,7 @@ export default class AppMediaViewerBase<
       return;
     }
 
-    const key = getKeyFromEventCaseInsensitive(e);
+    const key = e.key;
     
     let good = true;
     if(key === 'ArrowRight') {

src/components/appNavigationController.ts

@@ -12,7 +12,6 @@ import blurActiveElement from "../helpers/dom/blurActiveElement";
 import { cancelEvent } from "../helpers/dom/cancelEvent";
 import { indexOfAndSplice } from "../helpers/array";
 import isSwipingBackSafari from "../helpers/dom/isSwipingBackSafari";
-import getKeyFromEvent from "../helpers/dom/getKeyFromEvent";
 
 export type NavigationItem = {
   type: 'left' | 'right' | 'im' | 'chat' | 'popup' | 'media' | 'menu' | 
@@ -64,7 +63,7 @@ export class AppNavigationController {
     window.addEventListener('keydown', (e) => {
       const item = this.navigations[this.navigations.length - 1];
       if(!item) return;
-      if(getKeyFromEvent(e) === 'Escape' && (item.onEscape ? item.onEscape() : true)) {
+      if(e.key === 'Escape' && (item.onEscape ? item.onEscape() : true)) {
         cancelEvent(e);
         this.back(item.type);
       }

src/components/chat/input.ts

@@ -82,8 +82,6 @@ import MEDIA_MIME_TYPES_SUPPORTED from '../../environment/mediaMimeTypesSupport'
 import appMediaPlaybackController from '../appMediaPlaybackController';
 import { NULL_PEER_ID } from '../../lib/mtproto/mtproto_config';
 import setCaretAt from '../../helpers/dom/setCaretAt';
-import getKeyFromEvent from '../../helpers/dom/getKeyFromEvent';
-import getKeyFromEventCaseInsensitive from '../../helpers/dom/getKeyFromEventCaseInsensitive';
 import CheckboxField from '../checkboxField';
 import DropdownHover from '../../helpers/dropdownHover';
 import RadioForm from '../radioForm';
@@ -1086,7 +1084,7 @@ export default class ChatInput {
 
   private attachMessageInputListeners() {
     this.listenerSetter.add(this.messageInput)('keydown', (e: KeyboardEvent) => {
-      const key = getKeyFromEvent(e);
+      const key = e.key;
       if(isSendShortcutPressed(e)) {
         cancelEvent(e);
         this.sendMessage();
@@ -1288,24 +1286,24 @@ export default class ChatInput {
   private handleMarkdownShortcut = (e: KeyboardEvent) => {
     // console.log('handleMarkdownShortcut', e);
     const formatKeys: {[key: string]: MarkdownType} = {
-      'B': 'bold',
-      'I': 'italic',
-      'U': 'underline',
-      'S': 'strikethrough',
-      'M': 'monospace'
+      'KeyB': 'bold',
+      'KeyI': 'italic',
+      'KeyU': 'underline',
+      'KeyS': 'strikethrough',
+      'KeyM': 'monospace'
     };
 
     if(this.appImManager.markupTooltip) {
-      formatKeys['K'] = 'link';
+      formatKeys['KeyK'] = 'link';
     }
 
-    const key = getKeyFromEventCaseInsensitive(e);
-    const applyMarkdown = formatKeys[key];
+    const code = e.code;
+    const applyMarkdown = formatKeys[code];
 
     const selection = document.getSelection();
     if(selection.toString().trim().length && applyMarkdown) {
       // * костыльчик
-      if(key === 'K') {
+      if(code === 'KeyK') {
         this.appImManager.markupTooltip.showLinkEditor();
       } else {
         this.applyMarkdown(applyMarkdown);
@@ -1315,7 +1313,7 @@ export default class ChatInput {
     }
 
     //return;
-    if(key === 'Z') {
+    if(code === 'KeyZ') {
       let html = this.messageInput.innerHTML;
 
       if(e.shiftKey) {

src/components/chat/markupTooltip.ts

@@ -17,7 +17,6 @@ import { attachClickEvent } from "../../helpers/dom/clickEvent";
 import getSelectedNodes from "../../helpers/dom/getSelectedNodes";
 import isSelectionEmpty from "../../helpers/dom/isSelectionEmpty";
 import { MarkdownType, markdownTags } from "../../helpers/dom/getRichElementValue";
-import getKeyFromEvent from "../../helpers/dom/getKeyFromEvent";
 //import { logger } from "../../lib/logger";
 
 export default class MarkupTooltip {
@@ -81,7 +80,7 @@ export default class MarkupTooltip {
     this.linkInput.addEventListener('keydown', (e) => {
       const valid = !this.linkInput.value.length || !!RichTextProcessor.matchUrl(this.linkInput.value);///^(http)|(https):\/\//i.test(this.linkInput.value);
 
-      if(getKeyFromEvent(e) === 'Enter') {
+      if(e.key === 'Enter') {
         if(!valid) {
           if(this.linkInput.classList.contains('error')) {
             this.linkInput.classList.remove('error');

src/components/popups/index.ts

@@ -15,7 +15,6 @@ import ListenerSetter from "../../helpers/listenerSetter";
 import { attachClickEvent, simulateClickEvent } from "../../helpers/dom/clickEvent";
 import isSendShortcutPressed from "../../helpers/dom/isSendShortcutPressed";
 import { cancelEvent } from "../../helpers/dom/cancelEvent";
-import getKeyFromEvent from "../../helpers/dom/getKeyFromEvent";
 import EventListenerBase from "../../helpers/eventListenerBase";
 
 export type PopupButton = {
@@ -172,7 +171,7 @@ export default class PopupElement extends EventListenerBase<{
     // cannot add event instantly because keydown propagation will fire it
     setTimeout(() => {
       this.listenerSetter.add(document.body)('keydown', (e) => {
-        if(this.confirmShortcutIsSendShortcut ? isSendShortcutPressed(e) : getKeyFromEvent(e) === 'Enter') {
+        if(this.confirmShortcutIsSendShortcut ? isSendShortcutPressed(e) : e.key === 'Enter') {
           simulateClickEvent(this.btnConfirmOnEnter);
           cancelEvent(e);
         }

src/components/sidebarLeft/tabs/2fa/email.ts

@@ -20,7 +20,6 @@ import PopupPeer from "../../../popups/peer";
 import { cancelEvent } from "../../../../helpers/dom/cancelEvent";
 import { canFocus } from "../../../../helpers/dom/canFocus";
 import { attachClickEvent } from "../../../../helpers/dom/clickEvent";
-import getKeyFromEvent from "../../../../helpers/dom/getKeyFromEvent";
 
 export default class AppTwoStepVerificationEmailTab extends SliderSuperTab {
   public inputField: InputField;
@@ -73,7 +72,7 @@ export default class AppTwoStepVerificationEmailTab extends SliderSuperTab {
     });
 
     inputField.input.addEventListener('keypress', (e) => {
-      if(getKeyFromEvent(e) === 'Enter') {
+      if(e.key === 'Enter') {
         cancelEvent(e);
         return onContinueClick();
       }

src/components/sidebarLeft/tabs/2fa/enterPassword.ts

@@ -10,7 +10,6 @@ import { cancelEvent } from "../../../../helpers/dom/cancelEvent";
 import { canFocus } from "../../../../helpers/dom/canFocus";
 import { attachClickEvent } from "../../../../helpers/dom/clickEvent";
 import replaceContent from "../../../../helpers/dom/replaceContent";
-import getKeyFromEvent from "../../../../helpers/dom/getKeyFromEvent";
 import { AccountPassword } from "../../../../layer";
 import I18n, { i18n } from "../../../../lib/langPack";
 import passwordManager from "../../../../lib/mtproto/passwordManager";
@@ -65,7 +64,7 @@ export default class AppTwoStepVerificationEnterPasswordTab extends SliderSuperT
         textEl.update();
       }
   
-      if(getKeyFromEvent(e) === 'Enter') {
+      if(e.key === 'Enter') {
         return onContinueClick();
       }
     });

src/components/sidebarLeft/tabs/2fa/hint.ts

@@ -16,7 +16,6 @@ import { toast } from "../../../toast";
 import I18n from "../../../../lib/langPack";
 import { cancelEvent } from "../../../../helpers/dom/cancelEvent";
 import { attachClickEvent } from "../../../../helpers/dom/clickEvent";
-import getKeyFromEvent from "../../../../helpers/dom/getKeyFromEvent";
 
 export default class AppTwoStepVerificationHintTab extends SliderSuperTab {
   public inputField: InputField;
@@ -63,7 +62,7 @@ export default class AppTwoStepVerificationHintTab extends SliderSuperTab {
     });
 
     inputField.input.addEventListener('keypress', (e) => {
-      if(getKeyFromEvent(e) === 'Enter') {
+      if(e.key === 'Enter') {
         cancelEvent(e);
         return inputField.value ? onContinueClick() : onSkipClick();
       }

src/components/sidebarLeft/tabs/2fa/reEnterPassword.ts

@@ -14,7 +14,6 @@ import AppTwoStepVerificationHintTab from "./hint";
 import { InputState } from "../../../inputField";
 import { cancelEvent } from "../../../../helpers/dom/cancelEvent";
 import { attachClickEvent } from "../../../../helpers/dom/clickEvent";
-import getKeyFromEvent from "../../../../helpers/dom/getKeyFromEvent";
 
 export default class AppTwoStepVerificationReEnterPasswordTab extends SliderSuperTab {
   public state: AccountPassword;
@@ -52,7 +51,7 @@ export default class AppTwoStepVerificationReEnterPasswordTab extends SliderSupe
         passwordInputField.setState(InputState.Neutral);
       }
   
-      if(getKeyFromEvent(e) === 'Enter') {
+      if(e.key === 'Enter') {
         return onContinueClick();
       }
     });

src/components/telInputField.ts

@@ -9,7 +9,6 @@ import { formatPhoneNumber } from "../helpers/formatPhoneNumber";
 import { IS_APPLE, IS_ANDROID, IS_APPLE_MOBILE } from "../environment/userAgent";
 import { HelpCountry, HelpCountryCode } from "../layer";
 import InputField, { InputFieldOptions } from "./inputField";
-import getKeyFromEvent from "../helpers/dom/getKeyFromEvent";
 
 export default class TelInputField extends InputField {
   private pasted = false;
@@ -98,7 +97,7 @@ export default class TelInputField extends InputField {
   
     telEl.addEventListener('keypress', (e) => {
       //console.log('keypress', this.value);
-      const key = getKeyFromEvent(e);
+      const key = e.key;
       if(/\D/.test(key) && !(e.metaKey || e.ctrlKey) && key !== 'Backspace' && !(key === '+' && e.shiftKey/*  && !this.value */)) {
         e.preventDefault();
         return false;

src/helpers/dom/attachListNavigation.ts

@@ -5,7 +5,6 @@
  */
 
 import fastSmoothScroll from "../fastSmoothScroll";
-import getKeyFromEventCaseInsensitive from "./getKeyFromEventCaseInsensitive";
 import { cancelEvent } from "./cancelEvent";
 import { attachClickEvent, detachClickEvent } from "./clickEvent";
 import findUpAsChild from "./findUpAsChild";
@@ -89,7 +88,7 @@ export default function attachListNavigation({list, type, onSelect, once, waitFo
   }
 
   let onKeyDown = (e: KeyboardEvent) => {
-    const key = getKeyFromEventCaseInsensitive(e);
+    const key = e.key;
     if(!keyNames.has(key as any)) {
       if(key === 'Enter' || (type !== 'xy' && key === 'Tab')) {
         cancelEvent(e);
@@ -154,7 +153,7 @@ export default function attachListNavigation({list, type, onSelect, once, waitFo
   if(waitForKey) {
     const _onKeyDown = onKeyDown;
     onKeyDown = (e) => {
-      if(getKeyFromEventCaseInsensitive(e) === waitForKey) {
+      if(e.key === waitForKey) {
         cancelEvent(e);
 
         document.removeEventListener(HANDLE_EVENT, onKeyDown, {capture: true});

src/helpers/dom/getKeyFromEvent.ts

@@ -1,21 +0,0 @@
-/*
- * https://github.com/morethanwords/tweb
- * Copyright (C) 2019-2021 Eduard Kuzmenko
- * https://github.com/morethanwords/tweb/blob/master/LICENSE
- */
-
-export default function getKeyFromEvent(e: KeyboardEvent) {
-  let key = e.key;
-	if(!key) {
-    key = e.code;
-    if(key.startsWith('Key')) {
-      key = e.code.slice(3);
-
-      if(!e.shiftKey && key.length < 2) {
-        key = key.toLowerCase();
-      }
-    }
-	}
-
-	return key;
-}

src/helpers/dom/getKeyFromEventCaseInsensitive.ts

@@ -1,12 +0,0 @@
-/*
- * https://github.com/morethanwords/tweb
- * Copyright (C) 2019-2021 Eduard Kuzmenko
- * https://github.com/morethanwords/tweb/blob/master/LICENSE
- */
-
-import getKeyFromEvent from "./getKeyFromEvent";
-import { capitalizeFirstLetter } from "../string";
-
-export default function getKeyFromEventCaseInsensitive(e: KeyboardEvent) {
-  return capitalizeFirstLetter(getKeyFromEvent(e));
-}

src/helpers/dom/isSendShortcutPressed.ts

@@ -6,10 +6,9 @@
 
 import rootScope from "../../lib/rootScope";
 import { IS_MOBILE, IS_APPLE } from "../../environment/userAgent";
-import getKeyFromEvent from "./getKeyFromEvent";
 
 export default function isSendShortcutPressed(e: KeyboardEvent) {
-  if(getKeyFromEvent(e) === 'Enter' && !IS_MOBILE && !e.isComposing) {
+  if(e.key === 'Enter' && !IS_MOBILE && !e.isComposing) {
     /* if(e.ctrlKey || e.metaKey) {
       this.messageInput.innerHTML += '<br>';
       placeCaretAtEnd(this.message)

src/lib/appManagers/appImManager.ts

@@ -72,7 +72,6 @@ import { NULL_PEER_ID } from '../mtproto/mtproto_config';
 import telegramMeWebManager from '../mtproto/telegramMeWebManager';
 import { ONE_DAY } from '../../helpers/date';
 import { numberThousandSplitter } from '../../helpers/number';
-import getKeyFromEventCaseInsensitive from '../../helpers/dom/getKeyFromEventCaseInsensitive';
 
 //console.log('appImManager included33!');
 
@@ -445,7 +444,7 @@ export class AppImManager {
   private attachKeydownListener() {
     const IGNORE_KEYS = new Set(['PageUp', 'PageDown', 'Meta', 'Control']);
     const onKeyDown = (e: KeyboardEvent) => {
-      const key = getKeyFromEventCaseInsensitive(e);
+      const key = e.key;
       if(rootScope.isOverlayActive || IGNORE_KEYS.has(key)) return;
       
       const target = e.target as HTMLElement;
@@ -456,7 +455,7 @@ export class AppImManager {
 
       const chat = this.chat;
 
-      if(key === 'C' && (e.ctrlKey || e.metaKey) && target.tagName !== 'INPUT') {
+      if(e.code === 'KeyC' && (e.ctrlKey || e.metaKey) && target.tagName !== 'INPUT') {
         return;
       } else if(e.altKey && (key === 'ArrowUp' || key === 'ArrowDown')) {
         const folder = appMessagesManager.dialogsStorage.getFolderDialogs(rootScope.filterId, true);

src/lib/mediaPlayer.ts

@@ -18,7 +18,6 @@ import rootScope from "./rootScope";
 import findUpClassName from "../helpers/dom/findUpClassName";
 import { GrabEvent } from "../helpers/dom/attachGrabListeners";
 import { attachClickEvent } from "../helpers/dom/clickEvent";
-import getKeyFromEventCaseInsensitive from "../helpers/dom/getKeyFromEventCaseInsensitive";
 
 export class MediaProgressLine extends RangeSelector {
   protected filledLoad: HTMLDivElement;
@@ -387,18 +386,18 @@ export default class VideoPlayer extends EventListenerBase<{
             return;
           }
 
-          const key = getKeyFromEventCaseInsensitive(e);
+          const {key, code} = e;
 
           let good = true;
-          if(key === 'F') {
+          if(code === 'KeyF') {
             this.toggleFullScreen(fullScreenButton);
-          } else if(key === 'M') {
+          } else if(code === 'KeyM') {
             appMediaPlaybackController.muted = !appMediaPlaybackController.muted;
-          } else if(key === ' ') {
+          } else if(code === 'Space') {
             this.togglePlay();
-          } else if(e.altKey && key === '=') {
+          } else if(e.altKey && code === 'Equal') {
             appMediaPlaybackController.playbackRate += .25;
-          } else if(e.altKey && key === '-') {
+          } else if(e.altKey && code === 'Minus') {
             appMediaPlaybackController.playbackRate -= .25;
           } else if(this.wrapper.classList.contains('ckin__fullscreen') && (key === 'ArrowLeft' || key === 'ArrowRight')) {
             if(key === 'ArrowLeft') appMediaPlaybackController.seekBackward({action: 'seekbackward'});

src/pages/pagePassword.ts

@@ -21,7 +21,6 @@ import { attachClickEvent } from '../helpers/dom/clickEvent';
 import htmlToSpan from '../helpers/dom/htmlToSpan';
 import replaceContent from '../helpers/dom/replaceContent';
 import toggleDisability from '../helpers/dom/toggleDisability';
-import getKeyFromEvent from '../helpers/dom/getKeyFromEvent';
 
 const TEST = false;
 let passwordInput: HTMLInputElement;
@@ -126,7 +125,7 @@ let onFirstMount = (): Promise<any> => {
     this.classList.remove('error');
     btnNextI18n.update({key: 'Login.Next'});
 
-    if(getKeyFromEvent(e) === 'Enter') {
+    if(e.key === 'Enter') {
       return onSubmit();
     }
   });

src/pages/pageSignIn.ts

@@ -40,7 +40,6 @@ import stateStorage from "../lib/stateStorage";
 import rootScope from "../lib/rootScope";
 import TelInputField from "../components/telInputField";
 import IS_EMOJI_SUPPORTED from "../environment/emojiSupport";
-import getKeyFromEvent from "../helpers/dom/getKeyFromEvent";
 
 //import _countries from '../countries_pretty.json';
 let btnNext: HTMLButtonElement = null, btnQr: HTMLButtonElement;
@@ -233,7 +232,7 @@ let onFirstMount = () => {
   }, {capture: true}); */
 
   countryInput.addEventListener('keyup', (e) => {
-    const key = getKeyFromEvent(e);
+    const key = e.key;
     if(e.ctrlKey || key === 'Control') return false;
 
     //let i = new RegExp('^' + this.value, 'i');
@@ -304,7 +303,7 @@ let onFirstMount = () => {
 
   telEl.addEventListener('keypress', (e) => {
     //console.log('keypress', this.value);
-    if(!btnNext.style.visibility &&/* this.value.length >= 9 && */ getKeyFromEvent(e) === 'Enter') {
+    if(!btnNext.style.visibility &&/* this.value.length >= 9 && */ e.key === 'Enter') {
       return onSubmit();
     }
   });