fix ui cornercase and format code

Author: sgratzl

src/plugin/hierarchical.js

@@ -1,7 +1,21 @@
 'use strict';
 
-import {helpers, defaults, pluginService} from 'chart.js';
-import {toNodes, countExpanded, resolve, parentsOf, preOrderTraversal, lastOfLevel, spanLogic, determineVisible} from '../utils';
+import {
+  helpers,
+  defaults,
+  pluginService
+} from 'chart.js';
+import {
+  toNodes,
+  countExpanded,
+  resolve,
+  parentsOf,
+  preOrderTraversal,
+  lastOfLevel,
+  spanLogic,
+  determineVisible,
+  flatChildren
+} from '../utils';
 
 
 function parseFontOptions(options) {
@@ -176,7 +190,15 @@ const HierarchicalPlugin = {
       if (!r) {
         return false;
       }
-      const {hasFocusBox, hasCollapseBox, leftVisible, rightVisible, leftFirstVisible, rightLastVisible, groupLabelCenter} = r;
+      const {
+        hasFocusBox,
+        hasCollapseBox,
+        leftVisible,
+        rightVisible,
+        leftFirstVisible,
+        rightLastVisible,
+        groupLabelCenter
+      } = r;
 
       // render group label
       if (renderLabel === 'below') {
@@ -248,7 +270,15 @@ const HierarchicalPlugin = {
       if (!r) {
         return false;
       }
-      const {hasFocusBox, hasCollapseBox, leftVisible, rightVisible, leftFirstVisible, rightLastVisible, groupLabelCenter} = r;
+      const {
+        hasFocusBox,
+        hasCollapseBox,
+        leftVisible,
+        rightVisible,
+        leftFirstVisible,
+        rightLastVisible,
+        groupLabelCenter
+      } = r;
 
       // render group label
       ctx.fillText(node.label, offset - boxSize, groupLabelCenter);
@@ -415,11 +445,16 @@ const HierarchicalPlugin = {
       return null;
     }
 
-    const elem = chart.getElementsAtEventForMode(event, 'index', {axis: hor ? 'x' : 'y'})[0];
+    const elem = chart.getElementsAtEventForMode(event, 'index', {
+      axis: hor ? 'x' : 'y'
+    })[0];
     if (!elem) {
       return null;
     }
-    return {offset, index: elem._index};
+    return {
+      offset,
+      index: elem._index
+    };
   },
 
   beforeEvent(chart, event) {
@@ -466,7 +501,7 @@ const HierarchicalPlugin = {
         return;
       }
       // last index of expanded parent
-      if (isLastChildOfParent && parent.expand === true) {
+      if (isLastChildOfParent && parent.expand === true && flatChildren(parent, flat).every((d) => d.expand !== 'focus')) {
         this._zoomIn(chart, index, parent, flat);
         return;
       }

src/utils.js

@@ -1,4 +1,3 @@
-
 /**
  * builds up recursivly the label tree
  * @param {string|ILabelNode} label
@@ -15,7 +14,9 @@ export function asNode(label, parent) {
     width: 0,
     hidden: false,
     major: !parent // for ticks
-  }, typeof label === 'string' ? {label} : label);
+  }, typeof label === 'string' ? {
+    label
+  } : label);
 
   node.children = node.children.map((d) => asNode(d, node));
 
@@ -119,7 +120,9 @@ export function preOrderTraversal(node, visit) {
 export function resolve(label, flat, dataTree) {
   const parents = parentsOf(label, flat);
 
-  let dataItem = {children: dataTree};
+  let dataItem = {
+    children: dataTree
+  };
   const dataParents = parents.map((p) => {
     dataItem = dataItem && !(typeof dataItem === 'number' && isNaN(dataItem)) && dataItem.children ? dataItem.children[p.relIndex] : NaN;
     return dataItem;
@@ -155,8 +158,8 @@ export function flatChildren(node, flat) {
     const nextSibling = flat[node.parent].children[node.relIndex + 1];
     return flat.slice(firstChild.index, nextSibling.index);
   }
-  // find sibling
-  const nextSibling = flat.slice(firstChild.index + 1).find((d) => d.parent === node.parent && d.relIndex === node.relIndex + 1);
+  // find sibling or next in the hierarchy up
+  const nextSibling = flat.slice(firstChild.index + 1).find((d) => d.level < node.level || (d.parent === node.parent && d.relIndex === node.relIndex + 1));
   if (nextSibling) {
     return flat.slice(firstChild.index, nextSibling.index);
   }
@@ -208,5 +211,13 @@ export function spanLogic(node, flat, visibles) {
   const nextVisible = flat.slice(leftVisible.index + 1, rightVisible.index + 1).find((d) => visibles.has(d));
   const groupLabelCenter = !nextVisible ? leftVisible.center : (leftVisible.center + nextVisible.center) / 2;
 
-  return {hasCollapseBox, hasFocusBox, leftVisible, rightVisible, groupLabelCenter, leftFirstVisible, rightLastVisible};
+  return {
+    hasCollapseBox,
+    hasFocusBox,
+    leftVisible,
+    rightVisible,
+    groupLabelCenter,
+    leftFirstVisible,
+    rightLastVisible
+  };
 }

tests/utils.test.js

@@ -153,6 +153,14 @@ describe('flatChildren', () => {
     const children = flatChildren(a, flat);
     expect(children).toEqual(flat.slice(1, 1 + 4));
   });
+
+  test('ab nested', () => {
+    const {flat, root} = setupNodes([{ label: 'a', children: ['aa', { label: 'ab', children: ['aba', 'abb']}] }, 'b', 'c']);
+
+    const ab = root[0].children[1];
+    const children = flatChildren(ab, flat);
+    expect(children).toEqual(ab.children);
+  });
 });
 
 describe('countExpanded', () => {