From beef6312169ea0491d6122a2184091e149679a10 Mon Sep 17 00:00:00 2001 From: Rostislav Shermenyov Date: Fri, 28 Sep 2018 16:05:46 +0300 Subject: [PATCH 1/2] Added type definitions for countup.js --- types/countup.js/countup.js-tests.ts | 32 +++++++ types/countup.js/index.d.ts | 131 +++++++++++++++++++++++++++ types/countup.js/tsconfig.json | 24 +++++ types/countup.js/tslint.json | 3 + 4 files changed, 190 insertions(+) create mode 100644 types/countup.js/countup.js-tests.ts create mode 100644 types/countup.js/index.d.ts create mode 100644 types/countup.js/tsconfig.json create mode 100644 types/countup.js/tslint.json diff --git a/types/countup.js/countup.js-tests.ts b/types/countup.js/countup.js-tests.ts new file mode 100644 index 0000000000..1cee20301d --- /dev/null +++ b/types/countup.js/countup.js-tests.ts @@ -0,0 +1,32 @@ +const b = new CountUp(); + +const options: countUp.CountUpOptions = { + decimal: ",", + useGrouping: true, + suffix: "-", + prefix: "=", + separator: "/", + useEasing: true, + formattingFn: number => number + "-", + easingFn: (t, b, c, d) => t + b + c + d, + numerals: ["q", 2, "e", [3], "t", 0, "u", 7, "o", "p"] +}; + +const element = document.getElementById("#id"); +if (element) { + const instance2 = new CountUp(element, 2, "3", 0, "5", options); +} + +const instance = new CountUp(".js-target", 2, "3", 0, "5", options); + +instance.start(); + +instance.start(() => { + console.log(instance.version()); +}); + +instance.update(999); + +instance.pauseResume(); + +if (instance.paused) instance.reset(); diff --git a/types/countup.js/index.d.ts b/types/countup.js/index.d.ts new file mode 100644 index 0000000000..72b75a003a --- /dev/null +++ b/types/countup.js/index.d.ts @@ -0,0 +1,131 @@ +// Type definitions for countup.js v1.9.3 +// Project: https://github.com/inorganik/CountUp.js +// Definitions by: Rostislav Shermenyov +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped + +declare const CountUp: countUp.CountUpConstructor; + +declare module "countup.js" { + export = CountUp; +} + +declare namespace countUp { + interface CountUpConstructor { + /** + * @param target Id of html element or var of previously selected html element where counting occurs + * @param startVal The value you want to begin at + * @param endVal The value you want to arrive at + * @param decimals Number of decimal places, default 0 + * @param duration Duration of animation in seconds, default 2 + * @param options Object of options + * @return CountUp instance + */ + new ( + target?: string | HTMLElement, + startVal?: number | string, + endVal?: number | string, + decimals?: number | string, + duration?: number | string, + options?: CountUpOptions + ): CountUpInstance; + } + + interface CountUpOptions { + /** + * Character to use as a decimal + */ + decimal?: string; + /** + * Optional custom easing function, default is Robert Penner's easeOutExpo + * @param t current time + * @param b start value + * @param c change in value + * @param d duration + * @return calculated value + */ + easingFn?(t: number, b: number, c: number, d: number): number; + /** + * Optional custom formatting function + * @param num + * @return + */ + formattingFn?(num: number): string; + /** + * Optionally pass an array of custom numerals for 0-9 + */ + numerals?: any[]; + /** + * Optional text before the result + */ + prefix?: string; + /** + * Character to use as a separator + */ + separator?: string; + /** + * Optional text after the result + */ + suffix?: string; + /** + * Toggle easing + */ + useEasing?: boolean; + /** + * 1,000,000 vs 1000000 + */ + useGrouping?: boolean; + } + + interface CountUpInstance { + // #region Dynamic params + // Will appear(or not) in the CountUpInstance object once the other functions fire + // i.e. paused will return undefined instead of boolean unless the pauseResume() was called before + countDown?: boolean; + d?: any; + dec?: number; + decimals?: number; + duration?: number; + endVal?: number; + error?: string; + frameVal?: number; + initialized?: boolean; + options?: CountUpOptions; + paused?: boolean; + rAF?: number; + remaining?: number; + startTime?: number; + startVal?: number; + timestamp?: number; + callback?(): void; + // #endregion + /** + * @param timestamp + */ + count(timestamp: number): void; + initialize(): boolean; + /** + * Toggles pause/resume animation. + */ + pauseResume(): void; + /** + * Print value to target. + * @param value number that will be passed to formattingFn and then printed to the target + */ + printValue(value: number): void; + /** + * Reset to startVal so animation can be run again. + */ + reset(): void; + /** + * Start your animation. + * @param callback Option callback to run on animation end + */ + start(callback?: () => void): void; + /** + * Pass a new endVal and start animation. + * @param newEndVal new value + */ + update(newEndVal: number | string): void; + version(): string; + } +} diff --git a/types/countup.js/tsconfig.json b/types/countup.js/tsconfig.json new file mode 100644 index 0000000000..dc6a91b4a2 --- /dev/null +++ b/types/countup.js/tsconfig.json @@ -0,0 +1,24 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": [ + "es6", + "dom" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "strictFunctionTypes": true, + "baseUrl": "../", + "typeRoots": [ + "../" + ], + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true + }, + "files": [ + "index.d.ts", + "countup.js-tests.ts" + ] +} diff --git a/types/countup.js/tslint.json b/types/countup.js/tslint.json new file mode 100644 index 0000000000..d88586e5bd --- /dev/null +++ b/types/countup.js/tslint.json @@ -0,0 +1,3 @@ +{ + "extends": "dtslint/dt.json" +} From a2310c136a1e96412038ceeac220d61fea8afdb2 Mon Sep 17 00:00:00 2001 From: Rostislav Shermenyov Date: Fri, 28 Sep 2018 18:24:51 +0300 Subject: [PATCH 2/2] Linter & fixes --- types/countup.js/countup.js-tests.ts | 26 +++--- types/countup.js/index.d.ts | 133 +++++++++++++-------------- 2 files changed, 76 insertions(+), 83 deletions(-) diff --git a/types/countup.js/countup.js-tests.ts b/types/countup.js/countup.js-tests.ts index 1cee20301d..4b0dfc36d6 100644 --- a/types/countup.js/countup.js-tests.ts +++ b/types/countup.js/countup.js-tests.ts @@ -1,20 +1,20 @@ -const b = new CountUp(); +const b = new CountUp(".foo", 0, 100); -const options: countUp.CountUpOptions = { - decimal: ",", - useGrouping: true, - suffix: "-", - prefix: "=", - separator: "/", - useEasing: true, - formattingFn: number => number + "-", - easingFn: (t, b, c, d) => t + b + c + d, - numerals: ["q", 2, "e", [3], "t", 0, "u", 7, "o", "p"] +const options: CountUp.CountUpOptions = { + decimal: ",", + useGrouping: true, + suffix: "-", + prefix: "=", + separator: "/", + useEasing: true, + formattingFn: number => number + "-", + easingFn: (t, b, c, d) => t + b + c + d, + numerals: ["q", 2, "e", [3], "t", 0, "u", 7, "o", "p"] }; const element = document.getElementById("#id"); if (element) { - const instance2 = new CountUp(element, 2, "3", 0, "5", options); + const instance2 = new CountUp(element, 2, "3", 0, "5", options); } const instance = new CountUp(".js-target", 2, "3", 0, "5", options); @@ -22,7 +22,7 @@ const instance = new CountUp(".js-target", 2, "3", 0, "5", options); instance.start(); instance.start(() => { - console.log(instance.version()); + console.log(instance.version()); }); instance.update(999); diff --git a/types/countup.js/index.d.ts b/types/countup.js/index.d.ts index 72b75a003a..e74376d75b 100644 --- a/types/countup.js/index.d.ts +++ b/types/countup.js/index.d.ts @@ -1,16 +1,9 @@ -// Type definitions for countup.js v1.9.3 +// Type definitions for countup.js 1.9 // Project: https://github.com/inorganik/CountUp.js -// Definitions by: Rostislav Shermenyov +// Definitions by: Rostislav Shermenyov // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped -declare const CountUp: countUp.CountUpConstructor; - -declare module "countup.js" { - export = CountUp; -} - -declare namespace countUp { - interface CountUpConstructor { +declare class CountUp { /** * @param target Id of html element or var of previously selected html element where counting occurs * @param startVal The value you want to begin at @@ -18,65 +11,15 @@ declare namespace countUp { * @param decimals Number of decimal places, default 0 * @param duration Duration of animation in seconds, default 2 * @param options Object of options - * @return CountUp instance */ - new ( - target?: string | HTMLElement, - startVal?: number | string, - endVal?: number | string, - decimals?: number | string, - duration?: number | string, - options?: CountUpOptions - ): CountUpInstance; - } - - interface CountUpOptions { - /** - * Character to use as a decimal - */ - decimal?: string; - /** - * Optional custom easing function, default is Robert Penner's easeOutExpo - * @param t current time - * @param b start value - * @param c change in value - * @param d duration - * @return calculated value - */ - easingFn?(t: number, b: number, c: number, d: number): number; - /** - * Optional custom formatting function - * @param num - * @return - */ - formattingFn?(num: number): string; - /** - * Optionally pass an array of custom numerals for 0-9 - */ - numerals?: any[]; - /** - * Optional text before the result - */ - prefix?: string; - /** - * Character to use as a separator - */ - separator?: string; - /** - * Optional text after the result - */ - suffix?: string; - /** - * Toggle easing - */ - useEasing?: boolean; - /** - * 1,000,000 vs 1000000 - */ - useGrouping?: boolean; - } - - interface CountUpInstance { + constructor( + target: string | HTMLElement, + startVal: number | string, + endVal: number | string, + decimals?: number | string, + duration?: number | string, + options?: CountUp.CountUpOptions + ); // #region Dynamic params // Will appear(or not) in the CountUpInstance object once the other functions fire // i.e. paused will return undefined instead of boolean unless the pauseResume() was called before @@ -89,7 +32,7 @@ declare namespace countUp { error?: string; frameVal?: number; initialized?: boolean; - options?: CountUpOptions; + options?: CountUp.CountUpOptions; paused?: boolean; rAF?: number; remaining?: number; @@ -127,5 +70,55 @@ declare namespace countUp { */ update(newEndVal: number | string): void; version(): string; - } } + +declare namespace CountUp { + interface CountUpOptions { + /** + * Character to use as a decimal + */ + decimal?: string; + /** + * Optional custom easing function, default is Robert Penner's easeOutExpo + * @param t current time + * @param b start value + * @param c change in value + * @param d duration + * @return calculated value + */ + easingFn?(t: number, b: number, c: number, d: number): number; + /** + * Optional custom formatting function + * @param num + * @return + */ + formattingFn?(num: number): string; + /** + * Optionally pass an array of custom numerals for 0-9 + */ + numerals?: any[]; + /** + * Optional text before the result + */ + prefix?: string; + /** + * Character to use as a separator + */ + separator?: string; + /** + * Optional text after the result + */ + suffix?: string; + /** + * Toggle easing + */ + useEasing?: boolean; + /** + * 1,000,000 vs 1000000 + */ + useGrouping?: boolean; + } +} + +export = CountUp; +export as namespace CountUp;