Menubar.js 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212
  1. (function (global, factory) {
  2. if (typeof define === "function" && define.amd) {
  3. define("/Section/Menubar", ["exports", "jquery", "Component"], factory);
  4. } else if (typeof exports !== "undefined") {
  5. factory(exports, require("jquery"), require("Component"));
  6. } else {
  7. var mod = {
  8. exports: {}
  9. };
  10. factory(mod.exports, global.jQuery, global.Component);
  11. global.SectionMenubar = mod.exports;
  12. }
  13. })(this, function (_exports, _jquery, _Component2) {
  14. "use strict";
  15. Object.defineProperty(_exports, "__esModule", {
  16. value: true
  17. });
  18. _exports.default = void 0;
  19. _jquery = babelHelpers.interopRequireDefault(_jquery);
  20. _Component2 = babelHelpers.interopRequireDefault(_Component2);
  21. var $BODY = (0, _jquery.default)('body');
  22. var $HTML = (0, _jquery.default)('html');
  23. var Hoverscroll =
  24. /*#__PURE__*/
  25. function () {
  26. function Hoverscroll($el) {
  27. babelHelpers.classCallCheck(this, Hoverscroll);
  28. this.$el = $el;
  29. this.api = null;
  30. this.init();
  31. }
  32. babelHelpers.createClass(Hoverscroll, [{
  33. key: "init",
  34. value: function init() {
  35. this.api = this.$el.asHoverScroll({
  36. namespace: 'hoverscorll',
  37. direction: 'vertical',
  38. list: '.site-menu',
  39. item: '> li',
  40. exception: '.site-menu-sub',
  41. boundary: 100 // onEnter() {
  42. // // $(this).siblings().removeClass('hover');
  43. // // $(this).addClass('hover');
  44. // },
  45. // onLeave() {
  46. // // $(this).removeClass('hover');
  47. // }
  48. }).data('asHoverScroll');
  49. }
  50. }, {
  51. key: "update",
  52. value: function update() {
  53. if (this.api) {
  54. this.api.update();
  55. }
  56. }
  57. }, {
  58. key: "enable",
  59. value: function enable() {
  60. if (!this.api) {
  61. this.init();
  62. }
  63. if (this.api) {
  64. this.api.enable();
  65. }
  66. }
  67. }, {
  68. key: "disable",
  69. value: function disable() {
  70. if (this.api) {
  71. this.api.disable();
  72. }
  73. }
  74. }]);
  75. return Hoverscroll;
  76. }();
  77. var Menubar =
  78. /*#__PURE__*/
  79. function (_Component) {
  80. babelHelpers.inherits(Menubar, _Component);
  81. function Menubar() {
  82. var _babelHelpers$getProt;
  83. var _this;
  84. babelHelpers.classCallCheck(this, Menubar);
  85. for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
  86. args[_key] = arguments[_key];
  87. }
  88. _this = babelHelpers.possibleConstructorReturn(this, (_babelHelpers$getProt = babelHelpers.getPrototypeOf(Menubar)).call.apply(_babelHelpers$getProt, [this].concat(args)));
  89. _this.$menuBody = _this.$el.children('.site-menubar-body');
  90. _this.$menu = _this.$el.find('[data-plugin=menu]');
  91. if (_this.$menuBody.length > 0) {
  92. _this.initialized = true;
  93. } else {
  94. return babelHelpers.possibleConstructorReturn(_this);
  95. }
  96. _this.hoverscroll = new Hoverscroll(_this.$menuBody);
  97. _this.hoverscroll.enable(); // states
  98. _this.type = 'open'; // open, hide
  99. return _this;
  100. }
  101. babelHelpers.createClass(Menubar, [{
  102. key: "initialize",
  103. value: function initialize() {
  104. $HTML.removeClass('css-menubar').addClass('js-menubar');
  105. this.change(this.type);
  106. }
  107. }, {
  108. key: "process",
  109. value: function process() {
  110. (0, _jquery.default)('.site-menu-sub').on('touchstart', function (e) {
  111. e.stopPropagation();
  112. }).on('ponitstart', function (e) {
  113. e.stopPropagation();
  114. });
  115. }
  116. }, {
  117. key: "getMenuApi",
  118. value: function getMenuApi() {
  119. return this.$menu.data('menuApi');
  120. }
  121. }, {
  122. key: "setMenuData",
  123. value: function setMenuData() {
  124. var api = this.getMenuApi();
  125. api.outerHeight = this.$el.outerHeight();
  126. }
  127. }, {
  128. key: "update",
  129. value: function update() {
  130. this.hoverscroll.update();
  131. }
  132. }, {
  133. key: "change",
  134. value: function change(type) {
  135. if (this.initialized) {
  136. this.reset();
  137. this[type]();
  138. this.setMenuData();
  139. }
  140. }
  141. }, {
  142. key: "animate",
  143. value: function animate(doing) {
  144. var _this2 = this;
  145. var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {};
  146. $BODY.addClass('site-menubar-changing');
  147. doing.call(this);
  148. this.$el.trigger('changing.site.menubar');
  149. var menuApi = this.getMenuApi();
  150. if (menuApi) {
  151. menuApi.refresh();
  152. }
  153. setTimeout(function () {
  154. callback.call(_this2);
  155. $BODY.removeClass('site-menubar-changing');
  156. _this2.update();
  157. _this2.$el.trigger('changed.site.menubar');
  158. }, 500);
  159. }
  160. }, {
  161. key: "reset",
  162. value: function reset() {
  163. $BODY.removeClass('site-menubar-hide site-menubar-unfold');
  164. }
  165. }, {
  166. key: "hide",
  167. value: function hide() {
  168. this.animate(function () {
  169. $BODY.removeClass('site-menubar-unfold').addClass('site-menubar-hide');
  170. });
  171. this.type = 'hide';
  172. }
  173. }, {
  174. key: "open",
  175. value: function open() {
  176. this.animate(function () {
  177. $BODY.removeClass('site-menubar-hide').addClass('site-menubar-unfold');
  178. }, function () {
  179. this.triggerResize();
  180. });
  181. this.type = 'open';
  182. }
  183. }]);
  184. return Menubar;
  185. }(_Component2.default);
  186. var _default = Menubar;
  187. _exports.default = _default;
  188. });