24 lines
880 B
TypeScript
24 lines
880 B
TypeScript
import { observer } from 'mobx-react-lite';
|
|
import type { ResourceDrop } from '../game/types';
|
|
import { LOG_SPRITE, MEAT_SPRITE, TWIG_SPRITE } from '../game/sprites';
|
|
import PixelSprite from './PixelSprite';
|
|
|
|
const DROP_SPRITES = { log: LOG_SPRITE, twig: TWIG_SPRITE, meat: MEAT_SPRITE };
|
|
const DROP_SIZES = { log: 20, twig: 18, meat: 18 };
|
|
|
|
const ResourceDropEntity = observer(function ResourceDropEntity({ drop }: { drop: ResourceDrop }) {
|
|
return (
|
|
<div>
|
|
<div className={`entity ${drop.resource}-shadow`} style={{ left: drop.x, top: drop.y }} />
|
|
<div
|
|
className={`entity ${drop.resource}`}
|
|
style={{ left: drop.x, top: drop.y - drop.z, zIndex: Math.floor(drop.y - drop.z) }}
|
|
>
|
|
<PixelSprite pixels={DROP_SPRITES[drop.resource]} size={DROP_SIZES[drop.resource]} />
|
|
</div>
|
|
</div>
|
|
);
|
|
});
|
|
|
|
export default ResourceDropEntity;
|