fix several issues with book navigation

src/plugins/bookPlayer/plugin.js

@@ -193,8 +193,7 @@ export class BookPlayer {
         this.rendition?.on('keydown', this.onWindowKeyDown);
 
         if (browser.safari) {
-            const player = document.querySelector('.bookOsd');
-            this.addSwipeGestures(player);
+            this.addSwipeGestures(document.querySelector('#bookPlayerContainer'));
         } else {
             this.rendition?.on('rendered', (e, i) => this.addSwipeGestures(i.document.documentElement));
         }

src/plugins/pdfPlayer/plugin.js

@@ -142,13 +142,13 @@ export class PdfPlayer {
     bindEvents() {
         this.mediaElement?.addEventListener('close', this.onDialogClosed, { once: true });
         document.addEventListener('keydown', this.onWindowKeyDown);
-        document.addEventListener('touchstart', this.onTouchStart);
+        document.querySelector('#container')?.addEventListener('touchstart', this.onTouchStart);
     }
 
     unbindEvents() {
         this.mediaElement?.removeEventListener('close', this.onDialogClosed);
         document.removeEventListener('keydown', this.onWindowKeyDown);
-        document.removeEventListener('touchstart', this.onTouchStart);
+        document.querySelector('#container')?.removeEventListener('touchstart', this.onTouchStart);
     }
 
     createMediaElement(options) {
@@ -169,7 +169,7 @@ export class PdfPlayer {
             });
 
             elem.id = 'pdfPlayer';
-            elem.innerHTML = '<div id="bookOsdMount"></div><canvas id="canvas"></canvas>';
+            elem.innerHTML = '<div id="bookOsdMount"></div><div id="container"><canvas id="canvas"></canvas></div>';
 
             dialogHelper.open(elem);
         }

src/plugins/pdfPlayer/style.scss

@@ -1,3 +1,11 @@
+#container {
+    position: relative;
+    display: grid;
+    place-items: center;
+    top: 5vh;
+    height: 90vh;
+}
+
 #pdfPlayer {
     position: relative;
     height: 100%;
@@ -8,7 +16,6 @@
 
     #canvas {
         position: relative;
-        top: 5vh;
         display: block;
         margin: auto;
     }