mirror of
https://github.com/billsonnn/nitro-react.git
synced 2024-10-24 19:53:05 +02:00
61 lines
2.1 KiB
TypeScript
61 lines
2.1 KiB
TypeScript
|
import { IGetImageListener, ImageResult, TextureUtils, Vector3d } from 'nitro-renderer';
|
||
|
import { RenderTexture } from 'pixi.js';
|
||
|
import { FC, useCallback, useEffect, useState } from 'react';
|
||
|
import { GetRoomEngine } from '../../api';
|
||
|
import { ProductTypeEnum } from '../catalog/enums/ProductTypeEnum';
|
||
|
import { FurniImageViewProps } from './FurniImageView.types';
|
||
|
|
||
|
export const FurniImageView: FC<FurniImageViewProps> = props =>
|
||
|
{
|
||
|
const { type = 's', spriteId = -1, direction = 0, extras = '', scale = 1 } = props;
|
||
|
const [ imageElement, setImageElement ] = useState<HTMLImageElement>(null);
|
||
|
|
||
|
const buildImage = useCallback(() =>
|
||
|
{
|
||
|
let imageResult: ImageResult = null;
|
||
|
|
||
|
const furniType = type.toLocaleLowerCase();
|
||
|
|
||
|
const listener: IGetImageListener = {
|
||
|
imageReady: (id: number, texture: RenderTexture, image: HTMLImageElement) =>
|
||
|
{
|
||
|
if(!image && texture)
|
||
|
{
|
||
|
image = TextureUtils.generateImage(texture);
|
||
|
}
|
||
|
|
||
|
image.onload = () => setImageElement(image);
|
||
|
},
|
||
|
imageFailed: null
|
||
|
};
|
||
|
|
||
|
switch(furniType)
|
||
|
{
|
||
|
case ProductTypeEnum.FLOOR:
|
||
|
imageResult = GetRoomEngine().getFurnitureFloorImage(spriteId, new Vector3d(direction), 64, listener, 0, extras);
|
||
|
break;
|
||
|
case ProductTypeEnum.WALL:
|
||
|
imageResult = GetRoomEngine().getFurnitureWallImage(spriteId, new Vector3d(direction), 64, listener, 0, extras);
|
||
|
break;
|
||
|
}
|
||
|
|
||
|
if(imageResult)
|
||
|
{
|
||
|
const image = imageResult.getImage();
|
||
|
|
||
|
image.onload = () => setImageElement(image);
|
||
|
}
|
||
|
}, [ type, spriteId, direction, extras ]);
|
||
|
|
||
|
useEffect(() =>
|
||
|
{
|
||
|
buildImage();
|
||
|
}, [ buildImage ]);
|
||
|
|
||
|
if(!imageElement) return null;
|
||
|
|
||
|
const imageUrl = `url('${ imageElement.src }')`;
|
||
|
|
||
|
return <div className={ 'furni-image scale-' + scale } style={ { backgroundImage: imageUrl, width: imageElement.width, height: imageElement.height } }></div>;
|
||
|
}
|