open text on map node click & uniformized openText and closeText methods

src/components/NodeMap.vue

@@ -18,6 +18,9 @@
           :cy="node.y"
           :class="node.data.class + (node.data.first ? ' first' : '')"
           :r="node.children ? 7 : 5"
+          tabindex="0"
+          @click="onNodeClick(node.data)"
+          @keyup.enter="onNodeClick(node.data)"
         >
           <title>{{ node.data.title }}</title>
         </circle>
@@ -107,7 +110,7 @@ export default {
         .force('center', forceCenter(this.width * 0.5, this.height * 0.5))
     },
 
-    // DRAG EVENT HANDLER
+    // D3 DRAG EVENT HANDLERS
 
     onNodeDragStart (e, node) {
       if (!e.active) {
@@ -128,6 +131,17 @@ export default {
       }
       node.fx = null
       node.fy = null
+    },
+
+    // BASIC HANDLERS
+
+    onNodeClick (nodeData) {
+      const { id, parents } = nodeData
+      if (parents) {
+        this.$emit('open', parents[0].id, id)
+      } else {
+        this.$emit('open', id)
+      }
     }
   },
 

src/components/text/TextCard.vue

@@ -17,12 +17,12 @@
           <b-nav class="ml-auto flex-nowrap">
             <b-nav-item
               v-for="child in text.children" :key="child.id"
-              @click="$emit('open', child.id)"
+              @click="$emit('open', id, child.id)"
             >
               {{ child.id }}
             </b-nav-item>
 
-            <b-nav-item @click="$emit('close')">
+            <b-nav-item @click="$emit('close', id)">
               x
             </b-nav-item>
           </b-nav>