New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

countup.js

Package Overview
Dependencies
Maintainers
1
Versions
36
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

countup.js - npm Package Compare versions

Comparing version 1.8.5 to 1.9.0

94

countUp.js

@@ -17,2 +17,29 @@ /*

var self = this;
self.version = function () { return '1.9.0'; };
// default options
self.options = {
useEasing: true, // toggle easing
useGrouping: true, // 1,000,000 vs 1000000
separator: ',', // character to use as a separator
decimal: '.', // character to use as a decimal
easingFn: easeOutExpo, // optional custom easing function, default is Robert Penner's easeOutExpo
formattingFn: formatNumber, // optional custom formatting function, default is formatNumber above
prefix: '', // optional text before the result
suffix: '', // optional text after the result
numerals: [] // optionally pass an array of custom numerals for 0-9
};
// extend default options with passed options object
if (options && typeof options === 'object') {
for (var key in self.options) {
if (options.hasOwnProperty(key) && options[key] !== null) {
self.options[key] = options[key];
}
}
}
if (self.options.separator === '') self.options.useGrouping = false;
// make sure requestAnimationFrame and cancelAnimationFrame are defined

@@ -44,5 +71,2 @@ // polyfill for browsers without native support

var self = this;
self.version = function () { return '1.8.5'; };
function formatNumber(num) {

@@ -61,2 +85,11 @@ num = num.toFixed(self.decimals);

}
// optional numeral substitution
if (self.options.numerals.length) {
x1 = x1.replace(/[0-9]/g, function(w) {
return self.options.numerals[+w];
})
x2 = x2.replace(/[0-9]/g, function(w) {
return self.options.numerals[+w];
})
}
return self.options.prefix + x1 + x2 + self.options.suffix;

@@ -71,31 +104,10 @@ }

}
// default options
self.options = {
useEasing: true, // toggle easing
useGrouping: true, // 1,000,000 vs 1000000
separator: ',', // character to use as a separator
decimal: '.', // character to use as a decimal
easingFn: easeOutExpo, // optional custom easing function, default is Robert Penner's easeOutExpo
formattingFn: formatNumber, // optional custom formatting function, default is formatNumber above
prefix: '', // optional text before the result
suffix: '' // optional text after the result
};
// extend default options with passed options object
if (options && typeof options === 'object') {
for (var key in self.options) {
if (options.hasOwnProperty(key) && options[key] !== null) {
self.options[key] = options[key];
}
}
}
if (self.options.separator === '') self.options.useGrouping = false;
self.initialize = function() {
if (self.initialized) return true;
self.error = '';
self.d = (typeof target === 'string') ? document.getElementById(target) : target;
if (!self.d) {
console.error('[CountUp] target is null or undefined', self.d);
self.error = '[CountUp] target is null or undefined'
return false;

@@ -112,7 +124,13 @@ }

self.frameVal = self.startVal;
self.initialized = true;
return true;
if (isNaN(self.options.separator)) {
self.initialized = true;
return true;
}
else {
self.error = '[CountUp] separator cannot be a number: '+self.options.separator;
return false;
}
}
else {
console.error('[CountUp] startVal or endVal is not a number', self.startVal, self.endVal);
self.error = '[CountUp] startVal ('+startVal+') or endVal ('+endVal+') is not a number';
return false;

@@ -212,2 +230,8 @@ }

if (!self.initialize()) return;
newEndVal = Number(newEndVal);
if (!ensureNumber(newEndVal)) {
self.error = '[CountUp] update() - new endVal is not a number: '+newEndVal;
return;
}
self.error = '';
if (newEndVal === self.frameVal) return;

@@ -218,9 +242,5 @@ cancelAnimationFrame(self.rAF);

self.startVal = self.frameVal;
self.endVal = Number(newEndVal);
if (ensureNumber(self.endVal)) {
self.countDown = (self.startVal > self.endVal);
self.rAF = requestAnimationFrame(self.count);
} else {
console.error('[CountUp] update() - new endVal is not a number', newEndVal);
}
self.endVal = newEndVal;
self.countDown = (self.startVal > self.endVal);
self.rAF = requestAnimationFrame(self.count);
};

@@ -227,0 +247,0 @@

94

dist/countUp.js

@@ -28,2 +28,29 @@

var self = this;
self.version = function () { return '1.9.0'; };
// default options
self.options = {
useEasing: true, // toggle easing
useGrouping: true, // 1,000,000 vs 1000000
separator: ',', // character to use as a separator
decimal: '.', // character to use as a decimal
easingFn: easeOutExpo, // optional custom easing function, default is Robert Penner's easeOutExpo
formattingFn: formatNumber, // optional custom formatting function, default is formatNumber above
prefix: '', // optional text before the result
suffix: '', // optional text after the result
numerals: [] // optionally pass an array of custom numerals for 0-9
};
// extend default options with passed options object
if (options && typeof options === 'object') {
for (var key in self.options) {
if (options.hasOwnProperty(key) && options[key] !== null) {
self.options[key] = options[key];
}
}
}
if (self.options.separator === '') self.options.useGrouping = false;
// make sure requestAnimationFrame and cancelAnimationFrame are defined

@@ -55,5 +82,2 @@ // polyfill for browsers without native support

var self = this;
self.version = function () { return '1.8.5'; };
function formatNumber(num) {

@@ -72,2 +96,11 @@ num = num.toFixed(self.decimals);

}
// optional numeral substitution
if (self.options.numerals.length) {
x1 = x1.replace(/[0-9]/g, function(w) {
return self.options.numerals[+w];
})
x2 = x2.replace(/[0-9]/g, function(w) {
return self.options.numerals[+w];
})
}
return self.options.prefix + x1 + x2 + self.options.suffix;

@@ -82,31 +115,10 @@ }

}
// default options
self.options = {
useEasing: true, // toggle easing
useGrouping: true, // 1,000,000 vs 1000000
separator: ',', // character to use as a separator
decimal: '.', // character to use as a decimal
easingFn: easeOutExpo, // optional custom easing function, default is Robert Penner's easeOutExpo
formattingFn: formatNumber, // optional custom formatting function, default is formatNumber above
prefix: '', // optional text before the result
suffix: '' // optional text after the result
};
// extend default options with passed options object
if (options && typeof options === 'object') {
for (var key in self.options) {
if (options.hasOwnProperty(key) && options[key] !== null) {
self.options[key] = options[key];
}
}
}
if (self.options.separator === '') self.options.useGrouping = false;
self.initialize = function() {
if (self.initialized) return true;
self.error = '';
self.d = (typeof target === 'string') ? document.getElementById(target) : target;
if (!self.d) {
console.error('[CountUp] target is null or undefined', self.d);
self.error = '[CountUp] target is null or undefined'
return false;

@@ -123,7 +135,13 @@ }

self.frameVal = self.startVal;
self.initialized = true;
return true;
if (isNaN(self.options.separator)) {
self.initialized = true;
return true;
}
else {
self.error = '[CountUp] separator cannot be a number: '+self.options.separator;
return false;
}
}
else {
console.error('[CountUp] startVal or endVal is not a number', self.startVal, self.endVal);
self.error = '[CountUp] startVal ('+startVal+') or endVal ('+endVal+') is not a number';
return false;

@@ -223,2 +241,8 @@ }

if (!self.initialize()) return;
newEndVal = Number(newEndVal);
if (!ensureNumber(newEndVal)) {
self.error = '[CountUp] update() - new endVal is not a number: '+newEndVal;
return;
}
self.error = '';
if (newEndVal === self.frameVal) return;

@@ -229,9 +253,5 @@ cancelAnimationFrame(self.rAF);

self.startVal = self.frameVal;
self.endVal = Number(newEndVal);
if (ensureNumber(self.endVal)) {
self.countDown = (self.startVal > self.endVal);
self.rAF = requestAnimationFrame(self.count);
} else {
console.error('[CountUp] update() - new endVal is not a number', newEndVal);
}
self.endVal = newEndVal;
self.countDown = (self.startVal > self.endVal);
self.rAF = requestAnimationFrame(self.count);
};

@@ -238,0 +258,0 @@

2

dist/countUp.min.js

@@ -1,1 +0,1 @@

!function(a,t){"function"==typeof define&&define.amd?define(t):"object"==typeof exports?module.exports=t(require,exports,module):a.CountUp=t()}(this,function(a,t,e){var n=function(a,t,e,n,i,r){function o(a){a=a.toFixed(c.decimals),a+="";var t,e,n,i;if(t=a.split("."),e=t[0],n=t.length>1?c.options.decimal+t[1]:"",i=/(\d+)(\d{3})/,c.options.useGrouping)for(;i.test(e);)e=e.replace(i,"$1"+c.options.separator+"$2");return c.options.prefix+e+n+c.options.suffix}function l(a,t,e,n){return e*(-Math.pow(2,-10*a/n)+1)*1024/1023+t}function s(a){return"number"==typeof a&&!isNaN(a)}for(var u=0,m=["webkit","moz","ms","o"],d=0;d<m.length&&!window.requestAnimationFrame;++d)window.requestAnimationFrame=window[m[d]+"RequestAnimationFrame"],window.cancelAnimationFrame=window[m[d]+"CancelAnimationFrame"]||window[m[d]+"CancelRequestAnimationFrame"];window.requestAnimationFrame||(window.requestAnimationFrame=function(a,t){var e=(new Date).getTime(),n=Math.max(0,16-(e-u)),i=window.setTimeout(function(){a(e+n)},n);return u=e+n,i}),window.cancelAnimationFrame||(window.cancelAnimationFrame=function(a){clearTimeout(a)});var c=this;if(c.version=function(){return"1.8.5"},c.options={useEasing:!0,useGrouping:!0,separator:",",decimal:".",easingFn:l,formattingFn:o,prefix:"",suffix:""},r&&"object"==typeof r)for(var f in c.options)r.hasOwnProperty(f)&&null!==r[f]&&(c.options[f]=r[f]);""===c.options.separator&&(c.options.useGrouping=!1),c.initialize=function(){return!!c.initialized||(c.d="string"==typeof a?document.getElementById(a):a,c.d?(c.startVal=Number(t),c.endVal=Number(e),s(c.startVal)&&s(c.endVal)?(c.decimals=Math.max(0,n||0),c.dec=Math.pow(10,c.decimals),c.duration=1e3*Number(i)||2e3,c.countDown=c.startVal>c.endVal,c.frameVal=c.startVal,c.initialized=!0,!0):(console.error("[CountUp] startVal or endVal is not a number",c.startVal,c.endVal),!1)):(console.error("[CountUp] target is null or undefined",c.d),!1))},c.printValue=function(a){var t=c.options.formattingFn(a);"INPUT"===c.d.tagName?this.d.value=t:"text"===c.d.tagName||"tspan"===c.d.tagName?this.d.textContent=t:this.d.innerHTML=t},c.count=function(a){c.startTime||(c.startTime=a),c.timestamp=a;var t=a-c.startTime;c.remaining=c.duration-t,c.options.useEasing?c.countDown?c.frameVal=c.startVal-c.options.easingFn(t,0,c.startVal-c.endVal,c.duration):c.frameVal=c.options.easingFn(t,c.startVal,c.endVal-c.startVal,c.duration):c.countDown?c.frameVal=c.startVal-(c.startVal-c.endVal)*(t/c.duration):c.frameVal=c.startVal+(c.endVal-c.startVal)*(t/c.duration),c.countDown?c.frameVal=c.frameVal<c.endVal?c.endVal:c.frameVal:c.frameVal=c.frameVal>c.endVal?c.endVal:c.frameVal,c.frameVal=Math.round(c.frameVal*c.dec)/c.dec,c.printValue(c.frameVal),t<c.duration?c.rAF=requestAnimationFrame(c.count):c.callback&&c.callback()},c.start=function(a){c.initialize()&&(c.callback=a,c.rAF=requestAnimationFrame(c.count))},c.pauseResume=function(){c.paused?(c.paused=!1,delete c.startTime,c.duration=c.remaining,c.startVal=c.frameVal,requestAnimationFrame(c.count)):(c.paused=!0,cancelAnimationFrame(c.rAF))},c.reset=function(){c.paused=!1,delete c.startTime,c.initialized=!1,c.initialize()&&(cancelAnimationFrame(c.rAF),c.printValue(c.startVal))},c.update=function(a){c.initialize()&&a!==c.frameVal&&(cancelAnimationFrame(c.rAF),c.paused=!1,delete c.startTime,c.startVal=c.frameVal,c.endVal=Number(a),s(c.endVal)?(c.countDown=c.startVal>c.endVal,c.rAF=requestAnimationFrame(c.count)):console.error("[CountUp] update() - new endVal is not a number",a))},c.initialize()&&c.printValue(c.startVal)};return n});
!function(a,e){"function"==typeof define&&define.amd?define(e):"object"==typeof exports?module.exports=e(require,exports,module):a.CountUp=e()}(this,function(a,e,n){var t=function(a,e,n,t,i,r){function o(a){a=a.toFixed(l.decimals),a+="";var e,n,t,i;if(e=a.split("."),n=e[0],t=e.length>1?l.options.decimal+e[1]:"",i=/(\d+)(\d{3})/,l.options.useGrouping)for(;i.test(n);)n=n.replace(i,"$1"+l.options.separator+"$2");return l.options.numerals.length&&(n=n.replace(/[0-9]/g,function(a){return l.options.numerals[+a]}),t=t.replace(/[0-9]/g,function(a){return l.options.numerals[+a]})),l.options.prefix+n+t+l.options.suffix}function s(a,e,n,t){return n*(-Math.pow(2,-10*a/t)+1)*1024/1023+e}function u(a){return"number"==typeof a&&!isNaN(a)}var l=this;if(l.version=function(){return"1.9.0"},l.options={useEasing:!0,useGrouping:!0,separator:",",decimal:".",easingFn:s,formattingFn:o,prefix:"",suffix:"",numerals:[]},r&&"object"==typeof r)for(var m in l.options)r.hasOwnProperty(m)&&null!==r[m]&&(l.options[m]=r[m]);""===l.options.separator&&(l.options.useGrouping=!1);for(var d=0,c=["webkit","moz","ms","o"],p=0;p<c.length&&!window.requestAnimationFrame;++p)window.requestAnimationFrame=window[c[p]+"RequestAnimationFrame"],window.cancelAnimationFrame=window[c[p]+"CancelAnimationFrame"]||window[c[p]+"CancelRequestAnimationFrame"];window.requestAnimationFrame||(window.requestAnimationFrame=function(a,e){var n=(new Date).getTime(),t=Math.max(0,16-(n-d)),i=window.setTimeout(function(){a(n+t)},t);return d=n+t,i}),window.cancelAnimationFrame||(window.cancelAnimationFrame=function(a){clearTimeout(a)}),l.initialize=function(){return!!l.initialized||(l.error="",l.d="string"==typeof a?document.getElementById(a):a,l.d?(l.startVal=Number(e),l.endVal=Number(n),u(l.startVal)&&u(l.endVal)?(l.decimals=Math.max(0,t||0),l.dec=Math.pow(10,l.decimals),l.duration=1e3*Number(i)||2e3,l.countDown=l.startVal>l.endVal,l.frameVal=l.startVal,isNaN(l.options.separator)?(l.initialized=!0,!0):(l.error="[CountUp] separator cannot be a number: "+l.options.separator,!1)):(l.error="[CountUp] startVal ("+e+") or endVal ("+n+") is not a number",!1)):(l.error="[CountUp] target is null or undefined",!1))},l.printValue=function(a){var e=l.options.formattingFn(a);"INPUT"===l.d.tagName?this.d.value=e:"text"===l.d.tagName||"tspan"===l.d.tagName?this.d.textContent=e:this.d.innerHTML=e},l.count=function(a){l.startTime||(l.startTime=a),l.timestamp=a;var e=a-l.startTime;l.remaining=l.duration-e,l.options.useEasing?l.countDown?l.frameVal=l.startVal-l.options.easingFn(e,0,l.startVal-l.endVal,l.duration):l.frameVal=l.options.easingFn(e,l.startVal,l.endVal-l.startVal,l.duration):l.countDown?l.frameVal=l.startVal-(l.startVal-l.endVal)*(e/l.duration):l.frameVal=l.startVal+(l.endVal-l.startVal)*(e/l.duration),l.countDown?l.frameVal=l.frameVal<l.endVal?l.endVal:l.frameVal:l.frameVal=l.frameVal>l.endVal?l.endVal:l.frameVal,l.frameVal=Math.round(l.frameVal*l.dec)/l.dec,l.printValue(l.frameVal),e<l.duration?l.rAF=requestAnimationFrame(l.count):l.callback&&l.callback()},l.start=function(a){l.initialize()&&(l.callback=a,l.rAF=requestAnimationFrame(l.count))},l.pauseResume=function(){l.paused?(l.paused=!1,delete l.startTime,l.duration=l.remaining,l.startVal=l.frameVal,requestAnimationFrame(l.count)):(l.paused=!0,cancelAnimationFrame(l.rAF))},l.reset=function(){l.paused=!1,delete l.startTime,l.initialized=!1,l.initialize()&&(cancelAnimationFrame(l.rAF),l.printValue(l.startVal))},l.update=function(a){if(l.initialize()){if(a=Number(a),!u(a))return void(l.error="[CountUp] update() - new endVal is not a number: "+a);l.error="",a!==l.frameVal&&(cancelAnimationFrame(l.rAF),l.paused=!1,delete l.startTime,l.startVal=l.frameVal,l.endVal=a,l.countDown=l.startVal>l.endVal,l.rAF=requestAnimationFrame(l.count))}},l.initialize()&&l.printValue(l.startVal)};return t});

14

gulpfile.js

@@ -6,4 +6,2 @@ var gulp = require('gulp');

var del = require('del');
var ts = require("gulp-typescript");
var tsProject = ts.createProject("tsconfig.json");

@@ -28,14 +26,2 @@ gulp.task('clean', function(cb) {

.pipe(gulp.dest('dist/'));
var angularCountup = gulp
.src('angular-countUp.js')
.pipe(gulp.dest('dist/'))
.pipe(uglify())
.pipe(rename({
suffix: '.min'
}))
.pipe(gulp.dest('dist/'));
var angular2Countup = tsProject
.src()
.pipe(tsProject())
.pipe(gulp.dest('dist/'));
});

@@ -42,0 +28,0 @@

10

package.json
{
"name": "countup.js",
"description": "Animates a numerical value by counting to it",
"version": "1.8.5",
"version": "1.9.0",
"license": "MIT",

@@ -13,13 +13,7 @@ "main": "./dist/countUp.min.js",

"devDependencies": {
"@angular/core": "^2.2.3",
"@types/core-js": "^0.9.34",
"del": "~0.1.3",
"gulp": "~3.8.10",
"gulp-rename": "~1.2.0",
"gulp-typescript": "^3.1.3",
"gulp-uglify": "^1.4.2",
"gulp-wrap-umd": "~0.2.1",
"rxjs": "^5.0.1",
"typescript": "^2.0.10",
"zone.js": "^0.7.2"
"gulp-wrap-umd": "~0.2.1"
},

@@ -26,0 +20,0 @@ "scripts": {

110

README.md

@@ -10,2 +10,13 @@ # CountUp.js

## Please note
_Angular 1 and 2 modules used to be part of this repo_. **As of v1.9.0, they have moved.** See links below.
## See Also
- **[CountUp.js Angular 1.x Module](https://github.com/inorganik/countUp.js-angular1)**
- **[CountUp.js Angular ^2 Module](https://github.com/inorganik/countUp.js-angular2)**
- **[CountUp.js React](https://github.com/glennreyes/react-countup)**
- **[CountUp.js WordPress Plugin](https://wordpress.org/plugins/countup-js/)**
## Installation

@@ -17,15 +28,4 @@

## Angular directive
If you are using Angular, you can use the included Angular module. Use the count-up attribute to quickly create an animation. It also integrates nicely with the Angular-scroll-spy directive. The Angular directive only requires an `end-val` attribute, but will also accept `start-val`, `duration`, `decimals`, and `options`. `id` is not needed. You must include both countUp.js and the module to use the Angular directive. **[Check out the angular demo](http://inorganik.github.io/angular-scroll-spy/)** and see usage examples below.
## Angular 2 directive
An identical Angular 2 version of the directive compatible with version ^2.0.0 is also provided.
Simply import the module from `dist/` into your application module's `imports` array. See example below.
## jQuery
A jQuery version is also included in case you like dollar signs.
## WordPress plugin
Add CountUp to your WordPress site with this plugin: [https://wordpress.org/plugins/countup-js/](https://wordpress.org/plugins/countup-js/)
## Usage:

@@ -44,3 +44,7 @@ Params:

var numAnim = new CountUp("SomeElementYouWantToAnimate", 24.02, 99.99);
numAnim.start();
if (!numAnim.error) {
numAnim.start();
} else {
console.error(numAnim.error);
}
```

@@ -83,3 +87,3 @@

var endVal = 9645.72;
var numAnim = new CountUp("targetElem", 0, endVal - 100, duration/2);
var numAnim = new CountUp("targetElem", 0, endVal - 100, 2, duration/2);
numAnim.start(function() {

@@ -90,80 +94,2 @@ numAnim.update(endVal);

#### Angular
*If you are using Angular*, (not required), create your animation like the examples below. Make sure you include both countUp.js and angular-countUp.js, and inject the `countUpModule`.
```html
<h2 count-up end-val="873.4"></h2>
```
With [angular-scroll-spy](http://inorganik.github.io/angular-scroll-spy/):
```html
<h2 count-up id="numberAnimation" end-val="873.4" scroll-spy-event="elementFirstScrolledIntoView" scroll-spy></h2>
```
#### Angular 2
The directive is compatible with Angular version ^2.0.0. Make sure `countUp.js` is loaded as a global dependency during bootstrapping.
Note the value for the `options` parameter is passed directly to the directive attribute selector.
```ts
import {Component, NgModule} from '@angular/core';
import {CountUpModule} from 'countup.js/dist/countUp.module';
@NgModule({
imports: [CountUpModule],
bootstrap: [AppComponent]
})
export class AppModule {}
// ...
// ...
// Use in some component contained within the importing module...
@Component({
selector: 'counting-header',
template: `
<h1 countUp="{useEasing: false}"
[startVal]="myStartVal"
[endVal]="myEndVal"
[reanimateOnClick]="false"></h1>
`
})
export class CountingHeaderComponent {
@Input()
myStartVal: number;
@Input()
myEndVal: number;
}
```
#### Custom easing:
You can optionally apply your custom easing function, which will receive 4 parameters necessary to calculate a Bezier curve:
- `t` (the current time);
- `b` (the beginning value);
- `c` (the difference between the beginning and destination value);
- `d` (the total time of the tween).
You could use any of Robert Penner's [easing functions](https://github.com/danro/jquery-easing/blob/master/jquery.easing.js). Just avoid using "bouncy" functions, because they cause counting in both directions
If you don't specify a custom easing function, CountUp uses the default `easeOutExpo`.
Example:
```js
var easeOutCubic = function(t, b, c, d) {
var ts = (t /= d) * t;
var tc = ts * t;
return b + c * (1.77635683940025e-15 * tc * ts + 0.999999999999998 * tc + -3 * ts + 3 * t);
};
var options = {
  easingFn: easeOutCubic
};
var demo = new CountUp("myTargetElement", 24.02, 94.62, 2, 2.5, options);
demo.start();
```
## Contributing <a name="contributing"></a>

@@ -173,5 +99,5 @@

1. Do your work on the `countUp.js` and/or other files in the root directory.
1. Do your work on `countUp.js` and/or other files in the root directory.
2. In Terminal, `cd` to the `countUp.js` directory.
3. Run `npm install`, which installs gulp and its dependencies.
4. Run `gulp`, which copies and minifies the .js files to the `dist` folder.
angular-countUp.js
countUp.module.ts
dist/angular-countUp.js
dist/angular-countUp.min.js
dist/countUp.module.d.ts
dist/countUp.module.js
index.d.ts
tsconfig.json
index.html

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc