Skip to content

Commit

Permalink
Merge branch 'matteobruni-master'
Browse files Browse the repository at this point in the history
  • Loading branch information
@wufe
wufe committed Jul 21, 2020
2 parents fc6c002 + ffb7fdf commit 4afcf76
Show file tree
Hide file tree
Showing 5 changed files with 65 additions and 72 deletions.
40 changes: 11 additions & 29 deletions index.d.ts
View file
Expand Up @@ -4,40 +4,22 @@
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped

/// <reference types="react" />

export type RecursivePartial<T> = {
[P in keyof T]?: T[P] extends (infer U)[]
? RecursivePartial<U>[]
: T[P] extends object ? RecursivePartial<T[P]> : T[P]
};

import { ComponentClass } from "react";
import { IOptions } from "tsparticles/dist/Interfaces/Options/IOptions";
import { Container } from "tsparticles/dist/Classes/Container";
import { Container } from "tsparticles/dist/Core/Container";
import { IParticlesParams } from "./src/Particles";

export * from 'tsparticles/dist/Enums/InteractivityDetect';
export * from 'tsparticles/dist/Enums/MoveDirection';
export * from 'tsparticles/dist/Enums/OutMode';
export * from 'tsparticles/dist/Enums/PolygonMaskInlineArrangement';
export * from 'tsparticles/dist/Enums/PolygonMaskMoveType';
export * from 'tsparticles/dist/Enums/PolygonMaskType';
export * from 'tsparticles/dist/Enums/ProcessBubbleType';
export * from 'tsparticles/dist/Enums/RotateDirection';
export * from 'tsparticles/dist/Enums/ShapeType';
export * from 'tsparticles/dist/Enums/Modes/ClickMode';
export * from 'tsparticles/dist/Enums/Modes/DivMode';
export * from 'tsparticles/dist/Enums/Modes/HoverMode';
export { IParticlesParams };

export type IParticlesParams = RecursivePartial<IOptions>;
export * from 'tsparticles/dist/Enums';

export interface ParticlesProps {
width?: string;
height?: string;
params?: IParticlesParams;
style?: any;
className?: string;
canvasClassName?: string;
particlesRef?: React.RefObject<Container>;
width?: string;
height?: string;
params?: IParticlesParams;
style?: any;
className?: string;
canvasClassName?: string;
particlesRef?: React.RefObject<Container>;
}

type Particles = ComponentClass<ParticlesProps>;
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Expand Up @@ -35,7 +35,7 @@
},
"dependencies": {
"lodash": "^4.17.11",
"tsparticles": "^1.14.3"
"tsparticles": "^1.17.1"
},
"peerDependencies": {
"react": "^16.0.0"
Expand Down
60 changes: 30 additions & 30 deletions src/DefaultOptions.ts
View file
@@ -1,50 +1,50 @@
import type { IOptions } from "tsparticles/dist/Interfaces/Options/IOptions";
import { ShapeType } from "tsparticles/dist/Enums/ShapeType";
import type { RecursivePartial } from "tsparticles/dist/Types/RecursivePartial";
import { PolygonMaskType } from "tsparticles/dist/Enums/PolygonMaskType";
import { PolygonMaskInlineArrangement } from "tsparticles/dist/Enums/PolygonMaskInlineArrangement";
import { PolygonMaskMoveType } from "tsparticles/dist/Enums/PolygonMaskMoveType";
import { HoverMode } from "tsparticles/dist/Enums/Modes/HoverMode";
import { ClickMode } from "tsparticles/dist/Enums/Modes/ClickMode";
import { InteractivityDetect } from "tsparticles/dist/Enums/InteractivityDetect";
import { OutMode } from "tsparticles/dist/Enums/OutMode";
import { MoveDirection } from "tsparticles/dist/Enums/MoveDirection";
import { RecursivePartial } from "tsparticles/dist/Types/RecursivePartial";
import { ClickMode, HoverMode, InteractivityDetect, MoveDirection, OutMode, ShapeType } from "tsparticles/dist/Enums";
import type { IOptions } from "tsparticles/dist/Options/Interfaces/IOptions";
import {
InlineArrangement as PolygonMaskInlineArrangement,
IPolygonMaskOptions,
MoveType as PolygonMaskMoveType,
Type as PolygonMaskType
} from "tsparticles/dist/Plugins/PolygonMask/PolygonMaskPlugin";
import { IAbsorberOptions } from "tsparticles/dist/Plugins/Absorbers/AbsorbersPlugin";
import { IEmitterOptions } from "tsparticles/dist/Plugins/Emitters/EmittersPlugin";

export const defaultParams: RecursivePartial<IOptions> = {
export const defaultParams: RecursivePartial<IOptions & IPolygonMaskOptions & IAbsorberOptions & IEmitterOptions> = {
particles: {
number: {
value: 40,
max: -1,
density: {
enable: false,
value_area: 1200
area: 1200
}
},
color: {
value: "#FFF"
},
shape: {
type: ShapeType.circle,
stroke: {
width: 0,
color: "#000000"
},
polygon: {
nb_sides: 5
sides: 5
},
image: {
src: "",
width: 100,
height: 100
},
}
},
stroke: {
width: 0,
color: "#000000"
},
opacity: {
value: 0.5,
random: false,
anim: {
enable: true,
speed: 1,
opacity_min: 0.1,
minimumValue: 0.1,
sync: false
}
},
Expand All @@ -54,11 +54,11 @@ export const defaultParams: RecursivePartial<IOptions> = {
anim: {
enable: false,
speed: 40,
size_min: 0,
minimumValue: 0,
sync: false
}
},
line_linked: {
links: {
enable: true,
distance: 150,
color: "#FFF",
Expand All @@ -76,14 +76,14 @@ export const defaultParams: RecursivePartial<IOptions> = {
direction: MoveDirection.none,
random: false,
straight: false,
out_mode: OutMode.bounce,
outMode: OutMode.bounce,
bounce: true,
attract: {
enable: false,
rotateX: 3000,
rotateY: 3000
}
},
}
},
interactivity: {
detectsOn: InteractivityDetect.canvas,
Expand All @@ -101,7 +101,7 @@ export const defaultParams: RecursivePartial<IOptions> = {
modes: {
grab: {
distance: 180,
line_linked: {
links: {
opacity: 0.35
}
},
Expand All @@ -115,15 +115,15 @@ export const defaultParams: RecursivePartial<IOptions> = {
duration: 5
},
push: {
particles_nb: 4
quantity: 4
},
remove: {
particles_nb: 2
quantity: 2
}
}
},
retina_detect: true,
fps_limit: 999,
detectRetina: true,
fpsLimit: 999,
polygon: {
enable: false,
scale: 1,
Expand All @@ -144,4 +144,4 @@ export const defaultParams: RecursivePartial<IOptions> = {
},
url: ""
}
};
};
18 changes: 12 additions & 6 deletions src/Particles.tsx
View file
@@ -1,18 +1,23 @@
import * as React from "react";
import { Component } from "react";
import isEqual from "lodash/isEqual";
import type { IOptions } from "tsparticles/dist/Interfaces/Options/IOptions";
import { Container } from "tsparticles/dist/Classes/Container";
import type { IOptions } from "tsparticles/dist/Options/Interfaces/IOptions";
import { Options } from "tsparticles/dist/Options/Classes/Options";
import { Container } from "tsparticles/dist/Core/Container";
import type { RecursivePartial } from "tsparticles/dist/Types/RecursivePartial";
import { defaultParams } from "./DefaultOptions";
import { Options } from "tsparticles/dist/Classes/Options/Options";
import { tsParticles } from "tsparticles";
import { IPolygonMaskOptions } from "tsparticles/dist/Plugins/PolygonMask/PolygonMaskPlugin";
import { IAbsorberOptions } from "tsparticles/dist/Plugins/Absorbers/AbsorbersPlugin";
import { IEmitterOptions } from "tsparticles/dist/Plugins/Emitters/EmittersPlugin";

export type IParticlesParams = RecursivePartial<IOptions & IPolygonMaskOptions & IAbsorberOptions & IEmitterOptions>;

export interface ParticlesProps {
id: string;
width: string;
height: string;
params: RecursivePartial<IOptions>;
params: IParticlesParams;
style: any;
className?: string;
canvasClassName?: string;
Expand Down Expand Up @@ -49,13 +54,14 @@ export default class Particles extends Component<ParticlesProps,
} catch {
return null;
} // SSR

tsParticles.init();

const options = new Options();

options.load(defaultParams);
options.load(params);

tsParticles.init();

const container = new Container(tagId, options);

if (this.props.particlesRef) {
Expand Down
17 changes: 11 additions & 6 deletions yarn.lock
View file
Expand Up @@ -4072,18 +4072,23 @@ tsconfig@^6.0.0:
strip-bom "^3.0.0"
strip-json-comments "^2.0.0"

tslib@^1.11.2, tslib@^1.9.0:
tslib@^1.9.0:
version "1.13.0"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.13.0.tgz#c881e13cc7015894ed914862d276436fa9a47043"
integrity sha512-i/6DQjL8Xf3be4K/E6Wgpekn5Qasl1usyw++dAA35Ue5orEn65VIxOA+YvNNl9HV3qv70T7CNwjODHZrLwvd1Q==

tsparticles@^1.14.3:
version "1.14.3"
resolved "https://registry.yarnpkg.com/tsparticles/-/tsparticles-1.14.3.tgz#2ec575d5fd94eff951f77e0a72936d7738283167"
integrity sha512-2nIsKHf2aPZqIb7YjqsIiyoRtkUItTVbTw8q+lantiqP4mpVzAukF7NW49088mrMku6WnBtxjKqlyzsN/jDbcw==
tslib@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.0.0.tgz#18d13fc2dce04051e20f074cc8387fd8089ce4f3"
integrity sha512-lTqkx847PI7xEDYJntxZH89L2/aXInsyF2luSafe/+0fHOMjlBNXdH6th7f70qxLDhul7KZK0zC8V5ZIyHl0/g==

tsparticles@^1.17.1:
version "1.17.1"
resolved "https://registry.yarnpkg.com/tsparticles/-/tsparticles-1.17.1.tgz#426defad858244296ab9f6c8342e44d0edfadfdc"
integrity sha512-5pOqkks1UA9MLJQ9fSwxxcemc5Dbci9hCMgPLPMThI9KalQa2GgxbClnc+b/8VcoXxa36pGWWENHjMbMfCyUBA==
dependencies:
pathseg "^1.2.0"
tslib "^1.11.2"
tslib "^2.0.0"

tty-browserify@0.0.0:
version "0.0.0"
Expand Down

0 comments on commit 4afcf76

Please sign in to comment.