duckietm/Nitro-Cool-UI
1
0
Fork 0
mirror of https://github.com/duckietm/Nitro-Cool-UI.git synced 2025-06-21 22:36:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

New: Furni detail in Infostand

Browse Source
This commit is contained in:
DuckieTM 2024-03-16 13:06:08 +01:00
parent 3e346f3ac6
commit 898c72dd99
1 changed files with 41 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
src/components/room/widgets/avatar-info/infostand/InfoStandWidgetFurniView.tsx
View File

@ -1,6 +1,5 @@
import { CrackableDataType, GroupInformationComposer, GroupInformationEvent, NowPlayingEvent, RoomControllerLevel, RoomObjectCategory, RoomObjectOperationType, RoomObjectVariable, RoomWidgetEnumItemExtradataParameter, RoomWidgetFurniInfoUsagePolicyEnum, SetObjectDataMessageComposer, SongInfoReceivedEvent, StringDataType } from '@nitrots/nitro-renderer'; import { CrackableDataType, GroupInformationComposer, GroupInformationEvent, NowPlayingEvent, RoomControllerLevel, RoomObjectCategory, RoomObjectOperationType, RoomObjectVariable, RoomWidgetEnumItemExtradataParameter, RoomWidgetFurniInfoUsagePolicyEnum, SetObjectDataMessageComposer, SongInfoReceivedEvent, StringDataType } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useState } from 'react'; import { FC, useCallback, useEffect, useState } from 'react';
import { FaTimes } from 'react-icons/fa';
import { AvatarInfoFurni, CreateLinkEvent, GetGroupInformation, GetNitroInstance, GetRoomEngine, LocalizeText, SendMessageComposer } from '../../../../../api'; import { AvatarInfoFurni, CreateLinkEvent, GetGroupInformation, GetNitroInstance, GetRoomEngine, LocalizeText, SendMessageComposer } from '../../../../../api';
import { Base, Button, Column, Flex, LayoutBadgeImageView, LayoutLimitedEditionCompactPlateView, LayoutRarityLevelView, Text, UserProfileIconView } from '../../../../../common'; import { Base, Button, Column, Flex, LayoutBadgeImageView, LayoutLimitedEditionCompactPlateView, LayoutRarityLevelView, Text, UserProfileIconView } from '../../../../../common';
import { useMessageEvent, useRoom, useSoundEvent } from '../../../../../hooks'; import { useMessageEvent, useRoom, useSoundEvent } from '../../../../../hooks';
@ -39,6 +38,7 @@ export const InfoStandWidgetFurniView: FC<InfoStandWidgetFurniViewProps> = props
const [ songId, setSongId ] = useState<number>(-1); const [ songId, setSongId ] = useState<number>(-1);
const [ songName, setSongName ] = useState<string>(''); const [ songName, setSongName ] = useState<string>('');
const [ songCreator, setSongCreator ] = useState<string>(''); const [ songCreator, setSongCreator ] = useState<string>('');
const [itemLocation, setItemLocation] = useState<{ x: number; y: number; z: number; }>({ x: -1, y: -1, z: -1 });
useSoundEvent<NowPlayingEvent>(NowPlayingEvent.NPE_SONG_CHANGED, event => useSoundEvent<NowPlayingEvent>(NowPlayingEvent.NPE_SONG_CHANGED, event =>
{ {
@ -76,6 +76,12 @@ export const InfoStandWidgetFurniView: FC<InfoStandWidgetFurniViewProps> = props
let furniIsSongDisk = false; let furniIsSongDisk = false;
let furniSongId = -1; let furniSongId = -1;
const roomObject = GetRoomEngine().getRoomObject( roomSession.roomId, avatarInfo.id, avatarInfo.isWallItem ? RoomObjectCategory.WALL : RoomObjectCategory.FLOOR );
const location = roomObject.getLocation();
if (location) {
setItemLocation({ x: location.x, y: location.y, z: location.z, });
}
const isValidController = (avatarInfo.roomControllerLevel >= RoomControllerLevel.GUEST); const isValidController = (avatarInfo.roomControllerLevel >= RoomControllerLevel.GUEST);
if(isValidController || avatarInfo.isOwner || avatarInfo.isRoomOwner || avatarInfo.isAnyRoomController) if(isValidController || avatarInfo.isOwner || avatarInfo.isRoomOwner || avatarInfo.isAnyRoomController)
@ -328,12 +334,13 @@ export const InfoStandWidgetFurniView: FC<InfoStandWidgetFurniViewProps> = props
return ( return (
<Column gap={ 1 } alignItems="end"> <Column gap={ 1 } alignItems="end">
<Column className="nitro-infostand rounded"> <Column className="nitro-infostand">
<Column overflow="visible" className="container-fluid content-area" gap={ 1 }> <Column overflow="visible" className="container-fluid content-area" gap={ 1 }>
<Column gap={ 1 }> <Column gap={ 1 }>
<Flex alignItems="center" justifyContent="between" gap={ 1 }> <Flex alignItems="center" justifyContent="between" gap={ 1 }>
<Text variant="white" small wrap>{ avatarInfo.name }</Text> { !(isSongDisk) && <Text gfbold variant="white" wrap>{ avatarInfo.name }</Text> }
<FaTimes className="cursor-pointer fa-icon" onClick={ onClose } /> { (songName.length > 0) && <Text gfbold variant="white" wrap>{ songName }</Text> }
<i className="infostand-close" onClick={ onClose } />
</Flex> </Flex>
<hr className="m-0" /> <hr className="m-0" />
</Column> </Column>
@ -353,21 +360,21 @@ export const InfoStandWidgetFurniView: FC<InfoStandWidgetFurniViewProps> = props
<hr className="m-0" /> <hr className="m-0" />
</Column> </Column>
<Column gap={ 1 }> <Column gap={ 1 }>
<Text fullWidth wrap textBreak variant="white" small>{ avatarInfo.description }</Text> <Text fullWidth wrap textBreak variant="white">{ avatarInfo.description }</Text>
<hr className="m-0" /> <hr className="m-0" />
</Column> </Column>
<Column gap={ 1 }> <Column gap={ 1 }>
<Flex alignItems="center" gap={ 1 }> <Flex alignItems="center" gap={ 1 }>
<UserProfileIconView userId={ avatarInfo.ownerId } /> <UserProfileIconView userId={ avatarInfo.ownerId } />
<Text variant="white" small wrap> <Text variant="white" wrap>
{ LocalizeText('furni.owner', [ 'name' ], [ avatarInfo.ownerName ]) } { LocalizeText('furni.owner', [ 'name' ], [ avatarInfo.ownerName ]) }
</Text> </Text>
</Flex> </Flex>
{ (avatarInfo.purchaseOfferId > 0) && { (avatarInfo.purchaseOfferId > 0) &&
<Flex> <Flex>
<Text variant="white" small underline pointer onClick={ event => processButtonAction('buy_one') }> <Button className="volter-button text-black" onClick={ event => processButtonAction('buy_one') }>
{ LocalizeText('infostand.button.buy') } { LocalizeText('infostand.button.buy') }
</Text> </Button>
</Flex> } </Flex> }
</Column> </Column>
{ (isJukeBox || isSongDisk) && { (isJukeBox || isSongDisk) &&
@ -396,7 +403,7 @@ export const InfoStandWidgetFurniView: FC<InfoStandWidgetFurniViewProps> = props
{ isCrackable && { isCrackable &&
<> <>
<hr className="m-0" /> <hr className="m-0" />
<Text variant="white" small wrap>{ LocalizeText('infostand.crackable_furni.hits_remaining', [ 'hits', 'target' ], [ crackableHits.toString(), crackableTarget.toString() ]) }</Text> <Text variant="white" wrap>{ LocalizeText('infostand.crackable_furni.hits_remaining', [ 'hits', 'target' ], [ crackableHits.toString(), crackableTarget.toString() ]) }</Text>
</> } </> }
{ avatarInfo.groupId > 0 && { avatarInfo.groupId > 0 &&
<> <>
@ -406,10 +413,18 @@ export const InfoStandWidgetFurniView: FC<InfoStandWidgetFurniViewProps> = props
<Text variant="white" underline>{ groupName }</Text> <Text variant="white" underline>{ groupName }</Text>
</Flex> </Flex>
</> } </> }
<>
<hr className="m-0" />
<Text small wrap variant="white">
X = {itemLocation.x} and Y = {itemLocation.y}<br />
BuildHeight = {itemLocation.z < 0.01 ? 0 : itemLocation.z}<br />
{ canSeeFurniId && <Text wrap variant="white"> Room Furnishing ID: { avatarInfo.id }</Text> }
</Text>
</>
{itemLocation.x > -1}
{ godMode && { godMode &&
<> <>
<hr className="m-0" /> <hr className="m-0" />
{ canSeeFurniId && <Text small wrap variant="white">ID: { avatarInfo.id }</Text> }
{ (furniKeys.length > 0) && { (furniKeys.length > 0) &&
<> <>
<hr className="m-0"/> <hr className="m-0"/>
@ -418,7 +433,7 @@ export const InfoStandWidgetFurniView: FC<InfoStandWidgetFurniViewProps> = props
{ {
return ( return (
<Flex key={ index } alignItems="center" gap={ 1 }> <Flex key={ index } alignItems="center" gap={ 1 }>
<Text small wrap align="end" variant="white" className="col-4">{ key }</Text> <Text wrap align="end" variant="white" className="col-4">{ key }</Text>
<input type="text" className="form-control form-control-sm" value={ furniValues[index] } onChange={ event => onFurniSettingChange(index, event.target.value) }/> <input type="text" className="form-control form-control-sm" value={ furniValues[index] } onChange={ event => onFurniSettingChange(index, event.target.value) }/>
</Flex>); </Flex>);
}) } }) }
@ -442,29 +457,29 @@ export const InfoStandWidgetFurniView: FC<InfoStandWidgetFurniViewProps> = props
</Column> </Column>
</Column> </Column>
</Column> </Column>
<Flex gap={ 1 } justifyContent="end"> <Flex gap={ 2 } justifyContent="end">
{ canMove && { canMove &&
<Button variant="dark" onClick={ event => processButtonAction('move') }> <Button className="infostand-buttons px-2" onClick={ event => processButtonAction('move') }>
{ LocalizeText('infostand.button.move') } { LocalizeText('infostand.button.move') }
</Button> } </Button> }
{ canRotate && { canRotate &&
<Button variant="dark" onClick={ event => processButtonAction('rotate') }> <Button className="infostand-buttons px-2" onClick={ event => processButtonAction('rotate') }>
{ LocalizeText('infostand.button.rotate') } { LocalizeText('infostand.button.rotate') }
</Button> } </Button> }
{ (pickupMode !== PICKUP_MODE_NONE) && { (pickupMode !== PICKUP_MODE_NONE) &&
<Button variant="dark" onClick={ event => processButtonAction('pickup') }> <Button className="infostand-buttons px-2" onClick={ event => processButtonAction('pickup') }>
{ LocalizeText((pickupMode === PICKUP_MODE_EJECT) ? 'infostand.button.eject' : 'infostand.button.pickup') } { LocalizeText((pickupMode === PICKUP_MODE_EJECT) ? 'infostand.button.eject' : 'infostand.button.pickup') }
</Button> } </Button> }
{ canUse && { canUse &&
<Button variant="dark" onClick={ event => processButtonAction('use') }> <Button className="infostand-buttons px-2" onClick={ event => processButtonAction('use') }>
{ LocalizeText('infostand.button.use') } { LocalizeText('infostand.button.use') }
</Button> } </Button> }
{ ((furniKeys.length > 0 && furniValues.length > 0) && (furniKeys.length === furniValues.length)) && { ((furniKeys.length > 0 && furniValues.length > 0) && (furniKeys.length === furniValues.length)) &&
<Button variant="dark" onClick={ () => processButtonAction('save_branding_configuration') }> <Button className="infostand-buttons px-2" onClick={ () => processButtonAction('save_branding_configuration') }>
{ LocalizeText('save') } { LocalizeText('save') }
</Button> } </Button> }
{ ((customKeys.length > 0 && customValues.length > 0) && (customKeys.length === customValues.length)) && { ((customKeys.length > 0 && customValues.length > 0) && (customKeys.length === customValues.length)) &&
<Button variant="dark" onClick={ () => processButtonAction('save_custom_variables') }> <Button className="infostand-buttons px-2" onClick={ () => processButtonAction('save_custom_variables') }>
{ LocalizeText('save') } { LocalizeText('save') }
</Button> } </Button> }
</Flex> </Flex>