transition_events_js 0.1
Sign up to get free protection for your applications and to get access to all the features.
- data/ChangeLog +2 -0
- data/LICENSE +165 -0
- data/README.md +164 -0
- data/lib/assets/javascripts/transition-events.js +195 -0
- data/lib/transition_events_js.rb +8 -0
- metadata +70 -0
data/ChangeLog
ADDED
data/LICENSE
ADDED
@@ -0,0 +1,165 @@
|
|
1
|
+
GNU LESSER GENERAL PUBLIC LICENSE
|
2
|
+
Version 3, 29 June 2007
|
3
|
+
|
4
|
+
Copyright (C) 2007 Free Software Foundation, Inc. <http://fsf.org/>
|
5
|
+
Everyone is permitted to copy and distribute verbatim copies
|
6
|
+
of this license document, but changing it is not allowed.
|
7
|
+
|
8
|
+
|
9
|
+
This version of the GNU Lesser General Public License incorporates
|
10
|
+
the terms and conditions of version 3 of the GNU General Public
|
11
|
+
License, supplemented by the additional permissions listed below.
|
12
|
+
|
13
|
+
0. Additional Definitions.
|
14
|
+
|
15
|
+
As used herein, "this License" refers to version 3 of the GNU Lesser
|
16
|
+
General Public License, and the "GNU GPL" refers to version 3 of the GNU
|
17
|
+
General Public License.
|
18
|
+
|
19
|
+
"The Library" refers to a covered work governed by this License,
|
20
|
+
other than an Application or a Combined Work as defined below.
|
21
|
+
|
22
|
+
An "Application" is any work that makes use of an interface provided
|
23
|
+
by the Library, but which is not otherwise based on the Library.
|
24
|
+
Defining a subclass of a class defined by the Library is deemed a mode
|
25
|
+
of using an interface provided by the Library.
|
26
|
+
|
27
|
+
A "Combined Work" is a work produced by combining or linking an
|
28
|
+
Application with the Library. The particular version of the Library
|
29
|
+
with which the Combined Work was made is also called the "Linked
|
30
|
+
Version".
|
31
|
+
|
32
|
+
The "Minimal Corresponding Source" for a Combined Work means the
|
33
|
+
Corresponding Source for the Combined Work, excluding any source code
|
34
|
+
for portions of the Combined Work that, considered in isolation, are
|
35
|
+
based on the Application, and not on the Linked Version.
|
36
|
+
|
37
|
+
The "Corresponding Application Code" for a Combined Work means the
|
38
|
+
object code and/or source code for the Application, including any data
|
39
|
+
and utility programs needed for reproducing the Combined Work from the
|
40
|
+
Application, but excluding the System Libraries of the Combined Work.
|
41
|
+
|
42
|
+
1. Exception to Section 3 of the GNU GPL.
|
43
|
+
|
44
|
+
You may convey a covered work under sections 3 and 4 of this License
|
45
|
+
without being bound by section 3 of the GNU GPL.
|
46
|
+
|
47
|
+
2. Conveying Modified Versions.
|
48
|
+
|
49
|
+
If you modify a copy of the Library, and, in your modifications, a
|
50
|
+
facility refers to a function or data to be supplied by an Application
|
51
|
+
that uses the facility (other than as an argument passed when the
|
52
|
+
facility is invoked), then you may convey a copy of the modified
|
53
|
+
version:
|
54
|
+
|
55
|
+
a) under this License, provided that you make a good faith effort to
|
56
|
+
ensure that, in the event an Application does not supply the
|
57
|
+
function or data, the facility still operates, and performs
|
58
|
+
whatever part of its purpose remains meaningful, or
|
59
|
+
|
60
|
+
b) under the GNU GPL, with none of the additional permissions of
|
61
|
+
this License applicable to that copy.
|
62
|
+
|
63
|
+
3. Object Code Incorporating Material from Library Header Files.
|
64
|
+
|
65
|
+
The object code form of an Application may incorporate material from
|
66
|
+
a header file that is part of the Library. You may convey such object
|
67
|
+
code under terms of your choice, provided that, if the incorporated
|
68
|
+
material is not limited to numerical parameters, data structure
|
69
|
+
layouts and accessors, or small macros, inline functions and templates
|
70
|
+
(ten or fewer lines in length), you do both of the following:
|
71
|
+
|
72
|
+
a) Give prominent notice with each copy of the object code that the
|
73
|
+
Library is used in it and that the Library and its use are
|
74
|
+
covered by this License.
|
75
|
+
|
76
|
+
b) Accompany the object code with a copy of the GNU GPL and this license
|
77
|
+
document.
|
78
|
+
|
79
|
+
4. Combined Works.
|
80
|
+
|
81
|
+
You may convey a Combined Work under terms of your choice that,
|
82
|
+
taken together, effectively do not restrict modification of the
|
83
|
+
portions of the Library contained in the Combined Work and reverse
|
84
|
+
engineering for debugging such modifications, if you also do each of
|
85
|
+
the following:
|
86
|
+
|
87
|
+
a) Give prominent notice with each copy of the Combined Work that
|
88
|
+
the Library is used in it and that the Library and its use are
|
89
|
+
covered by this License.
|
90
|
+
|
91
|
+
b) Accompany the Combined Work with a copy of the GNU GPL and this license
|
92
|
+
document.
|
93
|
+
|
94
|
+
c) For a Combined Work that displays copyright notices during
|
95
|
+
execution, include the copyright notice for the Library among
|
96
|
+
these notices, as well as a reference directing the user to the
|
97
|
+
copies of the GNU GPL and this license document.
|
98
|
+
|
99
|
+
d) Do one of the following:
|
100
|
+
|
101
|
+
0) Convey the Minimal Corresponding Source under the terms of this
|
102
|
+
License, and the Corresponding Application Code in a form
|
103
|
+
suitable for, and under terms that permit, the user to
|
104
|
+
recombine or relink the Application with a modified version of
|
105
|
+
the Linked Version to produce a modified Combined Work, in the
|
106
|
+
manner specified by section 6 of the GNU GPL for conveying
|
107
|
+
Corresponding Source.
|
108
|
+
|
109
|
+
1) Use a suitable shared library mechanism for linking with the
|
110
|
+
Library. A suitable mechanism is one that (a) uses at run time
|
111
|
+
a copy of the Library already present on the user's computer
|
112
|
+
system, and (b) will operate properly with a modified version
|
113
|
+
of the Library that is interface-compatible with the Linked
|
114
|
+
Version.
|
115
|
+
|
116
|
+
e) Provide Installation Information, but only if you would otherwise
|
117
|
+
be required to provide such information under section 6 of the
|
118
|
+
GNU GPL, and only to the extent that such information is
|
119
|
+
necessary to install and execute a modified version of the
|
120
|
+
Combined Work produced by recombining or relinking the
|
121
|
+
Application with a modified version of the Linked Version. (If
|
122
|
+
you use option 4d0, the Installation Information must accompany
|
123
|
+
the Minimal Corresponding Source and Corresponding Application
|
124
|
+
Code. If you use option 4d1, you must provide the Installation
|
125
|
+
Information in the manner specified by section 6 of the GNU GPL
|
126
|
+
for conveying Corresponding Source.)
|
127
|
+
|
128
|
+
5. Combined Libraries.
|
129
|
+
|
130
|
+
You may place library facilities that are a work based on the
|
131
|
+
Library side by side in a single library together with other library
|
132
|
+
facilities that are not Applications and are not covered by this
|
133
|
+
License, and convey such a combined library under terms of your
|
134
|
+
choice, if you do both of the following:
|
135
|
+
|
136
|
+
a) Accompany the combined library with a copy of the same work based
|
137
|
+
on the Library, uncombined with any other library facilities,
|
138
|
+
conveyed under the terms of this License.
|
139
|
+
|
140
|
+
b) Give prominent notice with the combined library that part of it
|
141
|
+
is a work based on the Library, and explaining where to find the
|
142
|
+
accompanying uncombined form of the same work.
|
143
|
+
|
144
|
+
6. Revised Versions of the GNU Lesser General Public License.
|
145
|
+
|
146
|
+
The Free Software Foundation may publish revised and/or new versions
|
147
|
+
of the GNU Lesser General Public License from time to time. Such new
|
148
|
+
versions will be similar in spirit to the present version, but may
|
149
|
+
differ in detail to address new problems or concerns.
|
150
|
+
|
151
|
+
Each version is given a distinguishing version number. If the
|
152
|
+
Library as you received it specifies that a certain numbered version
|
153
|
+
of the GNU Lesser General Public License "or any later version"
|
154
|
+
applies to it, you have the option of following the terms and
|
155
|
+
conditions either of that published version or of any later version
|
156
|
+
published by the Free Software Foundation. If the Library as you
|
157
|
+
received it does not specify a version number of the GNU Lesser
|
158
|
+
General Public License, you may choose any version of the GNU Lesser
|
159
|
+
General Public License ever published by the Free Software Foundation.
|
160
|
+
|
161
|
+
If the Library as you received it specifies that a proxy can decide
|
162
|
+
whether future versions of the GNU Lesser General Public License shall
|
163
|
+
apply, that proxy's public statement of acceptance of any version is
|
164
|
+
permanent authorization for you to choose that version for the
|
165
|
+
Library.
|
data/README.md
ADDED
@@ -0,0 +1,164 @@
|
|
1
|
+
# jQuery Transition Events Plugin
|
2
|
+
|
3
|
+
CSS Transition allows to write simple animation directly in CSS. It’s simpler,
|
4
|
+
faster and cleaner, that JavaScript animation by `jQuery.fn.animate`.
|
5
|
+
But sometimes we need good old complete callback in JavaScript for
|
6
|
+
CSS Transitions animation (for example, if our animation isn’t so simple).
|
7
|
+
|
8
|
+
This jQuery plugin allows to set listeners to [CSS Transitions] animation end or
|
9
|
+
specific part:
|
10
|
+
|
11
|
+
CSS with transitions:
|
12
|
+
```css
|
13
|
+
.slider {
|
14
|
+
transition: left 600ms;
|
15
|
+
left: 0;
|
16
|
+
}
|
17
|
+
.slider.to-right {
|
18
|
+
left: -100px;
|
19
|
+
}
|
20
|
+
|
21
|
+
.fliper {
|
22
|
+
transition: transform 600ms;
|
23
|
+
transform: rotateY(0);
|
24
|
+
}
|
25
|
+
.fliper.rotate {
|
26
|
+
transform: rotateY(180deg);
|
27
|
+
}
|
28
|
+
```
|
29
|
+
|
30
|
+
JavaScript with callbacks:
|
31
|
+
```js
|
32
|
+
$('.slider').addClass('to-right').transitionEnd(function () {
|
33
|
+
playVideo( $(this).find('.right-part').find('video') );
|
34
|
+
});
|
35
|
+
|
36
|
+
$('.fliper').addClass('rotate'),transitionAt(0.5, function () {
|
37
|
+
// Note, that we do double check for class, not just call `toggle`,
|
38
|
+
// because `transitionAt` will be fired even if transition will be canceled.
|
39
|
+
$(this).find('.backface').toggle($(this).hasClass('rotate'));
|
40
|
+
});
|
41
|
+
```
|
42
|
+
|
43
|
+
Plugin requires jQuery 1.8 or higher.
|
44
|
+
|
45
|
+
Sponsored by [Evil Martians].
|
46
|
+
|
47
|
+
[CSS Transitions]: https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_transitions
|
48
|
+
[Evil Martians]: http://evilmartians.com/
|
49
|
+
|
50
|
+
## $.fn.transitionEnd
|
51
|
+
|
52
|
+
Modern browsers have `transitionend` event. But some old browsers don’t support
|
53
|
+
CSS Transitions (and this event), and others require vendor prefix for
|
54
|
+
event name.
|
55
|
+
|
56
|
+
This plugin adds syntax sugar and hides vendor prefix problem from you.
|
57
|
+
If browser doesn’t have support, callbacks will be called immediately
|
58
|
+
(because there is no animation).
|
59
|
+
|
60
|
+
If transition is set for several properties, `$.fn.transitionEnd` will execute
|
61
|
+
callback on every property. For example:
|
62
|
+
|
63
|
+
```css
|
64
|
+
.car {
|
65
|
+
transition-property: top, left;
|
66
|
+
transition-duration: 1s, 4s;
|
67
|
+
transition-delay: 1s;
|
68
|
+
}
|
69
|
+
```
|
70
|
+
|
71
|
+
```js
|
72
|
+
$('.car').addClass('at-home').transitionEnd(function (e) {
|
73
|
+
console.log(e.propertyName + ' ' + e.elapsedTime);
|
74
|
+
});
|
75
|
+
```
|
76
|
+
|
77
|
+
This code will print `"top 1"` and `"left 4"`.
|
78
|
+
|
79
|
+
Note, if transition is canceled before finishing (for example, you add
|
80
|
+
transition to hover effect, and object looses hover, before transition
|
81
|
+
will ends), `$.fn.transitionEnd` won’t execute callback.
|
82
|
+
|
83
|
+
## $.fn.transitionAt
|
84
|
+
|
85
|
+
Also plugin has additional `$.fn.transitionAt` function to set callback
|
86
|
+
to some part of transition (for example in the middle of animation, to hide
|
87
|
+
backface on rotate animation). Callback will be called after
|
88
|
+
`delay + (durationPart * duration)`.
|
89
|
+
|
90
|
+
If transition is set for several properties, `$.fn.transitionEnd` will execute
|
91
|
+
callback on every property.
|
92
|
+
|
93
|
+
Note, that `transitionAt` callback will be fired even if transition is canceled
|
94
|
+
(because JavaScript can’t know that).
|
95
|
+
|
96
|
+
## Event object
|
97
|
+
|
98
|
+
Callbacks get object with properties:
|
99
|
+
* `type` – event name. For `transitionend` event it will be often have
|
100
|
+
vendor prefix. For `$.fn.transitionAt` it will be `transitionat`.
|
101
|
+
* `currentTarget` – DOM node with CSS transition.
|
102
|
+
* `propertyName` – CSS property name, which has transition. it will be empty,
|
103
|
+
if CSS Transitions aren’t supported.
|
104
|
+
* `elapsedTime` – number of seconds the transition had been running at the time
|
105
|
+
the event fired. This value isn't affected by the value of `transition-delay`.
|
106
|
+
It will be zero, if CSS Transitions isn’t supported.
|
107
|
+
|
108
|
+
If CSS Transition is supported, `$.fn.transitionEnd` will send original browser
|
109
|
+
event to callback (with this properties too). If you use `$.fn.transitionAt` or
|
110
|
+
there is no CSS Transitions support, callback will receive simple object
|
111
|
+
with just these 4 properties.
|
112
|
+
|
113
|
+
## Extra
|
114
|
+
|
115
|
+
Free additional present from plugin: you can check CSS Transition support:
|
116
|
+
|
117
|
+
```js
|
118
|
+
if ( $.TransitionEvents.isSupported() ) {
|
119
|
+
// CSS Transitions is supported
|
120
|
+
}
|
121
|
+
```
|
122
|
+
|
123
|
+
## Installing
|
124
|
+
|
125
|
+
### Ruby on Rails
|
126
|
+
|
127
|
+
For Ruby on Rails you can use gem for Assets Pipeline.
|
128
|
+
|
129
|
+
1. Add `transition_events_js` gem to `Gemfile`:
|
130
|
+
|
131
|
+
```ruby
|
132
|
+
gem "transition_events_js"
|
133
|
+
```
|
134
|
+
|
135
|
+
2. Install gems:
|
136
|
+
|
137
|
+
```sh
|
138
|
+
bundle install
|
139
|
+
```
|
140
|
+
|
141
|
+
3. Include plugin to your `application.js.coffee`:
|
142
|
+
|
143
|
+
```coffee
|
144
|
+
#= require transition-events
|
145
|
+
```
|
146
|
+
|
147
|
+
### Others
|
148
|
+
|
149
|
+
If you don’t use any assets packaging manager (that’s very bad idea), you can use
|
150
|
+
already minified version of the library.
|
151
|
+
Take it from: <https://github.com/ai/transition-events/downloads>.
|
152
|
+
|
153
|
+
## Contributing
|
154
|
+
|
155
|
+
Open `test.html` in repository to run intergration tests.
|
156
|
+
|
157
|
+
## License
|
158
|
+
|
159
|
+
Plugin is licensed under the GNU Lesser General Public License version 3.
|
160
|
+
See the LICENSE file or http://www.gnu.org/licenses/lgpl.html.
|
161
|
+
|
162
|
+
## Author
|
163
|
+
|
164
|
+
Andrey “A.I.” Sitnik <andrey@sitnik.ru>
|
@@ -0,0 +1,195 @@
|
|
1
|
+
/*
|
2
|
+
* Copyright 2012 Andrey “A.I.” Sitnik <andrey@sitnik.ru>,
|
3
|
+
* sponsored by Evil Martians.
|
4
|
+
*
|
5
|
+
* This program is free software: you can redistribute it and/or modify
|
6
|
+
* it under the terms of the GNU Lesser General Public License as published by
|
7
|
+
* the Free Software Foundation, either version 3 of the License, or
|
8
|
+
* (at your option) any later version.
|
9
|
+
*
|
10
|
+
* This program is distributed in the hope that it will be useful,
|
11
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
12
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
13
|
+
* GNU Lesser General Public License for more details.
|
14
|
+
*
|
15
|
+
* You should have received a copy of the GNU Lesser General Public License
|
16
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
17
|
+
*/
|
18
|
+
|
19
|
+
;(function($) {
|
20
|
+
"use strict";
|
21
|
+
|
22
|
+
// Common methods and properties for jQuery Transition Events plugin.
|
23
|
+
// Mostly for internal usage, but maybe helpful for some hack stuff:
|
24
|
+
//
|
25
|
+
// if ( $.TransitionEvents.isSupported() ) {
|
26
|
+
// // CSS Transitions is supported
|
27
|
+
// }
|
28
|
+
$.TransitionEvents = {
|
29
|
+
|
30
|
+
// Hash of property name to event name with vendor prefixes.
|
31
|
+
// It is used to detect prefix.
|
32
|
+
_names: {
|
33
|
+
// Webkit must be on bottom, because Opera try to use webkit
|
34
|
+
// prefix.
|
35
|
+
'transition': 'transitionend',
|
36
|
+
'OTransition': 'oTransitionEnd',
|
37
|
+
'WebkitTransition': 'webkitTransitionEnd',
|
38
|
+
'MozTransition': 'transitionend'
|
39
|
+
},
|
40
|
+
|
41
|
+
// Return array of milliseconds for CSS value of `transition-duration`.
|
42
|
+
// It’s used in `$.fn.transitionAt`.
|
43
|
+
_parseTimes: function (string) {
|
44
|
+
var value, array = string.split(/,\s*/);
|
45
|
+
for (var i = 0; i < array.length; i++) {
|
46
|
+
value = array[i];
|
47
|
+
array[i] = parseFloat(value);
|
48
|
+
if ( value.match(/\ds/) ) {
|
49
|
+
array[i] = array[i] * 1000;
|
50
|
+
}
|
51
|
+
}
|
52
|
+
return array;
|
53
|
+
},
|
54
|
+
|
55
|
+
// Cached event name with vendor prefix. It will be detected by
|
56
|
+
// `detectPrefix`. Without transition support it will be `false`.
|
57
|
+
cachedEvent: null,
|
58
|
+
|
59
|
+
// Cached transition property name with vendor prefix. It will be
|
60
|
+
// detected by `detectPrefix`. Without transition support it will be
|
61
|
+
// `false`.
|
62
|
+
cachedProp: null,
|
63
|
+
|
64
|
+
// Detect vendor prefix and cache names to `cachedEvent` and
|
65
|
+
// `cachedProp`. On first call it return `true` if prefix is founded or
|
66
|
+
// `false` if transitions is’t supported. If vendor prefix is already
|
67
|
+
// detected, it will return `undefined`.
|
68
|
+
detectPrefix: function () {
|
69
|
+
if ( typeof(this.cachedEvent) == 'undefined' ) {
|
70
|
+
return;
|
71
|
+
}
|
72
|
+
|
73
|
+
for ( var prop in this._names ) {
|
74
|
+
if ( typeof(document.body.style[prop]) != 'undefined' ) {
|
75
|
+
this.cachedProp = prop;
|
76
|
+
this.cachedEvent = this._names[prop];
|
77
|
+
return true;
|
78
|
+
}
|
79
|
+
}
|
80
|
+
|
81
|
+
this.cachedProp = false;
|
82
|
+
this.cachedEvent = false;
|
83
|
+
return false;
|
84
|
+
},
|
85
|
+
|
86
|
+
// Return `true` if browser support CSS Transitions.
|
87
|
+
isSupported: function () {
|
88
|
+
this.detectPrefix();
|
89
|
+
return this.cachedProp !== false;
|
90
|
+
}
|
91
|
+
|
92
|
+
}
|
93
|
+
|
94
|
+
// jQuery node methods.
|
95
|
+
$.extend($.fn, {
|
96
|
+
|
97
|
+
// Call `callback`, when current transition will end. Callback will
|
98
|
+
// get event object with `propertyName` and `elapsedTime` properties.
|
99
|
+
//
|
100
|
+
// It just bind to `transitionend` event, but detect vendor prefix and
|
101
|
+
// call `callback` immediately without CSS Transitions support.
|
102
|
+
//
|
103
|
+
// Note, that `callback` will get original event object, not from
|
104
|
+
// jQuery.
|
105
|
+
//
|
106
|
+
// $('.slider').addClass('to-right').transitionEnd(function () {
|
107
|
+
// playVideo( $(this).find('.right-part').find('video') );
|
108
|
+
// });
|
109
|
+
transitionEnd: function (callback) {
|
110
|
+
if ( !$.TransitionEvents.isSupported() ) {
|
111
|
+
for (var i = 0; i < this.length; i++) {
|
112
|
+
callback.call(this[i], {
|
113
|
+
type: 'transitionend',
|
114
|
+
elapsedTime: 0,
|
115
|
+
propertyName: '',
|
116
|
+
currentTarget: this[i],
|
117
|
+
});
|
118
|
+
}
|
119
|
+
return this;
|
120
|
+
}
|
121
|
+
|
122
|
+
var event = $.TransitionEvents.cachedEvent;
|
123
|
+
for (var i = 0; i < this.length; i++) {
|
124
|
+
this[i].addEventListener(event, function (e) {
|
125
|
+
callback.call(this, e);
|
126
|
+
});
|
127
|
+
}
|
128
|
+
return this;
|
129
|
+
},
|
130
|
+
|
131
|
+
// Call `callback`, when part of transition will be passed.
|
132
|
+
// So, it call `callback` after `delay + (durationPart * duration)`
|
133
|
+
// time.
|
134
|
+
//
|
135
|
+
// Note, that because JS haven’t any way to detect, that transition
|
136
|
+
// is canceled (for example, you add transition to hover effect, and
|
137
|
+
// object loose hover, before transition will end, so `transitionend`
|
138
|
+
// will be not fired) `transitionAt` anyway will call `callback` in
|
139
|
+
// given time.
|
140
|
+
//
|
141
|
+
// $('.fliper').addClass('rotate'),transitionAt(0.5, function () {
|
142
|
+
// // Note, that we do double check for class, not just call
|
143
|
+
// // `toggle`, because `transitionAt` will be fired even
|
144
|
+
// // if transition will be canceled.
|
145
|
+
// $(this).find('.backface').toggle($(this).hasClass('rotate'));
|
146
|
+
// });
|
147
|
+
transitionAt: function (durationPart, callback) {
|
148
|
+
if ( !$.TransitionEvents.isSupported() ) {
|
149
|
+
for (var i = 0; i < this.length; i++) {
|
150
|
+
callback.call(this[i], {
|
151
|
+
type: 'transitionat',
|
152
|
+
elapsedTime: 0,
|
153
|
+
propertyName: '',
|
154
|
+
currentTarget: this[i],
|
155
|
+
});
|
156
|
+
}
|
157
|
+
return this;
|
158
|
+
}
|
159
|
+
|
160
|
+
var prefix = $.TransitionEvents.cachedProp;
|
161
|
+
for (var i = 0; i < this.length; i++) {
|
162
|
+
var el = $(this[i]);
|
163
|
+
var props = el.css('transition-property').split(/,\s*/);
|
164
|
+
var durations = el.css('transition-duration');
|
165
|
+
var delays = el.css('transition-delay');
|
166
|
+
|
167
|
+
durations = $.TransitionEvents._parseTimes(durations);
|
168
|
+
delays = $.TransitionEvents._parseTimes(delays);
|
169
|
+
|
170
|
+
var prop, duration, delay, after, elapsed;
|
171
|
+
for (var j = 0; j < props.length; j++) {
|
172
|
+
prop = props[j];
|
173
|
+
duration = durations[ durations.length == 1 ? 0 : j ];
|
174
|
+
delay = delays[ delays.length == 1 ? 0 : j ];
|
175
|
+
after = delay + (duration * durationPart);
|
176
|
+
elapsed = duration * durationPart / 1000;
|
177
|
+
|
178
|
+
(function (el, prop, after, elapsed) {
|
179
|
+
setTimeout(function () {
|
180
|
+
callback.call(el[0], {
|
181
|
+
type: 'transitionat',
|
182
|
+
elapsedTime: elapsed,
|
183
|
+
propertyName: prop,
|
184
|
+
currentTarget: el[0]
|
185
|
+
});
|
186
|
+
}, after);
|
187
|
+
})(el, prop, after, elapsed);
|
188
|
+
}
|
189
|
+
}
|
190
|
+
return this;
|
191
|
+
}
|
192
|
+
|
193
|
+
});
|
194
|
+
|
195
|
+
}).call(this, jQuery);
|
metadata
ADDED
@@ -0,0 +1,70 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: transition_events_js
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: '0.1'
|
5
|
+
prerelease:
|
6
|
+
platform: ruby
|
7
|
+
authors:
|
8
|
+
- Andrey "A.I" Sitnik
|
9
|
+
autorequire:
|
10
|
+
bindir: bin
|
11
|
+
cert_chain: []
|
12
|
+
date: 2012-09-05 00:00:00.000000000 Z
|
13
|
+
dependencies:
|
14
|
+
- !ruby/object:Gem::Dependency
|
15
|
+
name: sprockets
|
16
|
+
requirement: !ruby/object:Gem::Requirement
|
17
|
+
none: false
|
18
|
+
requirements:
|
19
|
+
- - ! '>='
|
20
|
+
- !ruby/object:Gem::Version
|
21
|
+
version: '2'
|
22
|
+
type: :runtime
|
23
|
+
prerelease: false
|
24
|
+
version_requirements: !ruby/object:Gem::Requirement
|
25
|
+
none: false
|
26
|
+
requirements:
|
27
|
+
- - ! '>='
|
28
|
+
- !ruby/object:Gem::Version
|
29
|
+
version: '2'
|
30
|
+
description:
|
31
|
+
email:
|
32
|
+
- andrey@sitnik.ru
|
33
|
+
executables: []
|
34
|
+
extensions: []
|
35
|
+
extra_rdoc_files:
|
36
|
+
- LICENSE
|
37
|
+
- README.md
|
38
|
+
- ChangeLog
|
39
|
+
files:
|
40
|
+
- lib/assets/javascripts/transition-events.js
|
41
|
+
- lib/transition_events_js.rb
|
42
|
+
- LICENSE
|
43
|
+
- README.md
|
44
|
+
- ChangeLog
|
45
|
+
homepage: https://github.com/ai/transition-events
|
46
|
+
licenses: []
|
47
|
+
post_install_message:
|
48
|
+
rdoc_options: []
|
49
|
+
require_paths:
|
50
|
+
- lib
|
51
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
52
|
+
none: false
|
53
|
+
requirements:
|
54
|
+
- - ! '>='
|
55
|
+
- !ruby/object:Gem::Version
|
56
|
+
version: '0'
|
57
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
58
|
+
none: false
|
59
|
+
requirements:
|
60
|
+
- - ! '>='
|
61
|
+
- !ruby/object:Gem::Version
|
62
|
+
version: '0'
|
63
|
+
requirements: []
|
64
|
+
rubyforge_project:
|
65
|
+
rubygems_version: 1.8.23
|
66
|
+
signing_key:
|
67
|
+
specification_version: 3
|
68
|
+
summary: jQuery plugin to set listeners for CSS Transition animation end or specific
|
69
|
+
part.
|
70
|
+
test_files: []
|