You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

177 lines
4.7 KiB

  1. /*!
  2. * jquery-drawer v3.2.0
  3. * Flexible drawer menu using jQuery, iScroll and CSS.
  4. * http://git.blivesta.com/drawer
  5. * License : MIT
  6. * Author : blivesta <design@blivesta.com> (http://blivesta.com/)
  7. */
  8. ;(function umd(factory) {
  9. 'use strict';
  10. if (typeof define === 'function' && define.amd) {
  11. define(['jquery'], factory);
  12. } else if (typeof exports === 'object') {
  13. module.exports = factory(require('jquery'));
  14. } else {
  15. factory(jQuery);
  16. }
  17. }(function Drawer($) {
  18. 'use strict';
  19. var namespace = 'drawer';
  20. var touches = typeof document.ontouchstart != 'undefined';
  21. var __ = {
  22. init: function init(options) {
  23. options = $.extend({
  24. iscroll: {
  25. mouseWheel: true,
  26. preventDefault: false
  27. },
  28. showOverlay: true
  29. }, options);
  30. __.settings = {
  31. state: false,
  32. events: {
  33. opened: 'drawer.opened',
  34. closed: 'drawer.closed'
  35. },
  36. dropdownEvents: {
  37. opened: 'shown.bs.dropdown',
  38. closed: 'hidden.bs.dropdown'
  39. }
  40. };
  41. __.settings.class = $.extend({
  42. nav: 'drawer-nav',
  43. toggle: 'drawer-toggle',
  44. overlay: 'drawer-overlay',
  45. open: 'drawer-open',
  46. close: 'drawer-close',
  47. dropdown: 'drawer-dropdown'
  48. }, options.class);
  49. return this.each(function instantiateDrawer() {
  50. var _this = this;
  51. var $this = $(this);
  52. var data = $this.data(namespace);
  53. if (!data) {
  54. options = $.extend({}, options);
  55. $this.data(namespace, { options: options });
  56. __.refresh.call(_this);
  57. if (options.showOverlay) {
  58. __.addOverlay.call(_this);
  59. }
  60. $('.' + __.settings.class.toggle).on('click.' + namespace, function toggle() {
  61. __.toggle.call(_this);
  62. return _this.iScroll.refresh();
  63. });
  64. $(window).resize(function close() {
  65. __.close.call(_this);
  66. return _this.iScroll.refresh();
  67. });
  68. $('.' + __.settings.class.dropdown)
  69. .on(__.settings.dropdownEvents.opened + ' ' + __.settings.dropdownEvents.closed, function onOpenedOrClosed() {
  70. return _this.iScroll.refresh();
  71. });
  72. }
  73. }); // end each
  74. },
  75. refresh: function refresh() {
  76. this.iScroll = new IScroll(
  77. '.' + __.settings.class.nav,
  78. $(this).data(namespace).options.iscroll
  79. );
  80. },
  81. addOverlay: function addOverlay() {
  82. var _this = this;
  83. var $this = $(this);
  84. var $overlay = $('<div>').addClass(__.settings.class.overlay + ' ' + __.settings.class.toggle);
  85. return $this.append($overlay);
  86. },
  87. toggle: function toggle() {
  88. var _this = this;
  89. if (__.settings.state) {
  90. return __.close.call(_this);
  91. } else {
  92. return __.open.call(_this);
  93. }
  94. },
  95. open: function open() {
  96. var $this = $(this);
  97. if (touches) {
  98. $this.on('touchmove.' + namespace, function disableTouch(event) {
  99. event.preventDefault();
  100. });
  101. }
  102. return $this
  103. .removeClass(__.settings.class.close)
  104. .addClass(__.settings.class.open)
  105. .css({ 'overflow': 'hidden' })
  106. .drawerCallback(function triggerOpenedListeners() {
  107. __.settings.state = true;
  108. $this.trigger(__.settings.events.opened);
  109. });
  110. },
  111. close: function close() {
  112. var $this = $(this);
  113. if (touches) $this.off('touchmove.' + namespace);
  114. return $this
  115. .removeClass(__.settings.class.open)
  116. .addClass(__.settings.class.close)
  117. .css({ 'overflow': 'auto' })
  118. .drawerCallback(function triggerClosedListeners() {
  119. __.settings.state = false;
  120. $this.trigger(__.settings.events.closed);
  121. });
  122. },
  123. destroy: function destroy() {
  124. return this.each(function destroyEach() {
  125. var $this = $(this);
  126. $(window).off('.' + namespace);
  127. $this.removeData(namespace);
  128. });
  129. }
  130. };
  131. $.fn.drawerCallback = function drawerCallback(callback) {
  132. var end = 'transitionend webkitTransitionEnd';
  133. return this.each(function setAnimationEndHandler() {
  134. var $this = $(this);
  135. $this.on(end, function invokeCallbackOnAnimationEnd() {
  136. $this.off(end);
  137. return callback.call(this);
  138. });
  139. });
  140. };
  141. $.fn.drawer = function drawer(method) {
  142. if (__[method]) {
  143. return __[method].apply(this, Array.prototype.slice.call(arguments, 1));
  144. } else if (typeof method === 'object' || !method) {
  145. return __.init.apply(this, arguments);
  146. } else {
  147. $.error('Method ' + method + ' does not exist on jQuery.' + namespace);
  148. }
  149. };
  150. }));