add NodeBook NodeView click for ordering

src/components/globals/ButtonClose.vue

@@ -36,6 +36,7 @@ export default {
   svg {
     width: 100%;
     height: 100%;
+    pointer-events: none;
   }
 
   path {

src/components/layouts/NodeBook.vue

@@ -8,7 +8,7 @@
     >
       <div
         v-for="({ parent, children }, i) in nodes" :key="parent.id"
-        class="node-book-stack-item node-book-stack-item-parent splitted"
+        class="node-book-stack-item node-book-stack-item-parent splitted no-events-container"
         :class="{ active: i === nodes.length - 1 }"
         :style="`--nth: ${i}`"
       >
@@ -25,6 +25,7 @@
           @open-node="$emit('open-node', $event)"
           @open-child="$emit('open-node', { parentId: parent.id, ...$event })"
           @close-node="$emit('close-node', { parentId: $event })"
+          @click.native="onNodeViewClick($event, i)"
         />
 
         <section
@@ -44,6 +45,7 @@
               type="prod"
               @open-node="$emit('open-node', $event)"
               @close-node="$emit('close-node', { parentId: parent.id, childId: $event })"
+              @click.native="onNodeViewClick($event, i, j)"
             />
           </div>
         </section>
@@ -77,6 +79,20 @@ export default {
   methods: {
     getChildrenStackHeight (childrenLen) {
       return this.stackHeight / childrenLen || this.stackHeight
+    },
+
+    onNodeViewClick (e, parentIndex, childIndex) {
+      if (e.target.classList.contains('btn')) return
+      const parentIsLast = parentIndex === this.nodes.length - 1
+      const childIsLast = childIndex !== undefined
+        ? childIndex === this.nodes[parentIndex].children.length - 1
+        : true
+      if (parentIsLast && childIsLast) return
+      const ids = { parentId: this.nodes[parentIndex].parent.id }
+      if (childIndex !== undefined) {
+        ids.childId = this.nodes[parentIndex].children[childIndex].id
+      }
+      this.$emit('select-node', ids)
     }
   }
 }

src/pages/Library.vue

@@ -10,6 +10,7 @@
       class="library-node-book no-events-container"
       @open-node="openNode"
       @close-node="closeNode"
+      @select-node="openNode"
     />
   </div>
 </template>
@@ -50,30 +51,6 @@ export default {
   },
 
   methods: {
-    onMainTextClick (mainTextIndex) {
-      if (mainTextIndex === this.texts.length - 1) return
-      this.parents.push(this.parents.splice(mainTextIndex, 1)[0])
-      this.updateQuery(this.parents)
-    },
-
-    onSubTextClick (mainTextIndex, subTextIndex) {
-      // FIXME clean this
-      const children = this.parents[mainTextIndex].children
-      let needUpdate = false
-      if (subTextIndex !== children.length - 1) {
-        children.push(children.splice(subTextIndex, 1)[0])
-        needUpdate = true
-      }
-      if (mainTextIndex !== this.texts.length - 1) {
-        this.parents.push(this.parents.splice(mainTextIndex, 1)[0])
-        needUpdate = true
-      }
-
-      if (needUpdate) {
-        this.updateQuery(this.parents)
-      }
-    },
-
     openNode (ids) {
       this.$store.dispatch('OPEN_NODE', ids)
     },

src/store/modules/library.js

@@ -41,8 +41,17 @@ export default {
       if (stack === undefined) {
         stack = childId === undefined ? [parentId] : [parentId, childId]
         state.nodebook.push(stack)
-      } else {
-        stack.push(childId)
+        return
+      }
+      if (stack !== undefined && parentId !== undefined) {
+        state.nodebook.push(state.nodebook.splice(state.nodebook.indexOf(stack), 1)[0])
+      }
+      if (childId) {
+        if (stack.includes(childId)) {
+          stack.push(stack.splice(stack.indexOf(childId), 1)[0])
+        } else {
+          stack.push(childId)
+        }
       }
     },
 
@@ -135,7 +144,6 @@ export default {
 
     async 'OPEN_NODE' ({ state, commit, dispatch }, { parentId, childId }) {
       const stack = state.nodebook.find(stack => stack[0] === parentId)
-      if (stack && (childId === undefined || stack.includes(childId))) return
       commit('ADD_NODEBOOK_NODE', [stack, parentId, childId])
       dispatch('UPDATE_QUERY_NODES')
     },