Treeview.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196
  1. 'use strict';
  2. var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
  3. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  4. /**
  5. * --------------------------------------------
  6. * AdminLTE Treeview.js
  7. * License MIT
  8. * --------------------------------------------
  9. */
  10. var Treeview = function ($) {
  11. /**
  12. * Constants
  13. * ====================================================
  14. */
  15. var NAME = 'Treeview';
  16. var DATA_KEY = 'lte.treeview';
  17. var EVENT_KEY = '.' + DATA_KEY;
  18. var JQUERY_NO_CONFLICT = $.fn[NAME];
  19. var Event = {
  20. SELECTED: 'selected' + EVENT_KEY,
  21. EXPANDED: 'expanded' + EVENT_KEY,
  22. COLLAPSED: 'collapsed' + EVENT_KEY,
  23. LOAD_DATA_API: 'load' + EVENT_KEY
  24. };
  25. var Selector = {
  26. LI: '.nav-item',
  27. LINK: '.nav-link',
  28. TREEVIEW_MENU: '.nav-treeview',
  29. OPEN: '.menu-open',
  30. DATA_WIDGET: '[data-widget="treeview"]'
  31. };
  32. var ClassName = {
  33. LI: 'nav-item',
  34. LINK: 'nav-link',
  35. TREEVIEW_MENU: 'nav-treeview',
  36. OPEN: 'menu-open'
  37. };
  38. var Default = {
  39. trigger: Selector.DATA_WIDGET + ' ' + Selector.LINK,
  40. animationSpeed: 300,
  41. accordion: true
  42. };
  43. /**
  44. * Class Definition
  45. * ====================================================
  46. */
  47. var Treeview = function () {
  48. function Treeview(element, config) {
  49. _classCallCheck(this, Treeview);
  50. this._config = config;
  51. this._element = element;
  52. }
  53. // Public
  54. _createClass(Treeview, [{
  55. key: 'init',
  56. value: function init() {
  57. this._setupListeners();
  58. }
  59. }, {
  60. key: 'expand',
  61. value: function expand(treeviewMenu, parentLi) {
  62. var _this = this;
  63. var expandedEvent = $.Event(Event.EXPANDED);
  64. if (this._config.accordion) {
  65. var openMenuLi = parentLi.siblings(Selector.OPEN).first();
  66. var openTreeview = openMenuLi.find(Selector.TREEVIEW_MENU).first();
  67. this.collapse(openTreeview, openMenuLi);
  68. }
  69. treeviewMenu.slideDown(this._config.animationSpeed, function () {
  70. parentLi.addClass(ClassName.OPEN);
  71. $(_this._element).trigger(expandedEvent);
  72. });
  73. }
  74. }, {
  75. key: 'collapse',
  76. value: function collapse(treeviewMenu, parentLi) {
  77. var _this2 = this;
  78. var collapsedEvent = $.Event(Event.COLLAPSED);
  79. treeviewMenu.slideUp(this._config.animationSpeed, function () {
  80. parentLi.removeClass(ClassName.OPEN);
  81. $(_this2._element).trigger(collapsedEvent);
  82. treeviewMenu.find(Selector.OPEN + ' > ' + Selector.TREEVIEW_MENU).slideUp();
  83. treeviewMenu.find(Selector.OPEN).removeClass(ClassName.OPEN);
  84. });
  85. }
  86. }, {
  87. key: 'collapseAll',
  88. value: function collapseAll() {}
  89. }, {
  90. key: 'expandAll',
  91. value: function expandAll() {}
  92. }, {
  93. key: 'toggle',
  94. value: function toggle(event) {
  95. var $relativeTarget = $(event.currentTarget);
  96. var treeviewMenu = $relativeTarget.next();
  97. if (!treeviewMenu.is(Selector.TREEVIEW_MENU)) {
  98. return;
  99. }
  100. event.preventDefault();
  101. var parentLi = $relativeTarget.parents(Selector.LI).first();
  102. var isOpen = parentLi.hasClass(ClassName.OPEN);
  103. if (isOpen) {
  104. this.collapse($(treeviewMenu), parentLi);
  105. } else {
  106. this.expand($(treeviewMenu), parentLi);
  107. }
  108. }
  109. // Private
  110. }, {
  111. key: '_setupListeners',
  112. value: function _setupListeners() {
  113. var _this3 = this;
  114. $(document).on('click', this._config.trigger, function (event) {
  115. _this3.toggle(event);
  116. });
  117. }
  118. // Static
  119. }], [{
  120. key: '_jQueryInterface',
  121. value: function _jQueryInterface(config) {
  122. return this.each(function () {
  123. var data = $(this).data(DATA_KEY);
  124. var _config = $.extend({}, Default, $(this).data());
  125. if (!data) {
  126. data = new Treeview($(this), _config);
  127. $(this).data(DATA_KEY, data);
  128. }
  129. if (config === 'init') {
  130. data[config]();
  131. }
  132. });
  133. }
  134. }]);
  135. return Treeview;
  136. }();
  137. /**
  138. * Data API
  139. * ====================================================
  140. */
  141. $(window).on(Event.LOAD_DATA_API, function () {
  142. $(Selector.DATA_WIDGET).each(function () {
  143. var $treeview = $(this);
  144. Treeview._jQueryInterface.call($treeview, 'init');
  145. });
  146. });
  147. /**
  148. * jQuery API
  149. * ====================================================
  150. */
  151. $.fn[NAME] = Treeview._jQueryInterface;
  152. $.fn[NAME].Constructor = Treeview;
  153. $.fn[NAME].noConflict = function () {
  154. $.fn[NAME] = JQUERY_NO_CONFLICT;
  155. return Treeview._jQueryInterface;
  156. };
  157. return Treeview;
  158. }(jQuery);
  159. //# sourceMappingURL=Treeview.js.map