diff --git a/src/components/room/widgets/furniture/FurnitureSpamWallPostItView.tsx b/src/components/room/widgets/furniture/FurnitureSpamWallPostItView.tsx new file mode 100644 index 00000000..c093d462 --- /dev/null +++ b/src/components/room/widgets/furniture/FurnitureSpamWallPostItView.tsx @@ -0,0 +1,46 @@ +import { FC } from 'react'; +import { ColorUtils } from '../../../../api'; +import { DraggableWindow, DraggableWindowPosition } from '../../../../common'; +import { useFurnitureSpamWallPostItWidget } from '../../../../hooks'; + +const STICKIE_COLORS = [ '9CCEFF','FF9CFF', '9CFF9C','FFFF33' ]; +const STICKIE_COLOR_NAMES = [ 'blue', 'pink', 'green', 'yellow' ]; + +const getStickieColorName = (color: string) => +{ + let index = STICKIE_COLORS.indexOf(color); + + if(index === -1) index = 0; + + return STICKIE_COLOR_NAMES[index]; +} + +export const FurnitureSpamWallPostItView: FC<{}> = props => +{ + const { objectId = -1, color = '0', setColor = null, text = '', setText = null, canModify = false, onClose = null } = useFurnitureSpamWallPostItWidget(); + + if(objectId === -1) return null; + + return ( + +
+
+
+ { canModify && + <> +
+ { STICKIE_COLORS.map(color => + { + return
setColor(color) } style={ { backgroundColor: ColorUtils.makeColorHex(color) } } /> + }) } + } +
+
+
+
+ +
+
+ + ); +} diff --git a/src/components/room/widgets/furniture/FurnitureWidgetsView.tsx b/src/components/room/widgets/furniture/FurnitureWidgetsView.tsx index 7850e936..207d934a 100644 --- a/src/components/room/widgets/furniture/FurnitureWidgetsView.tsx +++ b/src/components/room/widgets/furniture/FurnitureWidgetsView.tsx @@ -12,6 +12,7 @@ import { FurnitureHighScoreView } from './FurnitureHighScoreView'; import { FurnitureInternalLinkView } from './FurnitureInternalLinkView'; import { FurnitureMannequinView } from './FurnitureMannequinView'; import { FurnitureRoomLinkView } from './FurnitureRoomLinkView'; +import { FurnitureSpamWallPostItView } from './FurnitureSpamWallPostItView'; import { FurnitureStackHeightView } from './FurnitureStackHeightView'; import { FurnitureStickieView } from './FurnitureStickieView'; import { FurnitureTrophyView } from './FurnitureTrophyView'; @@ -23,7 +24,6 @@ export const FurnitureWidgetsView: FC<{}> = props => - @@ -33,6 +33,8 @@ export const FurnitureWidgetsView: FC<{}> = props => + + diff --git a/src/hooks/inventory/useInventoryFurni.ts b/src/hooks/inventory/useInventoryFurni.ts index 15b2d0a4..47b1e989 100644 --- a/src/hooks/inventory/useInventoryFurni.ts +++ b/src/hooks/inventory/useInventoryFurni.ts @@ -17,6 +17,34 @@ const useInventoryFurniState = () => const { isVisible = false, activate = null, deactivate = null } = useSharedVisibility(); const { isUnseen = null, resetCategory = null } = useInventoryUnseenTracker(); + const getWallItemById = (id: number) => + { + if(!groupItems || !groupItems.length) return; + + for(const groupItem of groupItems) + { + const item = groupItem.getItemById(id); + + if(item && item.isWallItem) return groupItem; + } + + return null; + } + + const getFloorItemById = (id: number) => + { + if(!groupItems || !groupItems.length) return; + + for(const groupItem of groupItems) + { + const item = groupItem.getItemById(id); + + if(item && !item.isWallItem) return groupItem; + } + + return null; + } + useMessageEvent(FurnitureListAddOrUpdateEvent, event => { const parser = event.getParser(); @@ -257,7 +285,7 @@ const useInventoryFurniState = () => setNeedsUpdate(false); }, [ isVisible, needsUpdate ]); - return { isVisible, groupItems, setGroupItems, selectedItem, setSelectedItem, activate, deactivate }; + return { isVisible, groupItems, setGroupItems, selectedItem, setSelectedItem, activate, deactivate, getWallItemById, getFloorItemById }; } export const useInventoryFurni = () => useBetween(useInventoryFurniState); diff --git a/src/hooks/rooms/widgets/furniture/index.ts b/src/hooks/rooms/widgets/furniture/index.ts index ddc0a2fb..58a31058 100644 --- a/src/hooks/rooms/widgets/furniture/index.ts +++ b/src/hooks/rooms/widgets/furniture/index.ts @@ -10,6 +10,7 @@ export * from './useFurnitureInternalLinkWidget'; export * from './useFurnitureMannequinWidget'; export * from './useFurniturePresentWidget'; export * from './useFurnitureRoomLinkWidget'; +export * from './useFurnitureSpamWallPostItWidget'; export * from './useFurnitureStackHeightWidget'; export * from './useFurnitureStickieWidget'; export * from './useFurnitureTrophyWidget'; diff --git a/src/hooks/rooms/widgets/furniture/useFurnitureSpamWallPostItWidget.ts b/src/hooks/rooms/widgets/furniture/useFurnitureSpamWallPostItWidget.ts new file mode 100644 index 00000000..64f89b0b --- /dev/null +++ b/src/hooks/rooms/widgets/furniture/useFurnitureSpamWallPostItWidget.ts @@ -0,0 +1,59 @@ +import { AddSpamWallPostItMessageComposer, RequestSpamWallPostItMessageEvent, RoomObjectCategory } from '@nitrots/nitro-renderer'; +import { useState } from 'react'; +import { GetRoomEngine, SendMessageComposer } from '../../../../api'; +import { useMessageEvent } from '../../../events'; +import { useInventoryFurni } from '../../../inventory'; + +const useFurnitureSpamWallPostItWidgetState = () => +{ + const [ objectId, setObjectId ] = useState(-1); + const [ category, setCategory ] = useState(-1); + const [ itemType, setItemType ] = useState(''); + const [ location, setLocation ] = useState(''); + const [ color, setColor ] = useState('0'); + const [ text, setText ] = useState(''); + const [ canModify, setCanModify ] = useState(false); + const { getWallItemById = null } = useInventoryFurni(); + + const onClose = () => + { + SendMessageComposer(new AddSpamWallPostItMessageComposer(objectId, location, color, text)); + + setObjectId(-1); + setCategory(-1); + setItemType(''); + setLocation(''); + setColor('0'); + setText(''); + setCanModify(false); + } + + useMessageEvent(RequestSpamWallPostItMessageEvent, event => + { + const parser = event.getParser(); + + setObjectId(parser.itemId); + setCategory(RoomObjectCategory.WALL); + + const inventoryItem = getWallItemById(parser.itemId); + + let itemType = 'post_it'; + + if(inventoryItem) + { + const wallItemType = GetRoomEngine().getFurnitureWallName(inventoryItem.type); + + if(wallItemType.match('post_it_')) itemType = wallItemType; + } + + setItemType(itemType); + setLocation(parser.location); + setColor('FFFF33'); + setText(''); + setCanModify(true); + }); + + return { objectId, color, setColor, text, setText, canModify, onClose }; +} + +export const useFurnitureSpamWallPostItWidget = useFurnitureSpamWallPostItWidgetState;