nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-10-23 03:13:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

Adding new buttons in right panel

Browse Source
This commit is contained in:
object 2022-08-10 16:14:52 +00:00
parent 2fa3662860
commit a9a03648d5
1 changed files with 154 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

99
src/components/room/widgets/avatar-info/infostand/InfoStandWidgetPetView.tsx
View File

@ -1,7 +1,9 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { FC } from 'react';
import { AvatarInfoPet, LocalizeText } from '../../../../../api';
import { Base, Column, Flex, LayoutPetImageView, Text, UserProfileIconView } from '../../../../../common';
import { PetRespectComposer, PetType } from '@nitrots/nitro-renderer';
import { FC, useEffect } from 'react';
import { AvatarInfoPet, CreateLinkEvent, GetConfiguration, GetSessionDataManager, LocalizeText, SendMessageComposer } from '../../../../../api';
import { Base, Button, Column, Flex, LayoutPetImageView, Text, UserProfileIconView } from '../../../../../common';
import { usePets, useRoom } from '../../../../../hooks';
interface InfoStandWidgetPetViewProps
{
@ -12,10 +14,66 @@ interface InfoStandWidgetPetViewProps
export const InfoStandWidgetPetView: FC<InfoStandWidgetPetViewProps> = props =>
{
const { avatarInfo = null, onClose = null } = props;
const { roomSession = null } = useRoom();
const { petRespect, changePetRespect } = usePets();
if(!avatarInfo) return null;
useEffect(() =>
{
changePetRespect(avatarInfo.respectsPetLeft);
}, [ avatarInfo ]);
const processButtonAction = (action: string) =>
{
let hideMenu = true;
if (!action || action == '') return;
switch (action)
{
case 'respect':
let newRespectsLeftChange = 0;
changePetRespect(prevValue =>
{
newRespectsLeftChange = (prevValue - 1);
return newRespectsLeftChange;
});
GetSessionDataManager().givePetRespect(avatarInfo.id);
if(newRespectsLeftChange > 0) hideMenu = false;
break;
case 'buyfood':
CreateLinkEvent('catalog/open/' + GetConfiguration('catalog.links')['pets.buy_saddle']);
break;
case 'train':
// not coded
break;
case 'treat':
SendMessageComposer(new PetRespectComposer(avatarInfo.id));
break;
case 'compost':
roomSession?.compostPlant(avatarInfo.id);
break;
case 'pick_up':
roomSession?.pickupPet(avatarInfo.id);
break;
}
if(hideMenu) onClose();
}
useEffect(() =>
{
changePetRespect(avatarInfo.respectsPetLeft);
}, [ avatarInfo ]);
return (
<Column gap={ 1 } alignItems="end">
<Column className="nitro-infostand rounded">
<Column overflow="visible" className="container-fluid content-area" gap={ 1 }>
<Column gap={ 1 }>
@ -65,7 +123,9 @@ export const InfoStandWidgetPetView: FC<InfoStandWidgetPetViewProps> = props =>
<hr className="m-0" />
</Column>
<Column gap={ 1 }>
{ avatarInfo.petType !== PetType.MONSTERPLANT &&
<Text variant="white" small wrap>{ LocalizeText('infostand.text.petrespect', [ 'count' ], [ avatarInfo.respect.toString() ]) }</Text>
}
<Text variant="white" small wrap>{ LocalizeText('pet.age', [ 'age' ], [ avatarInfo.age.toString() ]) }</Text>
<hr className="m-0" />
</Column>
@ -79,5 +139,38 @@ export const InfoStandWidgetPetView: FC<InfoStandWidgetPetViewProps> = props =>
</Column>
</Column>
</Column>
<Flex gap={ 1 } justifyContent="end">
{ avatarInfo.petType !== PetType.MONSTERPLANT &&
<Button variant="dark" onClick={ event => processButtonAction('buyfood') }>
{ LocalizeText('infostand.button.buyfood') }
</Button>
}
{ avatarInfo.isOwner && avatarInfo.petType !== PetType.MONSTERPLANT &&
<Button variant="dark" onClick={ event => processButtonAction('train') }>
{ LocalizeText('infostand.button.train') }
</Button>
}
{ !avatarInfo.dead && ((avatarInfo.energy / avatarInfo.maximumEnergy) < 0.98) && avatarInfo.petType === PetType.MONSTERPLANT &&
<Button variant="dark" onClick={ event => processButtonAction('treat') }>
{ LocalizeText('infostand.button.pettreat') }
</Button>
}
{ roomSession?.isRoomOwner && avatarInfo.petType === PetType.MONSTERPLANT &&
<Button variant="dark" onClick={ event => processButtonAction('compost') }>
{ LocalizeText('infostand.button.compost') }
</Button>
}
{ avatarInfo.isOwner &&
<Button variant="dark" onClick={ event => processButtonAction('pick_up') }>
{ LocalizeText('inventory.pets.pickup') }
</Button>
}
{ (petRespect > 0) && avatarInfo.petType !== PetType.MONSTERPLANT &&
<Button variant="dark" onClick={ event => processButtonAction('respect') }>
{ LocalizeText('infostand.button.petrespect', [ 'count' ], [ petRespect.toString() ]) }
</Button>
}
</Flex>
</Column>
);
}