PageRenderTime 42ms CodeModel.GetById 14ms RepoModel.GetById 0ms app.codeStats 0ms

/ajax/libs/jQuery.mmenu/4.2.1/js/addons/jquery.mmenu.dragopen.js

https://gitlab.com/Mirros/cdnjs
JavaScript | 296 lines | 241 code | 35 blank | 20 comment | 37 complexity | 8f967eeace4e9e69459b5ba7eeb071b6 MD5 | raw file
  1. /*
  2. * jQuery mmenu dragOpen addon
  3. * @requires mmenu 4.0.0 or later
  4. *
  5. * mmenu.frebsite.nl
  6. *
  7. * Copyright (c) Fred Heusschen
  8. * www.frebsite.nl
  9. *
  10. * Dual licensed under the MIT and GPL licenses.
  11. * http://en.wikipedia.org/wiki/MIT_License
  12. * http://en.wikipedia.org/wiki/GNU_General_Public_License
  13. */
  14. (function( $ ) {
  15. var _PLUGIN_ = 'mmenu',
  16. _ADDON_ = 'dragOpen';
  17. $[ _PLUGIN_ ].prototype[ '_addon_' + _ADDON_ ] = function()
  18. {
  19. var that = this,
  20. opts = this.opts[ _ADDON_ ];
  21. if ( !$.fn.hammer )
  22. {
  23. return;
  24. }
  25. var _c = $[ _PLUGIN_ ]._c,
  26. _d = $[ _PLUGIN_ ]._d,
  27. _e = $[ _PLUGIN_ ]._e;
  28. _c.add( 'dragging' );
  29. _e.add( 'dragleft dragright dragup dragdown dragend' );
  30. var glbl = $[ _PLUGIN_ ].glbl;
  31. // Extend options
  32. if ( typeof opts == 'boolean' )
  33. {
  34. opts = {
  35. open: opts
  36. };
  37. }
  38. if ( typeof opts != 'object' )
  39. {
  40. opts = {};
  41. }
  42. if ( typeof opts.maxStartPos != 'number' )
  43. {
  44. opts.maxStartPos = this.opts.position == 'left' || this.opts.position == 'right'
  45. ? 150
  46. : 75;
  47. }
  48. opts = $.extend( true, {}, $[ _PLUGIN_ ].defaults[ _ADDON_ ], opts );
  49. if ( opts.open )
  50. {
  51. var _stage = 0,
  52. _direction = false,
  53. _distance = 0,
  54. _maxDistance = 0,
  55. _dimension = 'width';
  56. switch( this.opts.position )
  57. {
  58. case 'left':
  59. case 'right':
  60. _dimension = 'width';
  61. break;
  62. default:
  63. _dimension = 'height';
  64. break;
  65. }
  66. // Set up variables
  67. switch( this.opts.position )
  68. {
  69. case 'left':
  70. var drag = {
  71. events : _e.dragleft + ' ' + _e.dragright,
  72. open_dir : 'right',
  73. close_dir : 'left',
  74. delta : 'deltaX',
  75. page : 'pageX',
  76. negative : false
  77. };
  78. break;
  79. case 'right':
  80. var drag = {
  81. events : _e.dragleft + ' ' + _e.dragright,
  82. open_dir : 'left',
  83. close_dir : 'right',
  84. delta : 'deltaX',
  85. page : 'pageX',
  86. negative : true
  87. };
  88. break;
  89. case 'top':
  90. var drag = {
  91. events : _e.dragup + ' ' + _e.dragdown,
  92. open_dir : 'down',
  93. close_dir : 'up',
  94. delta : 'deltaY',
  95. page : 'pageY',
  96. negative : false
  97. };
  98. break;
  99. case 'bottom':
  100. var drag = {
  101. events : _e.dragup + ' ' + _e.dragdown,
  102. open_dir : 'up',
  103. close_dir : 'down',
  104. delta : 'deltaY',
  105. page : 'pageY',
  106. negative : true
  107. };
  108. break;
  109. }
  110. var $dragNode = this.__valueOrFn( opts.pageNode, this.$menu, glbl.$page );
  111. if ( typeof $dragNode == 'string' )
  112. {
  113. $dragNode = $($dragNode);
  114. }
  115. var $fixed = glbl.$page.find( '.' + _c.mm( 'fixed-top' ) + ', .' + _c.mm( 'fixed-bottom' ) ),
  116. $dragg = glbl.$page;
  117. switch ( that.opts.zposition )
  118. {
  119. case 'back':
  120. $dragg = $dragg.add( $fixed );
  121. break;
  122. case 'front':
  123. $dragg = that.$menu;
  124. break;
  125. case 'next':
  126. $dragg = $dragg.add( that.$menu ).add( $fixed );
  127. break;
  128. };
  129. // Bind events
  130. $dragNode
  131. .hammer()
  132. .on( _e.touchstart + ' ' + _e.mousedown,
  133. function( e )
  134. {
  135. if ( e.type == 'touchstart' )
  136. {
  137. var tch = e.originalEvent.touches[ 0 ] || e.originalEvent.changedTouches[ 0 ],
  138. pos = tch[ drag.page ];
  139. }
  140. else if ( e.type == 'mousedown' )
  141. {
  142. var pos = e[ drag.page ];
  143. }
  144. switch( that.opts.position )
  145. {
  146. case 'right':
  147. case 'bottom':
  148. if ( pos >= glbl.$wndw[ _dimension ]() - opts.maxStartPos )
  149. {
  150. _stage = 1;
  151. }
  152. break;
  153. default:
  154. if ( pos <= opts.maxStartPos )
  155. {
  156. _stage = 1;
  157. }
  158. break;
  159. }
  160. }
  161. )
  162. .on( drag.events + ' ' + _e.dragend,
  163. function( e )
  164. {
  165. if ( _stage > 0 )
  166. {
  167. e.gesture.preventDefault();
  168. e.stopPropagation();
  169. }
  170. }
  171. )
  172. .on( drag.events,
  173. function( e )
  174. {
  175. var new_distance = drag.negative
  176. ? -e.gesture[ drag.delta ]
  177. : e.gesture[ drag.delta ];
  178. _direction = ( new_distance > _distance )
  179. ? drag.open_dir
  180. : drag.close_dir;
  181. _distance = new_distance;
  182. if ( _distance > opts.threshold )
  183. {
  184. if ( _stage == 1 )
  185. {
  186. if ( glbl.$html.hasClass( _c.opened ) )
  187. {
  188. return;
  189. }
  190. _stage = 2;
  191. that._openSetup();
  192. glbl.$html.addClass( _c.dragging );
  193. _maxDistance = minMax(
  194. glbl.$wndw[ _dimension ]() * that.conf[ _ADDON_ ][ _dimension ].perc,
  195. that.conf[ _ADDON_ ][ _dimension ].min,
  196. that.conf[ _ADDON_ ][ _dimension ].max
  197. );
  198. }
  199. }
  200. if ( _stage == 2 )
  201. {
  202. $dragg.css( that.opts.position, minMax( _distance, 10, _maxDistance ) - ( that.opts.zposition == 'front' ? _maxDistance : 0 ) );
  203. }
  204. }
  205. )
  206. .on( _e.dragend,
  207. function( e )
  208. {
  209. if ( _stage == 2 )
  210. {
  211. glbl.$html.removeClass( _c.dragging );
  212. $dragg.css( that.opts.position, '' );
  213. if ( _direction == drag.open_dir )
  214. {
  215. that._openFinish();
  216. }
  217. else
  218. {
  219. that.close();
  220. }
  221. }
  222. _stage = 0;
  223. }
  224. );
  225. }
  226. };
  227. $[ _PLUGIN_ ].defaults[ _ADDON_ ] = {
  228. open : false,
  229. // pageNode : null,
  230. // maxStartPos : null,
  231. threshold : 50
  232. };
  233. $[ _PLUGIN_ ].configuration[ _ADDON_ ] = {
  234. width : {
  235. perc : 0.8,
  236. min : 140,
  237. max : 440
  238. },
  239. height : {
  240. perc : 0.8,
  241. min : 140,
  242. max : 880
  243. }
  244. };
  245. // Add to plugin
  246. $[ _PLUGIN_ ].addons = $[ _PLUGIN_ ].addons || [];
  247. $[ _PLUGIN_ ].addons.push( _ADDON_ );
  248. // Functions
  249. function minMax( val, min, max )
  250. {
  251. if ( val < min )
  252. {
  253. val = min;
  254. }
  255. if ( val > max )
  256. {
  257. val = max;
  258. }
  259. return val;
  260. }
  261. })( jQuery );