Implemented Particles feature

This commit is contained in:
thepaperpilot 2022-03-19 23:59:52 -05:00
parent a50448e525
commit 0acfebb412
8 changed files with 858 additions and 4 deletions

742
package-lock.json generated
View file

@ -11,6 +11,8 @@
"core-js": "^3.6.5",
"lodash.clonedeep": "^4.5.0",
"nanoevents": "^6.0.2",
"particles.vue3": "^2.0.3",
"tsparticles": "^2.0.3",
"vue": "^3.2.26",
"vue-next-select": "^2.10.2",
"vue-panzoom": "^1.1.6",
@ -9105,6 +9107,29 @@
"node": ">= 0.8"
}
},
"node_modules/particles.vue3": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/particles.vue3/-/particles.vue3-2.0.3.tgz",
"integrity": "sha512-FE2zbTCDpwP8Wzk2nDfVyuJkOtQHDHq2I+eqc7UYELc0IEKxtEaCJEjAfP0uAscP4Rl1hWW3MS63Fg7OqBmnvQ==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/matteobruni"
},
{
"type": "buymeacoffee",
"url": "https://www.buymeacoffee.com/matteobruni"
}
],
"dependencies": {
"core-js": "^3.20.1",
"tsparticles-engine": "^2.0.3",
"vue-class-component": "^8.0.0-rc.1"
},
"peerDependencies": {
"vue": ">=3"
}
},
"node_modules/pascal-case": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/pascal-case/-/pascal-case-3.1.2.tgz",
@ -11558,6 +11583,362 @@
"integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==",
"dev": true
},
"node_modules/tsparticles": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles/-/tsparticles-2.0.3.tgz",
"integrity": "sha512-aHWFfppS9VBd+zZVbV6wVqovo/xFQbKNzdy2fWNGAuomXRlz0nkU48jY1sarGz64SUGREIWgXvYgwIpwlKe17g==",
"dependencies": {
"tsparticles-engine": "^2.0.3",
"tsparticles-interaction-external-trail": "^2.0.3",
"tsparticles-plugin-absorbers": "^2.0.3",
"tsparticles-plugin-emitters": "^2.0.3",
"tsparticles-plugin-polygon-mask": "^2.0.3",
"tsparticles-slim": "^2.0.3",
"tsparticles-updater-roll": "^2.0.3",
"tsparticles-updater-tilt": "^2.0.3",
"tsparticles-updater-wobble": "^2.0.3"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/matteobruni"
}
},
"node_modules/tsparticles-engine": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-engine/-/tsparticles-engine-2.0.3.tgz",
"integrity": "sha512-n54t3Qcdnz/wc6op38Q/nVwfi7d/m/HdiDdJsJy4DWAJnnu4YZLGoor9h76nuvfIeY7niTQWMLMxWBViAKOOEA==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/matteobruni"
},
{
"type": "buymeacoffee",
"url": "https://www.buymeacoffee.com/matteobruni"
}
],
"hasInstallScript": true
},
"node_modules/tsparticles-interaction-external-attract": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-attract/-/tsparticles-interaction-external-attract-2.0.3.tgz",
"integrity": "sha512-z0/+aM+AcKXd8AzE89SQA1jq7ZTnG+eF+x00aqNVBfiHvrch9+yLTudwk9Rmkiq5H1FStYk5kQZS0XS9lysf1g==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-external-bounce": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-bounce/-/tsparticles-interaction-external-bounce-2.0.3.tgz",
"integrity": "sha512-ERu3wiOnKAmNAh/lUEp1M7eYX3ai/hQU5+BmNQrKJDGqr1MjrKhJ1Ar7OtBLjBNaxuq7tIGBvngVn4+CjeoMXQ==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-external-bubble": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-bubble/-/tsparticles-interaction-external-bubble-2.0.3.tgz",
"integrity": "sha512-yOIy0QY9kDlvCwivQQkY3ezCHdDZ2WRYZNCdJARKxHG0lptZIT9hxqkONf1OYlQ+/dsHiT+4t1JIISYy9oYwEA==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-external-connect": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-connect/-/tsparticles-interaction-external-connect-2.0.3.tgz",
"integrity": "sha512-M7tn4T4RbO4xNJ5Ki8EgLzC9+H+adaTbQfMOroJ9/l1zKVrQhPAGHeXOAQmdQb1QgaYB0HXk9MpIEJW393vdaQ==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-external-grab": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-grab/-/tsparticles-interaction-external-grab-2.0.3.tgz",
"integrity": "sha512-QT/HbkzOxbY8OVj9skP1oAs9CLHH6pN8ofDmyPJ+n3dCuknIE5BPDAHjaaxE79EP+ZpauTbdGYDaAVQEjhRgXA==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-external-pause": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-pause/-/tsparticles-interaction-external-pause-2.0.3.tgz",
"integrity": "sha512-zmcYEWTKN8XecPR6ra97TVwGim/KxivW/WaG33XtNcilYLO3Oc6oWiQ7aHWIlf70pVyxZbcflWlsx6cSiwfJ5w==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-external-push": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-push/-/tsparticles-interaction-external-push-2.0.3.tgz",
"integrity": "sha512-nGodslff8JfjRayAxhB9qWvu6glZwqSegfZHxlYwwY1UIQAZ4jJwmlb2JXgpdpitv56RP4D9/pPU8bvf+IiazQ==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-external-remove": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-remove/-/tsparticles-interaction-external-remove-2.0.3.tgz",
"integrity": "sha512-PqKIPUBNV6hlfIReCqCglH3pUcvu7FWH1rTgIrgCjgIRnI4vmcw+Wkd5y1Hx0YwqFCdXrRJJ91e0c5FinMrJVA==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-external-repulse": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-repulse/-/tsparticles-interaction-external-repulse-2.0.3.tgz",
"integrity": "sha512-ukBNBWK6h4SmYvqzWCpoygcHUZEOc6DDpysMJlIgtIzHeaOnuM8vEahxQWl5yNsvwTiuCTtc6RZ2sL+sg2KHWQ==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-external-trail": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-trail/-/tsparticles-interaction-external-trail-2.0.3.tgz",
"integrity": "sha512-n9aTNQV20tnzZq1ySAku8arjcNgrwY7jxHYMg/cZhez5mU8I6xKNIf+VZVo9F/X9nuMgyIC795BV43mlky/gqQ==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-particles-attract": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-particles-attract/-/tsparticles-interaction-particles-attract-2.0.3.tgz",
"integrity": "sha512-rCSWDfwrHWt+/KO6Z4666S4R4gBpzyR0Hse1QwEiqNhwRdP2/QpwIpKU0pWnt/9HGzUvNYpAINH+bpIqWo2qcg==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-particles-collisions": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-particles-collisions/-/tsparticles-interaction-particles-collisions-2.0.3.tgz",
"integrity": "sha512-m/6VeYEHAUTvCWFYNNgURSK5dHnDBES8HextrkDCAxUjf/5wvJpwOVPELuGDNc5sWBD1T4hLrZVtIzbrYmxjwQ==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-interaction-particles-links": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-particles-links/-/tsparticles-interaction-particles-links-2.0.3.tgz",
"integrity": "sha512-Rdh+FsfBYbQqtBsd2EYcSdjYAoRbzy9/VYquEc/Bzv8DgMs3jJv2/1BtekSfCSVvUGxZW9YoA+5e8e9n9hi32Q==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-move-base": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-move-base/-/tsparticles-move-base-2.0.3.tgz",
"integrity": "sha512-ZJSe0AYKXerb1aSAwZFcojirSLmlbsN7+8w8oRmbM5h1aJRg7BOa4OastMuNjOT9fjxL1xDNik/e3nx8xyByXg==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-move-parallax": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-move-parallax/-/tsparticles-move-parallax-2.0.3.tgz",
"integrity": "sha512-rXj8PukEMizbhzWpM4/VvVFxnYs3oRIIEkQej1TmQeMsvg1wmi7qMV1YOGpmw/XjHBLDqwmYUtdn6p0FT6aXjQ==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-plugin-absorbers": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-plugin-absorbers/-/tsparticles-plugin-absorbers-2.0.3.tgz",
"integrity": "sha512-kh3QOZg2J/wMTbUU8+YmUeNhaQ1BRbPdZQH4PCE4PwgNkIduaZsX3ORuA1CPeqJ0zpS1xMGKGsWDgOfPJjaWJA==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-plugin-emitters": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-plugin-emitters/-/tsparticles-plugin-emitters-2.0.3.tgz",
"integrity": "sha512-2XV7je3VH0N3vZdbcUcau/W8r7/95I1ziGRj0RrouK1gvOFZEcqzWELrz1s/HV26aNlYeESMCxba1fHNh84tyA==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-plugin-polygon-mask": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-plugin-polygon-mask/-/tsparticles-plugin-polygon-mask-2.0.3.tgz",
"integrity": "sha512-EPV4xKQIrq1/ashtGv/gg4wTonOw76rSt6twHsG5cdubV6LQnJIYZg2scObIUgXnlpG4WG0p3nZiYMADdMnmRw==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-shape-circle": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-circle/-/tsparticles-shape-circle-2.0.3.tgz",
"integrity": "sha512-irlKC6pqqvlHS4LHLNzh+LgRpAsMMkc45Wnk3xc7EXSP1hjaudS2GMX2lO85MoDXeZcl+hrA1unUt45atDwF3g==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-shape-image": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-image/-/tsparticles-shape-image-2.0.3.tgz",
"integrity": "sha512-Rf+7DDGUTEEKkIVAi+YRjbeigzJSkPZzedg+1AZxztF2HDT8sXNlgAePudvjoqyMDKyd1gDQW/16Yzkcx6hIow==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-shape-line": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-line/-/tsparticles-shape-line-2.0.3.tgz",
"integrity": "sha512-s7f0izNUUZyOvt3tcCCIbDsu4Ed8etIqEDdigctBP7k0gwHZAmsV9fyYqOfTF4DK5oPCzc/7OJTISiPOqt9CNg==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-shape-polygon": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-polygon/-/tsparticles-shape-polygon-2.0.3.tgz",
"integrity": "sha512-2rslG14FKYbkmJNjs5wHQQud+lkWeponH36B1KJHQt1oGJhNT1aad1lnZ3JQaG/WHvXlIrT16pLolZW9KArpqg==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-shape-square": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-square/-/tsparticles-shape-square-2.0.3.tgz",
"integrity": "sha512-ra5fxTpLbsunJaxkc2AQzz9njwN7d/3jAZL8yuLwaSEiu8UyWp+8fMzHXuGY5hzp61BGGxtIQ4zfrF/9WK1/iQ==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-shape-star": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-star/-/tsparticles-shape-star-2.0.3.tgz",
"integrity": "sha512-/m/fzmfjExRYaVFCHUu1rp1PgybL16si69kU7b1+5s774D+/Mbpk0XplAEWLiv+YX1ifRk7YUi5O5MLWZ9+7bw==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-shape-text": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-text/-/tsparticles-shape-text-2.0.3.tgz",
"integrity": "sha512-8g3yL3kAcW+XgH5nRNT4nsWGzbVoUoOGhG7yD6vnvHWJhcsGAdk6qn/1MxJ45yUll4Fl/p8ZJcg2jywDmujf3g==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-slim": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-slim/-/tsparticles-slim-2.0.3.tgz",
"integrity": "sha512-RQX+ZGdJEthYUOX5U6GLWw3xiOYo11HI0E+9b53hQh5H1VcUEHvX6ITVwRqMohD04VtkA4Hw33PdOnfjtM3G/g==",
"dependencies": {
"tsparticles-engine": "^2.0.3",
"tsparticles-interaction-external-attract": "^2.0.3",
"tsparticles-interaction-external-bounce": "^2.0.3",
"tsparticles-interaction-external-bubble": "^2.0.3",
"tsparticles-interaction-external-connect": "^2.0.3",
"tsparticles-interaction-external-grab": "^2.0.3",
"tsparticles-interaction-external-pause": "^2.0.3",
"tsparticles-interaction-external-push": "^2.0.3",
"tsparticles-interaction-external-remove": "^2.0.3",
"tsparticles-interaction-external-repulse": "^2.0.3",
"tsparticles-interaction-particles-attract": "^2.0.3",
"tsparticles-interaction-particles-collisions": "^2.0.3",
"tsparticles-interaction-particles-links": "^2.0.3",
"tsparticles-move-base": "^2.0.3",
"tsparticles-move-parallax": "^2.0.3",
"tsparticles-shape-circle": "^2.0.3",
"tsparticles-shape-image": "^2.0.3",
"tsparticles-shape-line": "^2.0.3",
"tsparticles-shape-polygon": "^2.0.3",
"tsparticles-shape-square": "^2.0.3",
"tsparticles-shape-star": "^2.0.3",
"tsparticles-shape-text": "^2.0.3",
"tsparticles-updater-angle": "^2.0.3",
"tsparticles-updater-color": "^2.0.3",
"tsparticles-updater-life": "^2.0.3",
"tsparticles-updater-opacity": "^2.0.3",
"tsparticles-updater-out-modes": "^2.0.3",
"tsparticles-updater-size": "^2.0.3",
"tsparticles-updater-stroke-color": "^2.0.3"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/matteobruni"
}
},
"node_modules/tsparticles-updater-angle": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-angle/-/tsparticles-updater-angle-2.0.3.tgz",
"integrity": "sha512-Fu39U7WLeUfeiUDQhwnobyOrNVrWsIdM08m2TBaVjqXBt4WWilO4Xs+5SbDyCWxQ0hFwUgNcHdnm80AX9608LQ==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-updater-color": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-color/-/tsparticles-updater-color-2.0.3.tgz",
"integrity": "sha512-h2Ml4WIKqLlIZVngzP2WD+vsKDVWQyZelrXjW0a02zmsue1ZMexZhNwjCf2Vp+weaQLVGhzP+nKbzcYasKdydQ==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-updater-life": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-life/-/tsparticles-updater-life-2.0.3.tgz",
"integrity": "sha512-ISw1LVBkz6CVUaVecA6s2LEe9JzyuE9aQRv2LDK3eV1Lz3QrdyPlMt1MjccHa1K/AUp+RVPhIWKKKe4UBqFJFA==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-updater-opacity": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-opacity/-/tsparticles-updater-opacity-2.0.3.tgz",
"integrity": "sha512-AFBhPKfD5mzhEQzfYUHZ79heWQ8UuskTKgylLceXr41mzGEr3AMtOuBcRkQUpYhKThhlDbrWecMPCYk6VQfhOw==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-updater-out-modes": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-out-modes/-/tsparticles-updater-out-modes-2.0.3.tgz",
"integrity": "sha512-6lYjRrp0XIvEQTcERQhqm7nfz4NMCXqmUWzBUr6R/F7lMKM75eMK6Q6hmSQDgkdyVzvY7j9enHjTBeZXxyCrqA==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-updater-roll": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-roll/-/tsparticles-updater-roll-2.0.3.tgz",
"integrity": "sha512-sm7TkU/0ErVUBDnRUCYjH1OonHs+P/C8gtiVrRhvowQTdpSl5a1x+UoSu6aHzPxZZVCBhDmkACNC0JuOa6uucw==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-updater-size": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-size/-/tsparticles-updater-size-2.0.3.tgz",
"integrity": "sha512-dIkse7f9ZhOXFtPKyinzOQul75MRO29kzXMMU1vsOsLdNB6+8/LL44pvLRdrJA/6JUeuspMeMEtMvwtAyPeA+A==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-updater-stroke-color": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-stroke-color/-/tsparticles-updater-stroke-color-2.0.3.tgz",
"integrity": "sha512-iQLiYpbPDbM+NqnLZPv7Th12Mq4CLSFLXr6zvZi09TLVgRl9sLur046AHyLP5IuetvwwaOxKkKEGAg7VlvR6lA==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-updater-tilt": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-tilt/-/tsparticles-updater-tilt-2.0.3.tgz",
"integrity": "sha512-04L7qsP47X9Mt6esAvk4/avfHQQI94h+/NiKbZ7HNJjcKbCvQp9LaplQCFGvr9t1IxFT9aQAmRP2KInVAelw5g==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsparticles-updater-wobble": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-wobble/-/tsparticles-updater-wobble-2.0.3.tgz",
"integrity": "sha512-oToq/HwaA6OHjO8j7u8oT3I8/pJhOCNldX3XoZAgiaA3E8E19g8iD/0tWIkP4D/4o+I7NkJLv0wTcd5DJyueGg==",
"dependencies": {
"tsparticles-engine": "^2.0.3"
}
},
"node_modules/tsutils": {
"version": "3.21.0",
"resolved": "https://registry.npmjs.org/tsutils/-/tsutils-3.21.0.tgz",
@ -11760,6 +12141,14 @@
"@vue/shared": "3.2.26"
}
},
"node_modules/vue-class-component": {
"version": "8.0.0-rc.1",
"resolved": "https://registry.npmjs.org/vue-class-component/-/vue-class-component-8.0.0-rc.1.tgz",
"integrity": "sha512-w1nMzsT/UdbDAXKqhwTmSoyuJzUXKrxLE77PCFVuC6syr8acdFDAq116xgvZh9UCuV0h+rlCtxXolr3Hi3HyPQ==",
"peerDependencies": {
"vue": "^3.0.0"
}
},
"node_modules/vue-eslint-parser": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-8.0.1.tgz",
@ -19555,6 +19944,16 @@
"integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
"dev": true
},
"particles.vue3": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/particles.vue3/-/particles.vue3-2.0.3.tgz",
"integrity": "sha512-FE2zbTCDpwP8Wzk2nDfVyuJkOtQHDHq2I+eqc7UYELc0IEKxtEaCJEjAfP0uAscP4Rl1hWW3MS63Fg7OqBmnvQ==",
"requires": {
"core-js": "^3.20.1",
"tsparticles-engine": "^2.0.3",
"vue-class-component": "^8.0.0-rc.1"
}
},
"pascal-case": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/pascal-case/-/pascal-case-3.1.2.tgz",
@ -21319,6 +21718,343 @@
"integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==",
"dev": true
},
"tsparticles": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles/-/tsparticles-2.0.3.tgz",
"integrity": "sha512-aHWFfppS9VBd+zZVbV6wVqovo/xFQbKNzdy2fWNGAuomXRlz0nkU48jY1sarGz64SUGREIWgXvYgwIpwlKe17g==",
"requires": {
"tsparticles-engine": "^2.0.3",
"tsparticles-interaction-external-trail": "^2.0.3",
"tsparticles-plugin-absorbers": "^2.0.3",
"tsparticles-plugin-emitters": "^2.0.3",
"tsparticles-plugin-polygon-mask": "^2.0.3",
"tsparticles-slim": "^2.0.3",
"tsparticles-updater-roll": "^2.0.3",
"tsparticles-updater-tilt": "^2.0.3",
"tsparticles-updater-wobble": "^2.0.3"
}
},
"tsparticles-engine": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-engine/-/tsparticles-engine-2.0.3.tgz",
"integrity": "sha512-n54t3Qcdnz/wc6op38Q/nVwfi7d/m/HdiDdJsJy4DWAJnnu4YZLGoor9h76nuvfIeY7niTQWMLMxWBViAKOOEA=="
},
"tsparticles-interaction-external-attract": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-attract/-/tsparticles-interaction-external-attract-2.0.3.tgz",
"integrity": "sha512-z0/+aM+AcKXd8AzE89SQA1jq7ZTnG+eF+x00aqNVBfiHvrch9+yLTudwk9Rmkiq5H1FStYk5kQZS0XS9lysf1g==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-external-bounce": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-bounce/-/tsparticles-interaction-external-bounce-2.0.3.tgz",
"integrity": "sha512-ERu3wiOnKAmNAh/lUEp1M7eYX3ai/hQU5+BmNQrKJDGqr1MjrKhJ1Ar7OtBLjBNaxuq7tIGBvngVn4+CjeoMXQ==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-external-bubble": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-bubble/-/tsparticles-interaction-external-bubble-2.0.3.tgz",
"integrity": "sha512-yOIy0QY9kDlvCwivQQkY3ezCHdDZ2WRYZNCdJARKxHG0lptZIT9hxqkONf1OYlQ+/dsHiT+4t1JIISYy9oYwEA==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-external-connect": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-connect/-/tsparticles-interaction-external-connect-2.0.3.tgz",
"integrity": "sha512-M7tn4T4RbO4xNJ5Ki8EgLzC9+H+adaTbQfMOroJ9/l1zKVrQhPAGHeXOAQmdQb1QgaYB0HXk9MpIEJW393vdaQ==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-external-grab": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-grab/-/tsparticles-interaction-external-grab-2.0.3.tgz",
"integrity": "sha512-QT/HbkzOxbY8OVj9skP1oAs9CLHH6pN8ofDmyPJ+n3dCuknIE5BPDAHjaaxE79EP+ZpauTbdGYDaAVQEjhRgXA==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-external-pause": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-pause/-/tsparticles-interaction-external-pause-2.0.3.tgz",
"integrity": "sha512-zmcYEWTKN8XecPR6ra97TVwGim/KxivW/WaG33XtNcilYLO3Oc6oWiQ7aHWIlf70pVyxZbcflWlsx6cSiwfJ5w==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-external-push": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-push/-/tsparticles-interaction-external-push-2.0.3.tgz",
"integrity": "sha512-nGodslff8JfjRayAxhB9qWvu6glZwqSegfZHxlYwwY1UIQAZ4jJwmlb2JXgpdpitv56RP4D9/pPU8bvf+IiazQ==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-external-remove": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-remove/-/tsparticles-interaction-external-remove-2.0.3.tgz",
"integrity": "sha512-PqKIPUBNV6hlfIReCqCglH3pUcvu7FWH1rTgIrgCjgIRnI4vmcw+Wkd5y1Hx0YwqFCdXrRJJ91e0c5FinMrJVA==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-external-repulse": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-repulse/-/tsparticles-interaction-external-repulse-2.0.3.tgz",
"integrity": "sha512-ukBNBWK6h4SmYvqzWCpoygcHUZEOc6DDpysMJlIgtIzHeaOnuM8vEahxQWl5yNsvwTiuCTtc6RZ2sL+sg2KHWQ==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-external-trail": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-external-trail/-/tsparticles-interaction-external-trail-2.0.3.tgz",
"integrity": "sha512-n9aTNQV20tnzZq1ySAku8arjcNgrwY7jxHYMg/cZhez5mU8I6xKNIf+VZVo9F/X9nuMgyIC795BV43mlky/gqQ==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-particles-attract": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-particles-attract/-/tsparticles-interaction-particles-attract-2.0.3.tgz",
"integrity": "sha512-rCSWDfwrHWt+/KO6Z4666S4R4gBpzyR0Hse1QwEiqNhwRdP2/QpwIpKU0pWnt/9HGzUvNYpAINH+bpIqWo2qcg==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-particles-collisions": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-particles-collisions/-/tsparticles-interaction-particles-collisions-2.0.3.tgz",
"integrity": "sha512-m/6VeYEHAUTvCWFYNNgURSK5dHnDBES8HextrkDCAxUjf/5wvJpwOVPELuGDNc5sWBD1T4hLrZVtIzbrYmxjwQ==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-interaction-particles-links": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-interaction-particles-links/-/tsparticles-interaction-particles-links-2.0.3.tgz",
"integrity": "sha512-Rdh+FsfBYbQqtBsd2EYcSdjYAoRbzy9/VYquEc/Bzv8DgMs3jJv2/1BtekSfCSVvUGxZW9YoA+5e8e9n9hi32Q==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-move-base": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-move-base/-/tsparticles-move-base-2.0.3.tgz",
"integrity": "sha512-ZJSe0AYKXerb1aSAwZFcojirSLmlbsN7+8w8oRmbM5h1aJRg7BOa4OastMuNjOT9fjxL1xDNik/e3nx8xyByXg==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-move-parallax": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-move-parallax/-/tsparticles-move-parallax-2.0.3.tgz",
"integrity": "sha512-rXj8PukEMizbhzWpM4/VvVFxnYs3oRIIEkQej1TmQeMsvg1wmi7qMV1YOGpmw/XjHBLDqwmYUtdn6p0FT6aXjQ==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-plugin-absorbers": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-plugin-absorbers/-/tsparticles-plugin-absorbers-2.0.3.tgz",
"integrity": "sha512-kh3QOZg2J/wMTbUU8+YmUeNhaQ1BRbPdZQH4PCE4PwgNkIduaZsX3ORuA1CPeqJ0zpS1xMGKGsWDgOfPJjaWJA==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-plugin-emitters": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-plugin-emitters/-/tsparticles-plugin-emitters-2.0.3.tgz",
"integrity": "sha512-2XV7je3VH0N3vZdbcUcau/W8r7/95I1ziGRj0RrouK1gvOFZEcqzWELrz1s/HV26aNlYeESMCxba1fHNh84tyA==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-plugin-polygon-mask": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-plugin-polygon-mask/-/tsparticles-plugin-polygon-mask-2.0.3.tgz",
"integrity": "sha512-EPV4xKQIrq1/ashtGv/gg4wTonOw76rSt6twHsG5cdubV6LQnJIYZg2scObIUgXnlpG4WG0p3nZiYMADdMnmRw==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-shape-circle": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-circle/-/tsparticles-shape-circle-2.0.3.tgz",
"integrity": "sha512-irlKC6pqqvlHS4LHLNzh+LgRpAsMMkc45Wnk3xc7EXSP1hjaudS2GMX2lO85MoDXeZcl+hrA1unUt45atDwF3g==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-shape-image": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-image/-/tsparticles-shape-image-2.0.3.tgz",
"integrity": "sha512-Rf+7DDGUTEEKkIVAi+YRjbeigzJSkPZzedg+1AZxztF2HDT8sXNlgAePudvjoqyMDKyd1gDQW/16Yzkcx6hIow==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-shape-line": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-line/-/tsparticles-shape-line-2.0.3.tgz",
"integrity": "sha512-s7f0izNUUZyOvt3tcCCIbDsu4Ed8etIqEDdigctBP7k0gwHZAmsV9fyYqOfTF4DK5oPCzc/7OJTISiPOqt9CNg==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-shape-polygon": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-polygon/-/tsparticles-shape-polygon-2.0.3.tgz",
"integrity": "sha512-2rslG14FKYbkmJNjs5wHQQud+lkWeponH36B1KJHQt1oGJhNT1aad1lnZ3JQaG/WHvXlIrT16pLolZW9KArpqg==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-shape-square": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-square/-/tsparticles-shape-square-2.0.3.tgz",
"integrity": "sha512-ra5fxTpLbsunJaxkc2AQzz9njwN7d/3jAZL8yuLwaSEiu8UyWp+8fMzHXuGY5hzp61BGGxtIQ4zfrF/9WK1/iQ==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-shape-star": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-star/-/tsparticles-shape-star-2.0.3.tgz",
"integrity": "sha512-/m/fzmfjExRYaVFCHUu1rp1PgybL16si69kU7b1+5s774D+/Mbpk0XplAEWLiv+YX1ifRk7YUi5O5MLWZ9+7bw==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-shape-text": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-shape-text/-/tsparticles-shape-text-2.0.3.tgz",
"integrity": "sha512-8g3yL3kAcW+XgH5nRNT4nsWGzbVoUoOGhG7yD6vnvHWJhcsGAdk6qn/1MxJ45yUll4Fl/p8ZJcg2jywDmujf3g==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-slim": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-slim/-/tsparticles-slim-2.0.3.tgz",
"integrity": "sha512-RQX+ZGdJEthYUOX5U6GLWw3xiOYo11HI0E+9b53hQh5H1VcUEHvX6ITVwRqMohD04VtkA4Hw33PdOnfjtM3G/g==",
"requires": {
"tsparticles-engine": "^2.0.3",
"tsparticles-interaction-external-attract": "^2.0.3",
"tsparticles-interaction-external-bounce": "^2.0.3",
"tsparticles-interaction-external-bubble": "^2.0.3",
"tsparticles-interaction-external-connect": "^2.0.3",
"tsparticles-interaction-external-grab": "^2.0.3",
"tsparticles-interaction-external-pause": "^2.0.3",
"tsparticles-interaction-external-push": "^2.0.3",
"tsparticles-interaction-external-remove": "^2.0.3",
"tsparticles-interaction-external-repulse": "^2.0.3",
"tsparticles-interaction-particles-attract": "^2.0.3",
"tsparticles-interaction-particles-collisions": "^2.0.3",
"tsparticles-interaction-particles-links": "^2.0.3",
"tsparticles-move-base": "^2.0.3",
"tsparticles-move-parallax": "^2.0.3",
"tsparticles-shape-circle": "^2.0.3",
"tsparticles-shape-image": "^2.0.3",
"tsparticles-shape-line": "^2.0.3",
"tsparticles-shape-polygon": "^2.0.3",
"tsparticles-shape-square": "^2.0.3",
"tsparticles-shape-star": "^2.0.3",
"tsparticles-shape-text": "^2.0.3",
"tsparticles-updater-angle": "^2.0.3",
"tsparticles-updater-color": "^2.0.3",
"tsparticles-updater-life": "^2.0.3",
"tsparticles-updater-opacity": "^2.0.3",
"tsparticles-updater-out-modes": "^2.0.3",
"tsparticles-updater-size": "^2.0.3",
"tsparticles-updater-stroke-color": "^2.0.3"
}
},
"tsparticles-updater-angle": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-angle/-/tsparticles-updater-angle-2.0.3.tgz",
"integrity": "sha512-Fu39U7WLeUfeiUDQhwnobyOrNVrWsIdM08m2TBaVjqXBt4WWilO4Xs+5SbDyCWxQ0hFwUgNcHdnm80AX9608LQ==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-updater-color": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-color/-/tsparticles-updater-color-2.0.3.tgz",
"integrity": "sha512-h2Ml4WIKqLlIZVngzP2WD+vsKDVWQyZelrXjW0a02zmsue1ZMexZhNwjCf2Vp+weaQLVGhzP+nKbzcYasKdydQ==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-updater-life": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-life/-/tsparticles-updater-life-2.0.3.tgz",
"integrity": "sha512-ISw1LVBkz6CVUaVecA6s2LEe9JzyuE9aQRv2LDK3eV1Lz3QrdyPlMt1MjccHa1K/AUp+RVPhIWKKKe4UBqFJFA==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-updater-opacity": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-opacity/-/tsparticles-updater-opacity-2.0.3.tgz",
"integrity": "sha512-AFBhPKfD5mzhEQzfYUHZ79heWQ8UuskTKgylLceXr41mzGEr3AMtOuBcRkQUpYhKThhlDbrWecMPCYk6VQfhOw==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-updater-out-modes": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-out-modes/-/tsparticles-updater-out-modes-2.0.3.tgz",
"integrity": "sha512-6lYjRrp0XIvEQTcERQhqm7nfz4NMCXqmUWzBUr6R/F7lMKM75eMK6Q6hmSQDgkdyVzvY7j9enHjTBeZXxyCrqA==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-updater-roll": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-roll/-/tsparticles-updater-roll-2.0.3.tgz",
"integrity": "sha512-sm7TkU/0ErVUBDnRUCYjH1OonHs+P/C8gtiVrRhvowQTdpSl5a1x+UoSu6aHzPxZZVCBhDmkACNC0JuOa6uucw==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-updater-size": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-size/-/tsparticles-updater-size-2.0.3.tgz",
"integrity": "sha512-dIkse7f9ZhOXFtPKyinzOQul75MRO29kzXMMU1vsOsLdNB6+8/LL44pvLRdrJA/6JUeuspMeMEtMvwtAyPeA+A==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-updater-stroke-color": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-stroke-color/-/tsparticles-updater-stroke-color-2.0.3.tgz",
"integrity": "sha512-iQLiYpbPDbM+NqnLZPv7Th12Mq4CLSFLXr6zvZi09TLVgRl9sLur046AHyLP5IuetvwwaOxKkKEGAg7VlvR6lA==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-updater-tilt": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-tilt/-/tsparticles-updater-tilt-2.0.3.tgz",
"integrity": "sha512-04L7qsP47X9Mt6esAvk4/avfHQQI94h+/NiKbZ7HNJjcKbCvQp9LaplQCFGvr9t1IxFT9aQAmRP2KInVAelw5g==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsparticles-updater-wobble": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tsparticles-updater-wobble/-/tsparticles-updater-wobble-2.0.3.tgz",
"integrity": "sha512-oToq/HwaA6OHjO8j7u8oT3I8/pJhOCNldX3XoZAgiaA3E8E19g8iD/0tWIkP4D/4o+I7NkJLv0wTcd5DJyueGg==",
"requires": {
"tsparticles-engine": "^2.0.3"
}
},
"tsutils": {
"version": "3.21.0",
"resolved": "https://registry.npmjs.org/tsutils/-/tsutils-3.21.0.tgz",
@ -21474,6 +22210,12 @@
"@vue/shared": "3.2.26"
}
},
"vue-class-component": {
"version": "8.0.0-rc.1",
"resolved": "https://registry.npmjs.org/vue-class-component/-/vue-class-component-8.0.0-rc.1.tgz",
"integrity": "sha512-w1nMzsT/UdbDAXKqhwTmSoyuJzUXKrxLE77PCFVuC6syr8acdFDAq116xgvZh9UCuV0h+rlCtxXolr3Hi3HyPQ==",
"requires": {}
},
"vue-eslint-parser": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-8.0.1.tgz",

View file

@ -12,6 +12,8 @@
"core-js": "^3.6.5",
"lodash.clonedeep": "^4.5.0",
"nanoevents": "^6.0.2",
"particles.vue3": "^2.0.3",
"tsparticles": "^2.0.3",
"vue": "^3.2.26",
"vue-next-select": "^2.10.2",
"vue-panzoom": "^1.1.6",

View file

@ -6,10 +6,13 @@
<TPS v-if="unref(showTPS)" />
<GameOverScreen />
<NaNScreen />
<component :is="gameComponent" />
</div>
</template>
<script setup lang="ts">
<script setup lang="tsx">
import { jsx } from "features/feature";
import { coerceComponent, render } from "util/vue";
import { computed, toRef, unref } from "vue";
import Game from "./components/Game.vue";
import GameOverScreen from "./components/GameOverScreen.vue";
@ -18,7 +21,7 @@ import Nav from "./components/Nav.vue";
import TPS from "./components/TPS.vue";
import projInfo from "./data/projInfo.json";
import themes from "./data/themes";
import settings from "./game/settings";
import settings, { gameComponents } from "./game/settings";
import "./main.css";
function updateMouse(/* event */) {
@ -28,6 +31,10 @@ function updateMouse(/* event */) {
const useHeader = projInfo.useHeader;
const theme = computed(() => themes[settings.theme].variables);
const showTPS = toRef(settings, "showTPS");
const gameComponent = computed(() => {
return coerceComponent(jsx(() => <>{gameComponents.map(render)}</>));
});
</script>
<style scoped>

View file

@ -0,0 +1,54 @@
<template>
<Particles
id="particles"
ref="particles"
:particlesInit="particlesInit"
:options="{
fpsLimit: 60,
fullScreen: { zIndex: 1 },
particles: {
number: {
value: 0
}
},
emitters: {
autoPlay: false
}
}"
/>
</template>
<script lang="tsx">
import { loadFull } from "tsparticles";
import { Engine } from "tsparticles-engine";
import { Emitters } from "tsparticles-plugin-emitters/Emitters";
import { defineComponent, nextTick, ref } from "vue";
import { ParticlesComponent } from "particles.vue3";
// TODO get typing support on the Particles component
export default defineComponent({
emits: ["init"],
components: { Particles: ParticlesComponent },
setup(props, { emit }) {
const particles = ref<null | { particles: { container: Emitters } }>(null);
async function particlesInit(engine: Engine) {
await loadFull(engine);
finishInit(engine);
}
function finishInit(engine: Engine) {
if (engine.domArray.length) {
emit("init", engine.domItem(0));
} else {
nextTick(() => finishInit(engine));
}
}
return {
particles,
particlesInit
};
}
});
</script>

View file

@ -0,0 +1,43 @@
import ParticlesComponent from "./Particles.vue";
import { IEmitter } from "tsparticles-plugin-emitters/Options/Interfaces/IEmitter";
import { EmitterInstance } from "tsparticles-plugin-emitters/EmitterInstance";
import { EmitterContainer } from "tsparticles-plugin-emitters/EmitterContainer";
import { ICoordinates } from "tsparticles-engine";
import { Ref, shallowRef } from "vue";
import { registerGameComponent } from "game/settings";
import { jsx } from "features/feature";
registerGameComponent(jsx(() => <ParticlesComponent onInit={onInit} />));
const containerRef: Ref<null | EmitterContainer> = shallowRef(null);
let emittersToAdd: {
resolve: (value: EmitterInstance | PromiseLike<EmitterInstance>) => void;
options: IEmitter & { particles: Required<IEmitter>["particles"] };
position: ICoordinates;
}[] = [];
export function addEmitter(
options: IEmitter & { particles: Required<IEmitter>["particles"] },
position: ICoordinates
): Promise<EmitterInstance> {
if (containerRef.value) {
return Promise.resolve(containerRef.value.addEmitter(options, position));
}
return new Promise<EmitterInstance>(resolve => {
emittersToAdd.push({ resolve, options, position });
});
}
export function removeEmitter(emitter: EmitterInstance) {
// TODO I can't find a proper way to remove an emitter without accessing private functions
emitter.emitters.removeEmitter(emitter);
}
function onInit(container: EmitterContainer) {
containerRef.value = container;
emittersToAdd.forEach(({ resolve, options, position }) =>
resolve(container.addEmitter(options, position))
);
emittersToAdd = [];
}

View file

@ -24,7 +24,7 @@ import {
ProcessedComputable
} from "util/computed";
import { createLazyProxy } from "util/proxies";
import { computed, ref, Ref, unref } from "vue";
import { computed, ref, Ref, shallowRef, unref } from "vue";
export const TreeNodeType = Symbol("TreeNode");
export const TreeType = Symbol("Tree");
@ -175,7 +175,7 @@ export function createTree<T extends TreeOptions>(
tree[Component] = TreeComponent;
tree.isResetting = ref(false);
tree.resettingNode = ref(null);
tree.resettingNode = shallowRef(null);
tree.reset = function (node) {
const genericTree = tree as GenericTree;

View file

@ -67,3 +67,8 @@ export const infoComponents: CoercableComponent[] = reactive([]);
export function registerInfoComponent(component: CoercableComponent) {
infoComponents.push(component);
}
export const gameComponents: CoercableComponent[] = reactive([]);
export function registerGameComponent(component: CoercableComponent) {
gameComponents.push(component);
}

1
src/lib/tsParticles.d.ts vendored Normal file
View file

@ -0,0 +1 @@
declare module "particles.vue3";