mirror of
https://github.com/billsonnn/nitro-react.git
synced 2024-11-30 08:50:51 +01:00
Update shared components
This commit is contained in:
parent
2f67bb66e7
commit
63f7d6c3c4
@ -1,9 +1,19 @@
|
|||||||
import { BadgeImageReadyEvent, NitroSprite, TextureUtils } from '@nitrots/nitro-renderer';
|
import { BadgeImageReadyEvent, NitroSprite, TextureUtils } from '@nitrots/nitro-renderer';
|
||||||
import { FC, useCallback, useEffect, useMemo, useState } from 'react';
|
import { FC, useEffect, useMemo, useState } from 'react';
|
||||||
import { GetSessionDataManager, LocalizeBadgeDescription, LocalizeBadgeName, LocalizeText } from '../../../api';
|
import { GetSessionDataManager, LocalizeBadgeDescription, LocalizeBadgeName, LocalizeText } from '../../../api';
|
||||||
|
import { BaseProps } from '../../../common/Base';
|
||||||
import { NitroLayoutBase } from '../../../layout/base';
|
import { NitroLayoutBase } from '../../../layout/base';
|
||||||
import { BadgeInformationView } from './badge-info/BadgeInformationView';
|
import { BadgeInformationView } from './badge-info/BadgeInformationView';
|
||||||
import { BadgeImageViewProps } from './BadgeImageView.types';
|
|
||||||
|
export interface BadgeImageViewProps extends BaseProps<HTMLDivElement>
|
||||||
|
{
|
||||||
|
badgeCode: string;
|
||||||
|
isGroup?: boolean;
|
||||||
|
showInfo?: boolean;
|
||||||
|
customTitle?: string;
|
||||||
|
isGrayscale?: boolean;
|
||||||
|
scale?: number;
|
||||||
|
}
|
||||||
|
|
||||||
export const BadgeImageView: FC<BadgeImageViewProps> = props =>
|
export const BadgeImageView: FC<BadgeImageViewProps> = props =>
|
||||||
{
|
{
|
||||||
@ -48,7 +58,13 @@ export const BadgeImageView: FC<BadgeImageViewProps> = props =>
|
|||||||
return newStyle;
|
return newStyle;
|
||||||
}, [ style, badgeUrl ]);
|
}, [ style, badgeUrl ]);
|
||||||
|
|
||||||
const onBadgeImageReadyEvent = useCallback((event: BadgeImageReadyEvent) =>
|
useEffect(() =>
|
||||||
|
{
|
||||||
|
if(!badgeCode || !badgeCode.length) return;
|
||||||
|
|
||||||
|
const existing = (isGroup) ? GetSessionDataManager().loadGroupBadgeImage(badgeCode) : GetSessionDataManager().loadBadgeImage(badgeCode);
|
||||||
|
|
||||||
|
const onBadgeImageReadyEvent = (event: BadgeImageReadyEvent) =>
|
||||||
{
|
{
|
||||||
if(event.badgeId !== badgeCode) return;
|
if(event.badgeId !== badgeCode) return;
|
||||||
|
|
||||||
@ -60,13 +76,7 @@ export const BadgeImageView: FC<BadgeImageViewProps> = props =>
|
|||||||
GetSessionDataManager().events.removeEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent);
|
GetSessionDataManager().events.removeEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent);
|
||||||
setIsListening(false);
|
setIsListening(false);
|
||||||
}
|
}
|
||||||
}, [ badgeCode, isListening ]);
|
}
|
||||||
|
|
||||||
useEffect(() =>
|
|
||||||
{
|
|
||||||
if(!badgeCode || !badgeCode.length) return;
|
|
||||||
|
|
||||||
const existing = (isGroup) ? GetSessionDataManager().loadGroupBadgeImage(badgeCode) : GetSessionDataManager().loadBadgeImage(badgeCode);
|
|
||||||
|
|
||||||
if(!existing)
|
if(!existing)
|
||||||
{
|
{
|
||||||
@ -86,9 +96,7 @@ export const BadgeImageView: FC<BadgeImageViewProps> = props =>
|
|||||||
GetSessionDataManager().events.removeEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent);
|
GetSessionDataManager().events.removeEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}, [ badgeCode ]);
|
}, [ badgeCode, isGroup, isListening ]);
|
||||||
|
|
||||||
const url = `url('${ badgeUrl }')`;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<NitroLayoutBase className={ getClassName } style={ getStyle }>
|
<NitroLayoutBase className={ getClassName } style={ getStyle }>
|
||||||
|
@ -1,11 +0,0 @@
|
|||||||
import { NitroLayoutBaseProps } from '../../../layout/base';
|
|
||||||
|
|
||||||
export interface BadgeImageViewProps extends NitroLayoutBaseProps
|
|
||||||
{
|
|
||||||
badgeCode: string;
|
|
||||||
isGroup?: boolean;
|
|
||||||
showInfo?: boolean;
|
|
||||||
customTitle?: string;
|
|
||||||
isGrayscale?: boolean;
|
|
||||||
scale?: number;
|
|
||||||
}
|
|
@ -17,6 +17,7 @@ export const PetImageView: FC<PetImageViewProps> = props =>
|
|||||||
let petPaletteId = paletteId;
|
let petPaletteId = paletteId;
|
||||||
let petColor = color;
|
let petColor = color;
|
||||||
let petCustomParts = customParts;
|
let petCustomParts = customParts;
|
||||||
|
let petHeadOnly = headOnly;
|
||||||
|
|
||||||
if(figure && figure.length)
|
if(figure && figure.length)
|
||||||
{
|
{
|
||||||
@ -28,6 +29,8 @@ export const PetImageView: FC<PetImageViewProps> = props =>
|
|||||||
petCustomParts = petFigureData.customParts;
|
petCustomParts = petFigureData.customParts;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if(petTypeId === 16) petHeadOnly = false;
|
||||||
|
|
||||||
const imageResult = GetRoomEngine().getRoomObjectPetImage(petTypeId, petPaletteId, petColor, new Vector3d((direction * 45)), 64, {
|
const imageResult = GetRoomEngine().getRoomObjectPetImage(petTypeId, petPaletteId, petColor, new Vector3d((direction * 45)), 64, {
|
||||||
imageReady: (id, texture, image) =>
|
imageReady: (id, texture, image) =>
|
||||||
{
|
{
|
||||||
@ -40,7 +43,7 @@ export const PetImageView: FC<PetImageViewProps> = props =>
|
|||||||
{
|
{
|
||||||
|
|
||||||
}
|
}
|
||||||
}, headOnly, 0, petCustomParts, posture);
|
}, petHeadOnly, 0, petCustomParts, posture);
|
||||||
|
|
||||||
if(imageResult)
|
if(imageResult)
|
||||||
{
|
{
|
||||||
|
Loading…
Reference in New Issue
Block a user