trafficlunar/blockmatic
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor: remove solid textures

Browse source
This commit is contained in:
trafficlunar 2025-01-21 19:58:56 +00:00
parent dae3a88734
commit f3441d8033
3 changed files with 6 additions and 51 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/components/canvas/Blocks.tsx
View file

@ -9,7 +9,6 @@ interface Props {
blocks: Block[];
missingTexture: PIXI.Texture | undefined;
textures: Record<string, PIXI.Texture>;
solidTextures: Record<string, PIXI.Texture>;
coords: Position;
scale: number;
version: number;
@ -18,7 +17,7 @@ interface Props {
// Lifts 16,000 tiles limit
settings.use32bitIndex = true;
function Blocks({ blocks, missingTexture, textures, solidTextures, coords, scale, version }: Props) {
function Blocks({ blocks, missingTexture, textures, coords, scale, version }: Props) {
const app = useApp();
const tilemapRef = useRef<CompositeTilemap>();
@ -28,15 +27,9 @@ function Blocks({ blocks, missingTexture, textures, solidTextures, coords, scale
tilemap.clear();
// Tile solid colors at smaller scales
if (scale >= 0.4) {
blocks.forEach((block) => {
tilemap.tile(textures[block.name] ?? missingTexture, block.x * 16, block.y * 16);
});
} else {
blocks.forEach((block) => {
tilemap.tile(solidTextures[`${block.name}`] ?? missingTexture, block.x * 16, block.y * 16);
});
}
blocks.forEach((block) => {
tilemap.tile(textures[block.name] ?? missingTexture, block.x * 16, block.y * 16);
});
};
useEffect(() => {

12
src/components/canvas/Canvas.tsx
View file

@ -28,7 +28,7 @@ PIXI.settings.SCALE_MODE = PIXI.SCALE_MODES.NEAREST;
function Canvas() {
const { stageSize, canvasSize, blocks, coords, scale, version, setStageSize, setBlocks, setCoords, setScale } = useContext(CanvasContext);
const { settings } = useContext(SettingsContext);
const { missingTexture, solidTextures } = useContext(TexturesContext);
const { missingTexture } = useContext(TexturesContext);
const { isDark } = useContext(ThemeContext);
const { tool, radius, selectedBlock, selectionCoords, cssCursor, setTool, setSelectedBlock, setSelectionCoords, setCssCursor } =
useContext(ToolContext);
@ -487,15 +487,7 @@ function Canvas() {
onClick={onClick}
options={{ backgroundAlpha: 0 }}
>
<Blocks
blocks={visibleBlocks}
missingTexture={missingTexture}
textures={textures}
solidTextures={solidTextures}
coords={coords}
scale={scale}
version={version}
/>
<Blocks blocks={visibleBlocks} missingTexture={missingTexture} textures={textures} coords={coords} scale={scale} version={version} />
<Container x={coords.x} y={coords.y} scale={scale}>
{settings.canvasBorder && <CanvasBorder canvasSize={canvasSize} isDark={isDark} />}

30
src/context/Textures.tsx
View file

@ -6,14 +6,10 @@ import { LoadingContext } from "./Loading";
import spritesheet from "@/data/blocks/spritesheet.json";
import programmerArtSpritesheet from "@/data/blocks/programmer-art/spritesheet.json";
import _blockData from "@/data/blocks/data.json";
const blockData: BlockData = _blockData;
interface Context {
missingTexture: PIXI.Texture;
textures: Record<string, PIXI.Texture>;
programmerArtTextures: Record<string, PIXI.Texture>;
solidTextures: Record<string, PIXI.Texture>;
}
interface Props {
@ -35,7 +31,6 @@ export const TexturesProvider = ({ children }: Props) => {
);
const texturesRef = useRef<Record<string, PIXI.Texture>>({});
const programmerArtTexturesRef = useRef<Record<string, PIXI.Texture>>({});
const solidTexturesRef = useRef<Record<string, PIXI.Texture>>({});
// Load textures
useEffect(() => {
@ -52,30 +47,6 @@ export const TexturesProvider = ({ children }: Props) => {
programmerArtSheet.parse().then((t) => {
programmerArtTexturesRef.current = { ...t, "air.png": airTexture };
});
// Load solid textures
const solidTexturesCollection: Record<string, PIXI.Texture> = {};
const canvas = document.createElement("canvas");
canvas.width = 16;
canvas.height = 16;
const ctx = canvas.getContext("2d");
if (!ctx) return;
Object.entries(blockData).forEach(([blockName, data]) => {
ctx.fillStyle = `rgb(${data.color[0]}, ${data.color[1]}, ${data.color[2]}, ${data.color[3]})`;
ctx.fillRect(0, 0, canvas.width, canvas.height);
const image = new Image();
image.src = canvas.toDataURL();
const baseTexture = new PIXI.BaseTexture(image);
const texture = new PIXI.Texture(baseTexture);
solidTexturesCollection[blockName] = texture;
});
solidTexturesRef.current = solidTexturesCollection;
setLoading(false);
}, []);
@ -85,7 +56,6 @@ export const TexturesProvider = ({ children }: Props) => {
missingTexture: missingTextureRef.current,
textures: texturesRef.current,
programmerArtTextures: programmerArtTexturesRef.current,
solidTextures: solidTexturesRef.current,
}}
>
{children}