diff --git a/package-lock.json b/package-lock.json index 748169f..49f8320 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,8 @@ "name": "games", "version": "0.0.0", "dependencies": { + "@pixi/react": "^7.1.1", + "pixi.js": "^7.3.2", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router-dom": "^6.19.0" @@ -347,6 +349,18 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/runtime": { + "version": "7.23.5", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.5.tgz", + "integrity": "sha512-NdUTHcPe4C99WxPub+K9l9tK5/lV4UXIoaHSYgzco9BCyjKAAwzdBI+wWtYqHt7LJdbo74ZjRPJgzVweq1sz0w==", + "peer": true, + "dependencies": { + "regenerator-runtime": "^0.14.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/@babel/template": { "version": "7.22.15", "dev": true, @@ -573,6 +587,384 @@ "node": ">= 8" } }, + "node_modules/@pixi/accessibility": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/accessibility/-/accessibility-7.3.2.tgz", + "integrity": "sha512-MdkU22HTauRvq9cMeWZIQGaDDa86sr+m12rKNdLV+FaDQgP/AhP+qCVpK7IKeJa9BrWGXaYMw/vueij7HkyDSA==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2", + "@pixi/events": "7.3.2" + } + }, + "node_modules/@pixi/app": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/app/-/app-7.3.2.tgz", + "integrity": "sha512-3YRFSMvAxDebAz3/JJv+2jzbPkT8cHC0IHmmLRN8krDL1pZV+YjMLgMwN/Oeyv5TSbwNqnrF5su5whNkRaxeZQ==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2" + } + }, + "node_modules/@pixi/assets": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/assets/-/assets-7.3.2.tgz", + "integrity": "sha512-yteq6ptAxA09EcwU9D9hl7qr5yWIqy+c2PsXkTDkc76vTAwIamLY3KxLq2aR5y1U4L4O6aHFJd26uNhHcuTPmw==", + "dependencies": { + "@types/css-font-loading-module": "^0.0.7" + }, + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/utils": "7.3.2" + } + }, + "node_modules/@pixi/color": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/color/-/color-7.3.2.tgz", + "integrity": "sha512-jur5PvdOtUBEUTjmPudW5qdQq6yYGlVGsi3HyhasJw14bN+GKJwiCKgIsyrsiNL5HBUXmje4ICwQohf6BqKqxA==", + "dependencies": { + "@pixi/colord": "^2.9.6" + } + }, + "node_modules/@pixi/colord": { + "version": "2.9.6", + "resolved": "https://registry.npmjs.org/@pixi/colord/-/colord-2.9.6.tgz", + "integrity": "sha512-nezytU2pw587fQstUu1AsJZDVEynjskwOL+kibwcdxsMBFqPsFFNA7xl0ii/gXuDi6M0xj3mfRJj8pBSc2jCfA==" + }, + "node_modules/@pixi/compressed-textures": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/compressed-textures/-/compressed-textures-7.3.2.tgz", + "integrity": "sha512-J3ENMHDPQO6CJRei55gqI0WmiZJIK6SgsW5AEkShT0aAe5miEBSomv70pXw/58ru+4/Hx8cXjamsGt4aQB2D0Q==", + "peerDependencies": { + "@pixi/assets": "7.3.2", + "@pixi/core": "7.3.2" + } + }, + "node_modules/@pixi/constants": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/constants/-/constants-7.3.2.tgz", + "integrity": "sha512-Q8W3ncsFxmfgC5EtokpG92qJZabd+Dl+pbQAdHwiPY3v+8UNq77u4VN2qtl1Z04864hCcg7AStIYEDrzqTLF6Q==" + }, + "node_modules/@pixi/core": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/core/-/core-7.3.2.tgz", + "integrity": "sha512-Pta3ee8MtJ3yKxGXzglBWgwbEOKMB6Eth+FpLTjL0rgxiqTB550YX6jsNEQQAzcGjCBlO3rC/IF57UZ2go/X6w==", + "dependencies": { + "@pixi/color": "7.3.2", + "@pixi/constants": "7.3.2", + "@pixi/extensions": "7.3.2", + "@pixi/math": "7.3.2", + "@pixi/runner": "7.3.2", + "@pixi/settings": "7.3.2", + "@pixi/ticker": "7.3.2", + "@pixi/utils": "7.3.2", + "@types/offscreencanvas": "^2019.6.4" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/pixijs" + } + }, + "node_modules/@pixi/display": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/display/-/display-7.3.2.tgz", + "integrity": "sha512-cY5AnZ3TWt5GYGx4e5AQ2/2U9kP+RorBg/O30amJ+8e9bFk9rS8cjh/DDq/hc4lql96BkXAInTl40eHnAML5lQ==", + "peerDependencies": { + "@pixi/core": "7.3.2" + } + }, + "node_modules/@pixi/events": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/events/-/events-7.3.2.tgz", + "integrity": "sha512-Moca9epu8jk1wIQCdVYjhz2pD9Ol21m50wvWUKvpgt9yM/AjkCLSDt8HO/PmTpavDrkhx5pVVWeDDA6FyUNaGA==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2" + } + }, + "node_modules/@pixi/extensions": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/extensions/-/extensions-7.3.2.tgz", + "integrity": "sha512-Qw84ADfvmVu4Mwj+zTik/IEEK9lWS5n4trbrpQCcEZ+Mb8oRAXWvKz199mi1s7+LaZXDqeCY1yr2PHQaFf1KBA==" + }, + "node_modules/@pixi/extract": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/extract/-/extract-7.3.2.tgz", + "integrity": "sha512-KsoflvQZV/XD8A8xbtRnmI4reYekbI4MOi7ilwQe5tMz6O1mO7IzrSukxkSMD02f6SpbAqbi7a1EayTjvY0ECQ==", + "peerDependencies": { + "@pixi/core": "7.3.2" + } + }, + "node_modules/@pixi/filter-alpha": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/filter-alpha/-/filter-alpha-7.3.2.tgz", + "integrity": "sha512-nZMdn310wH5ZK1slwv3X4qT8eLoAGO7SgYGCy5IsMtpCtNObzE9XA4tAfhXrjihyzPS9KvszgAbnv1Qpfh0/uw==", + "peerDependencies": { + "@pixi/core": "7.3.2" + } + }, + "node_modules/@pixi/filter-blur": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/filter-blur/-/filter-blur-7.3.2.tgz", + "integrity": "sha512-unu3zhwHMhN+iAe7Td2rK40i2UJ2GOhzWK+6jcU3ZkMOsFCT5kgBoMRTejeQVcvCs6GoYK8imbkE7mXt05Vj6A==", + "peerDependencies": { + "@pixi/core": "7.3.2" + } + }, + "node_modules/@pixi/filter-color-matrix": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/filter-color-matrix/-/filter-color-matrix-7.3.2.tgz", + "integrity": "sha512-rbyjes/9SMoV9jjPiK0sLMkmLfN8D17GoTJIfq/KLv1x9646W5fL2QSKkN04UkZ+020ndWvIOxK1S97tvRyCfg==", + "peerDependencies": { + "@pixi/core": "7.3.2" + } + }, + "node_modules/@pixi/filter-displacement": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/filter-displacement/-/filter-displacement-7.3.2.tgz", + "integrity": "sha512-ZHl7Sfb8JYd9Z6j96OHCC0NhMKhhXJRE5AbkSDohjEMVCK1BV5rDGAHV8WVt/2MJ/j83CXUpydzyMhdM4lMchg==", + "peerDependencies": { + "@pixi/core": "7.3.2" + } + }, + "node_modules/@pixi/filter-fxaa": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/filter-fxaa/-/filter-fxaa-7.3.2.tgz", + "integrity": "sha512-9brtlxDnQTZk2XiFBKdBK9e+8CX9LdxxcL7LRpjEyiHuAPvTlQgu9B85LrJ4GzWKqJJKaIIZBzhIoiCLUnfeXg==", + "peerDependencies": { + "@pixi/core": "7.3.2" + } + }, + "node_modules/@pixi/filter-noise": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/filter-noise/-/filter-noise-7.3.2.tgz", + "integrity": "sha512-F8GQQ20n7tCjThX6GCXckiXz2YffOCxicTJ0oat9aVDZh+sVsAxYX0aKSdHh0hhv18F0yuc6tPsSL5DYb63xFg==", + "peerDependencies": { + "@pixi/core": "7.3.2" + } + }, + "node_modules/@pixi/graphics": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/graphics/-/graphics-7.3.2.tgz", + "integrity": "sha512-PhU6j1yub4tH/s+/gqByzgZ3mLv1mfb6iGXbquycg3+WypcxHZn0opFtI/axsazaQ9SEaWxw1m3i40WG5ANH5g==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2", + "@pixi/sprite": "7.3.2" + } + }, + "node_modules/@pixi/math": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/math/-/math-7.3.2.tgz", + "integrity": "sha512-dutoZ0IVJ5ME7UtYNo2szu4D7qsgtJB7e3ylujBVu7BOP2e710BVtFwFSFV768N14h9H5roGnuzVoDiJac2u+w==" + }, + "node_modules/@pixi/mesh": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/mesh/-/mesh-7.3.2.tgz", + "integrity": "sha512-LFkt7ELYXQLgbgHpjl68j6JD5ejUwma8zoPn2gqSBbY+6pK/phjvV1Wkh76muF46VvNulgXF0+qLIDdCsfrDaA==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2" + } + }, + "node_modules/@pixi/mesh-extras": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/mesh-extras/-/mesh-extras-7.3.2.tgz", + "integrity": "sha512-s/tg9TsTZZxLEdCDKWnBChDGkc041HCTP7ykJv4fEROzb9B0lskULYyvv+/YNNKa2Ugb9WnkMknpOdOXCpjyyg==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/mesh": "7.3.2" + } + }, + "node_modules/@pixi/mixin-cache-as-bitmap": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/mixin-cache-as-bitmap/-/mixin-cache-as-bitmap-7.3.2.tgz", + "integrity": "sha512-bZRlyUN5+9kCUjn67V0IFtYIrbmx9Vs4sMOmXyrX3Q4B4gPLE46IzZz3v0IVaTjp32udlQztfJalIaWbuqgb3A==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2", + "@pixi/sprite": "7.3.2" + } + }, + "node_modules/@pixi/mixin-get-child-by-name": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/mixin-get-child-by-name/-/mixin-get-child-by-name-7.3.2.tgz", + "integrity": "sha512-mbUi3WxXrkViH7qOgjk4fu2BN36NwNb7u+Fy1J5dS8Bntj57ZVKmEV9PbUy0zYjXE8rVmeAvSu/2kbn5n9UutQ==", + "peerDependencies": { + "@pixi/display": "7.3.2" + } + }, + "node_modules/@pixi/mixin-get-global-position": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/mixin-get-global-position/-/mixin-get-global-position-7.3.2.tgz", + "integrity": "sha512-1nhWbBgmw6rK7yQJxzeI9yjKYYEkM5i3pee8qVu4YWo3b1xWVQA7osQG7aGM/4qywDkXaA1ZvciA5hfg6f4Q5Q==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2" + } + }, + "node_modules/@pixi/particle-container": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/particle-container/-/particle-container-7.3.2.tgz", + "integrity": "sha512-JYc4j4z97KmxyLp+1Lg0SNi8hy6RxcBBNQGk+CSLNXeDWxx3hykT5gj/ORX1eXyzHh1ZCG1XzeVS9Yr8QhlFHA==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2", + "@pixi/sprite": "7.3.2" + } + }, + "node_modules/@pixi/prepare": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/prepare/-/prepare-7.3.2.tgz", + "integrity": "sha512-aLPAXSYLUhMwxzJtn9m0TSZe+dQlZCt09QNBqYbSi8LZId54QMDyvfBb4zBOJZrD2xAZgYL5RIJuKHwZtFX6lQ==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2", + "@pixi/graphics": "7.3.2", + "@pixi/text": "7.3.2" + } + }, + "node_modules/@pixi/react": { + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/@pixi/react/-/react-7.1.1.tgz", + "integrity": "sha512-W3LILsYiUxavrLoDGiIuQneFgSzsUuHkt6VVuAaqUPEGjMBzicgA5v5R2dPDmu3B+5BRwAHcJZttUKH7zFjbGw==", + "dependencies": { + "lodash.isnil": "4.0.0", + "lodash.times": "4.3.2", + "performance-now": "2.1.0", + "prop-types": "^15.8.1" + }, + "peerDependencies": { + "@babel/runtime": "^7.14.8", + "@pixi/app": ">=6.0.0", + "@pixi/constants": ">=6.0.0", + "@pixi/core": ">=6.0.0", + "@pixi/display": ">=6.0.0", + "@pixi/extensions": ">=6.0.0", + "@pixi/graphics": ">=6.0.0", + "@pixi/math": ">=6.0.0", + "@pixi/mesh": ">=6.0.0", + "@pixi/mesh-extras": ">=6.0.0", + "@pixi/particle-container": ">=6.0.0", + "@pixi/sprite": ">=6.0.0", + "@pixi/sprite-animated": ">=6.0.0", + "@pixi/sprite-tiling": ">=6.0.0", + "@pixi/text": ">=6.0.0", + "@pixi/text-bitmap": ">=6.0.0", + "@pixi/ticker": ">=6.0.0", + "prop-types": "^15.8.1", + "react": ">=17.0.0", + "react-dom": ">=17.0.0" + } + }, + "node_modules/@pixi/runner": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/runner/-/runner-7.3.2.tgz", + "integrity": "sha512-maKotoKJCQiQGBJwfM+iYdQKjrPN/Tn9+72F4WIf706zp/5vKoxW688Rsktg5BX4Mcn7ZkZvcJYTxj2Mv87lFA==" + }, + "node_modules/@pixi/settings": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/settings/-/settings-7.3.2.tgz", + "integrity": "sha512-vtxzuARDTbFe0fRYSqB53B+mPpX7v+QjjnCUmVMVvZiWr3QcngMWVml6c6dQDln7IakWoKZRrNG4FpggvDgLVg==", + "dependencies": { + "@pixi/constants": "7.3.2", + "@types/css-font-loading-module": "^0.0.7", + "ismobilejs": "^1.1.0" + } + }, + "node_modules/@pixi/sprite": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/sprite/-/sprite-7.3.2.tgz", + "integrity": "sha512-IpWTKXExJNXVcY7ITopJ+JW48DahdbCo/81D2IYzBImq3jyiJM2Km5EoJgvAM5ZQ3Ev3KPPIBzYLD+HoPWcxdw==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2" + } + }, + "node_modules/@pixi/sprite-animated": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/sprite-animated/-/sprite-animated-7.3.2.tgz", + "integrity": "sha512-j9pyUe4cefxE9wecNfbWQyL5fBQKvCGYaOA0DE1X46ukBHrIuhA8u3jg2X3N3r4IcbVvxpWFYDrDsWXWeiBmSw==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/sprite": "7.3.2" + } + }, + "node_modules/@pixi/sprite-tiling": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/sprite-tiling/-/sprite-tiling-7.3.2.tgz", + "integrity": "sha512-tWVVb/rMIx5AczfUrVxa0dZaIufP5C0IOL7IGfFUDQqDu5JSAUC0mwLe4F12jAXBVsqYhCGYx5bIHbPiI5vcSQ==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2", + "@pixi/sprite": "7.3.2" + } + }, + "node_modules/@pixi/spritesheet": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/spritesheet/-/spritesheet-7.3.2.tgz", + "integrity": "sha512-UkwqrPYDqrEdK5ub9qn/9VBvt5caA8ffV5iYR6ssCvrpaQovBKmS+b5pr/BYf8xNTExDpR3OmPIo8iDEYWWLuw==", + "peerDependencies": { + "@pixi/assets": "7.3.2", + "@pixi/core": "7.3.2" + } + }, + "node_modules/@pixi/text": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/text/-/text-7.3.2.tgz", + "integrity": "sha512-LdtNj+K5tPB/0UcDcO52M/C7xhwFTGFhtdF42fPhRuJawM23M3zm1Y8PapXv+mury+IxCHT1w30YlAi0qTVpKQ==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/sprite": "7.3.2" + } + }, + "node_modules/@pixi/text-bitmap": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/text-bitmap/-/text-bitmap-7.3.2.tgz", + "integrity": "sha512-p8KLgtZSPowWU/Zj+GVtfsUT8uGYo4TtKKYbLoWuxkRA5Pc1+4C9/rV/EOSFfoZIdW5C+iFg5VxRgBllUQf+aA==", + "peerDependencies": { + "@pixi/assets": "7.3.2", + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2", + "@pixi/mesh": "7.3.2", + "@pixi/text": "7.3.2" + } + }, + "node_modules/@pixi/text-html": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/text-html/-/text-html-7.3.2.tgz", + "integrity": "sha512-IYhBWEPOvqUtlHkS5/c1Hseuricj5jrrGd21ivcvHmcnK/x2m+CRGvvzeBp1mqoYBnDbQVrD2wSXSe4Dv9tEJA==", + "peerDependencies": { + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2", + "@pixi/sprite": "7.3.2", + "@pixi/text": "7.3.2" + } + }, + "node_modules/@pixi/ticker": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/ticker/-/ticker-7.3.2.tgz", + "integrity": "sha512-5kIPhBeXwDJohCzKzJJ6T7f1oAGbHAgeiwOjlTO+9lNXUX8ZPj0407V3syuF+64kFqJzIBCznBRpI+fmT4c9SA==", + "dependencies": { + "@pixi/extensions": "7.3.2", + "@pixi/settings": "7.3.2", + "@pixi/utils": "7.3.2" + } + }, + "node_modules/@pixi/utils": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/@pixi/utils/-/utils-7.3.2.tgz", + "integrity": "sha512-KhNvj9YcY7Zi2dTKZgDpx8C6OxKKR541vwtG6JgdBZZYDeMBOIghN2Vi5zn4diW5BhDfHBmdSJ1wZXEtE2MDwg==", + "dependencies": { + "@pixi/color": "7.3.2", + "@pixi/constants": "7.3.2", + "@pixi/settings": "7.3.2", + "@types/earcut": "^2.1.0", + "earcut": "^2.2.4", + "eventemitter3": "^4.0.0", + "url": "^0.11.0" + } + }, "node_modules/@remix-run/router": { "version": "1.12.0", "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.12.0.tgz", @@ -774,11 +1166,26 @@ "@babel/types": "^7.20.7" } }, + "node_modules/@types/css-font-loading-module": { + "version": "0.0.7", + "resolved": "https://registry.npmjs.org/@types/css-font-loading-module/-/css-font-loading-module-0.0.7.tgz", + "integrity": "sha512-nl09VhutdjINdWyXxHWN/w9zlNCfr60JUqJbd24YXUuCwgeL0TpFSdElCwb6cxfB6ybE19Gjj4g0jsgkXxKv1Q==" + }, + "node_modules/@types/earcut": { + "version": "2.1.4", + "resolved": "https://registry.npmjs.org/@types/earcut/-/earcut-2.1.4.tgz", + "integrity": "sha512-qp3m9PPz4gULB9MhjGID7wpo3gJ4bTGXm7ltNDsmOvsPduTeHp8wSW9YckBj3mljeOh4F0m2z/0JKAALRKbmLQ==" + }, "node_modules/@types/json-schema": { "version": "7.0.15", "dev": true, "license": "MIT" }, + "node_modules/@types/offscreencanvas": { + "version": "2019.7.3", + "resolved": "https://registry.npmjs.org/@types/offscreencanvas/-/offscreencanvas-2019.7.3.tgz", + "integrity": "sha512-ieXiYmgSRXUDeOntE1InxjWyvEelZGP63M+cGuquuRLuIKKT1osnkXjxev9B7d1nXSug5vpunx+gNlbVxMlC9A==" + }, "node_modules/@types/prop-types": { "version": "15.7.10", "dev": true, @@ -1336,7 +1743,6 @@ "version": "1.0.5", "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.5.tgz", "integrity": "sha512-C3nQxfFZxFRVoJoGKKI8y3MOEo129NQ+FgQ08iye+Mk4zNZZGdjfs06bVTr+DBSlA66Q2VEcMki/cUCP4SercQ==", - "dev": true, "dependencies": { "function-bind": "^1.1.2", "get-intrinsic": "^1.2.1", @@ -1521,7 +1927,6 @@ "version": "1.1.1", "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.1.tgz", "integrity": "sha512-E7uGkTzkk1d0ByLeSc6ZsFS79Axg+m1P/VsgYsxHgiuc3tFSj+MjMIwe90FC4lOAZzNBdY7kkO2P2wKdsQ1vgQ==", - "dev": true, "dependencies": { "get-intrinsic": "^1.2.1", "gopd": "^1.0.1", @@ -1582,6 +1987,11 @@ "node": ">=6.0.0" } }, + "node_modules/earcut": { + "version": "2.2.4", + "resolved": "https://registry.npmjs.org/earcut/-/earcut-2.2.4.tgz", + "integrity": "sha512-/pjZsA1b4RPHbeWZQn66SWS8nZZWLQQ23oE3Eam7aroEFGEvwKAsJfZ9ytiEMycfzXWpca4FA9QIOehf7PocBQ==" + }, "node_modules/electron-to-chromium": { "version": "1.4.587", "dev": true, @@ -2050,6 +2460,11 @@ "node": ">=0.10.0" } }, + "node_modules/eventemitter3": { + "version": "4.0.7", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz", + "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==" + }, "node_modules/fast-deep-equal": { "version": "3.1.3", "dev": true, @@ -2197,7 +2612,6 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==", - "dev": true, "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -2241,7 +2655,6 @@ "version": "1.2.2", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.2.tgz", "integrity": "sha512-0gSo4ml/0j98Y3lngkFEot/zhiCeWsbYIlZ+uZOVgzLyLaUw7wxUL+nCTP0XJvJg1AXulJRI3UJi8GsbDuxdGA==", - "dev": true, "dependencies": { "function-bind": "^1.1.2", "has-proto": "^1.0.1", @@ -2350,7 +2763,6 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz", "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==", - "dev": true, "dependencies": { "get-intrinsic": "^1.1.3" }, @@ -2384,7 +2796,6 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.1.tgz", "integrity": "sha512-VsX8eaIewvas0xnvinAe9bw4WfIeODpGYikiWYLH+dma0Jw6KHYqWiWfhQlgOVK8D6PvjubK5Uc4P0iIhIcNVg==", - "dev": true, "dependencies": { "get-intrinsic": "^1.2.2" }, @@ -2396,7 +2807,6 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.1.tgz", "integrity": "sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg==", - "dev": true, "engines": { "node": ">= 0.4" }, @@ -2408,7 +2818,6 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz", "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==", - "dev": true, "engines": { "node": ">= 0.4" }, @@ -2435,7 +2844,6 @@ "version": "2.0.0", "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.0.tgz", "integrity": "sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==", - "dev": true, "dependencies": { "function-bind": "^1.1.2" }, @@ -2835,6 +3243,11 @@ "dev": true, "license": "ISC" }, + "node_modules/ismobilejs": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/ismobilejs/-/ismobilejs-1.1.1.tgz", + "integrity": "sha512-VaFW53yt8QO61k2WJui0dHf4SlL8lxBofUuUmwBo0ljPk0Drz2TiuDW4jo3wDcv41qy/SxrJ+VAzJ/qYqsmzRw==" + }, "node_modules/iterator.prototype": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/iterator.prototype/-/iterator.prototype-1.1.2.tgz", @@ -2973,11 +3386,21 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/lodash.isnil": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/lodash.isnil/-/lodash.isnil-4.0.0.tgz", + "integrity": "sha512-up2Mzq3545mwVnMhTDMdfoG1OurpA/s5t88JmQX809eH3C8491iu2sfKhTfhQtKY78oPNhiaHJUpT/dUDAAtng==" + }, "node_modules/lodash.merge": { "version": "4.6.2", "dev": true, "license": "MIT" }, + "node_modules/lodash.times": { + "version": "4.3.2", + "resolved": "https://registry.npmjs.org/lodash.times/-/lodash.times-4.3.2.tgz", + "integrity": "sha512-FfaJzl0SA35CRPDh5SWe2BTght6y5KSK7yJv166qIp/8q7qOwBDCvuDZE2RUSMRpBkLF6rZKbLEUoTmaP3qg6A==" + }, "node_modules/loose-envify": { "version": "1.4.0", "license": "MIT", @@ -3095,7 +3518,6 @@ "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==", - "dev": true, "engines": { "node": ">=0.10.0" } @@ -3113,7 +3535,6 @@ "version": "1.13.1", "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.1.tgz", "integrity": "sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==", - "dev": true, "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -3307,6 +3728,11 @@ "node": ">=8" } }, + "node_modules/performance-now": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", + "integrity": "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==" + }, "node_modules/picocolors": { "version": "1.0.0", "dev": true, @@ -3341,6 +3767,47 @@ "node": ">= 6" } }, + "node_modules/pixi.js": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/pixi.js/-/pixi.js-7.3.2.tgz", + "integrity": "sha512-GJickUrT3UcBInGT1CU6cv2oktCdocE5QM74CD3t+weiJPPWIzleNlp7zrBR5QIDdU6bEO8CUgUXH2Y9QvlCMw==", + "dependencies": { + "@pixi/accessibility": "7.3.2", + "@pixi/app": "7.3.2", + "@pixi/assets": "7.3.2", + "@pixi/compressed-textures": "7.3.2", + "@pixi/core": "7.3.2", + "@pixi/display": "7.3.2", + "@pixi/events": "7.3.2", + "@pixi/extensions": "7.3.2", + "@pixi/extract": "7.3.2", + "@pixi/filter-alpha": "7.3.2", + "@pixi/filter-blur": "7.3.2", + "@pixi/filter-color-matrix": "7.3.2", + "@pixi/filter-displacement": "7.3.2", + "@pixi/filter-fxaa": "7.3.2", + "@pixi/filter-noise": "7.3.2", + "@pixi/graphics": "7.3.2", + "@pixi/mesh": "7.3.2", + "@pixi/mesh-extras": "7.3.2", + "@pixi/mixin-cache-as-bitmap": "7.3.2", + "@pixi/mixin-get-child-by-name": "7.3.2", + "@pixi/mixin-get-global-position": "7.3.2", + "@pixi/particle-container": "7.3.2", + "@pixi/prepare": "7.3.2", + "@pixi/sprite": "7.3.2", + "@pixi/sprite-animated": "7.3.2", + "@pixi/sprite-tiling": "7.3.2", + "@pixi/spritesheet": "7.3.2", + "@pixi/text": "7.3.2", + "@pixi/text-bitmap": "7.3.2", + "@pixi/text-html": "7.3.2" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/pixijs" + } + }, "node_modules/postcss": { "version": "8.4.31", "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz", @@ -3484,7 +3951,6 @@ "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", - "dev": true, "dependencies": { "loose-envify": "^1.4.0", "object-assign": "^4.1.1", @@ -3499,6 +3965,20 @@ "node": ">=6" } }, + "node_modules/qs": { + "version": "6.11.2", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.11.2.tgz", + "integrity": "sha512-tDNIz22aBzCDxLtVH++VnTfzxlfeK5CbqohpSqpJgj1Wg/cQbStNAz3NuqCs5vV+pjBsK4x4pN9HlVh7rcYRiA==", + "dependencies": { + "side-channel": "^1.0.4" + }, + "engines": { + "node": ">=0.6" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/queue-microtask": { "version": "1.2.3", "dev": true, @@ -3542,8 +4022,7 @@ "node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", - "dev": true + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" }, "node_modules/react-refresh": { "version": "0.14.0", @@ -3624,6 +4103,12 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/regenerator-runtime": { + "version": "0.14.0", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz", + "integrity": "sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==", + "peer": true + }, "node_modules/regexp.prototype.flags": { "version": "1.5.1", "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz", @@ -3796,7 +4281,6 @@ "version": "1.1.1", "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.1.1.tgz", "integrity": "sha512-VoaqjbBJKiWtg4yRcKBQ7g7wnGnLV3M8oLvVWwOk2PdYY6PEFegR1vezXR0tw6fZGF9csVakIRjrJiy2veSBFQ==", - "dev": true, "dependencies": { "define-data-property": "^1.1.1", "get-intrinsic": "^1.2.1", @@ -3844,7 +4328,6 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz", "integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==", - "dev": true, "dependencies": { "call-bind": "^1.0.0", "get-intrinsic": "^1.0.2", @@ -4272,6 +4755,20 @@ "punycode": "^2.1.0" } }, + "node_modules/url": { + "version": "0.11.3", + "resolved": "https://registry.npmjs.org/url/-/url-0.11.3.tgz", + "integrity": "sha512-6hxOLGfZASQK/cijlZnZJTq8OXAkt/3YGfQX45vvMYXpZoo8NdWZcY73K108Jf759lS1Bv/8wXnHDTSz17dSRw==", + "dependencies": { + "punycode": "^1.4.1", + "qs": "^6.11.2" + } + }, + "node_modules/url/node_modules/punycode": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz", + "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==" + }, "node_modules/util-deprecate": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", diff --git a/package.json b/package.json index 7fe64c3..b28d9f8 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,8 @@ "preview": "vite preview" }, "dependencies": { + "@pixi/react": "^7.1.1", + "pixi.js": "^7.3.2", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router-dom": "^6.19.0" diff --git a/public/blue-car.png b/public/blue-car.png new file mode 100644 index 0000000..fc2709d Binary files /dev/null and b/public/blue-car.png differ diff --git a/public/red-car.png b/public/red-car.png new file mode 100644 index 0000000..0337253 Binary files /dev/null and b/public/red-car.png differ diff --git a/src/pages/drag-race/index.tsx b/src/pages/drag-race/index.tsx new file mode 100644 index 0000000..1745c35 --- /dev/null +++ b/src/pages/drag-race/index.tsx @@ -0,0 +1,82 @@ +import {FC, useEffect, useState} from "react"; +import {Container, Sprite, Stage, Text} from "@pixi/react"; +import {TextStyle} from "pixi.js"; + +interface Coordinates { + x: number + y: number +} + +const style = new TextStyle({ + align: 'center', + fontSize: 50, + fill: ['#ffffff', '#00ff99'], // gradient + stroke: '#01d27e', + wordWrap: true, + wordWrapWidth: 440, +}) + +const determineNextKey = (nextKey: string) => { + switch (nextKey) { + case "a": + return "f"; + case "f": + return "a"; + case "j": + return ";"; + case ";": + return "j"; + } + return nextKey; +} + +export const DragRace: FC = () => { + const [topDriverPosition, setTopDriverPosition] = useState({x: 0, y: 125}) + const [bottomDriverPosition, setBottomDriverPosition] = useState({x: 0, y: 425}) + const [topNextKey, setTopNextKey] = useState("a") + const [bottomNextKey, setBottomNextKey] = useState("j") + const [winner, setWinner] = useState() + + const checkForWinner = () => { + // Tie goes to the top driver + if (topDriverPosition.x >= 746) { + setTopDriverPosition(position => ({...position, x: 775})) + setWinner("top") + return true + } + if (bottomDriverPosition.x >= 746) { + setBottomDriverPosition(position => ({...position, x: 775})) + setWinner("bottom") + return true + } + return false + } + + const handleKeyDown = (event: KeyboardEvent) => { + if (winner != null || checkForWinner()) return; + if (event.key === topNextKey) { + setTopNextKey(determineNextKey) + setTopDriverPosition((position) => ({...position, x: position.x + 4})); + } else if (event.key === bottomNextKey) { + setBottomNextKey(determineNextKey) + setBottomDriverPosition((position) => ({...position, x: position.x + 4})); + } + } + + useEffect(() => { + window.addEventListener("keydown", handleKeyDown); + return () => window.removeEventListener("keydown", handleKeyDown); + }) + + return ( + + + {winner != null && ( + )} + + + + + ) +} \ No newline at end of file diff --git a/src/pages/index.ts b/src/pages/index.ts index 3e43932..b92576d 100644 --- a/src/pages/index.ts +++ b/src/pages/index.ts @@ -1,4 +1,5 @@ +export * from "./connnect-four"; +export * from "./drag-race"; export * from "./errors"; export * from "./root"; -export * from "./tic-tac-toe"; -export * from "./connnect-four"; \ No newline at end of file +export * from "./tic-tac-toe"; \ No newline at end of file diff --git a/src/pages/root/index.tsx b/src/pages/root/index.tsx index 0feab97..993f778 100644 --- a/src/pages/root/index.tsx +++ b/src/pages/root/index.tsx @@ -15,6 +15,7 @@ export const Root: FC = () => { + {/* Outlet for rendering child routes */} diff --git a/src/router.tsx b/src/router.tsx index b3779fb..1be46d8 100644 --- a/src/router.tsx +++ b/src/router.tsx @@ -1,5 +1,5 @@ import {createBrowserRouter} from "react-router-dom"; -import {ConnectFour, Errors, Root, TicTacToe} from "./pages"; +import {ConnectFour, DragRace, Errors, Root, TicTacToe} from "./pages"; export const router = createBrowserRouter([ { @@ -9,6 +9,7 @@ export const router = createBrowserRouter([ children: [ {path: "/tic-tac-toe", element: }, {path: "/connect-four", element: }, + {path: "/drag-race", element: }, ] }, ]); \ No newline at end of file