jquery-asSpinner.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632
  1. /**
  2. * jQuery asSpinner v0.4.3
  3. * https://github.com/amazingSurge/jquery-asSpinner
  4. *
  5. * Copyright (c) amazingSurge
  6. * Released under the LGPL-3.0 license
  7. */
  8. (function(global, factory) {
  9. if (typeof define === 'function' && define.amd) {
  10. define(['jquery'], factory);
  11. } else if (typeof exports !== 'undefined') {
  12. factory(require('jquery'));
  13. } else {
  14. var mod = {
  15. exports: {}
  16. };
  17. factory(global.jQuery);
  18. global.jqueryAsSpinnerEs = mod.exports;
  19. }
  20. })(this, function(_jquery) {
  21. 'use strict';
  22. var _jquery2 = _interopRequireDefault(_jquery);
  23. function _interopRequireDefault(obj) {
  24. return obj && obj.__esModule
  25. ? obj
  26. : {
  27. default: obj
  28. };
  29. }
  30. function _classCallCheck(instance, Constructor) {
  31. if (!(instance instanceof Constructor)) {
  32. throw new TypeError('Cannot call a class as a function');
  33. }
  34. }
  35. var _createClass = (function() {
  36. function defineProperties(target, props) {
  37. for (var i = 0; i < props.length; i++) {
  38. var descriptor = props[i];
  39. descriptor.enumerable = descriptor.enumerable || false;
  40. descriptor.configurable = true;
  41. if ('value' in descriptor) descriptor.writable = true;
  42. Object.defineProperty(target, descriptor.key, descriptor);
  43. }
  44. }
  45. return function(Constructor, protoProps, staticProps) {
  46. if (protoProps) defineProperties(Constructor.prototype, protoProps);
  47. if (staticProps) defineProperties(Constructor, staticProps);
  48. return Constructor;
  49. };
  50. })();
  51. var DEFAULTS = {
  52. namespace: 'asSpinner',
  53. skin: null,
  54. disabled: false,
  55. min: -10,
  56. max: 10,
  57. step: 1,
  58. name: null,
  59. precision: 0,
  60. rule: null, //string, shortcut define max min step precision
  61. looping: true, // if cycling the value when it is outofbound
  62. mousewheel: false,
  63. format: function format(value) {
  64. // function, define custom format
  65. return value;
  66. },
  67. parse: function parse(value) {
  68. // function, parse custom format value
  69. return parseFloat(value);
  70. }
  71. };
  72. var RULES = {
  73. defaults: {
  74. min: null,
  75. max: null,
  76. step: 1,
  77. precision: 0
  78. },
  79. currency: {
  80. min: 0.0,
  81. max: 99999,
  82. step: 0.01,
  83. precision: 2
  84. },
  85. quantity: {
  86. min: 1,
  87. max: 999,
  88. step: 1,
  89. precision: 0
  90. },
  91. percent: {
  92. min: 1,
  93. max: 100,
  94. step: 1,
  95. precision: 0
  96. },
  97. month: {
  98. min: 1,
  99. max: 12,
  100. step: 1,
  101. precision: 0
  102. },
  103. day: {
  104. min: 1,
  105. max: 31,
  106. step: 1,
  107. precision: 0
  108. },
  109. hour: {
  110. min: 0,
  111. max: 23,
  112. step: 1,
  113. precision: 0
  114. },
  115. minute: {
  116. min: 1,
  117. max: 59,
  118. step: 1,
  119. precision: 0
  120. },
  121. second: {
  122. min: 1,
  123. max: 59,
  124. step: 1,
  125. precision: 0
  126. }
  127. };
  128. var NAMESPACE$1 = 'asSpinner';
  129. var asSpinner = (function() {
  130. function asSpinner(element, options) {
  131. _classCallCheck(this, asSpinner);
  132. this.element = element;
  133. this.$element = (0, _jquery2.default)(element);
  134. this.options = _jquery2.default.extend(
  135. {},
  136. DEFAULTS,
  137. options,
  138. this.$element.data()
  139. );
  140. this.namespace = this.options.namespace;
  141. if (this.options.rule) {
  142. var that = this;
  143. var array = ['min', 'max', 'step', 'precision'];
  144. _jquery2.default.each(array, function(key, value) {
  145. that[value] = RULES[that.options.rule][value];
  146. });
  147. } else {
  148. this.min = this.options.min;
  149. this.max = this.options.max;
  150. this.step = this.options.step;
  151. this.precision = this.options.precision;
  152. }
  153. this.disabled = this.options.disabled;
  154. if (this.$element.prop('disabled')) {
  155. this.disabled = true;
  156. }
  157. this.value = this.options.parse(this.$element.val());
  158. this.mousewheel = this.options.mousewheel;
  159. if (this.mousewheel && !_jquery2.default.event.special.mousewheel) {
  160. this.mousewheel = false;
  161. }
  162. this.eventBinded = false;
  163. this.spinTimeout = null;
  164. this.isFocused = false;
  165. this.classes = {
  166. disabled: this.namespace + '_disabled',
  167. skin: this.namespace + '_' + this.options.skin,
  168. focus: this.namespace + '_focus',
  169. control: this.namespace + '-control',
  170. down: this.namespace + '-down',
  171. up: this.namespace + '-up',
  172. wrap: this.namespace
  173. };
  174. this._trigger('init');
  175. this.init();
  176. }
  177. _createClass(
  178. asSpinner,
  179. [
  180. {
  181. key: 'init',
  182. value: function init() {
  183. this.$control = (0, _jquery2.default)(
  184. '<div class="' +
  185. this.namespace +
  186. '-control"><span class="' +
  187. this.classes.up +
  188. '"></span><span class="' +
  189. this.classes.down +
  190. '"></span></div>'
  191. );
  192. this.$wrap = this.$element
  193. .wrap(
  194. '<div tabindex="0" class="' + this.classes.wrap + '"></div>'
  195. )
  196. .parent();
  197. this.$down = this.$control.find('.' + this.classes.down);
  198. this.$up = this.$control.find('.' + this.classes.up);
  199. if (this.options.skin) {
  200. this.$wrap.addClass(this.classes.skin);
  201. }
  202. this.$control.appendTo(this.$wrap);
  203. if (this.disabled === false) {
  204. // attach event
  205. this.bindEvent();
  206. } else {
  207. this.disable();
  208. }
  209. // inital
  210. this._trigger('ready');
  211. }
  212. },
  213. {
  214. key: '_trigger',
  215. value: function _trigger(eventType) {
  216. for (
  217. var _len = arguments.length,
  218. params = Array(_len > 1 ? _len - 1 : 0),
  219. _key = 1;
  220. _key < _len;
  221. _key++
  222. ) {
  223. params[_key - 1] = arguments[_key];
  224. }
  225. var data = [this].concat(params);
  226. // event
  227. this.$element.trigger(NAMESPACE$1 + '::' + eventType, data);
  228. // callback
  229. eventType = eventType.replace(/\b\w+\b/g, function(word) {
  230. return word.substring(0, 1).toUpperCase() + word.substring(1);
  231. });
  232. var onFunction = 'on' + eventType;
  233. if (typeof this.options[onFunction] === 'function') {
  234. this.options[onFunction].apply(this, params);
  235. }
  236. }
  237. },
  238. {
  239. key: 'spin',
  240. value: function spin(fn, timeout) {
  241. var that = this;
  242. var spinFn = function spinFn(timeout) {
  243. clearTimeout(that.spinTimeout);
  244. that.spinTimeout = setTimeout(function() {
  245. fn.call(that);
  246. spinFn(60);
  247. }, timeout);
  248. };
  249. spinFn(timeout || 500);
  250. }
  251. },
  252. {
  253. key: 'bindEvent',
  254. value: function bindEvent() {
  255. var that = this;
  256. this.eventBinded = true;
  257. this.$wrap
  258. .on('focus.asSpinner', function() {
  259. that.$wrap.addClass(that.classes.focus);
  260. })
  261. .on('blur.asSpinner', function() {
  262. if (!that.isFocused) {
  263. that.$wrap.removeClass(that.classes.focus);
  264. }
  265. });
  266. this.$down
  267. .on('mousedown.asSpinner', function() {
  268. (0, _jquery2.default)(
  269. document
  270. ).one('mouseup.asSpinner', function() {
  271. clearTimeout(that.spinTimeout);
  272. });
  273. that.spin(that.spinDown);
  274. })
  275. .on('mouseup.asSpinner', function() {
  276. clearTimeout(that.spinTimeout);
  277. (0, _jquery2.default)(document).off('mouseup.asSpinner');
  278. })
  279. .on('click.asSpinner', function() {
  280. that.spinDown();
  281. });
  282. this.$up
  283. .on('mousedown.asSpinner', function() {
  284. (0, _jquery2.default)(
  285. document
  286. ).one('mouseup.asSpinner', function() {
  287. clearTimeout(that.spinTimeout);
  288. });
  289. that.spin(that.spinUp);
  290. })
  291. .on('mouseup.asSpinner', function() {
  292. clearTimeout(that.spinTimeout);
  293. (0, _jquery2.default)(document).off('mouseup.asSpinner');
  294. })
  295. .on('click.asSpinner', function() {
  296. that.spinUp();
  297. });
  298. this.$element
  299. .on('focus.asSpinner', function() {
  300. that.isFocused = true;
  301. that.$wrap.addClass(that.classes.focus);
  302. // keyboard support
  303. (0, _jquery2.default)(this).on('keydown.asSpinner', function(
  304. e
  305. ) {
  306. /*eslint consistent-return: "off"*/
  307. var key = e.keyCode || e.which;
  308. if (key === 38) {
  309. that.applyValue();
  310. that.spinUp();
  311. return false;
  312. }
  313. if (key === 40) {
  314. that.applyValue();
  315. that.spinDown();
  316. return false;
  317. }
  318. if (key <= 57 && key >= 48) {
  319. setTimeout(function() {
  320. //that.set(parseFloat(it.value));
  321. }, 0);
  322. }
  323. });
  324. // mousewheel support
  325. if (that.mousewheel === true) {
  326. (0, _jquery2.default)(this).mousewheel(function(
  327. event,
  328. delta
  329. ) {
  330. if (delta > 0) {
  331. that.spinUp();
  332. } else {
  333. that.spinDown();
  334. }
  335. return false;
  336. });
  337. }
  338. })
  339. .on('blur.asSpinner', function() {
  340. that.isFocused = false;
  341. that.$wrap.removeClass(that.classes.focus);
  342. (0, _jquery2.default)(this).off('keydown.asSpinner');
  343. if (that.mousewheel === true) {
  344. (0, _jquery2.default)(this).unmousewheel();
  345. }
  346. that.applyValue();
  347. });
  348. }
  349. },
  350. {
  351. key: 'unbindEvent',
  352. value: function unbindEvent() {
  353. this.eventBinded = false;
  354. this.$element.off('.asSpinner');
  355. this.$down.off('.asSpinner');
  356. this.$up.off('.asSpinner');
  357. this.$wrap.off('.asSpinner');
  358. }
  359. },
  360. {
  361. key: 'isNumber',
  362. value: function isNumber(value) {
  363. if (
  364. typeof value === 'number' &&
  365. _jquery2.default.isNumeric(value)
  366. ) {
  367. return true;
  368. }
  369. return false;
  370. }
  371. },
  372. {
  373. key: 'isOutOfBounds',
  374. value: function isOutOfBounds(value) {
  375. if (value < this.min) {
  376. return -1;
  377. }
  378. if (value > this.max) {
  379. return 1;
  380. }
  381. return 0;
  382. }
  383. },
  384. {
  385. key: 'applyValue',
  386. value: function applyValue() {
  387. if (this.options.format(this.value) !== this.$element.val()) {
  388. this.set(this.options.parse(this.$element.val()));
  389. }
  390. }
  391. },
  392. {
  393. key: '_set',
  394. value: function _set(value) {
  395. if (isNaN(value)) {
  396. value = this.min;
  397. }
  398. var valid = this.isOutOfBounds(value);
  399. if (valid !== 0) {
  400. if (this.options.looping === true) {
  401. value = valid === 1 ? this.min : this.max;
  402. } else {
  403. value = valid === -1 ? this.min : this.max;
  404. }
  405. }
  406. this.value = value = Number(value).toFixed(this.precision);
  407. this.$element.val(this.options.format(this.value));
  408. }
  409. },
  410. {
  411. key: 'set',
  412. value: function set(value) {
  413. this._set(value);
  414. this._trigger('change', this.value);
  415. }
  416. },
  417. {
  418. key: 'get',
  419. value: function get() {
  420. return this.value;
  421. }
  422. },
  423. {
  424. key: 'update',
  425. value: function update(obj) {
  426. var that = this;
  427. ['min', 'max', 'precision', 'step'].forEach(function(value) {
  428. if (obj[value]) {
  429. that[value] = obj[value];
  430. }
  431. });
  432. if (obj.value) {
  433. this.set(obj.value);
  434. }
  435. return this;
  436. }
  437. },
  438. {
  439. key: 'val',
  440. value: function val(value) {
  441. if (value) {
  442. this.set(this.options.parse(value));
  443. } else {
  444. return this.get();
  445. }
  446. }
  447. },
  448. {
  449. key: 'spinDown',
  450. value: function spinDown() {
  451. if (!_jquery2.default.isNumeric(this.value)) {
  452. this.value = 0;
  453. }
  454. this.value = parseFloat(this.value) - parseFloat(this.step);
  455. this.set(this.value);
  456. return this;
  457. }
  458. },
  459. {
  460. key: 'spinUp',
  461. value: function spinUp() {
  462. if (!_jquery2.default.isNumeric(this.value)) {
  463. this.value = 0;
  464. }
  465. this.value = parseFloat(this.value) + parseFloat(this.step);
  466. this.set(this.value);
  467. return this;
  468. }
  469. },
  470. {
  471. key: 'enable',
  472. value: function enable() {
  473. this.disabled = false;
  474. this.$wrap.removeClass(this.classes.disabled);
  475. this.$element.prop('disabled', false);
  476. if (this.eventBinded === false) {
  477. this.bindEvent();
  478. }
  479. this._trigger('enable');
  480. return this;
  481. }
  482. },
  483. {
  484. key: 'disable',
  485. value: function disable() {
  486. this.disabled = true;
  487. this.$element.prop('disabled', true);
  488. this.$wrap.addClass(this.classes.disabled);
  489. this.unbindEvent();
  490. this._trigger('disable');
  491. return this;
  492. }
  493. },
  494. {
  495. key: 'destroy',
  496. value: function destroy() {
  497. this.unbindEvent();
  498. this.$control.remove();
  499. this.$element.unwrap();
  500. this._trigger('destroy');
  501. return this;
  502. }
  503. }
  504. ],
  505. [
  506. {
  507. key: 'setDefaults',
  508. value: function setDefaults(options) {
  509. _jquery2.default.extend(
  510. DEFAULTS,
  511. _jquery2.default.isPlainObject(options) && options
  512. );
  513. }
  514. }
  515. ]
  516. );
  517. return asSpinner;
  518. })();
  519. var info = {
  520. version: '0.4.3'
  521. };
  522. var NAMESPACE = 'asSpinner';
  523. var OtherAsSpinner = _jquery2.default.fn.asSpinner;
  524. var jQueryAsSpinner = function jQueryAsSpinner(options) {
  525. for (
  526. var _len2 = arguments.length,
  527. args = Array(_len2 > 1 ? _len2 - 1 : 0),
  528. _key2 = 1;
  529. _key2 < _len2;
  530. _key2++
  531. ) {
  532. args[_key2 - 1] = arguments[_key2];
  533. }
  534. if (typeof options === 'string') {
  535. var method = options;
  536. if (/^_/.test(method)) {
  537. return false;
  538. } else if (
  539. /^(get)$/.test(method) ||
  540. (method === 'val' && args.length === 0)
  541. ) {
  542. var instance = this.first().data(NAMESPACE);
  543. if (instance && typeof instance[method] === 'function') {
  544. return instance[method].apply(instance, args);
  545. }
  546. } else {
  547. return this.each(function() {
  548. var instance = _jquery2.default.data(this, NAMESPACE);
  549. if (instance && typeof instance[method] === 'function') {
  550. instance[method].apply(instance, args);
  551. }
  552. });
  553. }
  554. }
  555. return this.each(function() {
  556. if (!(0, _jquery2.default)(this).data(NAMESPACE)) {
  557. (0, _jquery2.default)(this).data(
  558. NAMESPACE,
  559. new asSpinner(this, options)
  560. );
  561. }
  562. });
  563. };
  564. _jquery2.default.fn.asSpinner = jQueryAsSpinner;
  565. _jquery2.default.asSpinner = _jquery2.default.extend(
  566. {
  567. setDefaults: asSpinner.setDefaults,
  568. noConflict: function noConflict() {
  569. _jquery2.default.fn.asSpinner = OtherAsSpinner;
  570. return jQueryAsSpinner;
  571. }
  572. },
  573. info
  574. );
  575. });