diff --git a/app/react-components/devtools/tiles.jsx b/app/react-components/devtools/tiles.jsx index a81dbc1..3b9db65 100644 --- a/app/react-components/devtools/tiles.jsx +++ b/app/react-components/devtools/tiles.jsx @@ -11,6 +11,7 @@ export default function Tiles({eventsChannel}) { const wrapperRef = useRef(); const imageRef = useRef(); const imageRect = useRect(imageRef); + const [indices, setIndices] = useState([]); const [selection, setSelection] = useState({x: 0, y: 0, w: 1, h: 1}); const [moveStart, setMoveStart] = useState(); const [layer, setLayer] = useState(0); @@ -35,17 +36,19 @@ export default function Tiles({eventsChannel}) { if (at.x < 0 || at.y < 0 || at.x >= area.x || at.y >= area.y) { return; } - const payload = { - brush, - layer, - stamp: { - at, - data: stamp, - }, - } client.send({ type: 'AdminAction', - payload: {type: 'paint', value: payload}, + payload: { + type: 'paint', + value: { + brush, + layer, + stamp: { + at, + data: stamp, + }, + }, + }, }); } eventsChannel.addListener('click', onClick); @@ -64,6 +67,7 @@ export default function Tiles({eventsChannel}) { const {sourceJson, tileSize} = TileLayers.layer(0); const {w, h} = sourceJson.meta.size; const factor = (imageRect?.width ?? 1) / w; + const wt = w / tileSize.x; return (
+ Sel:
+ {' {'}
+ {selection.x}{', '}
+ {selection.y}{', '}
+ {selection.w}{', '}
+ {selection.h}
+ {'}'}
+
+
+ Idx:
+ {' ['}
+ {indices.join(', ')}
+ {']'}
+
+