From 91f7ab9b70d485bce169cd27e06ae9228aeb8abc Mon Sep 17 00:00:00 2001 From: asiryk Date: Thu, 11 Jul 2024 02:19:04 +0300 Subject: [PATCH] Upgrade to pixi.js v8 --- .editorconfig | 3 + package-lock.json | 604 +++++-------------------------------- package.json | 4 +- src/core/Background.ts | 6 +- src/core/Game.ts | 27 +- src/core/Loader.ts | 43 +-- src/core/PlayButton.ts | 10 +- src/core/Reel.ts | 15 +- src/core/ReelsContainer.ts | 14 +- src/core/Scoreboard.ts | 17 +- src/core/VictoryScreen.ts | 27 +- src/global.d.ts | 9 + src/index.ts | 6 +- 13 files changed, 170 insertions(+), 615 deletions(-) create mode 100644 .editorconfig create mode 100644 src/global.d.ts diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..570ea91 --- /dev/null +++ b/.editorconfig @@ -0,0 +1,3 @@ +[*.{js,ts}] +indent_style = space +indent_size = 4 diff --git a/package-lock.json b/package-lock.json index 80c2869..b1f89b4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,7 +10,7 @@ "license": "MIT", "dependencies": { "@types/node": "20.14.10", - "pixi.js": "6.0.4", + "pixi.js": "8.2.2", "ts-node": "10.9.2" }, "devDependencies": { @@ -175,417 +175,12 @@ "@module-federation/sdk": "0.1.6" } }, - "node_modules/@pixi/accessibility": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/accessibility/-/accessibility-6.0.4.tgz", - "integrity": "sha512-S0Co6M+BIx+Yk3INCwGp5Xif0jIv/uj5JPMbctpMV7fSsE3x0nYvcOOAfBjkGhYcXG7fNOGrYLgs5XQOBIWGtA==", - "license": "MIT", - "dependencies": { - "@pixi/canvas-renderer": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/app": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/app/-/app-6.0.4.tgz", - "integrity": "sha512-+BiuaQtnOBR5/Q8+nXnHE2tuZyuBnqy/cwbIR1ImPnKAs7UaCcRLf1R0RvnRFu4KMP4ozTd810p0k84TzIguTA==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4" - } - }, - "node_modules/@pixi/canvas-renderer": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/canvas-renderer/-/canvas-renderer-6.0.4.tgz", - "integrity": "sha512-z2r1nzYsAp9+gipvlFCj0rd0yfjVq1hTQkyWuMbo5TrePdEo3NLRrCUGo1dHJNbeSERpgGNN05OAiGQbAI+AUg==", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/settings": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/compressed-textures": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/compressed-textures/-/compressed-textures-6.0.4.tgz", - "integrity": "sha512-AqQPuuXcNrR28YT69SZhRxRRwzqQcQ/QrlexAR9Fohpe+jfDnvlNaIvQQoXU7HxD7huRiQ/dm3nwsLiKPqVoTg==", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/loaders": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/constants": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/constants/-/constants-6.0.4.tgz", - "integrity": "sha512-khwRMfuHVdFk93L+bf0mmCwtSloYlfBfjdseIAbJL+VSpeMG1S2DzCYlMCPdp4mvDLU9LvkH2U2leZGEIx5j7g==", + "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==", "license": "MIT" }, - "node_modules/@pixi/core": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/core/-/core-6.0.4.tgz", - "integrity": "sha512-r1ceyAz0z3usUs0uj4u2986vVT2tQixGNin2o9FNhPFDXbN5EaoKHLtrjGBt1iylK/EUH/nfL5zq0SGa/loW0A==", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/runner": "6.0.4", - "@pixi/settings": "6.0.4", - "@pixi/ticker": "6.0.4", - "@pixi/utils": "6.0.4" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/pixijs" - } - }, - "node_modules/@pixi/display": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/display/-/display-6.0.4.tgz", - "integrity": "sha512-v6hjx5Gm5aIlLQ7xrsZ2lstI1cv/MtbWXJOhU8LXckkrHHUvAuJgml3+0pcHw8YLuOlepZngUuiqy/XjceVk8A==", - "license": "MIT", - "dependencies": { - "@pixi/math": "6.0.4", - "@pixi/settings": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/extract": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/extract/-/extract-6.0.4.tgz", - "integrity": "sha512-xf/pnc5od7YJ8zCVIrv1km7i+P+rxYcSrrBI/hqX+qoVsI5EySKInf2GhCKHz4UjOHdSL5aPDnNYvzssNdIpdQ==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/filter-alpha": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/filter-alpha/-/filter-alpha-6.0.4.tgz", - "integrity": "sha512-MZEfvNPfH2NfrwgqKhwwzurnbLujphx4KNQmS63MEZTvXuQJy16DEOs459APYF6PmeGAGuDPKd5Onk/VbLRUwQ==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4" - } - }, - "node_modules/@pixi/filter-blur": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/filter-blur/-/filter-blur-6.0.4.tgz", - "integrity": "sha512-Hb14geh8ZKc8jZ4lfKyeWThLMqIvha6DdRUTfiSdKe3L7Q6qwqsb7LPtIrZHAPEQCyFLWbcOvRMy6ZFy0YkpLA==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4", - "@pixi/settings": "6.0.4" - } - }, - "node_modules/@pixi/filter-color-matrix": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/filter-color-matrix/-/filter-color-matrix-6.0.4.tgz", - "integrity": "sha512-31Rf9VBo2gqoxiAbD/Z1i+mu1C7uehecoelYQqCIzLjsWisICDTZZjUkMB5GrGzjeSpSqLfB34tlutBSh/r1wg==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4" - } - }, - "node_modules/@pixi/filter-displacement": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/filter-displacement/-/filter-displacement-6.0.4.tgz", - "integrity": "sha512-Oyk/WbzxlN46d/uB5NtPLfEW2G6ob5XRP+mPVd8yhK38m9Y9rKlcH4jJoWB2niQ+ewkdRfZhuIB+JRdhc9eevg==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4", - "@pixi/math": "6.0.4" - } - }, - "node_modules/@pixi/filter-fxaa": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/filter-fxaa/-/filter-fxaa-6.0.4.tgz", - "integrity": "sha512-cO5XuEIq//Wsk4MjrCYuXff+1/Gfc4bkFkMTO5JKvUaDlZzHNykZd5CeAouD2fz7/6/1z0gdWKbBY9IoameBew==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4" - } - }, - "node_modules/@pixi/filter-noise": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/filter-noise/-/filter-noise-6.0.4.tgz", - "integrity": "sha512-Fpex0tpKCwZIsN03zAmN7hAOCocFF/w4XVVIkuNgYR5A90OkK+omR6p/fDtlJtlAjWarsWq0y+c5wvvUMfqsmg==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4" - } - }, - "node_modules/@pixi/graphics": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/graphics/-/graphics-6.0.4.tgz", - "integrity": "sha512-CybR+DBkGB5llypPeib2A0J13mnPQwlQDqLRhlhXKkYxXQKXlPk5MWA7ZEg+4wKeqUUlrC+k70e5ZFYLC3AgEQ==", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/sprite": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/interaction": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/interaction/-/interaction-6.0.4.tgz", - "integrity": "sha512-4+FOKDpiF/+F9r3+y81xTBElcLqI3OpeeI9bkIw9pPHA41riXRQv+m0HWz76bGQK7zDAimAV9K2xff7Wa5nSeg==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/ticker": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/loaders": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/loaders/-/loaders-6.0.4.tgz", - "integrity": "sha512-cw8QSkn8l8P06fINfwCZW+vUdhtOJ5G+T2qQm3HIDgI/J1tAsiRj3ufHop8xkHwYXrUeTf1LTqw+QdlZEVpJfg==", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/utils": "6.0.4", - "resource-loader": "^3.0.1" - } - }, - "node_modules/@pixi/math": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/math/-/math-6.0.4.tgz", - "integrity": "sha512-UwZ72CeZ2KsS4IlcEXgNiuD88omPk42Dct74+1G+R2+yPI+XRZq+hGQRTle/BbFYjxh9ccdQVyX9ToGv1XTd6Q==", - "license": "MIT" - }, - "node_modules/@pixi/mesh": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/mesh/-/mesh-6.0.4.tgz", - "integrity": "sha512-uE1Qs4mXy0QVV3yjxlNeqthkXGS6Hkt5uR1fwrvdqxlQRkX69nRq+GZfInuRYDWqwAsl8eZWs7f+pLRDT+HFbA==", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/settings": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/mesh-extras": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/mesh-extras/-/mesh-extras-6.0.4.tgz", - "integrity": "sha512-2fGM8j2NBwPV71SSmMfke1N1oEQ34+J19rdaAb+p1fXex0FafqtXVO49Q8rPMvungKDplMKElzQoaC1G6JGKqA==", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/mesh": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/mixin-cache-as-bitmap": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/mixin-cache-as-bitmap/-/mixin-cache-as-bitmap-6.0.4.tgz", - "integrity": "sha512-b1G5AWsxnw3CxNyaxCWJ1cWPnRECknJQ9B4D8Dy7u/gI2gABVjqz17nNFYnVpcggLlgMTkjX8+/HWnD/vZQkTg==", - "license": "MIT", - "dependencies": { - "@pixi/canvas-renderer": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/settings": "6.0.4", - "@pixi/sprite": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/mixin-get-child-by-name": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/mixin-get-child-by-name/-/mixin-get-child-by-name-6.0.4.tgz", - "integrity": "sha512-scUMBHlOmW0hpjltn4UCihJZvz3ysDYIW35ma9p9Lso2D9qKjsZpojQ6mc75FVWz53T0BjUmLW8LHA86Jic6MQ==", - "license": "MIT", - "dependencies": { - "@pixi/display": "6.0.4" - } - }, - "node_modules/@pixi/mixin-get-global-position": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/mixin-get-global-position/-/mixin-get-global-position-6.0.4.tgz", - "integrity": "sha512-HzaFTMZEZTr6+WYuT9crTjjBYl7/Y/VDB7pWmjnntEdQsa1m0+by7Mnl67L6OSUPsAgW3MMlWirb5tL2zGFC7g==", - "license": "MIT", - "dependencies": { - "@pixi/display": "6.0.4", - "@pixi/math": "6.0.4" - } - }, - "node_modules/@pixi/particles": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/particles/-/particles-6.0.4.tgz", - "integrity": "sha512-/57nd+icuPFMNc+SxeUqGoO8ZXEKu9u8h+UI856XF1Rc1jlXzGanGAbp43Llq2LphYqBI8YVftP0QXhewCVjjA==", - "deprecated": "@pixi/particles renamed to @pixi/particle-container", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/polyfill": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/polyfill/-/polyfill-6.0.4.tgz", - "integrity": "sha512-HM27pSl8iduFqUC4Waa9mt/gRKHi8Pr679it84+U4CwXmJ2lw9DL5dZuyU+QzCp2nPEVGMqx8Ig8c7WLUMvnWA==", - "license": "MIT", - "dependencies": { - "object-assign": "^4.1.1", - "promise-polyfill": "^8.2.0" - } - }, - "node_modules/@pixi/prepare": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/prepare/-/prepare-6.0.4.tgz", - "integrity": "sha512-BrOeKC6eZ+sdiqpefUMGXIt/VDiYDqPDP7XUCRmaI8rGTFT6ZAg/XJQENb9TsVen/4dUp+9/1u7HCFO1TEhaWQ==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/graphics": "6.0.4", - "@pixi/settings": "6.0.4", - "@pixi/text": "6.0.4", - "@pixi/ticker": "6.0.4" - } - }, - "node_modules/@pixi/runner": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/runner/-/runner-6.0.4.tgz", - "integrity": "sha512-ta6r36r2vC+fPB27URpSacPGQDtbJbdUoeGCJWAEwX+QI4vx4C9NYAcB0bIg8TLXiigCfA6by/RMnJ0dBiemFA==", - "license": "MIT" - }, - "node_modules/@pixi/settings": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/settings/-/settings-6.0.4.tgz", - "integrity": "sha512-djiIsmULDwcHWNmEiZKm4zyVopu1NL+fClnbBmtDkGZw7nm37y6dOcdpYawJcxvE4/KLm6pspBiRTnrzdlqW7Q==", - "license": "MIT", - "dependencies": { - "ismobilejs": "^1.1.0" - } - }, - "node_modules/@pixi/sprite": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/sprite/-/sprite-6.0.4.tgz", - "integrity": "sha512-6yMoHmfFhSRERLM1PUXceq9e6e1UH0YJkLoPVLv6gxMunfk6jPXeO8p9dDS2FQ8ZMSkO/16BKq27HIMKvF6Cvg==", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/settings": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/sprite-animated": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/sprite-animated/-/sprite-animated-6.0.4.tgz", - "integrity": "sha512-uzNeJiZqcnuRc7HH/HdWxrkU7S3/D57rEGK+AuoaWEE2e2HlBWILGkf78mtqmeIrEChxe2qkOVkf4y3BZkzJVw==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4", - "@pixi/sprite": "6.0.4", - "@pixi/ticker": "6.0.4" - } - }, - "node_modules/@pixi/sprite-tiling": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/sprite-tiling/-/sprite-tiling-6.0.4.tgz", - "integrity": "sha512-4TBsKMeGhwmfsVELorSs+zWWBih37Kd0lPQu0uhcHVV1RKtZxZpkgNoyzKS4d+WInNek5F0E592bYsXkbE6Gag==", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/sprite": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/spritesheet": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/spritesheet/-/spritesheet-6.0.4.tgz", - "integrity": "sha512-WgOBoi9KvLkHtfSyKSEzjIq6BkLwC+Ckllh+vWgfjfFDhtm7NdOfxW5WVIoCLfyfv5/NSwEMEEffZrcw4zYA/A==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4", - "@pixi/loaders": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/text": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/text/-/text-6.0.4.tgz", - "integrity": "sha512-r9UJg8ivWvvS7nNyBaZBKX5zg5UCU37dIYbKXcHyiXnOvXO22tiQBfkPBrZCueeLXRouC9sHmDFya8rb5TE9HA==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/settings": "6.0.4", - "@pixi/sprite": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/text-bitmap": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/text-bitmap/-/text-bitmap-6.0.4.tgz", - "integrity": "sha512-Nh2PXixqF0LFJ0xwmTib2HVWdhgsHn+dSYMVIec8LndDFQMTBw+X2XP1iHjVm0xhqOVdZI+Qfb2Trc0j2lINrw==", - "license": "MIT", - "dependencies": { - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/loaders": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/mesh": "6.0.4", - "@pixi/settings": "6.0.4", - "@pixi/text": "6.0.4", - "@pixi/utils": "6.0.4" - } - }, - "node_modules/@pixi/ticker": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/ticker/-/ticker-6.0.4.tgz", - "integrity": "sha512-PkFfPP5vHlgnApLks0Ia0okmFu6KPqBdIyquDqHJAcBdgljedm32KS6K2EH37xelBOzYHScjZ2SQGiiebVfClw==", - "license": "MIT", - "dependencies": { - "@pixi/settings": "6.0.4" - } - }, - "node_modules/@pixi/utils": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/@pixi/utils/-/utils-6.0.4.tgz", - "integrity": "sha512-35JTWsAJ8Va0vvtUSQvyOr3kGedGKVuJnHDO89B8C8tSFtMpJYrR44vp1b1p1vOjNak+ulGehZc8LzlCqymViQ==", - "license": "MIT", - "dependencies": { - "@pixi/constants": "6.0.4", - "@pixi/settings": "6.0.4", - "@types/earcut": "^2.1.0", - "earcut": "^2.2.2", - "eventemitter3": "^3.1.0", - "url": "^0.11.0" - } - }, "node_modules/@polka/url": { "version": "1.0.0-next.25", "resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.25.tgz", @@ -1298,6 +893,12 @@ "@types/node": "*" } }, + "node_modules/@types/css-font-loading-module": { + "version": "0.0.12", + "resolved": "https://registry.npmjs.org/@types/css-font-loading-module/-/css-font-loading-module-0.0.12.tgz", + "integrity": "sha512-x2tZZYkSxXqWvTDgveSynfjq/T2HyiZHXb00j/+gy19yp70PHCizM48XFdjBCWH7eHBD0R5i/pw9yMBP/BH5uA==", + "license": "MIT" + }, "node_modules/@types/earcut": { "version": "2.1.4", "resolved": "https://registry.npmjs.org/@types/earcut/-/earcut-2.1.4.tgz", @@ -1662,6 +1263,21 @@ "@xtuc/long": "4.2.2" } }, + "node_modules/@webgpu/types": { + "version": "0.1.43", + "resolved": "https://registry.npmjs.org/@webgpu/types/-/types-0.1.43.tgz", + "integrity": "sha512-HoP+d+m+Kuq8CsE63BZ3+BYBKAemrqbHUNrCalxrUju5XW+q/094Q3oeIa+2pTraEbO8ckJmGpibzyGT4OV4YQ==", + "license": "BSD-3-Clause" + }, + "node_modules/@xmldom/xmldom": { + "version": "0.8.10", + "resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.8.10.tgz", + "integrity": "sha512-2WALfTl4xo2SkGCYRt6rDTFfk9R1czmBvUQy12gK2KuRKIpWEhcbbzy8EZXtz/jkRqHX8bFEc6FC1HjX4TUWYw==", + "license": "MIT", + "engines": { + "node": ">=10.0.0" + } + }, "node_modules/@xtuc/ieee754": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz", @@ -2028,6 +1644,7 @@ "version": "1.0.7", "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz", "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==", + "dev": true, "license": "MIT", "dependencies": { "es-define-property": "^1.0.0", @@ -2389,6 +2006,7 @@ "version": "1.1.4", "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz", "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==", + "dev": true, "license": "MIT", "dependencies": { "es-define-property": "^1.0.0", @@ -2599,6 +2217,7 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz", "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==", + "dev": true, "license": "MIT", "dependencies": { "get-intrinsic": "^1.2.4" @@ -2611,6 +2230,7 @@ "version": "1.3.0", "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz", "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==", + "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -2703,9 +2323,10 @@ } }, "node_modules/eventemitter3": { - "version": "3.1.2", - "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-3.1.2.tgz", - "integrity": "sha512-tvtQIeLVHjDkJYnzf2dgVMxfuSGJeM/7UCG17TT4EumTfNtF+0nebF/4zWOIkCreAbtNqhGEboB6BWrwqNaw4Q==", + "version": "4.0.7", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz", + "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==", + "dev": true, "license": "MIT" }, "node_modules/events": { @@ -2949,6 +2570,7 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==", + "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -2968,6 +2590,7 @@ "version": "1.2.4", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz", "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==", + "dev": true, "license": "MIT", "dependencies": { "es-errors": "^1.3.0", @@ -3008,6 +2631,7 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz", "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==", + "dev": true, "license": "MIT", "dependencies": { "get-intrinsic": "^1.1.3" @@ -3060,6 +2684,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz", "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==", + "dev": true, "license": "MIT", "dependencies": { "es-define-property": "^1.0.0" @@ -3072,6 +2697,7 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz", "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==", + "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -3084,6 +2710,7 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz", "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==", + "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -3096,6 +2723,7 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz", "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==", + "dev": true, "license": "MIT", "dependencies": { "function-bind": "^1.1.2" @@ -3323,13 +2951,6 @@ } } }, - "node_modules/http-proxy/node_modules/eventemitter3": { - "version": "4.0.7", - "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz", - "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==", - "dev": true, - "license": "MIT" - }, "node_modules/human-signals": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-2.1.0.tgz", @@ -3698,12 +3319,6 @@ "node": ">=6" } }, - "node_modules/mini-signals": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/mini-signals/-/mini-signals-1.2.0.tgz", - "integrity": "sha512-alffqMkGCjjTSwvYMVLx+7QeJ6sTuxbXqBkP21my4iWU5+QpTQAJt3h7htA1OKm9F3BpMM0vnu72QIoiJakrLA==", - "license": "MIT" - }, "node_modules/minimalistic-assert": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz", @@ -3825,19 +3440,11 @@ "url": "https://github.com/fb55/nth-check?sponsor=1" } }, - "node_modules/object-assign": { - "version": "4.1.1", - "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", - "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==", - "license": "MIT", - "engines": { - "node": ">=0.10.0" - } - }, "node_modules/object-inspect": { "version": "1.13.2", "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.2.tgz", "integrity": "sha512-IRZSRuzJiynemAXPYtPe5BoI/RESNYR7TYm50MC5Mqbd3Jmw5y790sErYw3V6SryFJD64b74qQQs9wn5Bg/k3g==", + "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -3923,14 +3530,11 @@ "tslib": "^2.0.3" } }, - "node_modules/parse-uri": { - "version": "1.0.9", - "resolved": "https://registry.npmjs.org/parse-uri/-/parse-uri-1.0.9.tgz", - "integrity": "sha512-YZfRHHkEZa6qTfPF/xgZ1ErQYCABfud/Vcqp1Q1GNa7RKwv6Oe0YaxXfQQMnQsGdNTo3fwaT0GbVEX7dMAr7tw==", - "license": "MIT", - "engines": { - "node": ">= 0.10" - } + "node_modules/parse-svg-path": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/parse-svg-path/-/parse-svg-path-0.1.2.tgz", + "integrity": "sha512-JyPSBnkTJ0AI8GGJLfMXvKq42cj5c006fnLz6fXy6zfoVjJizi8BNTpu8on8ziI1cKy9d9DGNuY17Ce7wuejpQ==", + "license": "MIT" }, "node_modules/parseurl": { "version": "1.3.3", @@ -4008,51 +3612,26 @@ } }, "node_modules/pixi.js": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/pixi.js/-/pixi.js-6.0.4.tgz", - "integrity": "sha512-zAlwr5x9xytaflmZiZWl/ZhlSf+lZzeJG+Hexa7Buf7cvEhHPfSITy4NNk0+qnMXKooQidikBmypShDsj2jAdg==", - "license": "MIT", - "dependencies": { - "@pixi/accessibility": "6.0.4", - "@pixi/app": "6.0.4", - "@pixi/compressed-textures": "6.0.4", - "@pixi/constants": "6.0.4", - "@pixi/core": "6.0.4", - "@pixi/display": "6.0.4", - "@pixi/extract": "6.0.4", - "@pixi/filter-alpha": "6.0.4", - "@pixi/filter-blur": "6.0.4", - "@pixi/filter-color-matrix": "6.0.4", - "@pixi/filter-displacement": "6.0.4", - "@pixi/filter-fxaa": "6.0.4", - "@pixi/filter-noise": "6.0.4", - "@pixi/graphics": "6.0.4", - "@pixi/interaction": "6.0.4", - "@pixi/loaders": "6.0.4", - "@pixi/math": "6.0.4", - "@pixi/mesh": "6.0.4", - "@pixi/mesh-extras": "6.0.4", - "@pixi/mixin-cache-as-bitmap": "6.0.4", - "@pixi/mixin-get-child-by-name": "6.0.4", - "@pixi/mixin-get-global-position": "6.0.4", - "@pixi/particles": "6.0.4", - "@pixi/polyfill": "6.0.4", - "@pixi/prepare": "6.0.4", - "@pixi/runner": "6.0.4", - "@pixi/settings": "6.0.4", - "@pixi/sprite": "6.0.4", - "@pixi/sprite-animated": "6.0.4", - "@pixi/sprite-tiling": "6.0.4", - "@pixi/spritesheet": "6.0.4", - "@pixi/text": "6.0.4", - "@pixi/text-bitmap": "6.0.4", - "@pixi/ticker": "6.0.4", - "@pixi/utils": "6.0.4" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/pixijs" - } + "version": "8.2.2", + "resolved": "https://registry.npmjs.org/pixi.js/-/pixi.js-8.2.2.tgz", + "integrity": "sha512-L/EmsJ74bYyFIZoF4RdaU0yOuWGR179/QMLnptCVjRhhhg4tgW7ABs7uvp2Z0psOKvpNanaRF/kIliD8Rm5dVw==", + "dependencies": { + "@pixi/colord": "^2.9.6", + "@types/css-font-loading-module": "^0.0.12", + "@types/earcut": "^2.1.4", + "@webgpu/types": "^0.1.40", + "@xmldom/xmldom": "^0.8.10", + "earcut": "^2.2.4", + "eventemitter3": "^5.0.1", + "ismobilejs": "^1.1.1", + "parse-svg-path": "^0.1.2" + } + }, + "node_modules/pixi.js/node_modules/eventemitter3": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz", + "integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==", + "license": "MIT" }, "node_modules/pretty-error": { "version": "4.0.0", @@ -4072,12 +3651,6 @@ "dev": true, "license": "MIT" }, - "node_modules/promise-polyfill": { - "version": "8.3.0", - "resolved": "https://registry.npmjs.org/promise-polyfill/-/promise-polyfill-8.3.0.tgz", - "integrity": "sha512-H5oELycFml5yto/atYqmjyigJoAo3+OXwolYiH7OfQuYlAqhxNvTfiNMbV9hsC6Yp83yE5r2KTVmtrG6R9i6Pg==", - "license": "MIT" - }, "node_modules/proxy-addr": { "version": "2.0.7", "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz", @@ -4112,21 +3685,6 @@ "node": ">=6" } }, - "node_modules/qs": { - "version": "6.12.3", - "resolved": "https://registry.npmjs.org/qs/-/qs-6.12.3.tgz", - "integrity": "sha512-AWJm14H1vVaO/iNZ4/hO+HyaTehuy9nRqVdkTqlJt0HWvBiBIEXFmb4C0DGeYo3Xes9rrEW+TxHsaigCbN5ICQ==", - "license": "BSD-3-Clause", - "dependencies": { - "side-channel": "^1.0.6" - }, - "engines": { - "node": ">=0.6" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/randombytes": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz", @@ -4284,16 +3842,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/resource-loader": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/resource-loader/-/resource-loader-3.0.1.tgz", - "integrity": "sha512-fBuCRbEHdLCI1eglzQhUv9Rrdcmqkydr1r6uHE2cYHvRBrcLXeSmbE/qI/urFt8rPr/IGxir3BUwM5kUK8XoyA==", - "license": "MIT", - "dependencies": { - "mini-signals": "^1.2.0", - "parse-uri": "^1.0.0" - } - }, "node_modules/retry": { "version": "0.13.1", "resolved": "https://registry.npmjs.org/retry/-/retry-0.13.1.tgz", @@ -4505,6 +4053,7 @@ "version": "1.2.2", "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz", "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==", + "dev": true, "license": "MIT", "dependencies": { "define-data-property": "^1.1.4", @@ -4562,6 +4111,7 @@ "version": "1.0.6", "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz", "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.7", @@ -5041,22 +4591,6 @@ "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==", - "license": "MIT", - "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==", - "license": "MIT" - }, "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 2b145e1..37266cf 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "slot-game", - "version": "1.4.0", + "version": "1.5.0", "private": true, "license": "MIT", "scripts": { @@ -10,7 +10,7 @@ }, "dependencies": { "@types/node": "20.14.10", - "pixi.js": "6.0.4", + "pixi.js": "8.2.2", "ts-node": "10.9.2" }, "devDependencies": { diff --git a/src/core/Background.ts b/src/core/Background.ts index 16044cc..7d29709 100644 --- a/src/core/Background.ts +++ b/src/core/Background.ts @@ -1,11 +1,11 @@ -import { Container, Loader, Sprite, Texture } from "pixi.js"; +import { Assets, Container, Sprite, Texture } from "pixi.js"; export default class Background { public readonly sprite: Container; private readonly texture: Texture; - constructor(loader: Loader) { - this.texture = loader.resources.atlas.textures!['BG.png']; + constructor() { + this.texture = Assets.get("atlas").textures["BG.png"]; this.sprite = new Sprite(this.texture); } } diff --git a/src/core/Game.ts b/src/core/Game.ts index ee07e2c..5b9e9bc 100644 --- a/src/core/Game.ts +++ b/src/core/Game.ts @@ -1,25 +1,28 @@ -import Loader from './Loader'; -import PlayButton from './PlayButton'; -import Background from './Background'; -import ReelsContainer from './ReelsContainer'; -import Scoreboard from './Scoreboard'; -import VictoryScreen from './VictoryScreen'; -import { Application } from 'pixi.js'; +import Loader from "./Loader"; +import PlayButton from "./PlayButton"; +import Background from "./Background"; +import ReelsContainer from "./ReelsContainer"; +import Scoreboard from "./Scoreboard"; +import VictoryScreen from "./VictoryScreen"; +import { Application } from "pixi.js"; export default class Game { public app: Application; + private loader: Loader; private playBtn: PlayButton; private reelsContainer: ReelsContainer; private scoreboard: Scoreboard; private victoryScreen: VictoryScreen; constructor() { - this.app = new Application({ width: 960, height: 536 }); - window.document.body.appendChild(this.app.view); - new Loader(this.app, this.init.bind(this)); + this.app = new Application(); } - private init() { + public async init() { + await this.app.init({ width: 960, height: 536 }); + this.loader = new Loader(this.app); + window.document.body.appendChild(this.app.canvas); + await this.loader.loadAssets(); this.createScene(); this.createPlayButton(); this.createReels(); @@ -28,7 +31,7 @@ export default class Game { } private createScene() { - const bg = new Background(this.app.loader); + const bg = new Background(); this.app.stage.addChild(bg.sprite); } diff --git a/src/core/Loader.ts b/src/core/Loader.ts index 6c34fce..a5e2967 100644 --- a/src/core/Loader.ts +++ b/src/core/Loader.ts @@ -1,34 +1,39 @@ -import { Application, Loader as PixiLoader, Text, TextStyle } from "pixi.js" +import { Application, Assets, Text, TextStyle } from "pixi.js" export default class Loader { - public loader: PixiLoader; private loadingScreen: Text; + private app: Application; - constructor(app: Application, onAssetsLoaded: () => void) { - this.loader = app.loader; - this.loadAssets(); - this.loader.load(() => { - app.stage.removeChild(this.loadingScreen); - onAssetsLoaded(); - }); - this.generateLoadingScreen(app.screen.width, app.screen.height); - app.stage.addChild(this.loadingScreen); + constructor(app: Application) { + this.app = app; + this.loadingScreen = this.createLoadingScreen(app.screen.width, app.screen.height); + } + + public showLoadingScreen() { + this.app.stage.addChild(this.loadingScreen); + } + + public hideLoadingScreen() { + this.app.stage.removeChild(this.loadingScreen); } - private loadAssets() { - this.loader.add('atlas', './assets/atlas.json'); + public async loadAssets() { + this.showLoadingScreen(); + Assets.add({ alias: "atlas", src: "./assets/atlas.json" }); + await Assets.load(["atlas"]); + this.hideLoadingScreen(); } - private generateLoadingScreen(appWidth: number, appHeight: number) { + private createLoadingScreen(appWidth: number, appHeight: number): Text { const style = new TextStyle({ - fontFamily: 'Arial', + fontFamily: "Arial", fontSize: 36, - fontWeight: 'bold', - fill: '#ffffff', + fontWeight: "bold", + fill: "#ffffff", }); - const playText = new Text('Loading...', style); + const playText = new Text({ text: "Loading...", style }); playText.x = (appWidth - playText.width) / 2; playText.y = (appHeight - playText.height) / 2; - this.loadingScreen = playText; + return playText; } } diff --git a/src/core/PlayButton.ts b/src/core/PlayButton.ts index 294d1d3..c8b8946 100644 --- a/src/core/PlayButton.ts +++ b/src/core/PlayButton.ts @@ -1,4 +1,4 @@ -import { Application, Sprite, Texture } from "pixi.js"; +import { Application, Assets, Sprite, Texture } from "pixi.js"; export default class PlayButton { public readonly sprite: Sprite; @@ -8,8 +8,8 @@ export default class PlayButton { constructor(app: Application, onClick: () => void) { this.onClick = onClick; - this.activeTexture = app.loader.resources.atlas.textures!['BTN_Spin.png']; - this.disabledTexture = app.loader.resources.atlas.textures!['BTN_Spin_d.png']; + this.activeTexture = Assets.get("atlas").textures["BTN_Spin.png"]; + this.disabledTexture = Assets.get("atlas").textures["BTN_Spin_d.png"]; this.sprite = new Sprite(this.activeTexture); this.init(app.screen.width, app.screen.height); } @@ -28,7 +28,7 @@ export default class PlayButton { this.sprite.x = appWidth - (this.sprite.width + 37.25); this.sprite.y = (appHeight - this.sprite.height) / 2; this.sprite.interactive = true; - this.sprite.buttonMode = true; - this.sprite.addListener('pointerdown', this.onClick); + this.sprite.eventMode = "static"; + this.sprite.addListener("pointerdown", this.onClick); } } diff --git a/src/core/Reel.ts b/src/core/Reel.ts index bf7b19e..d74fa62 100644 --- a/src/core/Reel.ts +++ b/src/core/Reel.ts @@ -1,4 +1,4 @@ -import { Application, Container, Sprite, Texture, Ticker } from "pixi.js"; +import { Application, Assets, Container, Sprite, Texture, Ticker } from "pixi.js"; export default class Reel { public readonly container: Container; @@ -11,13 +11,14 @@ export default class Reel { this.appHeight = app.screen.height; this.ticker = app.ticker; this.container = new Container(); + const atlas = Assets.get("atlas"); this.textures = [ - app.loader.resources.atlas!.textures!['SYM1.png'], - app.loader.resources.atlas!.textures!['SYM2.png'], - app.loader.resources.atlas!.textures!['SYM3.png'], - app.loader.resources.atlas!.textures!['SYM4.png'], - app.loader.resources.atlas!.textures!['SYM5.png'], - app.loader.resources.atlas!.textures!['SYM6.png'], + atlas.textures["SYM1.png"], + atlas.textures["SYM2.png"], + atlas.textures["SYM3.png"], + atlas.textures["SYM4.png"], + atlas.textures["SYM5.png"], + atlas.textures["SYM6.png"], ]; this.generate(position); } diff --git a/src/core/ReelsContainer.ts b/src/core/ReelsContainer.ts index 988e1dd..ce4e6d5 100644 --- a/src/core/ReelsContainer.ts +++ b/src/core/ReelsContainer.ts @@ -1,5 +1,5 @@ -import { Application, Container, Sprite } from 'pixi.js'; -import Reel from './Reel'; +import { Application, Container, Sprite } from "pixi.js"; +import Reel from "./Reel"; export default class ReelsContainer { public readonly reels: Array = []; @@ -26,7 +26,7 @@ export default class ReelsContainer { const start = Date.now(); const reelsToSpin = [...this.reels]; - for await (let value of this.infiniteSpinning(reelsToSpin)) { + for await (let _ of this.infiniteSpinning(reelsToSpin)) { const shiftingWaitTime = (this.reels.length - reelsToSpin.length + 1) * shiftingDelay; if (Date.now() >= start + shiftingWaitTime) { @@ -51,12 +51,12 @@ export default class ReelsContainer { } private checkForWin(symbols: Array): boolean { - // Set of strings: 'SYM1', 'SYM2', ... + // Set of strings: "SYM1", "SYM2", ... // const combination: Set = new Set(); - symbols.forEach(symbol => combination.add(symbol.texture.textureCacheIds[0].split('.')[0])); - if (combination.size === 1 && !combination.has('SYM1')) return true; - return combination.size === 2 && combination.has('SYM1'); + symbols.forEach(symbol => combination.add(symbol.texture.label!.split(".")[0])); + if (combination.size === 1 && !combination.has("SYM1")) return true; + return combination.size === 2 && combination.has("SYM1"); } private blessRNG() { diff --git a/src/core/Scoreboard.ts b/src/core/Scoreboard.ts index 0979c46..2e115b6 100644 --- a/src/core/Scoreboard.ts +++ b/src/core/Scoreboard.ts @@ -34,27 +34,26 @@ export default class Scoreboard { private generate(appWidth: number, appHeight: number) { const style = new TextStyle({ - fontFamily: 'Arial', + fontFamily: "Arial", fontSize: 24, - fill: 'yellow', + fill: "yellow", }); - this.moneyText = new Text(`money: $${this.money}`, style); + this.moneyText = new Text({ text: `money: $${this.money}`, style }); this.moneyText.y = 5; - const betText = new Text(`bet: $${this.bet}`, style); + const betText = new Text({ text: `bet: $${this.bet}`, style }); betText.y = this.moneyText.height + 10; - this.winAmountText = new Text(`win: $${this.winAmount}`, style); + this.winAmountText = new Text({ text: `win: $${this.winAmount}`, style }); this.winAmountText.y = betText.y + betText.height + 5; betText.x = this.moneyText.x = this.winAmountText.x = 10; - const rect = new Graphics(); - rect.beginFill(0x02474E, 0.8); const rectHeight = this.moneyText.height + betText.height + this.winAmountText.height + 25; - rect.drawRect(0, 0, 160, rectHeight); - rect.endFill(); + const rect = new Graphics() + .rect(0, 0, 160, rectHeight) + .fill({ color: 0x02474E, alpha: 0.8 }); this.container.x = appWidth - rect.width - 7; this.container.y = appHeight / 2 + 70; diff --git a/src/core/VictoryScreen.ts b/src/core/VictoryScreen.ts index e1b10b7..3fcc4bf 100644 --- a/src/core/VictoryScreen.ts +++ b/src/core/VictoryScreen.ts @@ -16,7 +16,7 @@ export default class VictoryScreen { window.clearTimeout(id); this.hide(); }; - this.overlay.addListener('pointerdown', handler.bind(this)); + this.overlay.addListener("pointerdown", handler.bind(this)); } hide() { @@ -26,28 +26,27 @@ export default class VictoryScreen { private generate(appWidth: number, appHeight: number) { this.container.visible = false; - this.overlay = new Graphics(); - this.overlay.beginFill(0xFFFFFF, 0.001); - this.overlay.drawRect(0, 0, appWidth, appHeight); - this.overlay.endFill(); + this.overlay = new Graphics() + .rect(0, 0, appWidth, appHeight) + .fill({ color: 0xffffff, alpha: 0.001 }); + this.overlay.interactive = true; - this.overlay.buttonMode = true; - this.overlay.cursor = 'default'; + this.overlay.eventMode = "static"; + this.overlay.cursor = "default"; - const rect = new Graphics(); - rect.beginFill(0x02474E, 0.8); - rect.drawRect(0, 0, 717.5, 400); + const rect = new Graphics() + .rect(0, 0, 717.5, 400) + .fill({ color: 0x02474E, alpha: 0.8 }); rect.x = 70; rect.y = (appHeight - rect.height) / 2; - rect.endFill(); const style = new TextStyle({ - fontFamily: 'Arial', + fontFamily: "Arial", fontSize: 96, - fill: 'yellow', + fill: "yellow", }); - const text = new Text('YOU WON!', style); + const text = new Text({ text: "YOU WON!", style }); text.x = 70 + (rect.width - text.width) / 2; text.y = (appHeight - text.height) / 2; diff --git a/src/global.d.ts b/src/global.d.ts new file mode 100644 index 0000000..1fe78e4 --- /dev/null +++ b/src/global.d.ts @@ -0,0 +1,9 @@ +import Game from "./core/Game"; + +declare global { + interface Window { + game: Game; + } +} + +export {}; diff --git a/src/index.ts b/src/index.ts index c99a89e..5972a17 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,3 +1,5 @@ -import Game from './core/Game'; +import Game from "./core/Game"; -new Game(); +const game = new Game(); +game.init(); +window.game = game;