Skip to content

Commit 9d1dee3

Browse files
matteobrunimatteobruni
authored
Merge pull request #69 from tsparticles/dev
v3.0.0
2 parents 0918dc9 + f922ba1 commit 9d1dee3

40 files changed

+4881
-3272
lines changed

‎.github/workflows/nodejs.yml

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -28,12 +28,12 @@ jobs:
2828
# uses: nrwl/nx-set-shas@v3
2929
- uses: actions/setup-node@v4
3030
with:
31-
node-version: '16'
31+
node-version: '20'
3232
- uses: pnpm/action-setup@v2.4.0
3333
name: Install pnpm
3434
id: pnpm-install
3535
with:
36-
version: 7
36+
version: 8
3737
run_install: false
3838
- name: Get pnpm version
3939
id: pnpm-version
@@ -70,7 +70,7 @@ jobs:
7070
# uses: nrwl/nx-set-shas@v3
7171
- uses: actions/setup-node@v4
7272
with:
73-
node-version: '16'
73+
node-version: '20'
7474
- uses: pnpm/action-setup@v2.4.0
7575
name: Install pnpm
7676
id: pnpm-install
@@ -111,7 +111,7 @@ jobs:
111111
# - uses: actions/checkout@v3
112112
# - uses: actions/setup-node@v3
113113
# with:
114-
# node-version: '16'
114+
# node-version: '20'
115115
# - uses: pnpm/action-setup@v2.2.2
116116
# name: Install pnpm
117117
# id: pnpm-install

‎CHANGELOG.md

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
# Change Log
2+
3+
All notable changes to this project will be documented in this file.
4+
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5+
6+
# 3.0.0 (2023-12-25)
7+
8+
9+
### Bug Fixes
10+
11+
* **deps:** update angular monorepo ([0df2410](https://github.com/tsparticles/angular/commit/0df2410d75e7a5b44766f44cf81c1d38478b33a9))
12+
* **deps:** update angular monorepo ([7734c62](https://github.com/tsparticles/angular/commit/7734c62fa1f0dba72675296a58b5f9e99f45c790))
13+
* **deps:** update angular monorepo to ~15.2.0 ([d9cc057](https://github.com/tsparticles/angular/commit/d9cc0579949f025c7be095b92abb121f2f450036))
14+
* **deps:** update angular monorepo to ~16.2.0 ([c94af32](https://github.com/tsparticles/angular/commit/c94af3266705e56cdd68fd9709882f97bf0a95a1))
15+
* **deps:** update angular monorepo to v16 ([ca8f4e4](https://github.com/tsparticles/angular/commit/ca8f4e47c4476a5f4548ad25f365f56caa7ce912))
16+
* **deps:** update dependency @capacitor/app to v5 ([ad5a080](https://github.com/tsparticles/angular/commit/ad5a0801b2ed8b46b460b8917cc3e288a00ad479))
17+
* **deps:** update dependency @capacitor/haptics to v5 ([0754bb7](https://github.com/tsparticles/angular/commit/0754bb766882db012719624947ce1e9c011db649))
18+
* **deps:** update dependency @capacitor/keyboard to v5 ([9cb00ac](https://github.com/tsparticles/angular/commit/9cb00ac7a584a24c5693ce3fbbe8257e6eed78a6))
19+
* **deps:** update dependency @capacitor/status-bar to v5 ([303717a](https://github.com/tsparticles/angular/commit/303717adbd7bdf51620cb4d6bee6204803b532e2))
20+
* **deps:** update dependency @ionic/angular to v7 ([7650cd0](https://github.com/tsparticles/angular/commit/7650cd010916947db786d20e5c9b7cac186f3523))
21+
* **deps:** update dependency @ionic/core to v7 ([be06511](https://github.com/tsparticles/angular/commit/be0651198bff6b15cd990abb532ab85cc98f0885))
22+
* **deps:** update dependency ionicons to v7 ([b551ad4](https://github.com/tsparticles/angular/commit/b551ad4e37685000063e0258190d9d1c5ef6dcc4))
23+
* **deps:** update dependency zone.js to ~0.13.0 ([9eaf8c1](https://github.com/tsparticles/angular/commit/9eaf8c1e184fbe813e0f2ec4ed14d35c677bc8a3))
24+
25+
26+
### Features
27+
28+
* added fire property to trigger confetti fire ([ba64ff5](https://github.com/tsparticles/angular/commit/ba64ff53130e0bbad18a3a4e4e2b19dc27d05020))
29+
* added service for initializing particles plugins ([c26e9f2](https://github.com/tsparticles/angular/commit/c26e9f2caa2038e652f2967a38ac26c6b5264a49))
30+
* preparing confetti and fireworks components ([a098d21](https://github.com/tsparticles/angular/commit/a098d217f7f332bfef5bda4d6d846b762ee4aea3))

‎README.md

Lines changed: 27 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
[![banner](https://particles.js.org/images/banner3.png)](https://particles.js.org)
22

3-
# ng-particles
3+
# @tsparticles/angular
44

5-
[![npm](https://img.shields.io/npm/v/ng-particles)](https://www.npmjs.com/package/ng-particles) [![npm](https://img.shields.io/npm/dm/ng-particles)](https://www.npmjs.com/package/ng-particles) [![GitHub Sponsors](https://img.shields.io/github/sponsors/matteobruni)](https://github.com/sponsors/matteobruni)
5+
[![npm](https://img.shields.io/npm/v/@tsparticles/angular)](https://www.npmjs.com/package/ng-particles) [![npm](https://img.shields.io/npm/dm/@tsparticles/angular)](https://www.npmjs.com/package/@tsparticles/angular) [![GitHub Sponsors](https://img.shields.io/github/sponsors/matteobruni)](https://github.com/sponsors/matteobruni)
66

77
Official [tsParticles](https://github.com/matteobruni/tsparticles) Angular component
88

@@ -15,35 +15,33 @@ Official [tsParticles](https://github.com/matteobruni/tsparticles) Angular compo
1515
### Install
1616

1717
```shell
18-
$ npm install ng-particles tsparticles-engine
18+
$ npm install @tsparticles/angular @tsparticles/engine
1919
```
2020

2121
or
2222

2323
```shell
24-
$ yarn add ng-particles tsparticles-engine
24+
$ yarn add @tsparticles/angular @tsparticles/engine
2525
```
2626

2727
### Usage
2828

2929
_template.html_
3030

3131
```html
32-
<ng-particles
32+
<ngx-particles
3333
[id]="id"
3434
[options]="particlesOptions"
35-
[particlesInit]="particlesInit"
3635
(particlesLoaded)="particlesLoaded($event)"
37-
></ng-particles>
36+
></ngx-particles>
3837

3938
<!-- or -->
4039

41-
<ng-particles
40+
<ngx-particles
4241
[id]="id"
4342
[url]="particlesUrl"
44-
[particlesInit]="particlesInit"
4543
(particlesLoaded)="particlesLoaded($event)"
46-
></ng-particles>
44+
></ngx-particles>
4745
```
4846

4947
_app.ts_
@@ -54,9 +52,10 @@ import {
5452
ClickMode,
5553
HoverMode,
5654
OutMode,
57-
} from "tsparticles-engine";
55+
} from "@tsparticles/engine";
5856
//import { loadFull } from "tsparticles"; // if you are going to use `loadFull`, install the "tsparticles" package too.
59-
import { loadSlim } from "tsparticles-slim"; // if you are going to use `loadSlim`, install the "tsparticles-slim" package too.
57+
import { loadSlim } from "@tsparticles/slim"; // if you are going to use `loadSlim`, install the "@tsparticles/slim" package too.
58+
import { NgParticlesService } from "@tsparticles/angular";
6059

6160
export class AppComponent {
6261
id = "tsparticles";
@@ -135,34 +134,38 @@ export class AppComponent {
135134
detectRetina: true,
136135
};
137136

138-
particlesLoaded(container: Container): void {
139-
console.log(container);
140-
}
137+
constructor(private readonly ngParticlesService: NgParticlesService) {}
141138

142-
async particlesInit(engine: Engine): Promise<void> {
143-
console.log(engine);
139+
ngOnInit(): void {
140+
this.ngParticlesService.init(async () => {
141+
console.log(engine);
144142

145-
// Starting from 1.19.0 you can add custom presets or shape here, using the current tsParticles instance (main)
146-
// this loads the tsparticles package bundle, it's the easiest method for getting everything ready
147-
// starting from v2 you can add only the features you need reducing the bundle size
148-
//await loadFull(engine);
149-
await loadSlim(engine);
143+
// Starting from 1.19.0 you can add custom presets or shape here, using the current tsParticles instance (main)
144+
// this loads the tsparticles package bundle, it's the easiest method for getting everything ready
145+
// starting from v2 you can add only the features you need reducing the bundle size
146+
//await loadFull(engine);
147+
await loadSlim(engine);
148+
});
149+
}
150+
151+
particlesLoaded(container: Container): void {
152+
console.log(container);
150153
}
151154
}
152155
```
153156

154157
_app.module.ts_
155158

156159
```typescript
157-
import { ParticlesModule } from "ng-particles";
160+
import { NgxParticlesModule } from "@tsparticles/angular";
158161
import { NgModule } from "@angular/core";
159162

160163
@NgModule({
161164
declarations: [
162165
/* AppComponent */
163166
],
164167
imports: [
165-
/* other imports */ ParticlesModule /* ParticlesModule is required*/,
168+
/* other imports */ NgxParticlesModule /* NgxParticlesModule is required*/,
166169
],
167170
providers: [],
168171
bootstrap: [

‎apps/angular-demo/CHANGELOG.md

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,30 @@
33
All notable changes to this project will be documented in this file.
44
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
55

6-
# [2.12.0](https://github.com/tsparticles/angular/compare/ng-particles-demo@2.11.0...ng-particles-demo@2.12.0) (2023-08-04)
6+
# 3.0.0 (2023-12-25)
7+
8+
9+
### Bug Fixes
10+
11+
* **deps:** update angular monorepo ([0df2410](https://github.com/tsparticles/angular/commit/0df2410d75e7a5b44766f44cf81c1d38478b33a9))
12+
* **deps:** update angular monorepo ([7734c62](https://github.com/tsparticles/angular/commit/7734c62fa1f0dba72675296a58b5f9e99f45c790))
13+
* **deps:** update angular monorepo to ~15.2.0 ([d9cc057](https://github.com/tsparticles/angular/commit/d9cc0579949f025c7be095b92abb121f2f450036))
14+
* **deps:** update angular monorepo to ~16.2.0 ([c94af32](https://github.com/tsparticles/angular/commit/c94af3266705e56cdd68fd9709882f97bf0a95a1))
15+
* **deps:** update angular monorepo to v16 ([ca8f4e4](https://github.com/tsparticles/angular/commit/ca8f4e47c4476a5f4548ad25f365f56caa7ce912))
16+
* **deps:** update dependency zone.js to ~0.13.0 ([9eaf8c1](https://github.com/tsparticles/angular/commit/9eaf8c1e184fbe813e0f2ec4ed14d35c677bc8a3))
17+
18+
19+
### Features
20+
21+
* added fire property to trigger confetti fire ([ba64ff5](https://github.com/tsparticles/angular/commit/ba64ff53130e0bbad18a3a4e4e2b19dc27d05020))
22+
* added service for initializing particles plugins ([c26e9f2](https://github.com/tsparticles/angular/commit/c26e9f2caa2038e652f2967a38ac26c6b5264a49))
23+
* preparing confetti and fireworks components ([a098d21](https://github.com/tsparticles/angular/commit/a098d217f7f332bfef5bda4d6d846b762ee4aea3))
24+
25+
26+
27+
28+
29+
# [3.0.0-beta.3](https://github.com/tsparticles/angular/compare/ng-particles-demo@2.11.0...ng-particles-demo@3.0.0-beta.3) (2023-08-04)
730

831
**Note:** Version bump only for package ng-particles-demo
932

‎apps/angular-demo/package.json

Lines changed: 77 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
2-
"name": "ng-particles-demo",
3-
"version": "2.12.0",
2+
"name": "@tsparticles/angular-demo",
3+
"version": "3.0.0",
44
"scripts": {
55
"ng": "ng",
66
"start": "ng serve -o",
@@ -11,84 +11,88 @@
1111
},
1212
"private": true,
1313
"dependencies": {
14-
"@angular/animations": "~16.2.0",
15-
"@angular/common": "~16.2.0",
16-
"@angular/compiler": "~16.2.0",
17-
"@angular/core": "~16.2.0",
18-
"@angular/forms": "~16.2.0",
19-
"@angular/platform-browser": "~16.2.0",
20-
"@angular/platform-browser-dynamic": "~16.2.0",
21-
"@angular/router": "~16.2.0",
22-
"ng-confetti": "^2.12.0",
23-
"ng-fireworks": "^2.12.0",
24-
"ng-particles": "^3.12.0",
14+
"@angular/animations": "~17.0.8",
15+
"@angular/common": "~17.0.8",
16+
"@angular/compiler": "~17.0.8",
17+
"@angular/core": "~17.0.8",
18+
"@angular/forms": "~17.0.8",
19+
"@angular/platform-browser": "~17.0.8",
20+
"@angular/platform-browser-dynamic": "~17.0.8",
21+
"@angular/router": "~17.0.8",
22+
"@tsparticles/angular": "workspace:^",
23+
"@tsparticles/basic": "^3.0.2",
24+
"@tsparticles/confetti": "^3.0.2",
25+
"@tsparticles/configs": "^3.0.2",
26+
"@tsparticles/effect-trail": "^3.0.2",
27+
"@tsparticles/engine": "^3.0.2",
28+
"@tsparticles/fireworks": "^3.0.2",
29+
"@tsparticles/interaction-external-attract": "^3.0.2",
30+
"@tsparticles/interaction-external-bounce": "^3.0.2",
31+
"@tsparticles/interaction-external-bubble": "^3.0.2",
32+
"@tsparticles/interaction-external-connect": "^3.0.2",
33+
"@tsparticles/interaction-external-grab": "^3.0.2",
34+
"@tsparticles/interaction-external-pause": "^3.0.2",
35+
"@tsparticles/interaction-external-push": "^3.0.2",
36+
"@tsparticles/interaction-external-remove": "^3.0.2",
37+
"@tsparticles/interaction-external-repulse": "^3.0.2",
38+
"@tsparticles/interaction-external-slow": "^3.0.2",
39+
"@tsparticles/interaction-external-trail": "^3.0.2",
40+
"@tsparticles/interaction-particles-attract": "^3.0.2",
41+
"@tsparticles/interaction-particles-collisions": "^3.0.2",
42+
"@tsparticles/interaction-particles-links": "^3.0.2",
43+
"@tsparticles/move-base": "^3.0.2",
44+
"@tsparticles/move-parallax": "^3.0.2",
45+
"@tsparticles/pjs": "^3.0.2",
46+
"@tsparticles/plugin-absorbers": "^3.0.2",
47+
"@tsparticles/plugin-easing-quad": "^3.0.2",
48+
"@tsparticles/plugin-emitters": "^3.0.2",
49+
"@tsparticles/plugin-emitters-shape-circle": "^3.0.2",
50+
"@tsparticles/plugin-emitters-shape-square": "^3.0.2",
51+
"@tsparticles/plugin-motion": "^3.0.2",
52+
"@tsparticles/plugin-polygon-mask": "^3.0.2",
53+
"@tsparticles/plugin-sounds": "^3.0.2",
54+
"@tsparticles/shape-cards": "^3.0.2",
55+
"@tsparticles/shape-circle": "^3.0.2",
56+
"@tsparticles/shape-emoji": "^3.0.2",
57+
"@tsparticles/shape-heart": "^3.0.2",
58+
"@tsparticles/shape-image": "^3.0.2",
59+
"@tsparticles/shape-line": "^3.0.2",
60+
"@tsparticles/shape-polygon": "^3.0.2",
61+
"@tsparticles/shape-square": "^3.0.2",
62+
"@tsparticles/shape-star": "^3.0.2",
63+
"@tsparticles/shape-text": "^3.0.2",
64+
"@tsparticles/slim": "^3.0.2",
65+
"@tsparticles/updater-color": "^3.0.2",
66+
"@tsparticles/updater-destroy": "^3.0.2",
67+
"@tsparticles/updater-life": "^3.0.2",
68+
"@tsparticles/updater-opacity": "^3.0.2",
69+
"@tsparticles/updater-out-modes": "^3.0.2",
70+
"@tsparticles/updater-roll": "^3.0.2",
71+
"@tsparticles/updater-rotate": "^3.0.2",
72+
"@tsparticles/updater-size": "^3.0.2",
73+
"@tsparticles/updater-stroke-color": "^3.0.2",
74+
"@tsparticles/updater-tilt": "^3.0.2",
75+
"@tsparticles/updater-twinkle": "^3.0.2",
76+
"@tsparticles/updater-wobble": "^3.0.2",
77+
"angular-confetti": "workspace:^",
78+
"angular-fireworks": "workspace:^",
2579
"rxjs": "~7.8.1",
26-
"tslib": "^2.6.1",
27-
"tsparticles": "^2.12.0",
28-
"tsparticles-basic": "^2.12.0",
29-
"tsparticles-confetti": "^2.12.0",
30-
"tsparticles-demo-configs": "^2.12.0",
31-
"tsparticles-engine": "^2.12.0",
32-
"tsparticles-fireworks": "^2.12.0",
33-
"tsparticles-interaction-external-attract": "^2.12.0",
34-
"tsparticles-interaction-external-bounce": "^2.12.0",
35-
"tsparticles-interaction-external-bubble": "^2.12.0",
36-
"tsparticles-interaction-external-connect": "^2.12.0",
37-
"tsparticles-interaction-external-grab": "^2.12.0",
38-
"tsparticles-interaction-external-pause": "^2.12.0",
39-
"tsparticles-interaction-external-push": "^2.12.0",
40-
"tsparticles-interaction-external-remove": "^2.12.0",
41-
"tsparticles-interaction-external-repulse": "^2.12.0",
42-
"tsparticles-interaction-external-slow": "^2.12.0",
43-
"tsparticles-interaction-external-trail": "^2.12.0",
44-
"tsparticles-interaction-particles-attract": "^2.12.0",
45-
"tsparticles-interaction-particles-collisions": "^2.12.0",
46-
"tsparticles-interaction-particles-links": "^2.12.0",
47-
"tsparticles-move-base": "^2.12.0",
48-
"tsparticles-move-parallax": "^2.12.0",
49-
"tsparticles-particles.js": "^2.12.0",
50-
"tsparticles-plugin-absorbers": "^2.12.0",
51-
"tsparticles-plugin-easing-quad": "^2.12.0",
52-
"tsparticles-plugin-emitters": "^2.12.0",
53-
"tsparticles-plugin-motion": "^2.12.0",
54-
"tsparticles-plugin-polygon-mask": "^2.12.0",
55-
"tsparticles-plugin-sounds": "^2.12.0",
56-
"tsparticles-shape-cards": "^2.12.0",
57-
"tsparticles-shape-circle": "^2.12.0",
58-
"tsparticles-shape-heart": "^2.12.0",
59-
"tsparticles-shape-image": "^2.12.0",
60-
"tsparticles-shape-line": "^2.12.0",
61-
"tsparticles-shape-polygon": "^2.12.0",
62-
"tsparticles-shape-square": "^2.12.0",
63-
"tsparticles-shape-star": "^2.12.0",
64-
"tsparticles-shape-text": "^2.12.0",
65-
"tsparticles-slim": "^2.12.0",
66-
"tsparticles-updater-color": "^2.12.0",
67-
"tsparticles-updater-destroy": "^2.12.0",
68-
"tsparticles-updater-life": "^2.12.0",
69-
"tsparticles-updater-opacity": "^2.12.0",
70-
"tsparticles-updater-out-modes": "^2.12.0",
71-
"tsparticles-updater-roll": "^2.12.0",
72-
"tsparticles-updater-rotate": "^2.12.0",
73-
"tsparticles-updater-size": "^2.12.0",
74-
"tsparticles-updater-stroke-color": "^2.12.0",
75-
"tsparticles-updater-tilt": "^2.12.0",
76-
"tsparticles-updater-twinkle": "^2.12.0",
77-
"tsparticles-updater-wobble": "^2.12.0",
78-
"zone.js": "~0.13.0"
80+
"tslib": "^2.6.2",
81+
"tsparticles": "^3.0.2",
82+
"zone.js": "~0.14.2"
7983
},
8084
"devDependencies": {
81-
"@angular-devkit/build-angular": "~16.2.0",
82-
"@angular/cli": "~16.2.0",
83-
"@angular/compiler-cli": "~16.2.0",
84-
"@types/jasmine": "~4.3.5",
85-
"@types/node": "^20.4.7",
86-
"jasmine-core": "~5.1.0",
85+
"@angular-devkit/build-angular": "~17.0.8",
86+
"@angular/cli": "~17.0.8",
87+
"@angular/compiler-cli": "~17.0.8",
88+
"@types/jasmine": "~5.1.4",
89+
"@types/node": "^20.10.5",
90+
"jasmine-core": "~5.1.1",
8791
"karma": "~6.4.2",
8892
"karma-chrome-launcher": "~3.2.0",
8993
"karma-coverage": "~2.2.1",
9094
"karma-jasmine": "~5.1.0",
9195
"karma-jasmine-html-reporter": "~2.1.0",
92-
"typescript": "~5.1.6"
96+
"typescript": "~5.2.2"
9397
}
9498
}

0 commit comments

Comments
 (0)