controller.js 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252
  1. var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
  2. function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
  3. return new (P || (P = Promise))(function (resolve, reject) {
  4. function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
  5. function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
  6. function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
  7. step((generator = generator.apply(thisArg, _arguments || [])).next());
  8. });
  9. };
  10. var __generator = (this && this.__generator) || function (thisArg, body) {
  11. var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
  12. return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
  13. function verb(n) { return function (v) { return step([n, v]); }; }
  14. function step(op) {
  15. if (f) throw new TypeError("Generator is already executing.");
  16. while (g && (g = 0, op[0] && (_ = 0)), _) try {
  17. if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
  18. if (y = 0, t) op = [op[0] & 2, t.value];
  19. switch (op[0]) {
  20. case 0: case 1: t = op; break;
  21. case 4: _.label++; return { value: op[1], done: false };
  22. case 5: _.label++; y = op[1]; op = [0]; continue;
  23. case 7: op = _.ops.pop(); _.trys.pop(); continue;
  24. default:
  25. if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
  26. if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
  27. if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
  28. if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
  29. if (t[2]) _.ops.pop();
  30. _.trys.pop(); continue;
  31. }
  32. op = body.call(thisArg, _);
  33. } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
  34. if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
  35. }
  36. };
  37. import { getInstanceBoundingClientRect } from '../_util/jsapi/get-instance-bounding-client-rect';
  38. var SliderController = /** @class */ (function () {
  39. function SliderController(_value, _props) {
  40. this._value = _value;
  41. this._props = _props;
  42. this.id = 0;
  43. this.valueId = 0;
  44. this._callback = null;
  45. this._moveStatus = null;
  46. }
  47. Object.defineProperty(SliderController.prototype, "value", {
  48. get: function () {
  49. return this._value;
  50. },
  51. enumerable: false,
  52. configurable: true
  53. });
  54. Object.defineProperty(SliderController.prototype, "props", {
  55. get: function () {
  56. return this._props;
  57. },
  58. enumerable: false,
  59. configurable: true
  60. });
  61. SliderController.prototype.handleMove = function (component, e, type) {
  62. var _this = this;
  63. if (this.props.disabled) {
  64. return;
  65. }
  66. var currentId = this.getId();
  67. this.getRect(component, e).then(function (res) {
  68. var _a = _this.getValue(res, type), value = _a.value, moveStatus = _a.moveStatus;
  69. var formatValue = _this.formatValue(value);
  70. _this.fireChange(currentId, formatValue, moveStatus, type, e);
  71. });
  72. };
  73. SliderController.prototype.fireChange = function (id, value, moveStatus, type, event) {
  74. if (id < this.valueId) {
  75. return;
  76. }
  77. if (this._callback) {
  78. var changed = !this.isSliderValueEqual(this._value, value);
  79. var moveStatusChanged = this.isMoveStatusChanged(this._moveStatus, moveStatus);
  80. this._value = value;
  81. this.valueId = id;
  82. if (changed || moveStatusChanged) {
  83. this._callback(value, moveStatus, {
  84. valueChange: changed,
  85. moveStatusChange: moveStatusChanged,
  86. type: type,
  87. event: event,
  88. });
  89. }
  90. }
  91. };
  92. SliderController.prototype.isMoveStatusChanged = function (value1, value2) {
  93. if (value1 === value2) {
  94. return false;
  95. }
  96. if (!value1 || !value2) {
  97. return true;
  98. }
  99. if (value1.changingStart !== value2.changingStart) {
  100. return true;
  101. }
  102. if (value1.changingEnd !== value2.changingEnd) {
  103. return true;
  104. }
  105. return false;
  106. };
  107. SliderController.prototype.isSliderValueEqual = function (value1, value2) {
  108. if (value1 === value2) {
  109. return true;
  110. }
  111. if (value1 === undefined || value2 === undefined) {
  112. return false;
  113. }
  114. if (typeof value1 === 'number' || typeof value2 == 'number') {
  115. return value1 === value2;
  116. }
  117. if (value1[0] === value2[0] && value1[1] === value2[1]) {
  118. return true;
  119. }
  120. return false;
  121. };
  122. SliderController.prototype.getId = function () {
  123. var id = this.id;
  124. this.id = this.id + 1;
  125. return id;
  126. };
  127. SliderController.prototype.getRect = function (component, e) {
  128. return __awaiter(this, void 0, void 0, function () {
  129. var elementId, instance, element, touch;
  130. return __generator(this, function (_a) {
  131. switch (_a.label) {
  132. case 0:
  133. elementId = e.currentTarget.id;
  134. instance = component;
  135. return [4 /*yield*/, getInstanceBoundingClientRect(instance, "#".concat(elementId))];
  136. case 1:
  137. element = _a.sent();
  138. touch = e.changedTouches[0];
  139. if (element) {
  140. return [2 /*return*/, {
  141. touch: {
  142. pageX: touch.pageX,
  143. },
  144. element: {
  145. left: element.left,
  146. width: element.width,
  147. },
  148. }];
  149. }
  150. return [2 /*return*/];
  151. }
  152. });
  153. });
  154. };
  155. SliderController.prototype.fitSliderValue = function (value, min, max, isRange) {
  156. if (value === undefined || value === null) {
  157. if (isRange) {
  158. return [min, min];
  159. }
  160. else {
  161. return min !== null && min !== void 0 ? min : 0;
  162. }
  163. }
  164. if (typeof value === 'number') {
  165. if (value > max) {
  166. return max;
  167. }
  168. if (value < min) {
  169. return min;
  170. }
  171. return value;
  172. }
  173. var leftValue = Math.min(value[0], value[1]);
  174. var rightValue = Math.max(value[0], value[1]);
  175. return [Math.max(min, leftValue), Math.min(max, rightValue)];
  176. };
  177. SliderController.prototype.getValue = function (rect, type) {
  178. var touchPosition = (rect.touch.pageX - rect.element.left) / rect.element.width;
  179. var props = this.props;
  180. var currentValue = this.value;
  181. var value = props.min + touchPosition * (props.max - props.min);
  182. if (!props.range) {
  183. return {
  184. value: value,
  185. moveStatus: type === 'end'
  186. ? {
  187. changingEnd: false,
  188. changingStart: false,
  189. }
  190. : {
  191. changingEnd: true,
  192. },
  193. };
  194. }
  195. else {
  196. var leftValue = currentValue[0];
  197. var rightValue = currentValue[1];
  198. var leftDistance = Math.abs(leftValue - value);
  199. var rightDistance = Math.abs(rightValue - value);
  200. var isFarFromLeft = leftDistance > rightDistance;
  201. var farValue = isFarFromLeft ? leftValue : rightValue;
  202. return {
  203. value: [value, farValue],
  204. moveStatus: type === 'end'
  205. ? {
  206. changingEnd: false,
  207. changingStart: false,
  208. }
  209. : isFarFromLeft
  210. ? {
  211. changingEnd: true,
  212. }
  213. : {
  214. changingStart: true,
  215. },
  216. };
  217. }
  218. };
  219. SliderController.prototype.formatValue = function (val) {
  220. var props = this.props;
  221. var value = this.fitSliderValue(val, props.min, props.max, props.range);
  222. value = this.getRoundedValue(value, props.step);
  223. return value;
  224. };
  225. SliderController.prototype.getRoundedValue = function (value, step) {
  226. if (step === void 0) { step = 1; }
  227. if (value === undefined) {
  228. return 0;
  229. }
  230. if (typeof value === 'number') {
  231. return Math.round(value / step) * step;
  232. }
  233. return [
  234. Math.round(value[0] / step) * step,
  235. Math.round(value[1] / step) * step,
  236. ];
  237. };
  238. SliderController.prototype.updateProps = function (props) {
  239. this._props = props;
  240. };
  241. SliderController.prototype.updateValue = function (value) {
  242. this._value = value;
  243. };
  244. SliderController.prototype.updateMoveStatus = function (moveStatus) {
  245. this._moveStatus = moveStatus;
  246. };
  247. SliderController.prototype.onChange = function (callback) {
  248. this._callback = callback;
  249. };
  250. return SliderController;
  251. }());
  252. export { SliderController };