mirror of
https://github.com/zhigang1992/DefinitelyTyped.git
synced 2026-06-05 14:59:37 +08:00
Merge pull request #23910 from matracey/master
canvas-confetti: created type definition for v0.0.2
This commit is contained in:
45
types/canvas-confetti/canvas-confetti-tests.ts
Normal file
45
types/canvas-confetti/canvas-confetti-tests.ts
Normal file
@@ -0,0 +1,45 @@
|
||||
import confetti = require("canvas-confetti");
|
||||
|
||||
confetti.Promise = null;
|
||||
|
||||
confetti();
|
||||
|
||||
confetti({
|
||||
particleCount: 150
|
||||
});
|
||||
|
||||
confetti({
|
||||
spread: 180
|
||||
});
|
||||
|
||||
confetti({
|
||||
particleCount: 100,
|
||||
startVelocity: 30,
|
||||
spread: 360,
|
||||
origin: {
|
||||
x: Math.random(),
|
||||
// since they fall down, start a bit higher than random
|
||||
y: Math.random() - 0.2
|
||||
}
|
||||
});
|
||||
|
||||
confetti({
|
||||
particleCount: 100,
|
||||
spread: 70,
|
||||
origin: {
|
||||
y: 0.6
|
||||
}
|
||||
});
|
||||
|
||||
function r(min: number, max: number) {
|
||||
return Math.random() * (max - min) + min;
|
||||
}
|
||||
|
||||
confetti({
|
||||
angle: r(55, 125),
|
||||
spread: r(50, 70),
|
||||
particleCount: r(50, 100),
|
||||
origin: {
|
||||
y: 0.6
|
||||
}
|
||||
});
|
||||
86
types/canvas-confetti/index.d.ts
vendored
Normal file
86
types/canvas-confetti/index.d.ts
vendored
Normal file
@@ -0,0 +1,86 @@
|
||||
// Type definitions for canvas-confetti 0.0
|
||||
// Project: https://github.com/catdad/canvas-confetti#readme
|
||||
// Definitions by: Martin Tracey <https://github.com/matracey>
|
||||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||||
|
||||
/**
|
||||
* `confetti` takes a single optional object. When `window.Promise` is available, it will return a Promise to let you know when it is done. When promises are not available (like in IE), it will return
|
||||
* `null`. You can polyfill promises using any of the popular polyfills. You can also provide a custom promise implementation to `confetti` through:
|
||||
*
|
||||
* `const MyPromise = require('some-promise-lib');
|
||||
* const confetti = require('canvas-confetti');
|
||||
* confetti.Promise = MyPromise;`
|
||||
*
|
||||
* If you call `confetti` multiple times before it is done, it
|
||||
* will return the same promise every time. Internally, the same canvas element will be reused, continuing the existing animation with the new confetti added. The promise returned by each call to
|
||||
* `confetti` will resolve once all animations are done.
|
||||
*
|
||||
*/
|
||||
declare function confetti(options?: confetti.Options): Promise<null> | null;
|
||||
|
||||
declare namespace confetti {
|
||||
/**
|
||||
* You can polyfill promises using any of the popular polyfills. You can also provide a promise implementation to `confetti` through this property.
|
||||
*/
|
||||
let Promise: any;
|
||||
|
||||
interface Options {
|
||||
/**
|
||||
* The number of confetti to launch. More is always fun... but be cool, there's a lot of math involved.
|
||||
* @default 50
|
||||
*/
|
||||
particleCount?: number;
|
||||
/**
|
||||
* The angle in which to launch the confetti, in degrees. 90 is straight up.
|
||||
* @default 90
|
||||
*/
|
||||
angle?: number;
|
||||
/**
|
||||
* How far off center the confetti can go, in degrees. 45 means the confetti will launch at the defined angle plus or minus 22.5 degrees.
|
||||
* @default 45
|
||||
*/
|
||||
spread?: number;
|
||||
/**
|
||||
* How fast the confetti will start going, in pixels.
|
||||
* @default 45
|
||||
*/
|
||||
startVelocity?: number;
|
||||
/**
|
||||
* How quickly the confetti will lose speed. Keep this number between 0 and 1, otherwise the confetti will gain speed. Better yet, just never change it.
|
||||
* @default 0.9
|
||||
*/
|
||||
decay?: number;
|
||||
/**
|
||||
* How many times the confetti will move. This is abstract... but play with it if the confetti disappear too quickly for you.
|
||||
* @default 200
|
||||
*/
|
||||
ticks?: number;
|
||||
/**
|
||||
* Where to start firing confetti from. Feel free to launch off-screen if you'd like.
|
||||
*/
|
||||
origin?: Origin;
|
||||
/**
|
||||
* An array of color strings, in the HEX format... you know, like #bada55.
|
||||
*/
|
||||
colors?: string[];
|
||||
/**
|
||||
* The confetti should be on top, after all. But if you have a crazy high page, you can set it even higher.
|
||||
* @default 100
|
||||
*/
|
||||
zIndex?: number;
|
||||
}
|
||||
interface Origin {
|
||||
/**
|
||||
* The x position on the page, with 0 being the left edge and 1 being the right edge.
|
||||
* @default 0.5
|
||||
*/
|
||||
x?: number;
|
||||
/**
|
||||
* The y position on the page, with 0 being the left edge and 1 being the right edge.
|
||||
* @default 0.5
|
||||
*/
|
||||
y?: number;
|
||||
}
|
||||
}
|
||||
|
||||
export = confetti;
|
||||
23
types/canvas-confetti/tsconfig.json
Normal file
23
types/canvas-confetti/tsconfig.json
Normal file
@@ -0,0 +1,23 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"module": "commonjs",
|
||||
"lib": [
|
||||
"es6"
|
||||
],
|
||||
"noImplicitAny": true,
|
||||
"noImplicitThis": true,
|
||||
"strictNullChecks": true,
|
||||
"strictFunctionTypes": true,
|
||||
"baseUrl": "../",
|
||||
"typeRoots": [
|
||||
"../"
|
||||
],
|
||||
"types": [],
|
||||
"noEmit": true,
|
||||
"forceConsistentCasingInFileNames": true
|
||||
},
|
||||
"files": [
|
||||
"index.d.ts",
|
||||
"canvas-confetti-tests.ts"
|
||||
]
|
||||
}
|
||||
1
types/canvas-confetti/tslint.json
Normal file
1
types/canvas-confetti/tslint.json
Normal file
@@ -0,0 +1 @@
|
||||
{ "extends": "dtslint/dt.json" }
|
||||
Reference in New Issue
Block a user