mirror of
https://github.com/billsonnn/nitro-react.git
synced 2024-11-22 22:30:52 +01:00
Crafting updates (still missing some details)
This commit is contained in:
parent
818c6b6070
commit
c6e44bff70
@ -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,44 +29,18 @@ 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);
|
craft();
|
||||||
setTryingToCraft(true);
|
setWaitingToConfirm(false);
|
||||||
setCraftInterval(setInterval(() => setCraftCounter(v => v - 1), 1000));
|
|
||||||
};
|
};
|
||||||
|
|
||||||
useEffect(() =>
|
|
||||||
{
|
|
||||||
if (craftCounter <= 0 && tryingToCraft)
|
|
||||||
{
|
|
||||||
clearInterval(craftInterval);
|
|
||||||
setCraftInterval(null);
|
|
||||||
setTryingToCraft(false);
|
|
||||||
craft();
|
|
||||||
}
|
|
||||||
}, [ craftCounter ]);
|
|
||||||
|
|
||||||
const craft = useCallback(() =>
|
|
||||||
{
|
|
||||||
if (!selectedRecipe) return;
|
|
||||||
|
|
||||||
SendMessageComposer(new CraftComposer(objectId, selectedRecipe.name));
|
|
||||||
}, [ objectId, selectedRecipe ]);
|
|
||||||
|
|
||||||
const renderSelectedRecipeIngredient = (ingredient: CraftingRecipeIngredientParser) =>
|
const renderSelectedRecipeIngredient = (ingredient: CraftingRecipeIngredientParser) =>
|
||||||
{
|
{
|
||||||
const ingredientData = ingredients.find((i) => i.name === ingredient.itemName);
|
const ingredientData = ingredients.find((i) => i.name === ingredient.itemName);
|
||||||
@ -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>
|
||||||
</> }
|
</> }
|
||||||
|
@ -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;
|
||||||
|
Loading…
Reference in New Issue
Block a user