fix: outer frame
This commit is contained in:
parent
02acecfb5c
commit
73c6d991a7
|
@ -1,30 +1,61 @@
|
|||
import {RenderTexture} from '@pixi/core';
|
||||
import {Container} from '@pixi/display';
|
||||
import {Graphics} from '@pixi/graphics';
|
||||
import {PixiComponent, useApp} from '@pixi/react';
|
||||
import {Sprite} from '@pixi/sprite';
|
||||
import '@pixi/spritesheet'; // NECESSARY!
|
||||
import {CompositeTilemap} from '@pixi/tilemap';
|
||||
|
||||
import {useAsset} from '@/react/context/assets.js';
|
||||
import {CHUNK_SIZE} from '@/util/constants.js';
|
||||
import {CHUNK_SIZE, RESOLUTION} from '@/util/constants.js';
|
||||
|
||||
import {deferredLighting} from './lights.js';
|
||||
|
||||
const TileLayerInternal = PixiComponent('TileLayer', {
|
||||
create: ({group, tileLayer}) => {
|
||||
const container = new Container();
|
||||
const cy = Math.ceil(tileLayer.area.y / CHUNK_SIZE);
|
||||
const cx = Math.ceil(tileLayer.area.x / CHUNK_SIZE);
|
||||
const {area, tileSize} = tileLayer;
|
||||
const g = new Graphics();
|
||||
g.beginFill(group === deferredLighting.diffuseGroup ? 0x000000 : 0x7777ff);
|
||||
// outer frame
|
||||
g.drawRect(
|
||||
-RESOLUTION.x / 2,
|
||||
-RESOLUTION.y / 2,
|
||||
area.x * tileSize.x + RESOLUTION.x,
|
||||
RESOLUTION.y / 2,
|
||||
);
|
||||
g.drawRect(
|
||||
-RESOLUTION.x / 2,
|
||||
-RESOLUTION.y / 2,
|
||||
RESOLUTION.x / 2,
|
||||
area.y * tileSize.y + RESOLUTION.y,
|
||||
);
|
||||
g.drawRect(
|
||||
area.x * tileSize.x,
|
||||
0,
|
||||
RESOLUTION.x / 2,
|
||||
area.y * tileSize.y,
|
||||
);
|
||||
g.drawRect(
|
||||
0,
|
||||
area.y * tileSize.y,
|
||||
area.x * tileSize.x,
|
||||
RESOLUTION.y / 2,
|
||||
);
|
||||
g.parentGroup = group;
|
||||
container.addChild(g);
|
||||
const cy = Math.ceil(area.y / CHUNK_SIZE);
|
||||
const cx = Math.ceil(area.x / CHUNK_SIZE);
|
||||
for (let iy = 0; iy < cy; ++iy) {
|
||||
for (let ix = 0; ix < cx; ++ix) {
|
||||
const tilemap = new CompositeTilemap();
|
||||
const renderTexture = RenderTexture.create({
|
||||
width: tileLayer.tileSize.x * CHUNK_SIZE,
|
||||
height: tileLayer.tileSize.y * CHUNK_SIZE,
|
||||
width: tileSize.x * CHUNK_SIZE,
|
||||
height: tileSize.y * CHUNK_SIZE,
|
||||
});
|
||||
const sprite = new Sprite(renderTexture);
|
||||
sprite.x = tileLayer.tileSize.x * CHUNK_SIZE * ix;
|
||||
sprite.y = tileLayer.tileSize.y * CHUNK_SIZE * iy;
|
||||
sprite.x = tileSize.x * CHUNK_SIZE * ix;
|
||||
sprite.y = tileSize.y * CHUNK_SIZE * iy;
|
||||
sprite.parentGroup = group;
|
||||
sprite.tilemap = tilemap;
|
||||
container.addChild(sprite);
|
||||
|
@ -41,7 +72,7 @@ const TileLayerInternal = PixiComponent('TileLayer', {
|
|||
}
|
||||
for (const i in tileLayer.$$chunks) {
|
||||
if (!oldTileLayer || oldTileLayer.$$chunks[i] !== tileLayer.$$chunks[i]) {
|
||||
const {texture, tilemap} = container.children[i];
|
||||
const {texture, tilemap} = container.children[parseInt(i) + 1];
|
||||
tilemap.clear();
|
||||
const ax = Math.ceil(tileLayer.area.x / CHUNK_SIZE);
|
||||
const cy = Math.floor(i / ax);
|
||||
|
|
Loading…
Reference in New Issue
Block a user