mirror of
https://github.com/misode/misode.github.io.git
synced 2026-04-23 07:10:41 +00:00
80 lines
3.1 KiB
TypeScript
80 lines
3.1 KiB
TypeScript
import { DataModel } from '@mcschema/core'
|
|
import { LegacyRandom, Structure, StructureRenderer } from 'deepslate'
|
|
import { BlockPos } from 'deepslate-1.18.2'
|
|
import type { mat4 } from 'gl-matrix'
|
|
import { useCallback, useMemo, useRef, useState } from 'preact/hooks'
|
|
import { randomSeed } from '../../Utils.js'
|
|
import { useLocale } from '../../contexts/index.js'
|
|
import { useAsync } from '../../hooks/useAsync.js'
|
|
import { AsyncCancel } from '../../hooks/useAsyncFn.js'
|
|
import { getResources } from '../../services/Resources.js'
|
|
import { Btn } from '../Btn.jsx'
|
|
import type { FeatureContext } from './Feature.js'
|
|
import { placeFeature } from './Feature.js'
|
|
import { InteractiveCanvas3D } from './InteractiveCanvas3D.jsx'
|
|
import { nextGaussian } from './WorldgenUtils.jsx'
|
|
import type { PreviewProps } from './index.js'
|
|
|
|
const MAX_SIZE = 45
|
|
|
|
export const FeaturePreview = ({ data, version, shown }: PreviewProps) => {
|
|
const { locale } = useLocale()
|
|
const [seed, setSeed] = useState(randomSeed())
|
|
const serializedData = JSON.stringify(data)
|
|
|
|
const { value: resources } = useAsync(async () => {
|
|
if (!shown) return AsyncCancel
|
|
return await getResources(version)
|
|
}, [shown, version, serializedData])
|
|
|
|
const { structure } = useMemo(() => {
|
|
const structure = new Structure([MAX_SIZE, MAX_SIZE, MAX_SIZE])
|
|
const random = new LegacyRandom(seed)
|
|
const placeOffset = Math.floor((MAX_SIZE - 1) / 2)
|
|
const context: FeatureContext = {
|
|
version: version,
|
|
random,
|
|
place: (pos, block) => {
|
|
const structurePos = BlockPos.offset(pos, placeOffset, placeOffset, placeOffset)
|
|
if (structurePos.some((v, i) => v < 0 || v >= structure.getSize()[i])) return
|
|
const name = typeof block === 'string' ? block : block.getName()
|
|
const properties = typeof block === 'string' ? undefined : block.getProperties()
|
|
structure.addBlock(structurePos, name, properties)
|
|
},
|
|
nextFloat: () => random.nextFloat(),
|
|
nextInt: (max: number) => random.nextInt(max),
|
|
nextGaussian: nextGaussian(random),
|
|
}
|
|
placeFeature(DataModel.unwrapLists(data), context)
|
|
return { structure }
|
|
}, [serializedData, version, seed])
|
|
|
|
const renderer = useRef<StructureRenderer | undefined>(undefined)
|
|
|
|
const onSetup = useCallback((canvas: HTMLCanvasElement) => {
|
|
if (renderer.current) {
|
|
renderer.current.setStructure(structure)
|
|
return
|
|
}
|
|
if (!resources || !shown) return
|
|
const gl = canvas.getContext('webgl')
|
|
if (!gl) return
|
|
renderer.current = new StructureRenderer(gl, structure, resources, { useInvisibleBlockBuffer: false })
|
|
}, [resources, shown, structure])
|
|
const onResize = useCallback((width: number, height: number) => {
|
|
renderer.current?.setViewport(0, 0, width, height)
|
|
}, [resources])
|
|
const onDraw = useCallback((transform: mat4) => {
|
|
renderer.current?.drawStructure(transform)
|
|
}, [])
|
|
|
|
return <>
|
|
<div class="controls preview-controls">
|
|
<Btn icon="sync" tooltip={locale('generate_new_seed')} onClick={() => setSeed(randomSeed())} />
|
|
</div>
|
|
<div class="full-preview">
|
|
<InteractiveCanvas3D onSetup={onSetup} onDraw={onDraw} onResize={onResize} startDistance={10} startPosition={[MAX_SIZE/2, MAX_SIZE/2, MAX_SIZE/2]} startYRotation={2.6} />
|
|
</div>
|
|
</>
|
|
}
|