nprogress-rails 0.1.2.3 → 0.1.3.0
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.
- checksums.yaml +4 -4
- data/README.md +10 -3
- data/{vendor → app}/assets/javascripts/nprogress-ajax.js +0 -0
- data/{vendor → app}/assets/javascripts/nprogress-pjax.js +0 -0
- data/{vendor → app}/assets/javascripts/nprogress-turbolinks.js +0 -0
- data/app/assets/javascripts/nprogress.js +468 -0
- data/{vendor → app}/assets/stylesheets/nprogress-bootstrap.css +0 -0
- data/app/assets/stylesheets/nprogress.css.scss +65 -0
- data/nprogress-rails.gemspec +1 -1
- metadata +20 -20
- data/vendor/assets/javascripts/nprogress.js +0 -274
- data/vendor/assets/stylesheets/nprogress.css.scss +0 -82
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 261db801b935edcfac7746e803dab06b69127599
|
4
|
+
data.tar.gz: 3d6c2634d465e766d1de036d54ec22b6899d5fe1
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 9f535bce837e0f27a93cb9db21324fc2f7603e1fc4a665edee1708794f1fa8024bd074dde5f02686d014d94c46be5ccc250c0737c415326e2892095045d092b6
|
7
|
+
data.tar.gz: 32e7de0350ca750f49e13d989b4c100a0d1cafe8faf220ac6829272a530ebdce909a21f3b303684fbe51f0f488528ed1125a035567fe2705b698a14814140133
|
data/README.md
CHANGED
@@ -44,9 +44,8 @@ you will have to deal with show/hide the progress by your own.
|
|
44
44
|
Also, into your `application.css.scss` file:
|
45
45
|
|
46
46
|
```scss
|
47
|
-
|
48
|
-
|
49
|
-
@import 'nprogress-bootstrap';
|
47
|
+
*= require nprogress
|
48
|
+
*= require nprogress-bootstrap
|
50
49
|
```
|
51
50
|
|
52
51
|
The `nprogress-bootstrap` is required if you use bootstrap and have a fixed
|
@@ -74,6 +73,14 @@ NProgress.configure
|
|
74
73
|
speed: 500
|
75
74
|
```
|
76
75
|
|
76
|
+
Since the [v0.1.2.3 release](https://github.com/caarlos0/nprogress-rails/releases/tag/v0.1.2.3),
|
77
|
+
you can also change the color of the progressbar using SASS:
|
78
|
+
|
79
|
+
```scss
|
80
|
+
$nprogress-color: #f1f1f1;
|
81
|
+
@import 'nprogress';
|
82
|
+
@import 'nprogress-bootstrap';
|
83
|
+
```
|
77
84
|
|
78
85
|
## Contributing
|
79
86
|
|
File without changes
|
File without changes
|
File without changes
|
@@ -0,0 +1,468 @@
|
|
1
|
+
/*! NProgress (c) 2013, Rico Sta. Cruz
|
2
|
+
* http://ricostacruz.com/nprogress */
|
3
|
+
|
4
|
+
;(function(factory) {
|
5
|
+
|
6
|
+
if (typeof module === 'function') {
|
7
|
+
module.exports = factory();
|
8
|
+
} else if (typeof define === 'function' && define.amd) {
|
9
|
+
define(factory);
|
10
|
+
} else {
|
11
|
+
this.NProgress = factory();
|
12
|
+
}
|
13
|
+
|
14
|
+
})(function() {
|
15
|
+
var NProgress = {};
|
16
|
+
|
17
|
+
NProgress.version = '0.1.3';
|
18
|
+
|
19
|
+
var Settings = NProgress.settings = {
|
20
|
+
minimum: 0.08,
|
21
|
+
easing: 'ease',
|
22
|
+
positionUsing: '',
|
23
|
+
speed: 200,
|
24
|
+
trickle: true,
|
25
|
+
trickleRate: 0.02,
|
26
|
+
trickleSpeed: 800,
|
27
|
+
showSpinner: true,
|
28
|
+
barSelector: '[role="bar"]',
|
29
|
+
spinnerSelector: '[role="spinner"]',
|
30
|
+
template: '<div class="bar" role="bar"><div class="peg"></div></div><div class="spinner" role="spinner"><div class="spinner-icon"></div></div>'
|
31
|
+
};
|
32
|
+
|
33
|
+
/**
|
34
|
+
* Updates configuration.
|
35
|
+
*
|
36
|
+
* NProgress.configure({
|
37
|
+
* minimum: 0.1
|
38
|
+
* });
|
39
|
+
*/
|
40
|
+
NProgress.configure = function(options) {
|
41
|
+
var key, value;
|
42
|
+
for (key in options) {
|
43
|
+
value = options[key];
|
44
|
+
if (value !== undefined && options.hasOwnProperty(key)) Settings[key] = value;
|
45
|
+
}
|
46
|
+
|
47
|
+
return this;
|
48
|
+
};
|
49
|
+
|
50
|
+
/**
|
51
|
+
* Last number.
|
52
|
+
*/
|
53
|
+
|
54
|
+
NProgress.status = null;
|
55
|
+
|
56
|
+
/**
|
57
|
+
* Sets the progress bar status, where `n` is a number from `0.0` to `1.0`.
|
58
|
+
*
|
59
|
+
* NProgress.set(0.4);
|
60
|
+
* NProgress.set(1.0);
|
61
|
+
*/
|
62
|
+
|
63
|
+
NProgress.set = function(n) {
|
64
|
+
var started = NProgress.isStarted();
|
65
|
+
|
66
|
+
n = clamp(n, Settings.minimum, 1);
|
67
|
+
NProgress.status = (n === 1 ? null : n);
|
68
|
+
|
69
|
+
var progress = NProgress.render(!started),
|
70
|
+
bar = progress.querySelector(Settings.barSelector),
|
71
|
+
speed = Settings.speed,
|
72
|
+
ease = Settings.easing;
|
73
|
+
|
74
|
+
progress.offsetWidth; /* Repaint */
|
75
|
+
|
76
|
+
queue(function(next) {
|
77
|
+
// Set positionUsing if it hasn't already been set
|
78
|
+
if (Settings.positionUsing === '') Settings.positionUsing = NProgress.getPositioningCSS();
|
79
|
+
|
80
|
+
// Add transition
|
81
|
+
css(bar, barPositionCSS(n, speed, ease));
|
82
|
+
|
83
|
+
if (n === 1) {
|
84
|
+
// Fade out
|
85
|
+
css(progress, {
|
86
|
+
transition: 'none',
|
87
|
+
opacity: 1
|
88
|
+
});
|
89
|
+
progress.offsetWidth; /* Repaint */
|
90
|
+
|
91
|
+
setTimeout(function() {
|
92
|
+
css(progress, {
|
93
|
+
transition: 'all ' + speed + 'ms linear',
|
94
|
+
opacity: 0
|
95
|
+
});
|
96
|
+
setTimeout(function() {
|
97
|
+
NProgress.remove();
|
98
|
+
next();
|
99
|
+
}, speed);
|
100
|
+
}, speed);
|
101
|
+
} else {
|
102
|
+
setTimeout(next, speed);
|
103
|
+
}
|
104
|
+
});
|
105
|
+
|
106
|
+
return this;
|
107
|
+
};
|
108
|
+
|
109
|
+
NProgress.isStarted = function() {
|
110
|
+
return typeof NProgress.status === 'number';
|
111
|
+
};
|
112
|
+
|
113
|
+
/**
|
114
|
+
* Shows the progress bar.
|
115
|
+
* This is the same as setting the status to 0%, except that it doesn't go backwards.
|
116
|
+
*
|
117
|
+
* NProgress.start();
|
118
|
+
*
|
119
|
+
*/
|
120
|
+
NProgress.start = function() {
|
121
|
+
if (!NProgress.status) NProgress.set(0);
|
122
|
+
|
123
|
+
var work = function() {
|
124
|
+
setTimeout(function() {
|
125
|
+
if (!NProgress.status) return;
|
126
|
+
NProgress.trickle();
|
127
|
+
work();
|
128
|
+
}, Settings.trickleSpeed);
|
129
|
+
};
|
130
|
+
|
131
|
+
if (Settings.trickle) work();
|
132
|
+
|
133
|
+
return this;
|
134
|
+
};
|
135
|
+
|
136
|
+
/**
|
137
|
+
* Hides the progress bar.
|
138
|
+
* This is the *sort of* the same as setting the status to 100%, with the
|
139
|
+
* difference being `done()` makes some placebo effect of some realistic motion.
|
140
|
+
*
|
141
|
+
* NProgress.done();
|
142
|
+
*
|
143
|
+
* If `true` is passed, it will show the progress bar even if its hidden.
|
144
|
+
*
|
145
|
+
* NProgress.done(true);
|
146
|
+
*/
|
147
|
+
|
148
|
+
NProgress.done = function(force) {
|
149
|
+
if (!force && !NProgress.status) return this;
|
150
|
+
|
151
|
+
return NProgress.inc(0.3 + 0.5 * Math.random()).set(1);
|
152
|
+
};
|
153
|
+
|
154
|
+
/**
|
155
|
+
* Increments by a random amount.
|
156
|
+
*/
|
157
|
+
|
158
|
+
NProgress.inc = function(amount) {
|
159
|
+
var n = NProgress.status;
|
160
|
+
|
161
|
+
if (!n) {
|
162
|
+
return NProgress.start();
|
163
|
+
} else {
|
164
|
+
if (typeof amount !== 'number') {
|
165
|
+
amount = (1 - n) * clamp(Math.random() * n, 0.1, 0.95);
|
166
|
+
}
|
167
|
+
|
168
|
+
n = clamp(n + amount, 0, 0.994);
|
169
|
+
return NProgress.set(n);
|
170
|
+
}
|
171
|
+
};
|
172
|
+
|
173
|
+
NProgress.trickle = function() {
|
174
|
+
return NProgress.inc(Math.random() * Settings.trickleRate);
|
175
|
+
};
|
176
|
+
|
177
|
+
/**
|
178
|
+
* Waits for all supplied jQuery promises and
|
179
|
+
* increases the progress as the promises resolve.
|
180
|
+
*
|
181
|
+
* @param $promise jQUery Promise
|
182
|
+
*/
|
183
|
+
(function() {
|
184
|
+
var initial = 0, current = 0;
|
185
|
+
|
186
|
+
NProgress.promise = function($promise) {
|
187
|
+
if (!$promise || $promise.state() == "resolved") {
|
188
|
+
return this;
|
189
|
+
}
|
190
|
+
|
191
|
+
if (current == 0) {
|
192
|
+
NProgress.start();
|
193
|
+
}
|
194
|
+
|
195
|
+
initial++;
|
196
|
+
current++;
|
197
|
+
|
198
|
+
$promise.always(function() {
|
199
|
+
current--;
|
200
|
+
if (current == 0) {
|
201
|
+
initial = 0;
|
202
|
+
NProgress.done();
|
203
|
+
} else {
|
204
|
+
NProgress.set((initial - current) / initial);
|
205
|
+
}
|
206
|
+
});
|
207
|
+
|
208
|
+
return this;
|
209
|
+
};
|
210
|
+
|
211
|
+
})();
|
212
|
+
|
213
|
+
/**
|
214
|
+
* (Internal) renders the progress bar markup based on the `template`
|
215
|
+
* setting.
|
216
|
+
*/
|
217
|
+
|
218
|
+
NProgress.render = function(fromStart) {
|
219
|
+
if (NProgress.isRendered()) return document.getElementById('nprogress');
|
220
|
+
|
221
|
+
addClass(document.documentElement, 'nprogress-busy');
|
222
|
+
|
223
|
+
var progress = document.createElement('div');
|
224
|
+
progress.id = 'nprogress';
|
225
|
+
progress.innerHTML = Settings.template;
|
226
|
+
|
227
|
+
var bar = progress.querySelector(Settings.barSelector),
|
228
|
+
perc = fromStart ? '-100' : toBarPerc(NProgress.status || 0),
|
229
|
+
spinner;
|
230
|
+
|
231
|
+
css(bar, {
|
232
|
+
transition: 'all 0 linear',
|
233
|
+
transform: 'translate3d(' + perc + '%,0,0)'
|
234
|
+
});
|
235
|
+
|
236
|
+
if (!Settings.showSpinner) {
|
237
|
+
spinner = progress.querySelector(Settings.spinnerSelector);
|
238
|
+
spinner && removeElement(spinner);
|
239
|
+
}
|
240
|
+
|
241
|
+
document.body.appendChild(progress);
|
242
|
+
return progress;
|
243
|
+
};
|
244
|
+
|
245
|
+
/**
|
246
|
+
* Removes the element. Opposite of render().
|
247
|
+
*/
|
248
|
+
|
249
|
+
NProgress.remove = function() {
|
250
|
+
removeClass(document.documentElement, 'nprogress-busy');
|
251
|
+
var progress = document.getElementById('nprogress');
|
252
|
+
progress && removeElement(progress);
|
253
|
+
};
|
254
|
+
|
255
|
+
/**
|
256
|
+
* Checks if the progress bar is rendered.
|
257
|
+
*/
|
258
|
+
|
259
|
+
NProgress.isRendered = function() {
|
260
|
+
return !!document.getElementById('nprogress');
|
261
|
+
};
|
262
|
+
|
263
|
+
/**
|
264
|
+
* Determine which positioning CSS rule to use.
|
265
|
+
*/
|
266
|
+
|
267
|
+
NProgress.getPositioningCSS = function() {
|
268
|
+
// Sniff on document.body.style
|
269
|
+
var bodyStyle = document.body.style;
|
270
|
+
|
271
|
+
// Sniff prefixes
|
272
|
+
var vendorPrefix = ('WebkitTransform' in bodyStyle) ? 'Webkit' :
|
273
|
+
('MozTransform' in bodyStyle) ? 'Moz' :
|
274
|
+
('msTransform' in bodyStyle) ? 'ms' :
|
275
|
+
('OTransform' in bodyStyle) ? 'O' : '';
|
276
|
+
|
277
|
+
if (vendorPrefix + 'Perspective' in bodyStyle) {
|
278
|
+
// Modern browsers with 3D support, e.g. Webkit, IE10
|
279
|
+
return 'translate3d';
|
280
|
+
} else if (vendorPrefix + 'Transform' in bodyStyle) {
|
281
|
+
// Browsers without 3D support, e.g. IE9
|
282
|
+
return 'translate';
|
283
|
+
} else {
|
284
|
+
// Browsers without translate() support, e.g. IE7-8
|
285
|
+
return 'margin';
|
286
|
+
}
|
287
|
+
};
|
288
|
+
|
289
|
+
/**
|
290
|
+
* Helpers
|
291
|
+
*/
|
292
|
+
|
293
|
+
function clamp(n, min, max) {
|
294
|
+
if (n < min) return min;
|
295
|
+
if (n > max) return max;
|
296
|
+
return n;
|
297
|
+
}
|
298
|
+
|
299
|
+
/**
|
300
|
+
* (Internal) converts a percentage (`0..1`) to a bar translateX
|
301
|
+
* percentage (`-100%..0%`).
|
302
|
+
*/
|
303
|
+
|
304
|
+
function toBarPerc(n) {
|
305
|
+
return (-1 + n) * 100;
|
306
|
+
}
|
307
|
+
|
308
|
+
|
309
|
+
/**
|
310
|
+
* (Internal) returns the correct CSS for changing the bar's
|
311
|
+
* position given an n percentage, and speed and ease from Settings
|
312
|
+
*/
|
313
|
+
|
314
|
+
function barPositionCSS(n, speed, ease) {
|
315
|
+
var barCSS;
|
316
|
+
|
317
|
+
if (Settings.positionUsing === 'translate3d') {
|
318
|
+
barCSS = { transform: 'translate3d('+toBarPerc(n)+'%,0,0)' };
|
319
|
+
} else if (Settings.positionUsing === 'translate') {
|
320
|
+
barCSS = { transform: 'translate('+toBarPerc(n)+'%,0)' };
|
321
|
+
} else {
|
322
|
+
barCSS = { 'margin-left': toBarPerc(n)+'%' };
|
323
|
+
}
|
324
|
+
|
325
|
+
barCSS.transition = 'all '+speed+'ms '+ease;
|
326
|
+
|
327
|
+
return barCSS;
|
328
|
+
}
|
329
|
+
|
330
|
+
/**
|
331
|
+
* (Internal) Queues a function to be executed.
|
332
|
+
*/
|
333
|
+
|
334
|
+
var queue = (function() {
|
335
|
+
var pending = [];
|
336
|
+
|
337
|
+
function next() {
|
338
|
+
var fn = pending.shift();
|
339
|
+
if (fn) {
|
340
|
+
fn(next);
|
341
|
+
}
|
342
|
+
}
|
343
|
+
|
344
|
+
return function(fn) {
|
345
|
+
pending.push(fn);
|
346
|
+
if (pending.length == 1) next();
|
347
|
+
};
|
348
|
+
})();
|
349
|
+
|
350
|
+
/**
|
351
|
+
* (Internal) Applies css properties to an element, similar to the jQuery
|
352
|
+
* css method.
|
353
|
+
*
|
354
|
+
* While this helper does assist with vendor prefixed property names, it
|
355
|
+
* does not perform any manipulation of values prior to setting styles.
|
356
|
+
*/
|
357
|
+
|
358
|
+
var css = (function() {
|
359
|
+
var cssPrefixes = [ 'Webkit', 'O', 'Moz', 'ms' ],
|
360
|
+
cssProps = {};
|
361
|
+
|
362
|
+
function camelCase(string) {
|
363
|
+
return string.replace(/^-ms-/, 'ms-').replace(/-([\da-z])/gi, function(match, letter) {
|
364
|
+
return letter.toUpperCase();
|
365
|
+
});
|
366
|
+
}
|
367
|
+
|
368
|
+
function getVendorProp(name) {
|
369
|
+
var style = document.body.style;
|
370
|
+
if (name in style) return name;
|
371
|
+
|
372
|
+
var i = cssPrefixes.length,
|
373
|
+
capName = name.charAt(0).toUpperCase() + name.slice(1),
|
374
|
+
vendorName;
|
375
|
+
while (i--) {
|
376
|
+
vendorName = cssPrefixes[i] + capName;
|
377
|
+
if (vendorName in style) return vendorName;
|
378
|
+
}
|
379
|
+
|
380
|
+
return name;
|
381
|
+
}
|
382
|
+
|
383
|
+
function getStyleProp(name) {
|
384
|
+
name = camelCase(name);
|
385
|
+
return cssProps[name] || (cssProps[name] = getVendorProp(name));
|
386
|
+
}
|
387
|
+
|
388
|
+
function applyCss(element, prop, value) {
|
389
|
+
prop = getStyleProp(prop);
|
390
|
+
element.style[prop] = value;
|
391
|
+
}
|
392
|
+
|
393
|
+
return function(element, properties) {
|
394
|
+
var args = arguments,
|
395
|
+
prop,
|
396
|
+
value;
|
397
|
+
|
398
|
+
if (args.length == 2) {
|
399
|
+
for (prop in properties) {
|
400
|
+
value = properties[prop];
|
401
|
+
if (value !== undefined && properties.hasOwnProperty(prop)) applyCss(element, prop, value);
|
402
|
+
}
|
403
|
+
} else {
|
404
|
+
applyCss(element, args[1], args[2]);
|
405
|
+
}
|
406
|
+
}
|
407
|
+
})();
|
408
|
+
|
409
|
+
/**
|
410
|
+
* (Internal) Determines if an element or space separated list of class names contains a class name.
|
411
|
+
*/
|
412
|
+
|
413
|
+
function hasClass(element, name) {
|
414
|
+
var list = typeof element == 'string' ? element : classList(element);
|
415
|
+
return list.indexOf(' ' + name + ' ') >= 0;
|
416
|
+
}
|
417
|
+
|
418
|
+
/**
|
419
|
+
* (Internal) Adds a class to an element.
|
420
|
+
*/
|
421
|
+
|
422
|
+
function addClass(element, name) {
|
423
|
+
var oldList = classList(element),
|
424
|
+
newList = oldList + name;
|
425
|
+
|
426
|
+
if (hasClass(oldList, name)) return;
|
427
|
+
|
428
|
+
// Trim the opening space.
|
429
|
+
element.className = newList.substring(1);
|
430
|
+
}
|
431
|
+
|
432
|
+
/**
|
433
|
+
* (Internal) Removes a class from an element.
|
434
|
+
*/
|
435
|
+
|
436
|
+
function removeClass(element, name) {
|
437
|
+
var oldList = classList(element),
|
438
|
+
newList;
|
439
|
+
|
440
|
+
if (!hasClass(element, name)) return;
|
441
|
+
|
442
|
+
// Replace the class name.
|
443
|
+
newList = oldList.replace(' ' + name + ' ', ' ');
|
444
|
+
|
445
|
+
// Trim the opening and closing spaces.
|
446
|
+
element.className = newList.substring(1, newList.length - 1);
|
447
|
+
}
|
448
|
+
|
449
|
+
/**
|
450
|
+
* (Internal) Gets a space separated list of the class names on the element.
|
451
|
+
* The list is wrapped with a single space on each end to facilitate finding
|
452
|
+
* matches within the list.
|
453
|
+
*/
|
454
|
+
|
455
|
+
function classList(element) {
|
456
|
+
return (' ' + (element.className || '') + ' ').replace(/\s+/gi, ' ');
|
457
|
+
}
|
458
|
+
|
459
|
+
/**
|
460
|
+
* (Internal) Removes an element from the DOM.
|
461
|
+
*/
|
462
|
+
|
463
|
+
function removeElement(element) {
|
464
|
+
element && element.parentNode && element.parentNode.removeChild(element);
|
465
|
+
}
|
466
|
+
|
467
|
+
return NProgress;
|
468
|
+
});
|
File without changes
|
@@ -0,0 +1,65 @@
|
|
1
|
+
$nprogress-color: #29d !default;
|
2
|
+
|
3
|
+
/* Make clicks pass-through */
|
4
|
+
#nprogress {
|
5
|
+
pointer-events: none;
|
6
|
+
}
|
7
|
+
|
8
|
+
#nprogress .bar {
|
9
|
+
background: $nprogress-color;
|
10
|
+
|
11
|
+
position: fixed;
|
12
|
+
z-index: 100;
|
13
|
+
top: 0;
|
14
|
+
left: 0;
|
15
|
+
|
16
|
+
width: 100%;
|
17
|
+
height: 2px;
|
18
|
+
}
|
19
|
+
|
20
|
+
/* Fancy blur effect */
|
21
|
+
#nprogress .peg {
|
22
|
+
display: block;
|
23
|
+
position: absolute;
|
24
|
+
right: 0px;
|
25
|
+
width: 100px;
|
26
|
+
height: 100%;
|
27
|
+
box-shadow: 0 0 10px $nprogress-color, 0 0 5px $nprogress-color;
|
28
|
+
opacity: 1.0;
|
29
|
+
|
30
|
+
-webkit-transform: rotate(3deg) translate(0px, -4px);
|
31
|
+
-ms-transform: rotate(3deg) translate(0px, -4px);
|
32
|
+
transform: rotate(3deg) translate(0px, -4px);
|
33
|
+
}
|
34
|
+
|
35
|
+
/* Remove these to get rid of the spinner */
|
36
|
+
#nprogress .spinner {
|
37
|
+
display: block;
|
38
|
+
position: fixed;
|
39
|
+
z-index: 100;
|
40
|
+
top: 15px;
|
41
|
+
right: 15px;
|
42
|
+
}
|
43
|
+
|
44
|
+
#nprogress .spinner-icon {
|
45
|
+
width: 18px;
|
46
|
+
height: 18px;
|
47
|
+
box-sizing: border-box;
|
48
|
+
|
49
|
+
border: solid 2px transparent;
|
50
|
+
border-top-color: $nprogress-color;
|
51
|
+
border-left-color: $nprogress-color;
|
52
|
+
border-radius: 50%;
|
53
|
+
|
54
|
+
-webkit-animation: nprogress-spinner 400ms linear infinite;
|
55
|
+
animation: nprogress-spinner 400ms linear infinite;
|
56
|
+
}
|
57
|
+
|
58
|
+
@-webkit-keyframes nprogress-spinner {
|
59
|
+
0% { -webkit-transform: rotate(0deg); }
|
60
|
+
100% { -webkit-transform: rotate(360deg); }
|
61
|
+
}
|
62
|
+
@keyframes nprogress-spinner {
|
63
|
+
0% { transform: rotate(0deg); }
|
64
|
+
100% { transform: rotate(360deg); }
|
65
|
+
}
|
data/nprogress-rails.gemspec
CHANGED
@@ -4,7 +4,7 @@ $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
|
|
4
4
|
|
5
5
|
Gem::Specification.new do |spec|
|
6
6
|
spec.name = 'nprogress-rails'
|
7
|
-
spec.version = '0.1.
|
7
|
+
spec.version = '0.1.3.0'
|
8
8
|
spec.authors = ['Carlos Alexandro Becker']
|
9
9
|
spec.email = ['caarlos0@gmail.com']
|
10
10
|
spec.description = %q{This is a gem for the rstacruz' nprogress implementation. It's based on version nprogress 0.1.2.}
|
metadata
CHANGED
@@ -1,69 +1,69 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: nprogress-rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.1.
|
4
|
+
version: 0.1.3.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Carlos Alexandro Becker
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date:
|
11
|
+
date: 2014-05-11 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: bundler
|
15
15
|
requirement: !ruby/object:Gem::Requirement
|
16
16
|
requirements:
|
17
|
-
- - ~>
|
17
|
+
- - "~>"
|
18
18
|
- !ruby/object:Gem::Version
|
19
19
|
version: '1.3'
|
20
20
|
type: :development
|
21
21
|
prerelease: false
|
22
22
|
version_requirements: !ruby/object:Gem::Requirement
|
23
23
|
requirements:
|
24
|
-
- - ~>
|
24
|
+
- - "~>"
|
25
25
|
- !ruby/object:Gem::Version
|
26
26
|
version: '1.3'
|
27
27
|
- !ruby/object:Gem::Dependency
|
28
28
|
name: rake
|
29
29
|
requirement: !ruby/object:Gem::Requirement
|
30
30
|
requirements:
|
31
|
-
- -
|
31
|
+
- - ">="
|
32
32
|
- !ruby/object:Gem::Version
|
33
33
|
version: '0'
|
34
34
|
type: :development
|
35
35
|
prerelease: false
|
36
36
|
version_requirements: !ruby/object:Gem::Requirement
|
37
37
|
requirements:
|
38
|
-
- -
|
38
|
+
- - ">="
|
39
39
|
- !ruby/object:Gem::Version
|
40
40
|
version: '0'
|
41
41
|
- !ruby/object:Gem::Dependency
|
42
42
|
name: sass-rails
|
43
43
|
requirement: !ruby/object:Gem::Requirement
|
44
44
|
requirements:
|
45
|
-
- -
|
45
|
+
- - ">="
|
46
46
|
- !ruby/object:Gem::Version
|
47
47
|
version: '0'
|
48
48
|
type: :development
|
49
49
|
prerelease: false
|
50
50
|
version_requirements: !ruby/object:Gem::Requirement
|
51
51
|
requirements:
|
52
|
-
- -
|
52
|
+
- - ">="
|
53
53
|
- !ruby/object:Gem::Version
|
54
54
|
version: '0'
|
55
55
|
- !ruby/object:Gem::Dependency
|
56
56
|
name: sass
|
57
57
|
requirement: !ruby/object:Gem::Requirement
|
58
58
|
requirements:
|
59
|
-
- -
|
59
|
+
- - ">="
|
60
60
|
- !ruby/object:Gem::Version
|
61
61
|
version: '0'
|
62
62
|
type: :development
|
63
63
|
prerelease: false
|
64
64
|
version_requirements: !ruby/object:Gem::Requirement
|
65
65
|
requirements:
|
66
|
-
- -
|
66
|
+
- - ">="
|
67
67
|
- !ruby/object:Gem::Version
|
68
68
|
version: '0'
|
69
69
|
description: This is a gem for the rstacruz' nprogress implementation. It's based
|
@@ -74,19 +74,19 @@ executables: []
|
|
74
74
|
extensions: []
|
75
75
|
extra_rdoc_files: []
|
76
76
|
files:
|
77
|
-
- .gitignore
|
77
|
+
- ".gitignore"
|
78
78
|
- Gemfile
|
79
79
|
- LICENSE.txt
|
80
80
|
- README.md
|
81
81
|
- Rakefile
|
82
|
+
- app/assets/javascripts/nprogress-ajax.js
|
83
|
+
- app/assets/javascripts/nprogress-pjax.js
|
84
|
+
- app/assets/javascripts/nprogress-turbolinks.js
|
85
|
+
- app/assets/javascripts/nprogress.js
|
86
|
+
- app/assets/stylesheets/nprogress-bootstrap.css
|
87
|
+
- app/assets/stylesheets/nprogress.css.scss
|
82
88
|
- lib/nprogress-rails.rb
|
83
89
|
- nprogress-rails.gemspec
|
84
|
-
- vendor/assets/javascripts/nprogress-ajax.js
|
85
|
-
- vendor/assets/javascripts/nprogress-pjax.js
|
86
|
-
- vendor/assets/javascripts/nprogress-turbolinks.js
|
87
|
-
- vendor/assets/javascripts/nprogress.js
|
88
|
-
- vendor/assets/stylesheets/nprogress-bootstrap.css
|
89
|
-
- vendor/assets/stylesheets/nprogress.css.scss
|
90
90
|
homepage: https://github.com/caarlos0/nprogress-rails
|
91
91
|
licenses:
|
92
92
|
- MIT
|
@@ -97,17 +97,17 @@ require_paths:
|
|
97
97
|
- lib
|
98
98
|
required_ruby_version: !ruby/object:Gem::Requirement
|
99
99
|
requirements:
|
100
|
-
- -
|
100
|
+
- - ">="
|
101
101
|
- !ruby/object:Gem::Version
|
102
102
|
version: '0'
|
103
103
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
104
104
|
requirements:
|
105
|
-
- -
|
105
|
+
- - ">="
|
106
106
|
- !ruby/object:Gem::Version
|
107
107
|
version: '0'
|
108
108
|
requirements: []
|
109
109
|
rubyforge_project:
|
110
|
-
rubygems_version: 2.
|
110
|
+
rubygems_version: 2.2.2
|
111
111
|
signing_key:
|
112
112
|
specification_version: 4
|
113
113
|
summary: Slim progress bars for Ajax'y applications. Inspired by Google, YouTube,
|
@@ -1,274 +0,0 @@
|
|
1
|
-
/*! NProgress (c) 2013, Rico Sta. Cruz
|
2
|
-
* http://ricostacruz.com/nprogress */
|
3
|
-
|
4
|
-
;(function(factory) {
|
5
|
-
|
6
|
-
if (typeof module === 'function') {
|
7
|
-
module.exports = factory(this.jQuery || require('jquery'));
|
8
|
-
} else {
|
9
|
-
this.NProgress = factory(this.jQuery);
|
10
|
-
}
|
11
|
-
|
12
|
-
})(function($) {
|
13
|
-
var NProgress = {};
|
14
|
-
|
15
|
-
NProgress.version = '0.1.2';
|
16
|
-
|
17
|
-
var Settings = NProgress.settings = {
|
18
|
-
minimum: 0.08,
|
19
|
-
easing: 'ease',
|
20
|
-
positionUsing: '',
|
21
|
-
speed: 200,
|
22
|
-
trickle: true,
|
23
|
-
trickleRate: 0.02,
|
24
|
-
trickleSpeed: 800,
|
25
|
-
showSpinner: true,
|
26
|
-
template: '<div class="bar" role="bar"><div class="peg"></div></div><div class="spinner" role="spinner"><div class="spinner-icon"></div></div>'
|
27
|
-
};
|
28
|
-
|
29
|
-
/**
|
30
|
-
* Updates configuration.
|
31
|
-
*
|
32
|
-
* NProgress.configure({
|
33
|
-
* minimum: 0.1
|
34
|
-
* });
|
35
|
-
*/
|
36
|
-
NProgress.configure = function(options) {
|
37
|
-
$.extend(Settings, options);
|
38
|
-
return this;
|
39
|
-
};
|
40
|
-
|
41
|
-
/**
|
42
|
-
* Last number.
|
43
|
-
*/
|
44
|
-
|
45
|
-
NProgress.status = null;
|
46
|
-
|
47
|
-
/**
|
48
|
-
* Sets the progress bar status, where `n` is a number from `0.0` to `1.0`.
|
49
|
-
*
|
50
|
-
* NProgress.set(0.4);
|
51
|
-
* NProgress.set(1.0);
|
52
|
-
*/
|
53
|
-
|
54
|
-
NProgress.set = function(n) {
|
55
|
-
var started = NProgress.isStarted();
|
56
|
-
|
57
|
-
n = clamp(n, Settings.minimum, 1);
|
58
|
-
NProgress.status = (n === 1 ? null : n);
|
59
|
-
|
60
|
-
var $progress = NProgress.render(!started),
|
61
|
-
$bar = $progress.find('[role="bar"]'),
|
62
|
-
speed = Settings.speed,
|
63
|
-
ease = Settings.easing;
|
64
|
-
|
65
|
-
$progress[0].offsetWidth; /* Repaint */
|
66
|
-
|
67
|
-
$progress.queue(function(next) {
|
68
|
-
// Set positionUsing if it hasn't already been set
|
69
|
-
if (Settings.positionUsing === '') Settings.positionUsing = NProgress.getPositioningCSS();
|
70
|
-
|
71
|
-
// Add transition
|
72
|
-
$bar.css(barPositionCSS(n, speed, ease));
|
73
|
-
|
74
|
-
if (n === 1) {
|
75
|
-
// Fade out
|
76
|
-
$progress.css({ transition: 'none', opacity: 1 });
|
77
|
-
$progress[0].offsetWidth; /* Repaint */
|
78
|
-
|
79
|
-
setTimeout(function() {
|
80
|
-
$progress.css({ transition: 'all '+speed+'ms linear', opacity: 0 });
|
81
|
-
setTimeout(function() {
|
82
|
-
NProgress.remove();
|
83
|
-
next();
|
84
|
-
}, speed);
|
85
|
-
}, speed);
|
86
|
-
} else {
|
87
|
-
setTimeout(next, speed);
|
88
|
-
}
|
89
|
-
});
|
90
|
-
|
91
|
-
return this;
|
92
|
-
};
|
93
|
-
|
94
|
-
NProgress.isStarted = function() {
|
95
|
-
return typeof NProgress.status === 'number';
|
96
|
-
};
|
97
|
-
|
98
|
-
/**
|
99
|
-
* Shows the progress bar.
|
100
|
-
* This is the same as setting the status to 0%, except that it doesn't go backwards.
|
101
|
-
*
|
102
|
-
* NProgress.start();
|
103
|
-
*
|
104
|
-
*/
|
105
|
-
NProgress.start = function() {
|
106
|
-
if (!NProgress.status) NProgress.set(0);
|
107
|
-
|
108
|
-
var work = function() {
|
109
|
-
setTimeout(function() {
|
110
|
-
if (!NProgress.status) return;
|
111
|
-
NProgress.trickle();
|
112
|
-
work();
|
113
|
-
}, Settings.trickleSpeed);
|
114
|
-
};
|
115
|
-
|
116
|
-
if (Settings.trickle) work();
|
117
|
-
|
118
|
-
return this;
|
119
|
-
};
|
120
|
-
|
121
|
-
/**
|
122
|
-
* Hides the progress bar.
|
123
|
-
* This is the *sort of* the same as setting the status to 100%, with the
|
124
|
-
* difference being `done()` makes some placebo effect of some realistic motion.
|
125
|
-
*
|
126
|
-
* NProgress.done();
|
127
|
-
*
|
128
|
-
* If `true` is passed, it will show the progress bar even if its hidden.
|
129
|
-
*
|
130
|
-
* NProgress.done(true);
|
131
|
-
*/
|
132
|
-
|
133
|
-
NProgress.done = function(force) {
|
134
|
-
if (!force && !NProgress.status) return this;
|
135
|
-
|
136
|
-
return NProgress.inc(0.3 + 0.5 * Math.random()).set(1);
|
137
|
-
};
|
138
|
-
|
139
|
-
/**
|
140
|
-
* Increments by a random amount.
|
141
|
-
*/
|
142
|
-
|
143
|
-
NProgress.inc = function(amount) {
|
144
|
-
var n = NProgress.status;
|
145
|
-
|
146
|
-
if (!n) {
|
147
|
-
return NProgress.start();
|
148
|
-
} else {
|
149
|
-
if (typeof amount !== 'number') {
|
150
|
-
amount = (1 - n) * clamp(Math.random() * n, 0.1, 0.95);
|
151
|
-
}
|
152
|
-
|
153
|
-
n = clamp(n + amount, 0, 0.994);
|
154
|
-
return NProgress.set(n);
|
155
|
-
}
|
156
|
-
};
|
157
|
-
|
158
|
-
NProgress.trickle = function() {
|
159
|
-
return NProgress.inc(Math.random() * Settings.trickleRate);
|
160
|
-
};
|
161
|
-
|
162
|
-
/**
|
163
|
-
* (Internal) renders the progress bar markup based on the `template`
|
164
|
-
* setting.
|
165
|
-
*/
|
166
|
-
|
167
|
-
NProgress.render = function(fromStart) {
|
168
|
-
if (NProgress.isRendered()) return $("#nprogress");
|
169
|
-
$('html').addClass('nprogress-busy');
|
170
|
-
|
171
|
-
var $el = $("<div id='nprogress'>")
|
172
|
-
.html(Settings.template);
|
173
|
-
|
174
|
-
var perc = fromStart ? '-100' : toBarPerc(NProgress.status || 0);
|
175
|
-
|
176
|
-
$el.find('[role="bar"]').css({
|
177
|
-
transition: 'all 0 linear',
|
178
|
-
transform: 'translate3d('+perc+'%,0,0)'
|
179
|
-
});
|
180
|
-
|
181
|
-
if (!Settings.showSpinner)
|
182
|
-
$el.find('[role="spinner"]').remove();
|
183
|
-
|
184
|
-
$el.appendTo(document.body);
|
185
|
-
|
186
|
-
return $el;
|
187
|
-
};
|
188
|
-
|
189
|
-
/**
|
190
|
-
* Removes the element. Opposite of render().
|
191
|
-
*/
|
192
|
-
|
193
|
-
NProgress.remove = function() {
|
194
|
-
$('html').removeClass('nprogress-busy');
|
195
|
-
$('#nprogress').remove();
|
196
|
-
};
|
197
|
-
|
198
|
-
/**
|
199
|
-
* Checks if the progress bar is rendered.
|
200
|
-
*/
|
201
|
-
|
202
|
-
NProgress.isRendered = function() {
|
203
|
-
return ($("#nprogress").length > 0);
|
204
|
-
};
|
205
|
-
|
206
|
-
/**
|
207
|
-
* Determine which positioning CSS rule to use.
|
208
|
-
*/
|
209
|
-
|
210
|
-
NProgress.getPositioningCSS = function() {
|
211
|
-
// Sniff on document.body.style
|
212
|
-
var bodyStyle = document.body.style;
|
213
|
-
|
214
|
-
// Sniff prefixes
|
215
|
-
var vendorPrefix = ('WebkitTransform' in bodyStyle) ? 'Webkit' :
|
216
|
-
('MozTransform' in bodyStyle) ? 'Moz' :
|
217
|
-
('msTransform' in bodyStyle) ? 'ms' :
|
218
|
-
('OTransform' in bodyStyle) ? 'O' : '';
|
219
|
-
|
220
|
-
if (vendorPrefix + 'Perspective' in bodyStyle) {
|
221
|
-
// Modern browsers with 3D support, e.g. Webkit, IE10
|
222
|
-
return 'translate3d';
|
223
|
-
} else if (vendorPrefix + 'Transform' in bodyStyle) {
|
224
|
-
// Browsers without 3D support, e.g. IE9
|
225
|
-
return 'translate';
|
226
|
-
} else {
|
227
|
-
// Browsers without translate() support, e.g. IE7-8
|
228
|
-
return 'margin';
|
229
|
-
}
|
230
|
-
};
|
231
|
-
|
232
|
-
/**
|
233
|
-
* Helpers
|
234
|
-
*/
|
235
|
-
|
236
|
-
function clamp(n, min, max) {
|
237
|
-
if (n < min) return min;
|
238
|
-
if (n > max) return max;
|
239
|
-
return n;
|
240
|
-
}
|
241
|
-
|
242
|
-
/**
|
243
|
-
* (Internal) converts a percentage (`0..1`) to a bar translateX
|
244
|
-
* percentage (`-100%..0%`).
|
245
|
-
*/
|
246
|
-
|
247
|
-
function toBarPerc(n) {
|
248
|
-
return (-1 + n) * 100;
|
249
|
-
}
|
250
|
-
|
251
|
-
|
252
|
-
/**
|
253
|
-
* (Internal) returns the correct CSS for changing the bar's
|
254
|
-
* position given an n percentage, and speed and ease from Settings
|
255
|
-
*/
|
256
|
-
|
257
|
-
function barPositionCSS(n, speed, ease) {
|
258
|
-
var barCSS;
|
259
|
-
|
260
|
-
if (Settings.positionUsing === 'translate3d') {
|
261
|
-
barCSS = { transform: 'translate3d('+toBarPerc(n)+'%,0,0)' };
|
262
|
-
} else if (Settings.positionUsing === 'translate') {
|
263
|
-
barCSS = { transform: 'translate('+toBarPerc(n)+'%,0)' };
|
264
|
-
} else {
|
265
|
-
barCSS = { 'margin-left': toBarPerc(n)+'%' };
|
266
|
-
}
|
267
|
-
|
268
|
-
barCSS.transition = 'all '+speed+'ms '+ease;
|
269
|
-
|
270
|
-
return barCSS;
|
271
|
-
}
|
272
|
-
|
273
|
-
return NProgress;
|
274
|
-
});
|
@@ -1,82 +0,0 @@
|
|
1
|
-
$nprogress-color: #29d !default;
|
2
|
-
|
3
|
-
/* Make clicks pass-through */
|
4
|
-
#nprogress {
|
5
|
-
pointer-events: none;
|
6
|
-
-webkit-pointer-events: none;
|
7
|
-
}
|
8
|
-
|
9
|
-
#nprogress .bar {
|
10
|
-
background: $nprogress-color;
|
11
|
-
|
12
|
-
position: fixed;
|
13
|
-
z-index: 100;
|
14
|
-
top: 0;
|
15
|
-
left: 0;
|
16
|
-
|
17
|
-
width: 100%;
|
18
|
-
height: 2px;
|
19
|
-
}
|
20
|
-
|
21
|
-
/* Fancy blur effect */
|
22
|
-
#nprogress .peg {
|
23
|
-
display: block;
|
24
|
-
position: absolute;
|
25
|
-
right: 0px;
|
26
|
-
width: 100px;
|
27
|
-
height: 100%;
|
28
|
-
box-shadow: 0 0 10px $nprogress-color, 0 0 5px $nprogress-color;
|
29
|
-
opacity: 1.0;
|
30
|
-
|
31
|
-
-webkit-transform: rotate(3deg) translate(0px, -4px);
|
32
|
-
-moz-transform: rotate(3deg) translate(0px, -4px);
|
33
|
-
-ms-transform: rotate(3deg) translate(0px, -4px);
|
34
|
-
-o-transform: rotate(3deg) translate(0px, -4px);
|
35
|
-
transform: rotate(3deg) translate(0px, -4px);
|
36
|
-
}
|
37
|
-
|
38
|
-
/* Remove these to get rid of the spinner */
|
39
|
-
#nprogress .spinner {
|
40
|
-
display: block;
|
41
|
-
position: fixed;
|
42
|
-
z-index: 100;
|
43
|
-
top: 15px;
|
44
|
-
right: 15px;
|
45
|
-
}
|
46
|
-
|
47
|
-
#nprogress .spinner-icon {
|
48
|
-
width: 14px;
|
49
|
-
height: 14px;
|
50
|
-
|
51
|
-
border: solid 2px transparent;
|
52
|
-
border-top-color: $nprogress-color;
|
53
|
-
border-left-color: $nprogress-color;
|
54
|
-
border-radius: 10px;
|
55
|
-
|
56
|
-
-webkit-animation: nprogress-spinner 400ms linear infinite;
|
57
|
-
-moz-animation: nprogress-spinner 400ms linear infinite;
|
58
|
-
-ms-animation: nprogress-spinner 400ms linear infinite;
|
59
|
-
-o-animation: nprogress-spinner 400ms linear infinite;
|
60
|
-
animation: nprogress-spinner 400ms linear infinite;
|
61
|
-
}
|
62
|
-
|
63
|
-
@-webkit-keyframes nprogress-spinner {
|
64
|
-
0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
|
65
|
-
100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
|
66
|
-
}
|
67
|
-
@-moz-keyframes nprogress-spinner {
|
68
|
-
0% { -moz-transform: rotate(0deg); transform: rotate(0deg); }
|
69
|
-
100% { -moz-transform: rotate(360deg); transform: rotate(360deg); }
|
70
|
-
}
|
71
|
-
@-o-keyframes nprogress-spinner {
|
72
|
-
0% { -o-transform: rotate(0deg); transform: rotate(0deg); }
|
73
|
-
100% { -o-transform: rotate(360deg); transform: rotate(360deg); }
|
74
|
-
}
|
75
|
-
@-ms-keyframes nprogress-spinner {
|
76
|
-
0% { -ms-transform: rotate(0deg); transform: rotate(0deg); }
|
77
|
-
100% { -ms-transform: rotate(360deg); transform: rotate(360deg); }
|
78
|
-
}
|
79
|
-
@keyframes nprogress-spinner {
|
80
|
-
0% { transform: rotate(0deg); transform: rotate(0deg); }
|
81
|
-
100% { transform: rotate(360deg); transform: rotate(360deg); }
|
82
|
-
}
|