confirm-button.js 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266
  1. /* ===========================================================
  2. * bootstrap-confirmation.js v1.0.1
  3. * http://ethaizone.github.io/Bootstrap-Confirmation/
  4. * ===========================================================
  5. * Copyright 2013 Nimit Suwannagate <ethaizone@hotmail.com>
  6. *
  7. * Licensed under the Apache License, Version 2.0 (the "License");
  8. * you may not use this file except in compliance with the License.
  9. * You may obtain a copy of the License at
  10. *
  11. * http://www.apache.org/licenses/LICENSE-2.0
  12. *
  13. * Unless required by applicable law or agreed to in writing, software
  14. * distributed under the License is distributed on an "AS IS" BASIS,
  15. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16. * See the License for the specific language governing permissions and
  17. * limitations under the License.
  18. * =========================================================== */
  19. !function ($) {
  20. "use strict"; // jshint ;_;
  21. /* CONFIRMATION PUBLIC CLASS DEFINITION
  22. * =============================== */
  23. //var for check event at body can have only one.
  24. var event_body = false;
  25. var Confirmation = function (element, options) {
  26. var that = this;
  27. // remove href attribute of button
  28. $(element).removeAttr('href')
  29. this.init('confirmation', element, options)
  30. $(element).on('show', function(e) {
  31. var options = that.options;
  32. var all = options.all_selector;
  33. if(options.singleton) {
  34. $(all).not(that.$element).confirmation('hide');
  35. }
  36. });
  37. $(element).on('shown', function(e) {
  38. var options = that.options;
  39. var all = options.all_selector;
  40. $(this).next('.popover').one('click.dismiss.confirmation', '[data-dismiss="confirmation"]', $.proxy(that.hide, that))
  41. if(that.isPopout()) {
  42. if(!event_body) {
  43. event_body = $('body').on('click', function (e) {
  44. if($(all).is(e.target)) return;
  45. if($(all).has(e.target).length) return;
  46. if($(all).next('div').has(e.target).length) return;
  47. $(all).confirmation('hide');
  48. $('body').unbind(e);
  49. event_body = false;
  50. return;
  51. });
  52. }
  53. }
  54. });
  55. }
  56. /* NOTE: CONFIRMATION EXTENDS BOOTSTRAP-TOOLTIP.js
  57. ========================================== */
  58. Confirmation.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype, {
  59. constructor: Confirmation
  60. , setContent: function () {
  61. var $tip = this.tip()
  62. , $btnOk = this.btnOk()
  63. , $btnCancel = this.btnCancel()
  64. , title = this.getTitle()
  65. , href = this.getHref()
  66. , target = this.getTarget()
  67. , $e = this.$element
  68. , btnOkClass = this.getBtnOkClass()
  69. , btnCancelClass = this.getBtnCancelClass()
  70. , btnOkLabel = this.getBtnOkLabel()
  71. , btnCancelLabel = this.getBtnCancelLabel()
  72. , o = this.options
  73. $tip.find('.popover-title').text(title)
  74. $btnOk.addClass(btnOkClass).html(btnOkLabel).attr('href', href).attr('target', target).on('click', o.onConfirm)
  75. $btnCancel.addClass(btnCancelClass).html(btnCancelLabel).on('click', o.onCancel)
  76. $tip.removeClass('fade top bottom left right in')
  77. }
  78. , hasContent: function () {
  79. return this.getTitle()
  80. }
  81. , isPopout: function () {
  82. var popout
  83. , $e = this.$element
  84. , o = this.options
  85. popout = $e.attr('data-popout') || (typeof o.popout == 'function' ? o.popout.call($e[0]) : o.popout)
  86. if(popout == 'false') popout = false;
  87. return popout
  88. }
  89. , getHref: function () {
  90. var href
  91. , $e = this.$element
  92. , o = this.options
  93. href = $e.attr('data-href') || (typeof o.href == 'function' ? o.href.call($e[0]) : o.href)
  94. return href
  95. }
  96. , getTarget: function () {
  97. var target
  98. , $e = this.$element
  99. , o = this.options
  100. target = $e.attr('data-target') || (typeof o.target == 'function' ? o.target.call($e[0]) : o.target)
  101. return target
  102. }
  103. , getBtnOkClass: function () {
  104. var btnOkClass
  105. , $e = this.$element
  106. , o = this.options
  107. btnOkClass = $e.attr('data-btnOkClass') || (typeof o.btnOkClass == 'function' ? o.btnOkClass.call($e[0]) : o.btnOkClass)
  108. return btnOkClass
  109. }
  110. , getBtnCancelClass: function () {
  111. var btnCancelClass
  112. , $e = this.$element
  113. , o = this.options
  114. btnCancelClass = $e.attr('data-btnCancelClass') || (typeof o.btnCancelClass == 'function' ? o.btnCancelClass.call($e[0]) : o.btnCancelClass)
  115. return btnCancelClass
  116. }
  117. , getBtnOkLabel: function () {
  118. var btnOkLabel
  119. , $e = this.$element
  120. , o = this.options
  121. btnOkLabel = $e.attr('data-btnOkLabel') || (typeof o.btnOkLabel == 'function' ? o.btnOkLabel.call($e[0]) : o.btnOkLabel)
  122. return btnOkLabel
  123. }
  124. , getBtnCancelLabel: function () {
  125. var btnCancelLabel
  126. , $e = this.$element
  127. , o = this.options
  128. btnCancelLabel = $e.attr('data-btnCancelLabel') || (typeof o.btnCancelLabel == 'function' ? o.btnCancelLabel.call($e[0]) : o.btnCancelLabel)
  129. return btnCancelLabel
  130. }
  131. , tip: function () {
  132. this.$tip = this.$tip || $(this.options.template)
  133. return this.$tip
  134. }
  135. , btnOk: function () {
  136. var $tip = this.tip()
  137. return $tip.find('.popover-content > div > a:not([data-dismiss="confirmation"])')
  138. }
  139. , btnCancel: function () {
  140. var $tip = this.tip()
  141. return $tip.find('.popover-content > div > a[data-dismiss="confirmation"]')
  142. }
  143. , hide: function () {
  144. var $btnOk = this.btnOk()
  145. , $btnCancel = this.btnCancel()
  146. $.fn.tooltip.Constructor.prototype.hide.call(this)
  147. $btnOk.off('click')
  148. $btnCancel.off('click')
  149. return this
  150. }
  151. , destroy: function () {
  152. this.hide().$element.off('.' + this.type).removeData(this.type)
  153. }
  154. })
  155. /* CONFIRMATION PLUGIN DEFINITION
  156. * ======================= */
  157. var old = $.fn.confirmation
  158. $.fn.confirmation = function (option) {
  159. var that = this
  160. return this.each(function () {
  161. var $this = $(this)
  162. , data = $this.data('confirmation')
  163. , options = typeof option == 'object' && option
  164. options = options || {}
  165. options.all_selector = that.selector
  166. if (!data) $this.data('confirmation', (data = new Confirmation(this, options)))
  167. if (typeof option == 'string') data[option]()
  168. })
  169. }
  170. $.fn.confirmation.Constructor = Confirmation
  171. $.fn.confirmation.defaults = $.extend({} , $.fn.tooltip.defaults, {
  172. placement: 'top'
  173. , trigger: 'click'
  174. , target : '_self'
  175. , href : '#'
  176. , title: 'Are you sure?'
  177. , template: '<div class="popover">' +
  178. '<div class="arrow"></div>' +
  179. '<h3 class="popover-title"></h3>' +
  180. '<div class="popover-content text-center">' +
  181. '<div class="btn-group">' +
  182. '<a class="btn btn-small" href="" target=""></a>' +
  183. '<a class="btn btn-small" data-dismiss="confirmation"></a>' +
  184. '</div>' +
  185. '</div>' +
  186. '</div>'
  187. , btnOkClass: 'btn-primary'
  188. , btnCancelClass: ''
  189. , btnOkLabel: '<i class="icon-ok-sign icon-white"></i> Yes'
  190. , btnCancelLabel: '<i class="icon-remove-sign"></i> No'
  191. , singleton: false
  192. , popout: false
  193. , onConfirm: function(){}
  194. , onCancel: function(){}
  195. })
  196. /* POPOVER NO CONFLICT
  197. * =================== */
  198. $.fn.confirmation.noConflict = function () {
  199. $.fn.confirmation = old
  200. return this
  201. }
  202. }(window.jQuery);