const fields = [
  { fieldName: 'icon', dataType: 'number' },
  { fieldName: 'col0', dataType: 'text' },
  { fieldName: 'col1', dataType: 'number' },
  { fieldName: 'col2', dataType: 'number' },
  { fieldName: 'col3', dataType: 'number' },
  { fieldName: 'col4', dataType: 'number' },
  { fieldName: 'col5', dataType: 'number' },
  { fieldName: 'col6', dataType: 'number' },
  { fieldName: 'col7', dataType: 'number' }
];

const columns = [
  { name: 'col0', fieldName: 'col0', type: 'data', width: '150', header: { text: 'Type' } },
  { name: 'col1', fieldName: 'col1', type: 'data', width: '80', numberFormat: '#,##0', header: { text: 'Agriculture/Forestry/Fishery' } },
  { name: 'col2', fieldName: 'col2', type: 'data', width: '75', numberFormat: '#,##0', header: { text: 'Mining' } },
  { name: 'col3', fieldName: 'col3', type: 'data', width: '75', numberFormat: '#,##0', header: { text: 'Manufacturing' } },
  { name: 'col4', fieldName: 'col4', type: 'data', width: '80', numberFormat: '#,##0', header: { text: 'Construction' } },
  { name: 'col5', fieldName: 'col5', type: 'data', width: '130', numberFormat: '#,##0', header: { text: 'Wholesale/Retail, Consumer Goods' } },
  { name: 'col6', fieldName: 'col6', type: 'data', width: '90', numberFormat: '#,##0', header: { text: 'Food/Lodging' } },
  { name: 'col7', fieldName: 'col7', type: 'data', width: '120', numberFormat: '#,##0', header: { text: 'Transport, Warehousing, Telecom' } }
];

function checkNode(grid, dataRow, checked) {
  var provider = grid.getDataSource();

  checkSiblingNode(grid, dataRow, checked);

  var desRows = provider.getDescendants(dataRow);
  if (desRows) {
    grid.checkRows(desRows, checked, false);
  }
}

function checkSiblingNode(grid, dataRow, checked) {
  var provider = grid.getDataSource();
  var parent = provider.getParent(dataRow);
  var sibling = parent == -1 ? provider.getChildren() : provider.getChildren(parent);

  var index = sibling.indexOf(dataRow);
  if (index !== -1) sibling.splice(index, 1);

  if (checked) {
    for (var i in sibling) {
      var value = grid.isCheckedRow(sibling[i]);
      if (checked != value) {
        checked = false;
        break;
      }
    }
  } else {
    checked = false;
  }

  if (parent > -1) grid.checkRow(parent, checked, false, false);
  if (parent == -1) grid.setAllCheck(checked, false);
  if (parent > -1) checkSiblingNode(grid, parent, checked);
}

const { treeView, dataProvider } = RealGrid.createTree('realgrid', {
  columns,
  header: {
    height: 40
  },
  display: {
    rowHeight: 36,
    emptyMessage: 'No data to display.'
  },
  footer: {
    height: 40
  },
  stateBar: {
    width: 16
  },
  treeOptions: {
    iconImagesRoot: '/images/flags/',
    iconImages: [
      'male.png', 'female.png', 'grd_tree_close.png', 'grd_tree_open.png',
      'br.png', 'de.png', 'es.png', 'fr.png', 'gb.png', 'gr.png',
      'hu.png', 'is.png', 'kr.png', 'mx.png', 'pt.png', 'us.png',
      've.png', 'br.png', 'de.png', 'es.png', 'fr.png', 'gr.png'
    ]
  },
  onItemChecked: function (grid, itemIndex, checked) {
    var dataRow = grid.getDataRow(itemIndex);
    checkNode(grid, dataRow, checked);
  },
  onInitialized: (tree) => {
    fetch('/data/en/treedata.json')
      .then(response => response.json())
      .then(data => {
        tree.getDataSource().setObjectRows(data, 'rows', '', 'icon');
        setTimeout(function() {
          tree.expandAll(-1, true, true);
        }, 100);
      });
  }
}, {
  fields
});

window.treeView = treeView;
window.dataProvider = dataProvider;