bjui-spinner.js 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171
  1. /*!
  2. * B-JUI v1.2 (http://b-jui.com)
  3. * Git@OSC (http://git.oschina.net/xknaan/B-JUI)
  4. * Copyright 2014 K'naan (xknaan@163.com).
  5. * Licensed under Apache (http://www.apache.org/licenses/LICENSE-2.0)
  6. */
  7. /* ========================================================================
  8. * B-JUI: bjui-spinner.js v1.2
  9. * @author K'naan (xknaan@163.com)
  10. * http://git.oschina.net/xknaan/B-JUI/blob/master/BJUI/js/bjui-spinner.js
  11. * ========================================================================
  12. * Copyright 2014 K'naan.
  13. * Licensed under Apache (http://www.apache.org/licenses/LICENSE-2.0)
  14. * ======================================================================== */
  15. +function ($) {
  16. 'use strict';
  17. // SPINNER CLASS DEFINITION
  18. // ======================
  19. var Spinner = function(element, options) {
  20. this.$element = $(element)
  21. this.options = options
  22. this.tools = this.TOOLS()
  23. this.$spinner = null
  24. this.height = this.$element.addClass('form-control').innerHeight()
  25. this.ivalue = Number(this.$element.val()) || 0
  26. }
  27. Spinner.DEFAULTS = {
  28. min: 0,
  29. max: 100,
  30. step: 1,
  31. decimalPlace: 0
  32. }
  33. Spinner.EVENTS = {
  34. afterChange : 'afterchange.bjui.spinner'
  35. }
  36. Spinner.prototype.TOOLS = function() {
  37. var that = this
  38. var tools = {
  39. changeVal: function($btn) {
  40. var $input = that.$element
  41. var ivalue = Number($input.val()) || Number(that.ivalue)
  42. var type = $btn.data('add') || -1
  43. var istart = that.options.min, iend = that.options.max, istep = that.options.step
  44. if (type == 1) {
  45. if (ivalue <= iend - istep)
  46. ivalue = ivalue + istep
  47. } else if (type == -1) {
  48. if (ivalue >= (istart + istep))
  49. ivalue = ivalue - istep
  50. } else if (ivalue > iend) {
  51. ivalue = iend
  52. } else if (ivalue < istart) {
  53. ivalue = istart
  54. }
  55. if (that.options.decimalPlace)
  56. ivalue = new String(ivalue.toFixed(that.options.decimalPlace))
  57. that.ivalue = ivalue
  58. $input
  59. .val(ivalue)
  60. .trigger(Spinner.EVENTS.afterChange, {value:ivalue})
  61. }
  62. }
  63. return tools
  64. }
  65. Spinner.prototype.init = function() {
  66. var that = this
  67. var $element = this.$element
  68. var options = this.options
  69. if (isNaN(this.options.min) || isNaN(this.options.max) || isNaN(this.options.step)) {
  70. BJUI.debug('Spinner Plugin: Parameter is non-numeric type!')
  71. return
  72. }
  73. this.addBtn()
  74. }
  75. Spinner.prototype.addBtn = function() {
  76. var that = this, $element = that.$element
  77. if (!this.$lookBtn && !$element.parent().hasClass('wrap_bjui_btn_box')) {
  78. this.$spinner = $(FRAG.spinnerBtn)
  79. $element.css({'paddingRight':'13px'}).wrap('<span class="wrap_bjui_btn_box"></span>')
  80. var $box = $element.parent()
  81. $box.css('position', 'relative')
  82. this.$spinner.css({'height':this.height}).appendTo($box)
  83. this.$spinner.on('selectstart', function() { return false })
  84. var timer = null
  85. that.$spinner.find('li').on('click', function(e) {
  86. that.tools.changeVal($(this))
  87. }).on('mousedown', function() {
  88. var $btn = $(this)
  89. timer = setInterval(function() {
  90. that.tools.changeVal($btn)
  91. }, 150)
  92. }).on('mouseup', function() { clearTimeout(timer) })
  93. }
  94. }
  95. Spinner.prototype.destroy = function() {
  96. if (this.$element.parent().hasClass('wrap_bjui_btn_box')) {
  97. this.$element.parent().find('.bjui-spinner').remove()
  98. this.$element.unwrap()
  99. }
  100. }
  101. // SPINNER PLUGIN DEFINITION
  102. // =======================
  103. function Plugin(option) {
  104. var args = arguments
  105. var property = option
  106. return this.each(function () {
  107. var $this = $(this)
  108. var options = $.extend({}, Spinner.DEFAULTS, $this.data(), typeof option == 'object' && option)
  109. var data = $this.data('bjui.spinner')
  110. if (!data) $this.data('bjui.spinner', (data = new Spinner(this, options)))
  111. if (typeof property == 'string' && $.isFunction(data[property])) {
  112. [].shift.apply(args)
  113. if (!args) data[property]()
  114. else data[property].apply(data, args)
  115. } else {
  116. data.init()
  117. }
  118. })
  119. }
  120. var old = $.fn.spinner
  121. $.fn.spinner = Plugin
  122. $.fn.spinner.Constructor = Spinner
  123. // SPINNER NO CONFLICT
  124. // =================
  125. $.fn.spinner.noConflict = function () {
  126. $.fn.spinner = old
  127. return this
  128. }
  129. // SPINNER DATA-API
  130. // ==============
  131. $(document).on(BJUI.eventType.initUI, function(e) {
  132. var $this = $(e.target).find('input[data-toggle="spinner"]')
  133. if (!$this.length) return
  134. Plugin.call($this)
  135. })
  136. }(jQuery);