causeway-standard-theme/causeway/js/components/tree-view.js

(function(window, $){
  'use strict';

//  Tree View Component
  window.Causeway.treeView = {};
  window.Causeway.treeView.elements = $('.tree-view');
  window.Causeway.treeView.childActiveNodes = function (el) {
//    if (el.find('li.active').length !== 0) {
    return $('ul:has(li.active)', el);
//    } else {
//      return $('ul > li ul', el).first();
//    }
  };
  window.Causeway.treeView.parentNodes = function (el) {
    return $('li:has(ul)', el);
  };
  window.Causeway.treeView.parentNodesCollapsed = function (el) {
    return $('li:has( > ul:hidden)', el);
  };
  window.Causeway.treeView.extendedClick = function (el) {
    return el.attr('data-extend-click') ? el.data('extend-click') : false;
  };
  window.Causeway.treeView.clickIcons = '';
  window.Causeway.treeView.build = function (el) {

    window.Causeway.treeView.childActiveNodes(el).show();
    // Set Collapsed Parent Lis

    // Prepend span icons
    window.Causeway.treeView.parentNodes(el).addClass('parent_li').prepend('<span class="glyphicon glyphicon-tree-minus"></span>');
    window.Causeway.treeView.parentNodesCollapsed(el).find('.glyphicon-tree-minus').addClass('glyphicon-tree-plus').removeClass('glyphicon-tree-minus');

    // Set Click Icons
    window.Causeway.treeView.clickIcons = window.Causeway.treeView.clickIcons ? window.Causeway.treeView.clickIcons.add($('li.parent_li > span', el)) : $('li.parent_li > span', el);


  };

  window.Causeway.treeView.init = function () {
    if (window.Causeway.treeView.elements.length > 0) {

      // Build the tree
      window.Causeway.treeView.elements.each(function () {
        var $this = $(this);
        window.Causeway.treeView.build($this);

        if (window.Causeway.treeView.extendedClick($this)) {

          $this.find('li.parent_li > a').each(function () {
            $(this).on('click', function (e) {
              e.preventDefault();
              $(this).prev('span.glyphicon:first-child').trigger('click');
            });
          });

        }
      });

      // Add Handlers
      window.Causeway.treeView.clickIcons.on('click', function (e) {
        var $this = $(this);

        var children = $this.parent('li.parent_li').find(' > ul > li');

        // check active class
        var activeLeaf = !!$this.parent().find('.active:visible').length,
          activeNode = !!$this.parent().find('.active-node').length;

        if (activeLeaf || activeNode) {
          $this.addClass('active-node');

          if ($this.hasClass('glyphicon-tree-plus')) {
            $this.removeClass('active-node');
          }
        }

        // Click handlers
        if (children.is(':visible')) {
          children.hide('fast');
          $this.addClass('glyphicon-tree-plus').removeClass('glyphicon-tree-minus');
        } else {
          children.parent().show('fast');
          children.show('fast');
          $this.addClass('glyphicon-tree-minus').removeClass('glyphicon-tree-plus');
        }

        e.stopPropagation();

      });
    }
  };
  window.Causeway.treeView.init();

// Tree Grid
  var treeGrid = $('.tree-grid');
  if (treeGrid.length > 0) {
    treeGrid.treegrid({
      treeColumn: 1,
      expanderTemplate: '<span class="treegrid-expander glyphicon"></span><span class="vertical-dots"></span>',
      expanderExpandedClass: 'glyphicon-tree-minus',
      expanderCollapsedClass: 'glyphicon-tree-plus'
    });
    treeGrid.treegrid('getAllNodes').each(function () {
      if ($(this).treegrid('isFirst')) {
        $(this).addClass('first');
      }
      if ($(this).treegrid('isLast')) {
        $(this).addClass('last');
      }
      if ($(this).treegrid('isLeaf')) {
        $(this).addClass('leaf');
      } else {
        $(this).addClass('parent');
      }
    });

    var lastParent = $('.last.parent');

    lastParent.each(function () {
      var $that = $(this),
        treeIndentLength = $that.find('.treegrid-indent').length,
        index = treeIndentLength;
      $that.nextAll('tr').each(function () {
        var $this = $(this),
          treeIndent = $this.find('.treegrid-indent');
        $(treeIndent[index]).addClass('remove-dots');
      });
    });
  }

}(window, jQuery));