1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 |
|
14 |
|
15 |
|
16 |
|
17 |
|
18 |
|
19 |
|
20 |
|
21 | !function( $ ){
|
22 |
|
23 | "use strict"
|
24 |
|
25 | |
26 |
|
27 |
|
28 | var transitionEnd
|
29 |
|
30 | $(document).ready(function () {
|
31 |
|
32 | $.support.transition = (function () {
|
33 | var thisBody = document.body || document.documentElement
|
34 | , thisStyle = thisBody.style
|
35 | , support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.MsTransition !== undefined || thisStyle.OTransition !== undefined
|
36 | return support
|
37 | })()
|
38 |
|
39 |
|
40 | if ( $.support.transition ) {
|
41 | transitionEnd = "TransitionEnd"
|
42 | if ( $.browser.webkit ) {
|
43 | transitionEnd = "webkitTransitionEnd"
|
44 | } else if ( $.browser.mozilla ) {
|
45 | transitionEnd = "transitionend"
|
46 | } else if ( $.browser.opera ) {
|
47 | transitionEnd = "oTransitionEnd"
|
48 | }
|
49 | }
|
50 |
|
51 | })
|
52 |
|
53 |
|
54 | |
55 |
|
56 |
|
57 | var Modal = function ( content, options ) {
|
58 | this.settings = $.extend({}, $.fn.modal.defaults, options)
|
59 | this.$element = $(content)
|
60 | .delegate('.close', 'click.modal', $.proxy(this.hide, this))
|
61 |
|
62 | if ( this.settings.show ) {
|
63 | this.show()
|
64 | }
|
65 |
|
66 | return this
|
67 | }
|
68 |
|
69 | Modal.prototype = {
|
70 |
|
71 | toggle: function () {
|
72 | return this[!this.isShown ? 'show' : 'hide']()
|
73 | }
|
74 |
|
75 | , show: function () {
|
76 | var that = this
|
77 | this.isShown = true
|
78 | this.$element.trigger('show')
|
79 |
|
80 | escape.call(this)
|
81 | backdrop.call(this, function () {
|
82 | var transition = $.support.transition && that.$element.hasClass('fade')
|
83 |
|
84 | that.$element
|
85 | .appendTo(document.body)
|
86 | .show()
|
87 |
|
88 | if (transition) {
|
89 | that.$element[0].offsetWidth
|
90 | }
|
91 |
|
92 | that.$element.addClass('in')
|
93 |
|
94 | transition ?
|
95 | that.$element.one(transitionEnd, function () { that.$element.trigger('shown') }) :
|
96 | that.$element.trigger('shown')
|
97 |
|
98 | })
|
99 |
|
100 | return this
|
101 | }
|
102 |
|
103 | , hide: function (e) {
|
104 | e && e.preventDefault()
|
105 |
|
106 | if ( !this.isShown ) {
|
107 | return this
|
108 | }
|
109 |
|
110 | var that = this
|
111 | this.isShown = false
|
112 |
|
113 | escape.call(this)
|
114 |
|
115 | this.$element
|
116 | .trigger('hide')
|
117 | .removeClass('in')
|
118 |
|
119 | $.support.transition && this.$element.hasClass('fade') ?
|
120 | hideWithTransition.call(this) :
|
121 | hideModal.call(this)
|
122 |
|
123 | return this
|
124 | }
|
125 |
|
126 | }
|
127 |
|
128 |
|
129 | |
130 |
|
131 |
|
132 | function hideWithTransition() {
|
133 |
|
134 | var that = this
|
135 | , timeout = setTimeout(function () {
|
136 | that.$element.unbind(transitionEnd)
|
137 | hideModal.call(that)
|
138 | }, 500)
|
139 |
|
140 | this.$element.one(transitionEnd, function () {
|
141 | clearTimeout(timeout)
|
142 | hideModal.call(that)
|
143 | })
|
144 | }
|
145 |
|
146 | function hideModal (that) {
|
147 | this.$element
|
148 | .hide()
|
149 | .trigger('hidden')
|
150 |
|
151 | backdrop.call(this)
|
152 | }
|
153 |
|
154 | function backdrop ( callback ) {
|
155 | var that = this
|
156 | , animate = this.$element.hasClass('fade') ? 'fade' : ''
|
157 | if ( this.isShown && this.settings.backdrop ) {
|
158 | var doAnimate = $.support.transition && animate
|
159 |
|
160 | this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
|
161 | .appendTo(document.body)
|
162 |
|
163 | if ( this.settings.backdrop != 'static' ) {
|
164 | this.$backdrop.click($.proxy(this.hide, this))
|
165 | }
|
166 |
|
167 | if ( doAnimate ) {
|
168 | this.$backdrop[0].offsetWidth
|
169 | }
|
170 |
|
171 | this.$backdrop.addClass('in')
|
172 |
|
173 | doAnimate ?
|
174 | this.$backdrop.one(transitionEnd, callback) :
|
175 | callback()
|
176 |
|
177 | } else if ( !this.isShown && this.$backdrop ) {
|
178 | this.$backdrop.removeClass('in')
|
179 |
|
180 | $.support.transition && this.$element.hasClass('fade')?
|
181 | this.$backdrop.one(transitionEnd, $.proxy(removeBackdrop, this)) :
|
182 | removeBackdrop.call(this)
|
183 |
|
184 | } else if ( callback ) {
|
185 | callback()
|
186 | }
|
187 | }
|
188 |
|
189 | function removeBackdrop() {
|
190 | this.$backdrop.remove()
|
191 | this.$backdrop = null
|
192 | }
|
193 |
|
194 | function escape() {
|
195 | var that = this
|
196 | if ( this.isShown && this.settings.keyboard ) {
|
197 | $(document).bind('keyup.modal', function ( e ) {
|
198 | if ( e.which == 27 ) {
|
199 | that.hide()
|
200 | }
|
201 | })
|
202 | } else if ( !this.isShown ) {
|
203 | $(document).unbind('keyup.modal')
|
204 | }
|
205 | }
|
206 |
|
207 |
|
208 | |
209 |
|
210 |
|
211 | $.fn.modal = function ( options ) {
|
212 | var modal = this.data('modal')
|
213 |
|
214 | if (!modal) {
|
215 |
|
216 | if (typeof options == 'string') {
|
217 | options = {
|
218 | show: /show|toggle/.test(options)
|
219 | }
|
220 | }
|
221 |
|
222 | return this.each(function () {
|
223 | $(this).data('modal', new Modal(this, options))
|
224 | })
|
225 | }
|
226 |
|
227 | if ( options === true ) {
|
228 | return modal
|
229 | }
|
230 |
|
231 | if ( typeof options == 'string' ) {
|
232 | modal[options]()
|
233 | } else if ( modal ) {
|
234 | modal.toggle()
|
235 | }
|
236 |
|
237 | return this
|
238 | }
|
239 |
|
240 | $.fn.modal.Modal = Modal
|
241 |
|
242 | $.fn.modal.defaults = {
|
243 | backdrop: false
|
244 | , keyboard: false
|
245 | , show: false
|
246 | }
|
247 |
|
248 |
|
249 | |
250 |
|
251 |
|
252 | $(document).ready(function () {
|
253 | $('body').delegate('[data-controls-modal]', 'click', function (e) {
|
254 | e.preventDefault()
|
255 | var $this = $(this).data('show', true)
|
256 | $('#' + $this.attr('data-controls-modal')).modal( $this.data() )
|
257 | })
|
258 | })
|
259 |
|
260 | }( window.jQuery || window.ender );
|