Update RarityLevelView

This commit is contained in:
Bill 2022-03-03 23:59:53 -05:00
parent 2e296a765c
commit 25c7017518
5 changed files with 22 additions and 9 deletions

View File

@ -318,5 +318,19 @@
} }
} }
.nitro-rarity-level {
width: 36px;
height: 28px;
background: url("../assets/images/infostand/rarity-level.png");
div {
line-height: 28px;
text-align: center;
color: $black;
font-weight: bold;
}
}
@import './card/NitroCardView'; @import './card/NitroCardView';

View File

@ -1,12 +1,12 @@
import { FC, useMemo } from 'react'; import { FC, useMemo } from 'react';
import { Base, BaseProps } from '../../../common'; import { Base, BaseProps } from '..';
interface RarityLevelViewProps extends BaseProps<HTMLDivElement> interface LayoutRarityLevelViewProps extends BaseProps<HTMLDivElement>
{ {
level: number; level: number;
} }
export const RarityLevelView: FC<RarityLevelViewProps> = props => export const LayoutRarityLevelView: FC<LayoutRarityLevelViewProps> = props =>
{ {
const { level = 0, classNames = [], children = null, ...rest } = props; const { level = 0, classNames = [], children = null, ...rest } = props;

View File

@ -9,6 +9,7 @@ export * from './LayoutLoadingSpinnerView';
export * from './LayoutMiniCameraView'; export * from './LayoutMiniCameraView';
export * from './LayoutNotificationAlertView'; export * from './LayoutNotificationAlertView';
export * from './LayoutNotificationBubbleView'; export * from './LayoutNotificationBubbleView';
export * from './LayoutRarityLevelView';
export * from './LayoutRoomThumbnailView'; export * from './LayoutRoomThumbnailView';
export * from './LayoutTrophyView'; export * from './LayoutTrophyView';
export * from './UserProfileIconView'; export * from './UserProfileIconView';

View File

@ -1,9 +1,8 @@
import { FurnitureListComposer, IRoomSession, RoomObjectVariable, RoomPreviewer, Vector3d } from '@nitrots/nitro-renderer'; import { FurnitureListComposer, IRoomSession, RoomObjectVariable, RoomPreviewer, Vector3d } from '@nitrots/nitro-renderer';
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import { GetRoomEngine, GetSessionDataManager, LocalizeText, SendMessageComposer } from '../../../../api'; import { GetRoomEngine, GetSessionDataManager, LocalizeText, SendMessageComposer } from '../../../../api';
import { AutoGrid, Button, Column, Grid, Text } from '../../../../common'; import { AutoGrid, Button, Column, Grid, LayoutRarityLevelView, Text } from '../../../../common';
import { LimitedEditionCompactPlateView } from '../../../../views/shared/limited-edition/LimitedEditionCompactPlateView'; import { LimitedEditionCompactPlateView } from '../../../../views/shared/limited-edition/LimitedEditionCompactPlateView';
import { RarityLevelView } from '../../../../views/shared/rarity-level/RarityLevelView';
import { RoomPreviewerView } from '../../../../views/shared/room-previewer/RoomPreviewerView'; import { RoomPreviewerView } from '../../../../views/shared/room-previewer/RoomPreviewerView';
import { FurniCategory } from '../../common/FurniCategory'; import { FurniCategory } from '../../common/FurniCategory';
import { attemptItemPlacement, attemptPlaceMarketplaceOffer } from '../../common/FurnitureUtilities'; import { attemptItemPlacement, attemptPlaceMarketplaceOffer } from '../../common/FurnitureUtilities';
@ -120,7 +119,7 @@ export const InventoryFurnitureView: FC<InventoryFurnitureViewProps> = props =>
{ groupItem && groupItem.stuffData.isUnique && { groupItem && groupItem.stuffData.isUnique &&
<LimitedEditionCompactPlateView className="top-2 end-2" position="absolute" uniqueNumber={ groupItem.stuffData.uniqueNumber } uniqueSeries={ groupItem.stuffData.uniqueSeries } /> } <LimitedEditionCompactPlateView className="top-2 end-2" position="absolute" uniqueNumber={ groupItem.stuffData.uniqueNumber } uniqueSeries={ groupItem.stuffData.uniqueSeries } /> }
{ (groupItem && groupItem.stuffData.rarityLevel > -1) && { (groupItem && groupItem.stuffData.rarityLevel > -1) &&
<RarityLevelView className="top-2 end-2" position="absolute" level={ groupItem.stuffData.rarityLevel } /> } <LayoutRarityLevelView className="top-2 end-2" position="absolute" level={ groupItem.stuffData.rarityLevel } /> }
</Column> </Column>
{ groupItem && { groupItem &&
<Column grow justifyContent="between" gap={ 2 }> <Column grow justifyContent="between" gap={ 2 }>

View File

@ -2,10 +2,9 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { CrackableDataType, GroupInformationComposer, GroupInformationEvent, RoomControllerLevel, RoomObjectCategory, RoomObjectVariable, RoomWidgetEnumItemExtradataParameter, RoomWidgetFurniInfoUsagePolicyEnum, SetObjectDataMessageComposer, StringDataType } from '@nitrots/nitro-renderer'; import { CrackableDataType, GroupInformationComposer, GroupInformationEvent, RoomControllerLevel, RoomObjectCategory, RoomObjectVariable, RoomWidgetEnumItemExtradataParameter, RoomWidgetFurniInfoUsagePolicyEnum, SetObjectDataMessageComposer, StringDataType } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useState } from 'react'; import { FC, useCallback, useEffect, useState } from 'react';
import { CreateLinkEvent, GetGroupInformation, GetRoomEngine, LocalizeText, RoomWidgetFurniActionMessage, RoomWidgetUpdateInfostandFurniEvent, SendMessageComposer } from '../../../../api'; import { CreateLinkEvent, GetGroupInformation, GetRoomEngine, LocalizeText, RoomWidgetFurniActionMessage, RoomWidgetUpdateInfostandFurniEvent, SendMessageComposer } from '../../../../api';
import { Button, Column, Flex, LayoutBadgeImageView, Text, UserProfileIconView } from '../../../../common'; import { Button, Column, Flex, LayoutBadgeImageView, LayoutRarityLevelView, Text, UserProfileIconView } from '../../../../common';
import { BatchUpdates, UseMessageEventHook } from '../../../../hooks'; import { BatchUpdates, UseMessageEventHook } from '../../../../hooks';
import { LimitedEditionCompactPlateView } from '../../../shared/limited-edition/LimitedEditionCompactPlateView'; import { LimitedEditionCompactPlateView } from '../../../shared/limited-edition/LimitedEditionCompactPlateView';
import { RarityLevelView } from '../../../shared/rarity-level/RarityLevelView';
import { useRoomContext } from '../../context/RoomContext'; import { useRoomContext } from '../../context/RoomContext';
interface InfoStandWidgetFurniViewProps interface InfoStandWidgetFurniViewProps
@ -272,7 +271,7 @@ export const InfoStandWidgetFurniView: FC<InfoStandWidgetFurniViewProps> = props
</div> } </div> }
{ (furniData.stuffData.rarityLevel > -1) && { (furniData.stuffData.rarityLevel > -1) &&
<div className="position-absolute end-0"> <div className="position-absolute end-0">
<RarityLevelView level={ furniData.stuffData.rarityLevel } /> <LayoutRarityLevelView level={ furniData.stuffData.rarityLevel } />
</div> } </div> }
{ furniData.image && furniData.image.src.length && { furniData.image && furniData.image.src.length &&
<img className="d-block mx-auto" src={ furniData.image.src } alt="" /> } <img className="d-block mx-auto" src={ furniData.image.src } alt="" /> }