Skip to content

Feature - Mystery trophy #135

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
s074 merged 1 commit into from
Jan 27, 2023
Merged

Feature - Mystery trophy #135

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added src/assets/images/mysterytrophy/frank_mystery_trophy.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
50 changes: 50 additions & 0 deletions src/components/room/widgets/furniture/FurnitureMysteryTrophyOpenDialogView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
import { OpenMysteryTrophyMessageComposer } from '@nitrots/nitro-renderer';
import { FC, useState } from 'react';
import { LocalizeText, SendMessageComposer } from '../../../../api';
import { Button, Column, Flex, NitroCardContentView, NitroCardHeaderView, NitroCardView, Text } from '../../../../common';

interface FurnitureMysteryTrophyOpenDialogViewProps
{
objectId: number;
onClose: () => void;
}

export const FurnitureMysteryTrophyOpenDialogView: FC<FurnitureMysteryTrophyOpenDialogViewProps> = props =>
{
const { objectId = -1, onClose = null } = props;
const [ description, setDescription ] = useState<string>('');

const onConfirm = () =>
{
SendMessageComposer(new OpenMysteryTrophyMessageComposer(objectId, description));
onClose();
}

if(objectId === -1) return null;

return (
<NitroCardView className="nitro-mysterytrophy-dialog no-resize" theme="primary-slim">
<NitroCardHeaderView center headerText={ LocalizeText('mysterytrophy.header.title') } onCloseClick={ onClose } />
<NitroCardContentView>
<Flex className="mysterytrophy-dialog-top p-3">
<div className="mysterytrophy-image flex-shrink-0"></div>
<div className="m-2">
<Text variant="white" className="mysterytrophy-text-big">{ LocalizeText('mysterytrophy.header.description') }</Text>
</div>
</Flex>
<Flex className="mysterytrophy-dialog-bottom p-2">
<Column gap={ 1 }>
<Flex alignItems="center" className="bg-white rounded py-1 px-2 input-mysterytrophy-dialog">
<textarea className="form-control form-control-sm input-mysterytrophy" value={ description } onChange={ event => setDescription(event.target.value) } />
<div className="mysterytrophy-pencil-image flex-shrink-0 small fa-icon"></div>
</Flex>
<Flex className="mt-2" gap={ 5 } display="flex" justifyContent="center" alignItems="center">
<Text pointer className="text-decoration" onClick={ () => onClose() }>{ LocalizeText('cancel') }</Text>
<Button variant="success" onClick={ () => onConfirm() }>{ LocalizeText('generic.ok') }</Button>
</Flex>
</Column>
</Flex>
</NitroCardContentView>
</NitroCardView>
);
}
62 changes: 62 additions & 0 deletions src/components/room/widgets/furniture/FurnitureWidgets.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -462,3 +462,65 @@
background-position: center;
}
}

.nitro-mysterytrophy-dialog
{
.mysterytrophy-dialog-top
{
width: 400px;
height: 120px;
border-radius: 2px;
background-color: #0E3F52;

.mysterytrophy-image
{
width: 80px;
height: 84px;
position: relative;
background-image: url('@/assets/images/mysterytrophy/frank_mystery_trophy.png');
background-repeat: no-repeat;
}

.mysterytrophy-text-big
{
font-size: 16px;
}
}

.mysterytrophy-dialog-bottom
{
display: flex;
justify-content: center;
width: 400px;
height: 120px;
border-radius: 2px;
background-color: #E9E9E1;

.input-mysterytrophy-dialog
{
width: 380px;
border: 1px solid black;

.input-mysterytrophy
{
width: 350px;
border: 0;
outline: 0;
}

.mysterytrophy-pencil-image
{
width: 16px;
height: 16px;
position: relative;
background-image: url('@/assets/images/infostand/pencil-icon.png');
background-repeat: no-repeat;
}
}

.text-decoration
{
text-decoration: underline;
}
}
}
14 changes: 13 additions & 1 deletion src/components/room/widgets/furniture/context-menu/FurnitureContextMenuView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
import { ContextMenuEnum, CustomUserNotificationMessageEvent, RoomObjectCategory } from '@nitrots/nitro-renderer';
import { FC } from 'react';
import { GetGroupInformation, GetSessionDataManager, LocalizeText } from '../../../../../api';
import { EFFECTBOX_OPEN, GROUP_FURNITURE, MONSTERPLANT_SEED_CONFIRMATION, PURCHASABLE_CLOTHING_CONFIRMATION, useFurnitureContextMenuWidget, useMessageEvent, useNotification } from '../../../../../hooks';
import { EFFECTBOX_OPEN, GROUP_FURNITURE, MONSTERPLANT_SEED_CONFIRMATION, MYSTERYTROPHY_OPEN_DIALOG, PURCHASABLE_CLOTHING_CONFIRMATION, useFurnitureContextMenuWidget, useMessageEvent, useNotification } from '../../../../../hooks';
import { ContextMenuHeaderView } from '../../context-menu/ContextMenuHeaderView';
import { ContextMenuListItemView } from '../../context-menu/ContextMenuListItemView';
import { ContextMenuView } from '../../context-menu/ContextMenuView';
import { FurnitureMysteryBoxOpenDialogView } from '../FurnitureMysteryBoxOpenDialogView';
import { FurnitureMysteryTrophyOpenDialogView } from '../FurnitureMysteryTrophyOpenDialogView';
import { EffectBoxConfirmView } from './EffectBoxConfirmView';
import { MonsterPlantSeedConfirmView } from './MonsterPlantSeedConfirmView';
import { PurchasableClothingConfirmView } from './PurchasableClothingConfirmView';
Expand Down Expand Up @@ -47,6 +48,8 @@ export const FurnitureContextMenuView: FC<{}> = props =>
<PurchasableClothingConfirmView objectId={ confirmingObjectId } onClose={ closeConfirm } /> }
{ (confirmMode === EFFECTBOX_OPEN) &&
<EffectBoxConfirmView objectId={ confirmingObjectId } onClose={ closeConfirm } /> }
{ (confirmMode === MYSTERYTROPHY_OPEN_DIALOG) &&
<FurnitureMysteryTrophyOpenDialogView objectId={ confirmingObjectId } onClose={ closeConfirm } /> }
<FurnitureMysteryBoxOpenDialogView ownerId={ objectOwnerId } />
{ (objectId >= 0) && mode &&
<ContextMenuView objectId={ objectId } category={ RoomObjectCategory.FLOOR } onClose={ onClose } fades={ true }>
Expand Down Expand Up @@ -95,6 +98,15 @@ export const FurnitureContextMenuView: FC<{}> = props =>
{ LocalizeText('mysterybox.context.' + ((isOwner) ? 'owner' : 'other') + '.use') }
</ContextMenuListItemView>
</> }
{ (mode === ContextMenuEnum.MYSTERY_TROPHY) &&
<>
<ContextMenuHeaderView>
{ LocalizeText('mysterytrophy.header.title') }
</ContextMenuHeaderView>
<ContextMenuListItemView onClick={ event => processAction('use_mystery_trophy') }>
{ LocalizeText('friendfurni.context.use') }
</ContextMenuListItemView>
</> }
{ (mode === GROUP_FURNITURE) && groupData &&
<>
<ContextMenuHeaderView className="cursor-pointer text-truncate" onClick={ () => GetGroupInformation(groupData.guildId) }>
Expand Down
19 changes: 18 additions & 1 deletion src/hooks/rooms/widgets/furniture/useFurnitureContextMenuWidget.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ export const MONSTERPLANT_SEED_CONFIRMATION: string = 'MONSTERPLANT_SEED_CONFIRM
export const PURCHASABLE_CLOTHING_CONFIRMATION: string = 'PURCHASABLE_CLOTHING_CONFIRMATION';
export const GROUP_FURNITURE: string = 'GROUP_FURNITURE';
export const EFFECTBOX_OPEN: string = 'EFFECTBOX_OPEN';
export const MYSTERYTROPHY_OPEN_DIALOG: string = 'MYSTERYTROPHY_OPEN_DIALOG';

const useFurnitureContextMenuWidgetState = () =>
{
Expand Down Expand Up @@ -57,6 +58,10 @@ const useFurnitureContextMenuWidgetState = () =>
case 'use_mystery_box':
roomSession.useMultistateItem(objectId);
break;
case 'use_mystery_trophy':
setConfirmMode(MYSTERYTROPHY_OPEN_DIALOG);
setConfirmingObjectId(objectId);
break;
case 'join_group':
TryJoinGroup(groupData.guildId);
setIsGroupMember(true);
Expand All @@ -76,7 +81,8 @@ const useFurnitureContextMenuWidgetState = () =>
RoomEngineTriggerWidgetEvent.REQUEST_MONSTERPLANT_SEED_PLANT_CONFIRMATION_DIALOG,
RoomEngineTriggerWidgetEvent.REQUEST_PURCHASABLE_CLOTHING_CONFIRMATION_DIALOG,
RoomEngineTriggerWidgetEvent.REQUEST_EFFECTBOX_OPEN_DIALOG,
RoomEngineTriggerWidgetEvent.REQUEST_MYSTERYBOX_OPEN_DIALOG
RoomEngineTriggerWidgetEvent.REQUEST_MYSTERYBOX_OPEN_DIALOG,
RoomEngineTriggerWidgetEvent.REQUEST_MYSTERYTROPHY_OPEN_DIALOG
], event =>
{
const object = GetRoomEngine().getRoomObject(roomSession.roomId, event.objectId, event.category);
Expand Down Expand Up @@ -114,6 +120,14 @@ const useFurnitureContextMenuWidgetState = () =>
case RoomEngineTriggerWidgetEvent.REQUEST_MYSTERYBOX_OPEN_DIALOG:
roomSession.useMultistateItem(object.id);

onClose();
return;
case RoomEngineTriggerWidgetEvent.REQUEST_MYSTERYTROPHY_OPEN_DIALOG:
if(!IsOwnerOfFurniture(object)) return;

setConfirmingObjectId(object.id);
setConfirmMode(MYSTERYTROPHY_OPEN_DIALOG);

onClose();
return;
case RoomEngineTriggerWidgetEvent.OPEN_FURNI_CONTEXT_MENU:
Expand All @@ -131,6 +145,9 @@ const useFurnitureContextMenuWidgetState = () =>
case ContextMenuEnum.MYSTERY_BOX:
setMode(ContextMenuEnum.MYSTERY_BOX);
return;
case ContextMenuEnum.MYSTERY_TROPHY:
if(IsOwnerOfFurniture(object)) setMode(ContextMenuEnum.MYSTERY_TROPHY);
return;
case ContextMenuEnum.RANDOM_TELEPORT:
setMode(ContextMenuEnum.RANDOM_TELEPORT);
return;
Expand Down