nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-11-23 06:40:50 +01:00
Code Issues Packages Projects Releases Wiki Activity

Crafting updates (still missing some details)

Browse Source
This commit is contained in:
MyNameIsBatman 2022-09-20 17:50:45 -03:00
parent 818c6b6070
commit c6e44bff70
2 changed files with 25 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
src/components/room/widgets/furniture/FurnitureCraftingView.tsx
View File

@ -1,18 +1,15 @@
import { CraftComposer, CraftingRecipeIngredientParser, RoomObjectCategory } from '@nitrots/nitro-renderer'; import { CraftingRecipeIngredientParser, RoomObjectCategory } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useMemo, useState } from 'react'; import { FC, useMemo, useState } from 'react';
import { GetRoomEngine, IsOwnerOfFurniture, LocalizeText, SendMessageComposer } from '../../../../api'; import { GetRoomEngine, IsOwnerOfFurniture, LocalizeText } from '../../../../api';
import { AutoGrid, Button, Column, Flex, LayoutGridItem, NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../common'; import { AutoGrid, Button, Column, Flex, LayoutGridItem, LayoutLoadingSpinnerView, NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../common';
import { useFurnitureCraftingWidget, useInventoryFurni, useRoom } from '../../../../hooks'; import { useFurnitureCraftingWidget, useRoom } from '../../../../hooks';
export const FurnitureCraftingView: FC<{}> = props => export const FurnitureCraftingView: FC<{}> = props =>
{ {
const { objectId = -1, recipes = [], ingredients = [], selectedRecipe = null, selectedRecipeIngredients = null, selectRecipe = null, onClose = null } = useFurnitureCraftingWidget(); const { objectId = -1, recipes = [], ingredients = [], selectedRecipe = null, selectedRecipeIngredients = null, isCrafting = false, craft = null, selectRecipe = null, onClose = null } = useFurnitureCraftingWidget();
const { activate, deactivate } = useInventoryFurni();
const { roomSession = null } = useRoom(); const { roomSession = null } = useRoom();
const [ craftCounter, setCraftCounter ] = useState(0); const [ waitingToConfirm, setWaitingToConfirm ] = useState(false);
const [ tryingToCraft, setTryingToCraft ] = useState(false);
const [ craftInterval, setCraftInterval ] = useState(null);
const isOwner = useMemo(() => const isOwner = useMemo(() =>
{ {
@ -32,43 +29,17 @@ export const FurnitureCraftingView: FC<{}> = props =>
return true; return true;
}, [ ingredients, selectedRecipeIngredients ]); }, [ ingredients, selectedRecipeIngredients ]);
const cancelCraft = () =>
{
setTryingToCraft(false);
setCraftCounter(0);
clearInterval(craftInterval);
};
const tryCraft = () => const tryCraft = () =>
{ {
if (tryingToCraft) if (!waitingToConfirm)
{ {
cancelCraft(); setWaitingToConfirm(true);
return; return;
} }
setCraftCounter(5);
setTryingToCraft(true);
setCraftInterval(setInterval(() => setCraftCounter(v => v - 1), 1000));
};
useEffect(() =>
{
if (craftCounter <= 0 && tryingToCraft)
{
clearInterval(craftInterval);
setCraftInterval(null);
setTryingToCraft(false);
craft(); craft();
} setWaitingToConfirm(false);
}, [ craftCounter ]); };
const craft = useCallback(() =>
{
if (!selectedRecipe) return;
SendMessageComposer(new CraftComposer(objectId, selectedRecipe.name));
}, [ objectId, selectedRecipe ]);
const renderSelectedRecipeIngredient = (ingredient: CraftingRecipeIngredientParser) => const renderSelectedRecipeIngredient = (ingredient: CraftingRecipeIngredientParser) =>
{ {
@ -124,8 +95,9 @@ export const FurnitureCraftingView: FC<{}> = props =>
<div className="text-black">{ selectedRecipe.localizedName }</div> <div className="text-black">{ selectedRecipe.localizedName }</div>
</Flex> </Flex>
</Flex> </Flex>
<Button variant={ !isOwner || !canCraft ? 'danger' : tryingToCraft ? 'warning' : 'success' } disabled={ !isOwner || !canCraft } onClick={ tryCraft }> <Button variant={ !isOwner || !canCraft ? 'danger' : waitingToConfirm ? 'warning' : isCrafting ? 'primary' : 'success' } disabled={ !isOwner || !canCraft || isCrafting } onClick={ tryCraft }>
{ LocalizeText(!isOwner ? 'crafting.btn.notowner' : !canCraft ? 'crafting.status.recipe.incomplete' : tryingToCraft ? 'generic.cancel' : 'crafting.btn.craft') } { !isCrafting && LocalizeText(!isOwner ? 'crafting.btn.notowner' : !canCraft ? 'crafting.status.recipe.incomplete' : waitingToConfirm ? 'generic.confirm' : 'crafting.btn.craft') }
{ isCrafting && <LayoutLoadingSpinnerView /> }
</Button> </Button>
</Flex> </Flex>
</> } </> }

13
src/hooks/rooms/widgets/furniture/useFurnitureCraftingWidget.ts
View File

@ -1,4 +1,4 @@
import { CraftableProductsEvent, CraftingRecipeEvent, CraftingRecipeIngredientParser, CraftingRecipesAvailableEvent, CraftingResultEvent, GetCraftableProductsComposer, GetCraftingRecipeComposer, RoomEngineTriggerWidgetEvent, RoomWidgetEnum } from '@nitrots/nitro-renderer'; import { CraftableProductsEvent, CraftComposer, CraftingRecipeEvent, CraftingRecipeIngredientParser, CraftingRecipesAvailableEvent, CraftingResultEvent, GetCraftableProductsComposer, GetCraftingRecipeComposer, RoomEngineTriggerWidgetEvent, RoomWidgetEnum } from '@nitrots/nitro-renderer';
import { useCallback, useState } from 'react'; import { useCallback, useState } from 'react';
import { GetRoomEngine, LocalizeText, SendMessageComposer } from '../../../../api'; import { GetRoomEngine, LocalizeText, SendMessageComposer } from '../../../../api';
import { useMessageEvent, useRoomEngineEvent } from '../../../events'; import { useMessageEvent, useRoomEngineEvent } from '../../../events';
@ -16,6 +16,7 @@ const useFurnitureCraftingWidgetState = () =>
const [ selectedRecipe, setSelectedRecipe ] = useState<{ name: string, localizedName: string, iconUrl: string }>(null); const [ selectedRecipe, setSelectedRecipe ] = useState<{ name: string, localizedName: string, iconUrl: string }>(null);
const [ selectedRecipeIngredients, setSelectedRecipeIngredients ] = useState<CraftingRecipeIngredientParser[]>([]); const [ selectedRecipeIngredients, setSelectedRecipeIngredients ] = useState<CraftingRecipeIngredientParser[]>([]);
const [ cacheRecipeIngredients, setCacheRecipeIngredients ] = useState<Map<string, CraftingRecipeIngredientParser[]>>(new Map()); const [ cacheRecipeIngredients, setCacheRecipeIngredients ] = useState<Map<string, CraftingRecipeIngredientParser[]>>(new Map());
const [ isCrafting, setIsCrafting ] = useState(false);
const resetData = () => const resetData = () =>
{ {
@ -32,6 +33,12 @@ const useFurnitureCraftingWidgetState = () =>
resetData(); resetData();
}; };
const craft = () =>
{
setIsCrafting(true);
SendMessageComposer(new CraftComposer(objectId, selectedRecipe.name));
};
const selectRecipe = useCallback((recipe: { name: string, localizedName: string, iconUrl: string }) => const selectRecipe = useCallback((recipe: { name: string, localizedName: string, iconUrl: string }) =>
{ {
setSelectedRecipeIngredients([]); setSelectedRecipeIngredients([]);
@ -124,13 +131,15 @@ const useFurnitureCraftingWidgetState = () =>
{ {
simpleAlert(LocalizeText('crafting.info.result.ok')); simpleAlert(LocalizeText('crafting.info.result.ok'));
} }
setIsCrafting(false);
}); });
useMessageEvent<CraftingRecipesAvailableEvent>(CraftingRecipesAvailableEvent, event => useMessageEvent<CraftingRecipesAvailableEvent>(CraftingRecipesAvailableEvent, event =>
{ {
}); });
return { objectId, recipes, ingredients, selectedRecipe, selectedRecipeIngredients, selectRecipe, onClose }; return { objectId, recipes, ingredients, selectedRecipe, selectedRecipeIngredients, isCrafting, selectRecipe, craft, onClose };
} }
export const useFurnitureCraftingWidget = useFurnitureCraftingWidgetState; export const useFurnitureCraftingWidget = useFurnitureCraftingWidgetState;