feat(interaction-handler): add the ability to skip highlight when bin… (

#1537) * feat(interaction-handler): add the ability to skip highlight when bindToWindow is false * feat(interaction-handler): add skipHighlight to the docs * refactor(interaction-handler): rename skipHighlight to autoFocus that defaults to true Co-authored-by: Matan Sar-Shalom <[email protected]> Co-authored-by: Tomina <[email protected]>
visjs · Aug 29, 2021 · ea66a94 · ea66a94
1 parent 8455e39
commit ea66a94
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 2 deletions.
diff --git a/docs-kr/network/interaction.html b/docs-kr/network/interaction.html
@@ -156,7 +156,8 @@ <h3>옵션</h3>
     keyboard: {
       enabled: false,
       speed: {x: 10, y: 10, zoom: 0.02},
-      bindToWindow: true
+      bindToWindow: true,
+      autoFocus: true,
     },
     multiselect: false,
     navigationButtons: false,

diff --git a/docs/network/interaction.html b/docs/network/interaction.html
@@ -156,7 +156,8 @@ <h3>Options</h3>
     keyboard: {
       enabled: false,
       speed: {x: 10, y: 10, zoom: 0.02},
-      bindToWindow: true
+      bindToWindow: true,
+      autoFocus: true,
     },
     multiselect: false,
     navigationButtons: false,
@@ -317,6 +318,15 @@ <h3>Options</h3>
             keyboard shortcuts only work on the network that has the focus.
           </td>
         </tr>
+        <tr parent="keyboard" class="hidden">
+          <td class="indent">keyboard.autoFocus</td>
+          <td>Boolean</td>
+          <td><code>true</code></td>
+          <td>
+            When <code>keyboard.bindToWindow=false</code> this option allows you
+            to skip auto focusing the network on hover.
+          </td>
+        </tr>
         <tr>
           <td>multiselect</td>
           <td>Boolean</td>

diff --git a/lib/network/modules/InteractionHandler.js b/lib/network/modules/InteractionHandler.js
@@ -55,6 +55,7 @@ class InteractionHandler {
         enabled: false,
         speed: { x: 10, y: 10, zoom: 0.02 },
         bindToWindow: true,
+        autoFocus: true,
       },
       navigationButtons: false,
       tooltipDelay: 300,
@@ -647,6 +648,7 @@ class InteractionHandler {
 
     // if we bind the keyboard to the div, we have to highlight it to use it. This highlights it on mouse over.
     if (
+      this.options.keyboard.autoFocus &&
       this.options.keyboard.bindToWindow === false &&
       this.options.keyboard.enabled === true
     ) {

diff --git a/lib/network/options.ts b/lib/network/options.ts
@@ -420,6 +420,7 @@ const allOptions: OptionsConfig = {
         __type__: { object },
       },
       bindToWindow: { boolean: bool },
+      autoFocus: { boolean: bool },
       __type__: { object, boolean: bool },
     },
     multiselect: { boolean: bool },
@@ -759,6 +760,7 @@ const configureOptions: ConfiguratorConfig = {
         zoom: [0.02, 0, 0.1, 0.005],
       },
       bindToWindow: true,
+      autoFocus: true,
     },
     multiselect: false,
     navigationButtons: false,