pages235/src/react/ModuleSignsViewer.tsx

69 lines
2.3 KiB
TypeScript

import { useEffect, useRef, useState } from 'react'
import { WorldRendererThree } from 'renderer/viewer/lib/worldrendererThree'
import FullScreenWidget from './FullScreenWidget'
export const name = 'loaded world signs'
export default () => {
const [selected, setSelected] = useState([] as string[])
const allSignsPos = [] as string[]
const signs = viewer.world instanceof WorldRendererThree ? [...viewer.world.chunkTextures.values()].flatMap(textures => {
return Object.entries(textures).map(([signPosKey, texture]) => {
allSignsPos.push(signPosKey)
const pos = signPosKey.split(',').map(Number)
const isSelected = selected.includes(signPosKey)
return <div key={signPosKey}>
<div style={{ color: 'white', userSelect: 'text', fontSize: 8, }}>{pos.join(', ')}</div>
<div
style={{ background: isSelected ? 'rgba(255, 255, 255, 0.8)' : 'rgba(255, 255, 255, 0.5)', padding: 5, borderRadius: 5, cursor: 'pointer' }}
onClick={() => setSelected(selected.includes(signPosKey) ? selected.filter(x => x !== signPosKey) : [...selected, signPosKey])}>
<AddElem elem={texture.image} />
</div>
</div>
})
}) : []
return <FullScreenWidget name={name} title='Loaded Signs'>
<div>
{signs.length} signs currently in the scene:
</div>
<div
style={{ cursor: 'pointer', }} onClick={() => {
// toggle all
if (selected.length === allSignsPos.length) {
setSelected([])
return
}
setSelected([...allSignsPos])
}}>Select All</div>
{selected.length && <div
style={{ cursor: 'pointer', }} onClick={() => {
void navigator.clipboard.writeText(selected.join('\n'))
}}>Copy Selected Signs</div>}
{signs}
</FullScreenWidget>
}
const AddElem = ({ elem }) => {
const ref = useRef<HTMLDivElement>(null)
useEffect(() => {
elem.style.width = '100%'
elem.style.height = '100%'
ref.current!.appendChild(elem)
return () => {
elem.remove()
}
}, [])
return <div
ref={ref} style={{
height: '35px',
}} />
}
// for (const key of Object.keys(viewer.world.sectionObjects)) {
// const section = viewer.world.sectionObjects[key]
// for (const child of section.children) {
// if (child.name === 'mesh') child.visible = false
// }
// }