diff --git a/client/components/App.vue b/client/components/App.vue
index 1c89a8e0..32ecbb18 100644
--- a/client/components/App.vue
+++ b/client/components/App.vue
@@ -87,7 +87,7 @@ class App {
 
         //global event hooks
         this.eventHooks = {};
-        this.eventHook = (hookName, event) => {
+        this.$root.eventHook = (hookName, event) => {
             if (!this.eventHooks[hookName])
                 return;
             for (const hook of this.eventHooks[hookName])
@@ -110,17 +110,17 @@ class App {
         }
 
         document.addEventListener('keyup', (event) => {
-            this.eventHook('key', event);
+            this.$root.eventHook('key', event);
         });
         document.addEventListener('keypress', (event) => {
-            this.eventHook('key', event);
+            this.$root.eventHook('key', event);
         });
         document.addEventListener('keydown', (event) => {
-            this.eventHook('key', event);
+            this.$root.eventHook('key', event);
         });
 
         window.addEventListener('resize', (event) => {
-            this.eventHook('resize', event);
+            this.$root.eventHook('resize', event);
         });
     }
 
@@ -157,7 +157,7 @@ class App {
 
     toggleCollapse() {
         this.commit('uistate/setAsideBarCollapse', !this.uistate.asideBarCollapse);
-        this.$root.$emit('resize');
+        this.$root.eventHook('resize');
     }
 
     get isCollapse() {
diff --git a/client/components/Reader/Reader.vue b/client/components/Reader/Reader.vue
index 6aeff2b6..1774149f 100644
--- a/client/components/Reader/Reader.vue
+++ b/client/components/Reader/Reader.vue
@@ -107,7 +107,10 @@
 
         <div class="main col row relative-position">
             <keep-alive>
-                <component :is="activePage" ref="page" class="col"
+                <component 
+                    :is="activePage"
+                    ref="page"
+                    class="col"
                     @load-book="loadBook"
                     @load-file="loadFile"
                     @book-pos-changed="bookPosChanged"
@@ -116,7 +119,9 @@
             </keep-alive>
 
             <SetPositionPage v-if="setPositionActive" ref="setPositionPage" @set-position-toggle="setPositionToggle" @book-pos-changed="bookPosChanged"></SetPositionPage>
-            <SearchPage v-show="searchActive" ref="searchPage" 
+            <SearchPage 
+                v-show="searchActive"
+                ref="searchPage" 
                 @do-action="doAction"
                 @book-pos-changed="bookPosChanged"
                 @start-text-search="startTextSearch"
@@ -602,7 +607,7 @@ class Reader {
 
     toolBarToggle() {
         this.commit('reader/setToolBarActive', !this.toolBarActive);
-        this.$root.$emit('resize');
+        this.$root.eventHook('resize');
     }
 
     fullScreenToggle() {