movable.js 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238
  1. /*!
  2. * better-scroll / movable
  3. * (c) 2016-2021 ustbhuangyi
  4. * Released under the MIT License.
  5. */
  6. (function (global, factory) {
  7. typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
  8. typeof define === 'function' && define.amd ? define(factory) :
  9. (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.Movable = factory());
  10. }(this, (function () { 'use strict';
  11. // ssr support
  12. var inBrowser = typeof window !== 'undefined';
  13. var ua = inBrowser && navigator.userAgent.toLowerCase();
  14. !!(ua && /wechatdevtools/.test(ua));
  15. ua && ua.indexOf('android') > 0;
  16. /* istanbul ignore next */
  17. ((function () {
  18. if (typeof ua === 'string') {
  19. var regex = /os (\d\d?_\d(_\d)?)/;
  20. var matches = regex.exec(ua);
  21. if (!matches)
  22. return false;
  23. var parts = matches[1].split('_').map(function (item) {
  24. return parseInt(item, 10);
  25. });
  26. // ios version >= 13.4 issue 982
  27. return !!(parts[0] === 13 && parts[1] >= 4);
  28. }
  29. return false;
  30. }))();
  31. /* istanbul ignore next */
  32. var supportsPassive = false;
  33. /* istanbul ignore next */
  34. if (inBrowser) {
  35. var EventName = 'test-passive';
  36. try {
  37. var opts = {};
  38. Object.defineProperty(opts, 'passive', {
  39. get: function () {
  40. supportsPassive = true;
  41. },
  42. }); // https://github.com/facebook/flow/issues/285
  43. window.addEventListener(EventName, function () { }, opts);
  44. }
  45. catch (e) { }
  46. }
  47. var elementStyle = (inBrowser &&
  48. document.createElement('div').style);
  49. var vendor = (function () {
  50. /* istanbul ignore if */
  51. if (!inBrowser) {
  52. return false;
  53. }
  54. var transformNames = [
  55. {
  56. key: 'standard',
  57. value: 'transform',
  58. },
  59. {
  60. key: 'webkit',
  61. value: 'webkitTransform',
  62. },
  63. {
  64. key: 'Moz',
  65. value: 'MozTransform',
  66. },
  67. {
  68. key: 'O',
  69. value: 'OTransform',
  70. },
  71. {
  72. key: 'ms',
  73. value: 'msTransform',
  74. },
  75. ];
  76. for (var _i = 0, transformNames_1 = transformNames; _i < transformNames_1.length; _i++) {
  77. var obj = transformNames_1[_i];
  78. if (elementStyle[obj.value] !== undefined) {
  79. return obj.key;
  80. }
  81. }
  82. /* istanbul ignore next */
  83. return false;
  84. })();
  85. /* istanbul ignore next */
  86. function prefixStyle(style) {
  87. if (vendor === false) {
  88. return style;
  89. }
  90. if (vendor === 'standard') {
  91. if (style === 'transitionEnd') {
  92. return 'transitionend';
  93. }
  94. return style;
  95. }
  96. return vendor + style.charAt(0).toUpperCase() + style.substr(1);
  97. }
  98. vendor && vendor !== 'standard' ? '-' + vendor.toLowerCase() + '-' : '';
  99. var transform = prefixStyle('transform');
  100. var transition = prefixStyle('transition');
  101. inBrowser && prefixStyle('perspective') in elementStyle;
  102. ({
  103. transform: transform,
  104. transition: transition,
  105. transitionTimingFunction: prefixStyle('transitionTimingFunction'),
  106. transitionDuration: prefixStyle('transitionDuration'),
  107. transitionDelay: prefixStyle('transitionDelay'),
  108. transformOrigin: prefixStyle('transformOrigin'),
  109. transitionEnd: prefixStyle('transitionEnd'),
  110. transitionProperty: prefixStyle('transitionProperty'),
  111. });
  112. var ease = {
  113. // easeOutQuint
  114. swipe: {
  115. style: 'cubic-bezier(0.23, 1, 0.32, 1)',
  116. fn: function (t) {
  117. return 1 + --t * t * t * t * t;
  118. }
  119. },
  120. // easeOutQuard
  121. swipeBounce: {
  122. style: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)',
  123. fn: function (t) {
  124. return t * (2 - t);
  125. }
  126. },
  127. // easeOutQuart
  128. bounce: {
  129. style: 'cubic-bezier(0.165, 0.84, 0.44, 1)',
  130. fn: function (t) {
  131. return 1 - --t * t * t * t;
  132. }
  133. }
  134. };
  135. var sourcePrefix = 'plugins.movable';
  136. var propertiesMap = [
  137. {
  138. key: 'putAt',
  139. name: 'putAt',
  140. },
  141. ];
  142. var propertiesConfig = propertiesMap.map(function (item) {
  143. return {
  144. key: item.key,
  145. sourceKey: sourcePrefix + "." + item.name,
  146. };
  147. });
  148. var Movable = /** @class */ (function () {
  149. function Movable(scroll) {
  150. this.scroll = scroll;
  151. this.handleBScroll();
  152. this.handleHooks();
  153. }
  154. Movable.prototype.handleBScroll = function () {
  155. this.scroll.proxy(propertiesConfig);
  156. };
  157. Movable.prototype.handleHooks = function () {
  158. var _this = this;
  159. this.hooksFn = [];
  160. var _a = this.scroll.scroller, scrollBehaviorX = _a.scrollBehaviorX, scrollBehaviorY = _a.scrollBehaviorY;
  161. var computeBoundary = function (boundary, behavior) {
  162. if (boundary.maxScrollPos > 0) {
  163. // content is smaller than wrapper
  164. boundary.minScrollPos = behavior.wrapperSize - behavior.contentSize;
  165. boundary.maxScrollPos = 0;
  166. }
  167. };
  168. this.registerHooks(scrollBehaviorX.hooks, scrollBehaviorX.hooks.eventTypes.ignoreHasScroll, function () { return true; });
  169. this.registerHooks(scrollBehaviorX.hooks, scrollBehaviorX.hooks.eventTypes.computeBoundary, function (boundary) {
  170. computeBoundary(boundary, scrollBehaviorX);
  171. });
  172. this.registerHooks(scrollBehaviorY.hooks, scrollBehaviorY.hooks.eventTypes.ignoreHasScroll, function () { return true; });
  173. this.registerHooks(scrollBehaviorY.hooks, scrollBehaviorY.hooks.eventTypes.computeBoundary, function (boundary) {
  174. computeBoundary(boundary, scrollBehaviorY);
  175. });
  176. this.registerHooks(this.scroll.hooks, this.scroll.hooks.eventTypes.destroy, function () {
  177. _this.destroy();
  178. });
  179. };
  180. Movable.prototype.putAt = function (x, y, time, easing) {
  181. if (time === void 0) { time = this.scroll.options.bounceTime; }
  182. if (easing === void 0) { easing = ease.bounce; }
  183. var position = this.resolvePostion(x, y);
  184. this.scroll.scrollTo(position.x, position.y, time, easing);
  185. };
  186. Movable.prototype.resolvePostion = function (x, y) {
  187. var _a = this.scroll.scroller, scrollBehaviorX = _a.scrollBehaviorX, scrollBehaviorY = _a.scrollBehaviorY;
  188. var resolveFormula = {
  189. left: function () {
  190. return 0;
  191. },
  192. top: function () {
  193. return 0;
  194. },
  195. right: function () {
  196. return scrollBehaviorX.minScrollPos;
  197. },
  198. bottom: function () {
  199. return scrollBehaviorY.minScrollPos;
  200. },
  201. center: function (index) {
  202. var baseSize = index === 0
  203. ? scrollBehaviorX.minScrollPos
  204. : scrollBehaviorY.minScrollPos;
  205. return baseSize / 2;
  206. },
  207. };
  208. return {
  209. x: typeof x === 'number' ? x : resolveFormula[x](0),
  210. y: typeof y === 'number' ? y : resolveFormula[y](1),
  211. };
  212. };
  213. Movable.prototype.destroy = function () {
  214. this.hooksFn.forEach(function (item) {
  215. var hooks = item[0];
  216. var hooksName = item[1];
  217. var handlerFn = item[2];
  218. hooks.off(hooksName, handlerFn);
  219. });
  220. this.hooksFn.length = 0;
  221. };
  222. Movable.prototype.registerHooks = function (hooks, name, handler) {
  223. hooks.on(name, handler, this);
  224. this.hooksFn.push([hooks, name, handler]);
  225. };
  226. Movable.pluginName = 'movable';
  227. Movable.applyOrder = "pre" /* Pre */;
  228. return Movable;
  229. }());
  230. return Movable;
  231. })));