optional visibility chack

Author: Sebi Nemeth

dist/index.d.ts

@@ -10,6 +10,7 @@ type LiveTranslatorPluginOptions = {
     persist?: boolean;
     root?: HTMLElement;
     refreshRate?: number;
+    checkVisibility?: boolean;
 };
 export declare function encodeMessages(messagesObject: any): any;
 export declare const LiveTranslatorPlugin: {

dist/index.js

@@ -259,18 +259,18 @@ class LiveTranslatorManager {
             if (badges.length) {
                 let position = { top: 0, left: 0 };
                 try {
-                    let isVisible;
+                    let isVisible = !this._options.checkVisibility;
                     if (node instanceof Text) {
                         const clientRect = getBoundingClientRect(node);
                         position.top = clientRect.top + window.scrollY;
                         position.left = clientRect.left + window.screenX;
-                        isVisible = node.parentElement.contains(document.elementFromPoint(clientRect.left + clientRect.width / 2, clientRect.top + clientRect.height / 2));
+                        isVisible = isVisible || node.parentElement.contains(document.elementFromPoint(clientRect.left + clientRect.width / 2, clientRect.top + clientRect.height / 2));
                     }
                     else {
                         const clientRect = node.getClientRects()[0];
                         position.top = clientRect.top + clientRect.height - 10 + window.scrollY;
                         position.left = clientRect.left + window.screenX;
-                        isVisible = node.contains(document.elementFromPoint(clientRect.left + clientRect.width / 2, clientRect.top + clientRect.height / 2));
+                        isVisible = isVisible || node.contains(document.elementFromPoint(clientRect.left + clientRect.width / 2, clientRect.top + clientRect.height / 2));
                     }
                     if (!isVisible) {
                         continue;

src/demo/main.ts

@@ -14,6 +14,7 @@ app.use(LiveTranslatorPlugin, {
   persist: true,
   root: document.getElementById('app'),
   refreshRate: 50,
+  checkVisibility: true,
 })
 
 app.mount('#app')

src/index.ts

@@ -84,7 +84,8 @@ type LiveTranslatorPluginOptions = {
   translationLink: (meta: TranslationMeta) => string
   persist?: boolean
   root?: HTMLElement
-  refreshRate?: number
+  refreshRate?: number,
+  checkVisibility?: boolean,
 }
 
 function deepForIn(object: Object, fn: (value: string, key: string) => void) {
@@ -305,19 +306,19 @@ class LiveTranslatorManager {
       if (badges.length) {
         let position = { top: 0, left: 0}
         try {
-          let isVisible
+          let isVisible = !this._options.checkVisibility
           if (node instanceof Text) {
             const clientRect = getBoundingClientRect(node)
             position.top = clientRect.top + window.scrollY
             position.left = clientRect.left + window.screenX
-            isVisible = node.parentElement.contains(
+            isVisible = isVisible || node.parentElement.contains(
               document.elementFromPoint(clientRect.left + clientRect.width/2, clientRect.top + clientRect.height/2)
             )
           } else {
             const clientRect = node.getClientRects()[0]
             position.top = clientRect.top + clientRect.height - 10 + window.scrollY
             position.left = clientRect.left + window.screenX
-            isVisible = node.contains(
+            isVisible = isVisible || node.contains(
               document.elementFromPoint(clientRect.left + clientRect.width/2, clientRect.top + clientRect.height/2)
             )
           }