diff --git a/src/views/shared/badge-image/BadgeImage.scss b/src/views/shared/badge-image/BadgeImage.scss index 6b23c065..1066fad7 100644 --- a/src/views/shared/badge-image/BadgeImage.scss +++ b/src/views/shared/badge-image/BadgeImage.scss @@ -8,6 +8,11 @@ &.group-badge { width: 39px; height: 39px; + + &.scale-2 { + width: 80px; + height: 80px; + } } .badge-information { diff --git a/src/views/shared/badge-image/BadgeImageView.tsx b/src/views/shared/badge-image/BadgeImageView.tsx index cfc9a064..d70ff622 100644 --- a/src/views/shared/badge-image/BadgeImageView.tsx +++ b/src/views/shared/badge-image/BadgeImageView.tsx @@ -18,7 +18,6 @@ export const BadgeImageView: FC = props => { const { badgeCode = null, isGroup = false, showInfo = false, customTitle = null, isGrayscale = false, scale = 1, classNames = [], style = {}, children = null, ...rest } = props; const [ badgeUrl, setBadgeUrl ] = useState(''); - const [ isListening, setIsListening ] = useState(true); const getScaleClass = useMemo(() => { @@ -64,42 +63,28 @@ export const BadgeImageView: FC = props => useEffect(() => { if(!badgeCode || !badgeCode.length) return; - - const existing = (isGroup) ? GetSessionDataManager().loadGroupBadgeImage(badgeCode) : GetSessionDataManager().loadBadgeImage(badgeCode); + + let didSetBadge = false; const onBadgeImageReadyEvent = (event: BadgeImageReadyEvent) => { if(event.badgeId !== badgeCode) return; - const nitroSprite = new NitroSprite(event.image); - setBadgeUrl(TextureUtils.generateImageUrl(nitroSprite)); + setBadgeUrl(TextureUtils.generateImageUrl(new NitroSprite(event.image))); - if(isListening) - { - GetSessionDataManager().events.removeEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent); - setIsListening(false); - } + didSetBadge = true; + + GetSessionDataManager().events.removeEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent); } - if(!existing) - { - GetSessionDataManager().events.addEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent); - } - else - { - const image = (isGroup) ? GetSessionDataManager().getGroupBadgeImage(badgeCode) : GetSessionDataManager().getBadgeImage(badgeCode); - const nitroSprite = new NitroSprite(image); - setBadgeUrl(TextureUtils.generateImageUrl(nitroSprite)); - } + GetSessionDataManager().events.addEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent); - return (() => - { - if(isListening) - { - GetSessionDataManager().events.removeEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent); - } - }); - }, [ badgeCode, isGroup, isListening ]); + const texture = isGroup ? GetSessionDataManager().getGroupBadgeImage(badgeCode) : GetSessionDataManager().getBadgeImage(badgeCode); + + if(texture && !didSetBadge) setBadgeUrl(TextureUtils.generateImageUrl(new NitroSprite(texture))); + + return () => GetSessionDataManager().events.removeEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent); + }, [ badgeCode, isGroup ]); return (