From 1eafec6602f6d4a0e7a13bd17252645212dad9d9 Mon Sep 17 00:00:00 2001
From: Daniel Baetz <baetz.daniel@gmail.com>
Date: Sun, 9 Feb 2020 16:15:57 +0100
Subject: [PATCH] changed exUi.js to ts

---
 src/exUi/exUi.js    | 46 -----------------------------------
 src/exUi/exUi.ts    | 59 +++++++++++++++++++++++++++++++++++++++++++++
 src/shims/exui.d.ts |  7 ++++++
 tsconfig.json       |  2 +-
 4 files changed, 67 insertions(+), 47 deletions(-)
 delete mode 100644 src/exUi/exUi.js
 create mode 100644 src/exUi/exUi.ts

diff --git a/src/exUi/exUi.js b/src/exUi/exUi.js
deleted file mode 100644
index 720ff93..0000000
--- a/src/exUi/exUi.js
+++ /dev/null
@@ -1,46 +0,0 @@
-import { InputFlags } from '@/exUi/InputFlags';
-import Vue from 'vue';
-
-Vue.directive('ui-focusable', {
-    bind(el, binding) {
-        const modifiers = Object.keys(binding.modifiers);
-        let flags = InputFlags.ALL;
-        if (!binding.value && modifiers.length !== 0) {
-            flags = 0;
-            for (const key of modifiers) {
-                flags |= InputFlags[key];
-            }
-        } else {
-            for (const key of modifiers) {
-                flags &= ~InputFlags[key];
-            }
-        }
-        el._exUiFocusIn = async () => window.exUiInput.removeFlag(flags);
-        el.addEventListener('focusin', el._exUiFocusIn);
-
-        if (!binding.arg) {
-            el._exUiFocusOut = async () => window.exUiInput.setFlag(flags);
-        } else {
-            el._exUiFocusOut = () => el.focus();
-            el._exUikeyUp = async e => {
-                if (binding.arg === e.key) {
-                    el.removeEventListener('focusout', el._exUiFocusOut);
-                    el.blur();
-                    await window.exUiInput.setFlag(flags);
-                }
-            };
-            el.addEventListener('keyup', el._exUikeyUp);
-        }
-        el.addEventListener('focusout', el._exUiFocusOut);
-    },
-    unbind(el, binding) {
-        el.removeEventListener('focusin', el._exUiFocusIn);
-        el._exUiFocusIn = null;
-        if (binding.arg) {
-            el.removeEventListener('keyup', el._exUikeyUp);
-            el._exUikeyUp = null;
-        }
-        el.removeEventListener('focusout', el._exUiFocusOut);
-        el._exUiFocusOut = null;
-    },
-});
diff --git a/src/exUi/exUi.ts b/src/exUi/exUi.ts
new file mode 100644
index 0000000..b0a7e08
--- /dev/null
+++ b/src/exUi/exUi.ts
@@ -0,0 +1,59 @@
+import { InputFlags } from '@/exUi/InputFlags';
+import Vue from 'vue';
+
+Vue.directive('ui-focusable', {
+    bind: (el, binding) => {
+        const modifiers = Object.keys(binding.modifiers);
+        let flags = InputFlags.ALL;
+        if (!binding.value && modifiers.length !== 0) {
+            flags = 0;
+            for (const key of modifiers) {
+                flags |= InputFlags[key as keyof typeof InputFlags];
+            }
+        } else {
+            for (const key of modifiers) {
+                flags &= ~InputFlags[key as keyof typeof InputFlags];
+            }
+        }
+        el._exUiFocusIn = async () => {
+            el._hasFocus = true;
+            window.exUiInput.removeFlag(flags);
+        };
+        el.addEventListener('focusin', el._exUiFocusIn);
+
+        if (!binding.arg) {
+            el._exUiFocusOut = async () => window.exUiInput.setFlag(flags);
+        } else {
+            el._exUiFocusOut = () => {
+                if (el._hasFocus) {
+                    el.focus();
+                }
+            };
+            el._exUikeyUp = async (e: KeyboardEvent) => {
+                if (binding.arg === e.key) {
+                    el._hasFocus = false;
+                    el.blur();
+                    await window.exUiInput.setFlag(flags);
+                }
+            };
+            el.addEventListener('keyup', el._exUikeyUp);
+        }
+        el.addEventListener('focusout', el._exUiFocusOut);
+    },
+    unbind: (el, binding) => {
+        if (el._exUiFocusIn != null) {
+            el.removeEventListener('focusin', el._exUiFocusIn);
+            el._exUiFocusIn = null;
+        }
+        if (binding.arg) {
+            if (el._exUikeyUp != null) {
+                el.removeEventListener('keyup', el._exUikeyUp);
+                el._exUikeyUp = null;
+            }
+        }
+        if (el._exUiFocusOut != null) {
+            el.removeEventListener('focusout', el._exUiFocusOut);
+            el._exUiFocusOut = null;
+        }
+    },
+});
diff --git a/src/shims/exui.d.ts b/src/shims/exui.d.ts
index f4b4c05..b513fc4 100644
--- a/src/shims/exui.d.ts
+++ b/src/shims/exui.d.ts
@@ -1,6 +1,13 @@
 import { InputFlags } from '@/exUi/InputFlags';
 
 declare global {
+    // tslint:disable-next-line
+    interface HTMLElement {
+        _exUiFocusIn: (() => Promise<void>) | null;
+        _exUiFocusOut: (() => Promise<void>) | (() => void) | null;
+        _exUikeyUp: ((event: KeyboardEvent) => Promise<void>) | null;
+        _hasFocus: boolean;
+    }
     // tslint:disable-next-line
     interface Window {
         cefSharp: {
diff --git a/tsconfig.json b/tsconfig.json
index d9358ae..1d2b44d 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -37,6 +37,6 @@
         },
         "lib": ["esnext", "dom", "dom.iterable", "scripthost"]
     },
-    "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue", "tests/**/*.ts", "tests/**/*.tsx", "src/exUi/exUi.js"],
+    "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue", "tests/**/*.ts", "tests/**/*.tsx", "src/exUi/exUi.ts"],
     "exclude": ["node_modules"]
 }