spinjs-rails 0.0.3 → 0.0.4

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,5 +1,5 @@
1
1
  module Spinjs
2
2
  module Rails
3
- VERSION = "0.0.3"
3
+ VERSION = "0.0.4"
4
4
  end
5
5
  end
@@ -1,47 +1,45 @@
1
- //fgnass.github.com/spin.js#v1.2.5
2
- (function(window, document, undefined) {
1
+ //fgnass.github.com/spin.js#v1.2.6
2
+ !function(window, document, undefined) {
3
3
 
4
- /**
5
- * Copyright (c) 2011 Felix Gnass [fgnass at neteye dot de]
6
- * Licensed under the MIT license
7
- */
4
+ /**
5
+ * Copyright (c) 2011 Felix Gnass [fgnass at neteye dot de]
6
+ * Licensed under the MIT license
7
+ */
8
8
 
9
- var prefixes = ['webkit', 'Moz', 'ms', 'O']; /* Vendor prefixes */
10
- var animations = {}; /* Animation rules keyed by their name */
11
- var useCssAnimations;
9
+ var prefixes = ['webkit', 'Moz', 'ms', 'O'] /* Vendor prefixes */
10
+ , animations = {} /* Animation rules keyed by their name */
11
+ , useCssAnimations
12
12
 
13
13
  /**
14
14
  * Utility function to create elements. If no tag name is given,
15
15
  * a DIV is created. Optionally properties can be passed.
16
16
  */
17
17
  function createEl(tag, prop) {
18
- var el = document.createElement(tag || 'div');
19
- var n;
18
+ var el = document.createElement(tag || 'div')
19
+ , n
20
20
 
21
- for(n in prop) {
22
- el[n] = prop[n];
23
- }
24
- return el;
21
+ for(n in prop) el[n] = prop[n]
22
+ return el
25
23
  }
26
24
 
27
25
  /**
28
26
  * Appends children and returns the parent.
29
27
  */
30
28
  function ins(parent /* child1, child2, ...*/) {
31
- for (var i=1, n=arguments.length; i<n; i++) {
32
- parent.appendChild(arguments[i]);
33
- }
34
- return parent;
29
+ for (var i=1, n=arguments.length; i<n; i++)
30
+ parent.appendChild(arguments[i])
31
+
32
+ return parent
35
33
  }
36
34
 
37
35
  /**
38
36
  * Insert a new stylesheet to hold the @keyframe or VML rules.
39
37
  */
40
38
  var sheet = function() {
41
- var el = createEl('style');
42
- ins(document.getElementsByTagName('head')[0], el);
43
- return el.sheet || el.styleSheet;
44
- }();
39
+ var el = createEl('style', {type : 'text/css'})
40
+ ins(document.getElementsByTagName('head')[0], el)
41
+ return el.sheet || el.styleSheet
42
+ }()
45
43
 
46
44
  /**
47
45
  * Creates an opacity keyframe animation rule and returns its name.
@@ -49,39 +47,40 @@
49
47
  * we create separate rules for each line/segment.
50
48
  */
51
49
  function addAnimation(alpha, trail, i, lines) {
52
- var name = ['opacity', trail, ~~(alpha*100), i, lines].join('-');
53
- var start = 0.01 + i/lines*100;
54
- var z = Math.max(1-(1-alpha)/trail*(100-start) , alpha);
55
- var prefix = useCssAnimations.substring(0, useCssAnimations.indexOf('Animation')).toLowerCase();
56
- var pre = prefix && '-'+prefix+'-' || '';
50
+ var name = ['opacity', trail, ~~(alpha*100), i, lines].join('-')
51
+ , start = 0.01 + i/lines*100
52
+ , z = Math.max(1 - (1-alpha) / trail * (100-start), alpha)
53
+ , prefix = useCssAnimations.substring(0, useCssAnimations.indexOf('Animation')).toLowerCase()
54
+ , pre = prefix && '-'+prefix+'-' || ''
57
55
 
58
56
  if (!animations[name]) {
59
57
  sheet.insertRule(
60
58
  '@' + pre + 'keyframes ' + name + '{' +
61
- '0%{opacity:'+z+'}' +
62
- start + '%{opacity:'+ alpha + '}' +
59
+ '0%{opacity:' + z + '}' +
60
+ start + '%{opacity:' + alpha + '}' +
63
61
  (start+0.01) + '%{opacity:1}' +
64
- (start+trail)%100 + '%{opacity:'+ alpha + '}' +
65
- '100%{opacity:'+ z + '}' +
66
- '}', 0);
67
- animations[name] = 1;
62
+ (start+trail) % 100 + '%{opacity:' + alpha + '}' +
63
+ '100%{opacity:' + z + '}' +
64
+ '}', sheet.cssRules.length)
65
+
66
+ animations[name] = 1
68
67
  }
69
- return name;
68
+ return name
70
69
  }
71
70
 
72
71
  /**
73
72
  * Tries various vendor prefixes and returns the first supported property.
74
73
  **/
75
74
  function vendor(el, prop) {
76
- var s = el.style;
77
- var pp;
78
- var i;
75
+ var s = el.style
76
+ , pp
77
+ , i
79
78
 
80
- if(s[prop] !== undefined) return prop;
81
- prop = prop.charAt(0).toUpperCase() + prop.slice(1);
79
+ if(s[prop] !== undefined) return prop
80
+ prop = prop.charAt(0).toUpperCase() + prop.slice(1)
82
81
  for(i=0; i<prefixes.length; i++) {
83
- pp = prefixes[i]+prop;
84
- if(s[pp] !== undefined) return pp;
82
+ pp = prefixes[i]+prop
83
+ if(s[pp] !== undefined) return pp
85
84
  }
86
85
  }
87
86
 
@@ -89,10 +88,10 @@
89
88
  * Sets multiple style properties at once.
90
89
  */
91
90
  function css(el, prop) {
92
- for (var n in prop) {
93
- el.style[vendor(el, n)||n] = prop[n];
94
- }
95
- return el;
91
+ for (var n in prop)
92
+ el.style[vendor(el, n)||n] = prop[n]
93
+
94
+ return el
96
95
  }
97
96
 
98
97
  /**
@@ -100,24 +99,22 @@
100
99
  */
101
100
  function merge(obj) {
102
101
  for (var i=1; i < arguments.length; i++) {
103
- var def = arguments[i];
104
- for (var n in def) {
105
- if (obj[n] === undefined) obj[n] = def[n];
106
- }
102
+ var def = arguments[i]
103
+ for (var n in def)
104
+ if (obj[n] === undefined) obj[n] = def[n]
107
105
  }
108
- return obj;
106
+ return obj
109
107
  }
110
108
 
111
109
  /**
112
110
  * Returns the absolute page-offset of the given element.
113
111
  */
114
112
  function pos(el) {
115
- var o = {x:el.offsetLeft, y:el.offsetTop};
116
- while((el = el.offsetParent)) {
117
- o.x+=el.offsetLeft;
118
- o.y+=el.offsetTop;
119
- }
120
- return o;
113
+ var o = { x:el.offsetLeft, y:el.offsetTop }
114
+ while((el = el.offsetParent))
115
+ o.x+=el.offsetLeft, o.y+=el.offsetTop
116
+
117
+ return o
121
118
  }
122
119
 
123
120
  var defaults = {
@@ -125,7 +122,8 @@
125
122
  length: 7, // The length of each line
126
123
  width: 5, // The line thickness
127
124
  radius: 10, // The radius of the inner circle
128
- rotate: 0, // rotation offset
125
+ rotate: 0, // Rotation offset
126
+ corners: 1, // Roundness (0..1)
129
127
  color: '#000', // #rgb or #rrggbb
130
128
  speed: 1, // Rounds per second
131
129
  trail: 100, // Afterglow percentage
@@ -135,69 +133,72 @@
135
133
  className: 'spinner', // CSS class to assign to the element
136
134
  top: 'auto', // center vertically
137
135
  left: 'auto' // center horizontally
138
- };
136
+ }
139
137
 
140
138
  /** The constructor */
141
139
  var Spinner = function Spinner(o) {
142
- if (!this.spin) return new Spinner(o);
143
- this.opts = merge(o || {}, Spinner.defaults, defaults);
144
- };
140
+ if (!this.spin) return new Spinner(o)
141
+ this.opts = merge(o || {}, Spinner.defaults, defaults)
142
+ }
143
+
144
+ Spinner.defaults = {}
145
145
 
146
- Spinner.defaults = {};
147
146
  merge(Spinner.prototype, {
148
147
  spin: function(target) {
149
- this.stop();
150
- var self = this;
151
- var o = self.opts;
152
- var el = self.el = css(createEl(0, {className: o.className}), {position: 'relative', zIndex: o.zIndex});
153
- var mid = o.radius+o.length+o.width;
154
- var ep; // element position
155
- var tp; // target position
148
+ this.stop()
149
+ var self = this
150
+ , o = self.opts
151
+ , el = self.el = css(createEl(0, {className: o.className}), {position: 'relative', width: 0, zIndex: o.zIndex})
152
+ , mid = o.radius+o.length+o.width
153
+ , ep // element position
154
+ , tp // target position
156
155
 
157
156
  if (target) {
158
- target.insertBefore(el, target.firstChild||null);
159
- tp = pos(target);
160
- ep = pos(el);
157
+ target.insertBefore(el, target.firstChild||null)
158
+ tp = pos(target)
159
+ ep = pos(el)
161
160
  css(el, {
162
- left: (o.left == 'auto' ? tp.x-ep.x + (target.offsetWidth >> 1) : o.left+mid) + 'px',
163
- top: (o.top == 'auto' ? tp.y-ep.y + (target.offsetHeight >> 1) : o.top+mid) + 'px'
164
- });
161
+ left: (o.left == 'auto' ? tp.x-ep.x + (target.offsetWidth >> 1) : parseInt(o.left, 10) + mid) + 'px',
162
+ top: (o.top == 'auto' ? tp.y-ep.y + (target.offsetHeight >> 1) : parseInt(o.top, 10) + mid) + 'px'
163
+ })
165
164
  }
166
165
 
167
- el.setAttribute('aria-role', 'progressbar');
168
- self.lines(el, self.opts);
166
+ el.setAttribute('aria-role', 'progressbar')
167
+ self.lines(el, self.opts)
169
168
 
170
169
  if (!useCssAnimations) {
171
170
  // No CSS animation support, use setTimeout() instead
172
- var i = 0;
173
- var fps = o.fps;
174
- var f = fps/o.speed;
175
- var ostep = (1-o.opacity)/(f*o.trail / 100);
176
- var astep = f/o.lines;
171
+ var i = 0
172
+ , fps = o.fps
173
+ , f = fps/o.speed
174
+ , ostep = (1-o.opacity) / (f*o.trail / 100)
175
+ , astep = f/o.lines
177
176
 
178
- !function anim() {
177
+ ;(function anim() {
179
178
  i++;
180
179
  for (var s=o.lines; s; s--) {
181
- var alpha = Math.max(1-(i+s*astep)%f * ostep, o.opacity);
182
- self.opacity(el, o.lines-s, alpha, o);
180
+ var alpha = Math.max(1-(i+s*astep)%f * ostep, o.opacity)
181
+ self.opacity(el, o.lines-s, alpha, o)
183
182
  }
184
- self.timeout = self.el && setTimeout(anim, ~~(1000/fps));
185
- }();
183
+ self.timeout = self.el && setTimeout(anim, ~~(1000/fps))
184
+ })()
186
185
  }
187
- return self;
186
+ return self
188
187
  },
188
+
189
189
  stop: function() {
190
- var el = this.el;
190
+ var el = this.el
191
191
  if (el) {
192
- clearTimeout(this.timeout);
193
- if (el.parentNode) el.parentNode.removeChild(el);
194
- this.el = undefined;
192
+ clearTimeout(this.timeout)
193
+ if (el.parentNode) el.parentNode.removeChild(el)
194
+ this.el = undefined
195
195
  }
196
- return this;
196
+ return this
197
197
  },
198
+
198
199
  lines: function(el, o) {
199
- var i = 0;
200
- var seg;
200
+ var i = 0
201
+ , seg
201
202
 
202
203
  function fill(color, shadow) {
203
204
  return css(createEl(), {
@@ -208,9 +209,10 @@
208
209
  boxShadow: shadow,
209
210
  transformOrigin: 'left',
210
211
  transform: 'rotate(' + ~~(360/o.lines*i+o.rotate) + 'deg) translate(' + o.radius+'px' +',0)',
211
- borderRadius: (o.width>>1) + 'px'
212
- });
212
+ borderRadius: (o.corners * o.width>>1) + 'px'
213
+ })
213
214
  }
215
+
214
216
  for (; i < o.lines; i++) {
215
217
  seg = css(createEl(), {
216
218
  position: 'absolute',
@@ -218,16 +220,20 @@
218
220
  transform: o.hwaccel ? 'translate3d(0,0,0)' : '',
219
221
  opacity: o.opacity,
220
222
  animation: useCssAnimations && addAnimation(o.opacity, o.trail, i, o.lines) + ' ' + 1/o.speed + 's linear infinite'
221
- });
222
- if (o.shadow) ins(seg, css(fill('#000', '0 0 4px ' + '#000'), {top: 2+'px'}));
223
- ins(el, ins(seg, fill(o.color, '0 0 1px rgba(0,0,0,.1)')));
223
+ })
224
+
225
+ if (o.shadow) ins(seg, css(fill('#000', '0 0 4px ' + '#000'), {top: 2+'px'}))
226
+
227
+ ins(el, ins(seg, fill(o.color, '0 0 1px rgba(0,0,0,.1)')))
224
228
  }
225
- return el;
229
+ return el
226
230
  },
231
+
227
232
  opacity: function(el, i, val) {
228
- if (i < el.childNodes.length) el.childNodes[i].style.opacity = val;
233
+ if (i < el.childNodes.length) el.childNodes[i].style.opacity = val
229
234
  }
230
- });
235
+
236
+ })
231
237
 
232
238
  /////////////////////////////////////////////////////////////////////////
233
239
  // VML rendering for IE
@@ -236,36 +242,41 @@
236
242
  /**
237
243
  * Check and init VML support
238
244
  */
239
- !function() {
245
+ ;(function() {
240
246
 
241
247
  function vml(tag, attr) {
242
- return createEl('<' + tag + ' xmlns="urn:schemas-microsoft.com:vml" class="spin-vml">', attr);
248
+ return createEl('<' + tag + ' xmlns="urn:schemas-microsoft.com:vml" class="spin-vml">', attr)
243
249
  }
244
250
 
245
- var s = css(createEl('group'), {behavior: 'url(#default#VML)'});
251
+ var s = css(createEl('group'), {behavior: 'url(#default#VML)'})
246
252
 
247
253
  if (!vendor(s, 'transform') && s.adj) {
248
254
 
249
255
  // VML support detected. Insert CSS rule ...
250
- sheet.addRule('.spin-vml', 'behavior:url(#default#VML)');
256
+ sheet.addRule('.spin-vml', 'behavior:url(#default#VML)')
251
257
 
252
258
  Spinner.prototype.lines = function(el, o) {
253
- var r = o.length+o.width;
254
- var s = 2*r;
259
+ var r = o.length+o.width
260
+ , s = 2*r
255
261
 
256
262
  function grp() {
257
- return css(vml('group', {coordsize: s +' '+s, coordorigin: -r +' '+-r}), {width: s, height: s});
263
+ return css(
264
+ vml('group', {
265
+ coordsize: s + ' ' + s,
266
+ coordorigin: -r + ' ' + -r
267
+ }),
268
+ { width: s, height: s }
269
+ )
258
270
  }
259
271
 
260
- var margin = -(o.width+o.length)*2+'px';
261
- var g = css(grp(), {position: 'absolute', top: margin, left: margin});
262
-
263
- var i;
272
+ var margin = -(o.width+o.length)*2 + 'px'
273
+ , g = css(grp(), {position: 'absolute', top: margin, left: margin})
274
+ , i
264
275
 
265
276
  function seg(i, dx, filter) {
266
277
  ins(g,
267
278
  ins(css(grp(), {rotation: 360 / o.lines * i + 'deg', left: ~~dx}),
268
- ins(css(vml('roundrect', {arcsize: 1}), {
279
+ ins(css(vml('roundrect', {arcsize: o.corners}), {
269
280
  width: r,
270
281
  height: o.width,
271
282
  left: o.radius,
@@ -276,31 +287,33 @@
276
287
  vml('stroke', {opacity: 0}) // transparent stroke to fix color bleeding upon opacity change
277
288
  )
278
289
  )
279
- );
290
+ )
280
291
  }
281
292
 
282
- if (o.shadow) {
283
- for (i = 1; i <= o.lines; i++) {
284
- seg(i, -2, 'progid:DXImageTransform.Microsoft.Blur(pixelradius=2,makeshadow=1,shadowopacity=.3)');
285
- }
286
- }
287
- for (i = 1; i <= o.lines; i++) seg(i);
288
- return ins(el, g);
289
- };
293
+ if (o.shadow)
294
+ for (i = 1; i <= o.lines; i++)
295
+ seg(i, -2, 'progid:DXImageTransform.Microsoft.Blur(pixelradius=2,makeshadow=1,shadowopacity=.3)')
296
+
297
+ for (i = 1; i <= o.lines; i++) seg(i)
298
+ return ins(el, g)
299
+ }
300
+
290
301
  Spinner.prototype.opacity = function(el, i, val, o) {
291
- var c = el.firstChild;
292
- o = o.shadow && o.lines || 0;
302
+ var c = el.firstChild
303
+ o = o.shadow && o.lines || 0
293
304
  if (c && i+o < c.childNodes.length) {
294
- c = c.childNodes[i+o]; c = c && c.firstChild; c = c && c.firstChild;
295
- if (c) c.opacity = val;
305
+ c = c.childNodes[i+o]; c = c && c.firstChild; c = c && c.firstChild
306
+ if (c) c.opacity = val
296
307
  }
297
- };
298
- }
299
- else {
300
- useCssAnimations = vendor(s, 'animation');
308
+ }
301
309
  }
302
- }();
310
+ else
311
+ useCssAnimations = vendor(s, 'animation')
312
+ })()
303
313
 
304
- window.Spinner = Spinner;
314
+ if (typeof define == 'function' && define.amd)
315
+ define(function() { return Spinner })
316
+ else
317
+ window.Spinner = Spinner
305
318
 
306
- })(window, document);
319
+ }(window, document)
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: spinjs-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.3
4
+ version: 0.0.4
5
5
  prerelease:
6
6
  platform: ruby
7
7
  authors:
@@ -9,11 +9,11 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2012-04-03 00:00:00.000000000 Z
12
+ date: 2012-09-11 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: rails
16
- requirement: &70113496389260 !ruby/object:Gem::Requirement
16
+ requirement: !ruby/object:Gem::Requirement
17
17
  none: false
18
18
  requirements:
19
19
  - - ! '>='
@@ -21,7 +21,12 @@ dependencies:
21
21
  version: '3.1'
22
22
  type: :runtime
23
23
  prerelease: false
24
- version_requirements: *70113496389260
24
+ version_requirements: !ruby/object:Gem::Requirement
25
+ none: false
26
+ requirements:
27
+ - - ! '>='
28
+ - !ruby/object:Gem::Version
29
+ version: '3.1'
25
30
  description: An animated CSS3 loading spinner with VML fallback for IE.
26
31
  email:
27
32
  - dnagir@gmail.com
@@ -51,15 +56,21 @@ required_ruby_version: !ruby/object:Gem::Requirement
51
56
  - - ! '>='
52
57
  - !ruby/object:Gem::Version
53
58
  version: '0'
59
+ segments:
60
+ - 0
61
+ hash: 1254404581123064380
54
62
  required_rubygems_version: !ruby/object:Gem::Requirement
55
63
  none: false
56
64
  requirements:
57
65
  - - ! '>='
58
66
  - !ruby/object:Gem::Version
59
67
  version: '0'
68
+ segments:
69
+ - 0
70
+ hash: 1254404581123064380
60
71
  requirements: []
61
72
  rubyforge_project: spinjs-rails
62
- rubygems_version: 1.8.17
73
+ rubygems_version: 1.8.24
63
74
  signing_key:
64
75
  specification_version: 3
65
76
  summary: A spinning activity indicator for Rails 3 with no images and CSS.