Переход на Vue 3, в процессе

client/components/App.vue

@@ -85,36 +85,42 @@ class App {
         //sanitize
         this.$root.sanitize = sanitizeHtml;
 
-        //global keyHooks
+        //global event hooks
-        this.keyHooks = [];
+        this.eventHooks = {};
-        this.keyHook = (event) => {
+        this.eventHook = (hookName, event) => {
-            for (const hook of this.keyHooks)
+            if (!this.eventHooks[hookName])
+                return;
+            for (const hook of this.eventHooks[hookName])
                 hook(event);
         }
 
-        this.$root.addKeyHook = (hook) => {
+        this.$root.addEventHook = (hookName, hook) => {
-            if (this.keyHooks.indexOf(hook) < 0)
+            if (!this.eventHooks[hookName])
-                this.keyHooks.push(hook);
+                this.eventHooks[hookName] = [];
+            if (this.eventHooks[hookName].indexOf(hook) < 0)
+                this.eventHooks[hookName].push(hook);
         }
 
-        this.$root.removeKeyHook = (hook) => {
+        this.$root.removeEventHook = (hookName, hook) => {
-            const i = this.keyHooks.indexOf(hook);
+            if (!this.eventHooks[hookName])
+                return;
+            const i = this.eventHooks[hookName].indexOf(hook);
             if (i >= 0)
-                this.keyHooks.splice(i, 1);
+                this.eventHooks[hookName].splice(i, 1);
         }
 
         document.addEventListener('keyup', (event) => {
-            this.keyHook(event);
+            this.eventHook('key', event);
         });
         document.addEventListener('keypress', (event) => {
-            this.keyHook(event);
+            this.eventHook('key', event);
         });
         document.addEventListener('keydown', (event) => {
-            this.keyHook(event);
+            this.eventHook('key', event);
         });
 
-        window.addEventListener('resize', () => {
+        window.addEventListener('resize', (event) => {
-            this.$root.$emit('resize');
+            this.eventHook('resize', event);
         });
     }
 

client/components/ExternalLibs/BookmarkSettings/BookmarkSettings.vue

@@ -62,9 +62,9 @@
                         :nodes="nodes"
                         node-key="key"
                         tick-strategy="leaf"
-                        :selected.sync="selected"
+                        v-model:selected="selected"
-                        :ticked.sync="ticked"
+                        v-model:ticked="ticked"
-                        :expanded.sync="expanded"
+                        v-model:expanded="expanded"
                         selected-color="black"
                         :filter="search"
                         no-nodes-label="Закладок пока нет"

client/components/ExternalLibs/ExternalLibs.vue

@@ -270,9 +270,9 @@ class ExternalLibs {
     created() {
         this.oldStartLink = '';
         this.justOpened = true;
-        this.$root.addKeyHook(this.keyHook);
+        this.$root.addEventHook('key', this.keyHook);
 
-        this.$root.$on('resize', async() => {
+        this.$root.addEventHook('resize', async() => {
             await utils.sleep(200);
             this.frameResize();
         });

client/components/Reader/Reader.vue

@@ -279,7 +279,7 @@ class Reader {
         this.reader = this.$store.state.reader;
         this.config = this.$store.state.config;
 
-        this.$root.addKeyHook(this.keyHook);
+        this.$root.addEventHook('key', this.keyHook);
 
         this.lastActivePage = false;
 

client/components/Reader/RecentBooksPage/RecentBooksPage.vue

@@ -14,7 +14,7 @@
             :data="tableData"
             :columns="columns"
             row-key="key"
-            :pagination.sync="pagination"
+            v-model:pagination="pagination"
             separator="cell"
             hide-bottom
             virtual-scroll

client/components/Reader/TextPage/TextPage.vue

@@ -149,7 +149,7 @@ class TextPage {
             await this.doPageAnimation();
         }, 10);
 
-        this.$root.$on('resize', async() => {
+        this.$root.addEventHook('resize', async() => {
             this.$nextTick(this.onResize);
             await utils.sleep(500);
             this.$nextTick(this.onResize);

client/components/share/StdDialog.vue

@@ -148,8 +148,8 @@ class StdDialog {
     hotKeyCode = '';
 
     created() {
-        if (this.$root.addKeyHook) {
+        if (this.$root.addEventHook) {
-            this.$root.addKeyHook(this.keyHook);
+            this.$root.addEventHook('key', this.keyHook);
         }
     }