diff --git a/client/package.json b/client/package.json index 94cfd950d..dc6dc4f48 100644 --- a/client/package.json +++ b/client/package.json @@ -21,7 +21,7 @@ "mitt": "^3.0.1", "moment": "^2.29.1", "pixi-viewport": "6.0.3", - "pixi.js": "8.6.3", + "pixi.js": "8.6.6", "random-seed": "^0.3.0", "socket.io-client": "2.5.0", "uuid": "^10.0.0", diff --git a/client/src/game/animation.ts b/client/src/game/animation.ts index f856f239e..5c6dd1a02 100644 --- a/client/src/game/animation.ts +++ b/client/src/game/animation.ts @@ -1,17 +1,20 @@ -import * as PIXI from 'pixi.js' +import type { Location } from '@solaris-common'; +import {Application, Ticker, Container, Graphics} from 'pixi.js'; class AnimationService { - drawSelectedCircle (app, container, location) { + drawSelectedCircle (app: Application, container: Container, location: Location) { // It ain't pretty, but it works. - let graphics = new PIXI.Graphics() + let graphics = new Graphics() let radius = 1 - const animation = (delta) => { + const animation = (ticker: Ticker) => { if (graphics.alpha <= 0) { return } + const delta = ticker.deltaTime; + graphics.clear() radius = radius + delta diff --git a/client/src/game/star.ts b/client/src/game/star.ts index 1f78be06b..3ed88ec8f 100644 --- a/client/src/game/star.ts +++ b/client/src/game/star.ts @@ -1,4 +1,4 @@ -import {Application, BitmapText, Circle, Container, Graphics, Sprite, TextStyle} from 'pixi.js'; +import {Application, BitmapText, Circle, Container, Graphics, Sprite} from 'pixi.js'; import TextureService from './texture' import gameHelper from '../services/gameHelper.js' import seededRandom from 'random-seed' diff --git a/client/src/game/territories.ts b/client/src/game/territories.ts index 76c5e9eee..6609c6b18 100644 --- a/client/src/game/territories.ts +++ b/client/src/game/territories.ts @@ -288,7 +288,8 @@ export class Territories { territoryLines.stroke({ width: LINE_WIDTH, color, - alpha: 1 + alpha: 1, + cap: 'round', }) } } diff --git a/client/src/game/texture.ts b/client/src/game/texture.ts index 3fbc689fe..f38162025 100644 --- a/client/src/game/texture.ts +++ b/client/src/game/texture.ts @@ -91,6 +91,15 @@ const SPECIALIST_TEXTURES = [ 'bolter-gun' ]; +const loadTextureAsset = (url: string) => { + return Assets.load({ + src: url, + data: { + autoGenerateMipmaps: true + } + }); +} + class TextureService { static WARP_GATE_INDEX = 1 @@ -114,13 +123,13 @@ class TextureService { await Promise.all(Object.keys(TEXTURE_URLS).map(spec => { const val = TEXTURE_URLS[spec]; if (Array.isArray(val)) { - return Promise.all(val.map(url => Assets.load(url))); + return Promise.all(val.map(url => loadTextureAsset(url))); } else if (typeof val === 'string') { - return Assets.load(val); + return loadTextureAsset(val); } })); - await Promise.all(SPECIALIST_TEXTURES.map(specTex => Assets.load(new URL(`../assets/specialists/${specTex}.svg`, import.meta.url).href))); + await Promise.all(SPECIALIST_TEXTURES.map(specTex => loadTextureAsset(new URL(`../assets/specialists/${specTex}.svg`, import.meta.url).href))); } initialize() { @@ -134,18 +143,19 @@ class TextureService { padding: 3 }) - BitmapFont.install({ - name: 'chakrapetch', - style: this.DEFAULT_FONT_STYLE - }); - this.DEFAULT_FONT_STYLE_BOLD = new TextStyle({ fontFamily: `Chakra Petch,sans-serif;`, fill: 0xFFFFFF, - fontWeight: "bold", + fontWeight: 'bold', padding: 3 }) + BitmapFont.install({ + name: 'chakrapetch', + style: this.DEFAULT_FONT_STYLE, + resolution: 4, + }); + this.STAR_TEXTURE = Texture.from(TEXTURE_URLS.STAR) // STARLESS NEBULAS diff --git a/package-lock.json b/package-lock.json index 74b22dcfe..44abb7241 100644 --- a/package-lock.json +++ b/package-lock.json @@ -27,7 +27,7 @@ "mitt": "^3.0.1", "moment": "^2.29.1", "pixi-viewport": "6.0.3", - "pixi.js": "8.6.3", + "pixi.js": "8.6.6", "random-seed": "^0.3.0", "socket.io-client": "2.5.0", "uuid": "^10.0.0", @@ -3057,8 +3057,9 @@ } }, "node_modules/pixi.js": { - "version": "8.6.3", - "license": "MIT", + "version": "8.6.6", + "resolved": "https://registry.npmjs.org/pixi.js/-/pixi.js-8.6.6.tgz", + "integrity": "sha512-o5pw7G2yuIrnBx0G4npBlmFp+XGNcapI/Ufs62rRj/4XKxc1Zo74YJr/BtEXcXTraTKd+pQvYOLvnfxRjxBMvQ==", "dependencies": { "@pixi/colord": "^2.9.6", "@types/css-font-loading-module": "^0.0.12",