spinjs-rails 0.0.3 → 0.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -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.