From 195f3815cb1bdadb100f89183d1ac5297566eb29 Mon Sep 17 00:00:00 2001 From: Bill Date: Tue, 5 Oct 2021 15:52:52 -0400 Subject: [PATCH 01/12] Achievement updates --- src/views/achievements/AchievementsView.tsx | 11 +++++-- .../common/GetAchievementLevel.ts | 8 +++++ .../common/GetScaledProgressPercent.ts | 8 +++++ .../AchievementDetailsView.tsx | 32 +++++++++---------- .../achievement-list/AchievementListView.tsx | 4 +-- 5 files changed, 42 insertions(+), 21 deletions(-) create mode 100644 src/views/achievements/common/GetAchievementLevel.ts create mode 100644 src/views/achievements/common/GetScaledProgressPercent.ts diff --git a/src/views/achievements/AchievementsView.tsx b/src/views/achievements/AchievementsView.tsx index 9ef315a6..a3bfbaca 100644 --- a/src/views/achievements/AchievementsView.tsx +++ b/src/views/achievements/AchievementsView.tsx @@ -158,6 +158,11 @@ export const AchievementsView: FC = props => return progress; }, [ achievementCategories ]); + const scaledProgressPercent = useMemo(() => + { + return ~~((((getProgress - 0) * (100 - 0)) / (getMaxProgress - 0)) + 0); + }, [ getProgress, getMaxProgress ]); + const getSelectedCategory = useMemo(() => { if(!achievementCategories || !achievementCategories.length) return null; @@ -220,8 +225,10 @@ export const AchievementsView: FC = props => <> - - { LocalizeText('achievements.categories.totalprogress', [ 'progress', 'limit' ], [ getProgress.toString(), getMaxProgress.toString() ]) } + + + { LocalizeText('achievements.categories.totalprogress', [ 'progress', 'limit' ], [ getProgress.toString(), getMaxProgress.toString() ]) } + { LocalizeText('achievements.categories.score', [ 'score' ], [ achievementScore.toString() ]) } diff --git a/src/views/achievements/common/GetAchievementLevel.ts b/src/views/achievements/common/GetAchievementLevel.ts new file mode 100644 index 00000000..c62bf7aa --- /dev/null +++ b/src/views/achievements/common/GetAchievementLevel.ts @@ -0,0 +1,8 @@ +import { AchievementData } from '@nitrots/nitro-renderer'; + +export const GetAchievementLevel = (achievement: AchievementData) => +{ + if(achievement.finalLevel) return achievement.level; + + return (achievement.level - 1); +} diff --git a/src/views/achievements/common/GetScaledProgressPercent.ts b/src/views/achievements/common/GetScaledProgressPercent.ts new file mode 100644 index 00000000..8708a709 --- /dev/null +++ b/src/views/achievements/common/GetScaledProgressPercent.ts @@ -0,0 +1,8 @@ +import { AchievementData } from '@nitrots/nitro-renderer'; + +export const GetScaledProgressPercent = (achievement: AchievementData) => +{ + if(!achievement) return 0; + + return ~~(((((achievement.currentPoints + achievement.scoreAtStartOfLevel) - 0) * (100 - 0)) / ((achievement.scoreLimit + achievement.scoreAtStartOfLevel) - 0)) + 0); +} diff --git a/src/views/achievements/views/achievement-details/AchievementDetailsView.tsx b/src/views/achievements/views/achievement-details/AchievementDetailsView.tsx index be50d707..5ab5d320 100644 --- a/src/views/achievements/views/achievement-details/AchievementDetailsView.tsx +++ b/src/views/achievements/views/achievement-details/AchievementDetailsView.tsx @@ -1,9 +1,11 @@ -import { FC, useMemo } from 'react'; +import { FC } from 'react'; import { LocalizeBadgeDescription, LocalizeBadgeName, LocalizeText } from '../../../../api'; import { NitroLayoutFlex, NitroLayoutFlexColumn } from '../../../../layout'; import { NitroLayoutBase } from '../../../../layout/base'; import { CurrencyIcon } from '../../../shared/currency-icon/CurrencyIcon'; import { AchievementUtilities } from '../../common/AchievementUtilities'; +import { GetAchievementLevel } from '../../common/GetAchievementLevel'; +import { GetScaledProgressPercent } from '../../common/GetScaledProgressPercent'; import { AchievementBadgeView } from '../achievement-badge/AchievementBadgeView'; import { AchievementDetailsViewProps } from './AchievementDetailsView.types'; @@ -11,25 +13,17 @@ export const AchievementDetailsView: FC = props => { const { achievement = null } = props; - const getAchievementLevel = useMemo(() => - { - if(achievement.finalLevel) return achievement.level; - - return (achievement.level - 1); - }, [ achievement ]); - if(!achievement) return null; - const currentAmount = achievement.currentPoints; - const maxAmount = achievement.scoreLimit; - const scoreAtStartOfLevel = achievement.scoreAtStartOfLevel; + const achievementLevel = GetAchievementLevel(achievement); + const scaledProgressPercent = GetScaledProgressPercent(achievement); return ( - { LocalizeText('achievements.details.level', [ 'level', 'limit' ], [ getAchievementLevel.toString(), achievement.levelCount.toString() ]) } + { LocalizeText('achievements.details.level', [ 'level', 'limit' ], [ achievementLevel.toString(), achievement.levelCount.toString() ]) } @@ -41,20 +35,24 @@ export const AchievementDetailsView: FC = props => { LocalizeBadgeDescription(AchievementUtilities.getBadgeCode(achievement)) } - { ((achievement.levelRewardPoints > 0) || (maxAmount > 0)) && + { ((achievement.levelRewardPoints > 0) || (achievement.scoreLimit > 0)) && { (achievement.levelRewardPoints > 0) && - + { LocalizeText('achievements.details.reward') } - + { achievement.levelRewardPoints } } - { (maxAmount > 0) && - LocalizeText('achievements.details.progress', [ 'progress', 'limit' ], [ (currentAmount + scoreAtStartOfLevel).toString(), (maxAmount + scoreAtStartOfLevel).toString() ]) } + { (achievement.scoreLimit > 0) && + + + { LocalizeText('achievements.details.progress', [ 'progress', 'limit' ], [ (achievement.currentPoints + achievement.scoreAtStartOfLevel).toString(), (achievement.scoreLimit + achievement.scoreAtStartOfLevel).toString() ]) } + + } } diff --git a/src/views/achievements/views/achievement-list/AchievementListView.tsx b/src/views/achievements/views/achievement-list/AchievementListView.tsx index 8cb6d7e1..4475e263 100644 --- a/src/views/achievements/views/achievement-list/AchievementListView.tsx +++ b/src/views/achievements/views/achievement-list/AchievementListView.tsx @@ -9,9 +9,9 @@ export const AchievementListView: FC = props => return ( - { achievements && (achievements.length > 0) && achievements.map(achievement => + { achievements && (achievements.length > 0) && achievements.map((achievement, index) => { - return setSelectedAchievementId(achievement.achievementId) } />; + return setSelectedAchievementId(achievement.achievementId) } />; }) } ); From 89eb5fd658f014893f5e89850ce88cd8a5d4c455 Mon Sep 17 00:00:00 2001 From: Bill Date: Tue, 5 Oct 2021 15:53:16 -0400 Subject: [PATCH 02/12] Layout changes --- src/layout/card/NitroCardView.scss | 26 +++++++- src/layout/common/NitroLayoutSpacing.type.ts | 2 +- .../draggable-window/DraggableWindow.tsx | 63 ++++++++++++++++--- .../NotificationBubbleView.tsx | 42 +++++++++---- .../NotificationBubbleView.types.ts | 5 +- src/layout/trophy/NitroLayoutTrophyView.scss | 1 + 6 files changed, 114 insertions(+), 25 deletions(-) diff --git a/src/layout/card/NitroCardView.scss b/src/layout/card/NitroCardView.scss index 9f11cdef..b604cd44 100644 --- a/src/layout/card/NitroCardView.scss +++ b/src/layout/card/NitroCardView.scss @@ -13,6 +13,7 @@ $nitro-card-tabs-height: 33px; width: 100%; height: 100%; pointer-events: none; + overflow: hidden; .theme-primary { border: $border-width solid $border-color; @@ -25,7 +26,7 @@ $nitro-card-tabs-height: 33px; left: 0 !important; width: 100%; height: 100%; - transform: none !important; + //transform: none !important; overflow: hidden; } @@ -39,6 +40,29 @@ $nitro-card-tabs-height: 33px; // } } } + + @include media-breakpoint-down(sm) { + + .draggable-window { + top: 0 !important; + left: 0 !important; + width: 100%; + height: 100%; + //transform: none !important; + overflow: hidden; + } + + .nitro-card { + width: 100%; + max-width: 100%; + max-height: calc(100% - #{$toolbar-height}); + margin: 0; + + &.rounded { + border-radius: 0 !important; + } + } + } } @import './accordion/NitroCardAccordionView'; diff --git a/src/layout/common/NitroLayoutSpacing.type.ts b/src/layout/common/NitroLayoutSpacing.type.ts index 96e53311..4f2bd26a 100644 --- a/src/layout/common/NitroLayoutSpacing.type.ts +++ b/src/layout/common/NitroLayoutSpacing.type.ts @@ -1 +1 @@ -export type NitroLayoutSpacing = 1 | 2 | 3 | 4 | 5; +export type NitroLayoutSpacing = 0 | 1 | 2 | 3 | 4 | 5; diff --git a/src/layout/draggable-window/DraggableWindow.tsx b/src/layout/draggable-window/DraggableWindow.tsx index a5cab370..d9d1fb03 100644 --- a/src/layout/draggable-window/DraggableWindow.tsx +++ b/src/layout/draggable-window/DraggableWindow.tsx @@ -1,5 +1,5 @@ -import { MouseEventType } from '@nitrots/nitro-renderer'; -import { FC, Key, MouseEvent as ReactMouseEvent, useCallback, useEffect, useRef, useState } from 'react'; +import { MouseEventType, TouchEventType } from '@nitrots/nitro-renderer'; +import { FC, Key, MouseEvent as ReactMouseEvent, TouchEvent as ReactTouchEvent, useCallback, useEffect, useRef, useState } from 'react'; import { DraggableWindowPosition, DraggableWindowProps } from './DraggableWindow.types'; const CURRENT_WINDOWS: HTMLElement[] = []; @@ -29,7 +29,7 @@ export const DraggableWindow: FC = props => } }, []); - const onMouseDown = useCallback((event: ReactMouseEvent) => + const moveCurrentWindow = useCallback(() => { const index = CURRENT_WINDOWS.indexOf(elementRef.current); @@ -50,18 +50,47 @@ export const DraggableWindow: FC = props => bringToTop(); }, [ bringToTop ]); - const onDragMouseDown = useCallback((event: MouseEvent) => + const onMouseDown = useCallback((event: ReactMouseEvent) => { - setStart({ x: event.clientX, y: event.clientY }); + moveCurrentWindow(); + }, [ moveCurrentWindow ]); + + const onTouchStart = useCallback((event: ReactTouchEvent) => + { + moveCurrentWindow(); + }, [ moveCurrentWindow ]); + + const startDragging = useCallback((startX: number, startY: number) => + { + setStart({ x: startX, y: startY }); setIsDragging(true); }, []); + const onDragMouseDown = useCallback((event: MouseEvent) => + { + startDragging(event.clientX, event.clientY); + }, [ startDragging ]); + + const onTouchDown = useCallback((event: TouchEvent) => + { + const touch = event.touches[0]; + + startDragging(touch.clientX, touch.clientY); + }, [ startDragging ]); + const onDragMouseMove = useCallback((event: MouseEvent) => { setDelta({ x: (event.clientX - start.x), y: (event.clientY - start.y) }); }, [ start ]); - const onDragMouseUp = useCallback((event: MouseEvent) => + const onDragTouchMove = useCallback((event: TouchEvent) => + { + const touch = event.touches[0]; + + setDelta({ x: (touch.clientX - start.x), y: (touch.clientY - start.y) }); + }, [ start ]); + + const completeDrag = useCallback(() => { if(!elementRef.current || !dragHandler) return; @@ -98,6 +127,16 @@ export const DraggableWindow: FC = props => if(uniqueKey !== null) POS_MEMORY.set(uniqueKey, { x: offsetX, y: offsetY }); }, [ dragHandler, delta, offset, uniqueKey ]); + const onDragMouseUp = useCallback((event: MouseEvent) => + { + completeDrag(); + }, [ completeDrag ]); + + const onDragTouchUp = useCallback((event: TouchEvent) => + { + completeDrag(); + }, [ completeDrag ]); + useEffect(() => { const element = (elementRef.current as HTMLElement); @@ -169,29 +208,35 @@ export const DraggableWindow: FC = props => if(!dragHandler) return; dragHandler.addEventListener(MouseEventType.MOUSE_DOWN, onDragMouseDown); + dragHandler.addEventListener(TouchEventType.TOUCH_START, onTouchDown); return () => { dragHandler.removeEventListener(MouseEventType.MOUSE_DOWN, onDragMouseDown); + dragHandler.removeEventListener(TouchEventType.TOUCH_START, onTouchDown); } - }, [ dragHandler, onDragMouseDown ]); + }, [ dragHandler, onDragMouseDown, onTouchDown ]); useEffect(() => { if(!isDragging) return; document.addEventListener(MouseEventType.MOUSE_UP, onDragMouseUp); + document.addEventListener(TouchEventType.TOUCH_END, onDragTouchUp); document.addEventListener(MouseEventType.MOUSE_MOVE, onDragMouseMove); + document.addEventListener(TouchEventType.TOUCH_MOVE, onDragTouchMove); return () => { document.removeEventListener(MouseEventType.MOUSE_UP, onDragMouseUp); + document.removeEventListener(TouchEventType.TOUCH_END, onDragTouchUp); document.removeEventListener(MouseEventType.MOUSE_MOVE, onDragMouseMove); + document.removeEventListener(TouchEventType.TOUCH_MOVE, onDragTouchMove); } - }, [ isDragging, onDragMouseUp, onDragMouseMove ]); + }, [ isDragging, onDragMouseUp, onDragMouseMove, onDragTouchUp, onDragTouchMove ]); return ( -
+
{ children }
); diff --git a/src/layout/notification-bubble/NotificationBubbleView.tsx b/src/layout/notification-bubble/NotificationBubbleView.tsx index 49a45b9f..5c91505d 100644 --- a/src/layout/notification-bubble/NotificationBubbleView.tsx +++ b/src/layout/notification-bubble/NotificationBubbleView.tsx @@ -1,28 +1,46 @@ -import { FC, useEffect, useState } from 'react'; +import { FC, useEffect, useMemo, useState } from 'react'; +import { NitroLayoutBase } from '../base'; +import { TransitionAnimation, TransitionAnimationTypes } from '../transitions'; import { NotificationBubbleViewProps } from './NotificationBubbleView.types'; export const NotificationBubbleView: FC = props => { - const { fadesOut = false, close = null, className = '', children = null, ...rest } = props; - const [ isFading, setIsFading ] = useState(false); + const { fadesOut = true, timeoutMs = 8000, close = null, className = '', ...rest } = props; + const [ isVisible, setIsVisible ] = useState(false); + + const getClassName = useMemo(() => + { + let newClassName = 'nitro-notification-bubble rounded'; + + if(className && className.length) newClassName += ` ${ className }`; + + return newClassName; + }, [ className ]); + + useEffect(() => + { + setIsVisible(true); + + return () => setIsVisible(false); + }, []); useEffect(() => { if(!fadesOut) return; const timeout = setTimeout(() => - { - setIsFading(true); + { + setIsVisible(false); - setTimeout(() => close()); - }, 8000); + setTimeout(() => close(), 300); + }, timeoutMs); return () => clearTimeout(timeout); - }, [ fadesOut, close ]); + }, [ fadesOut, timeoutMs, close ]); return ( -
- { children } -
- ) + + + + ); } diff --git a/src/layout/notification-bubble/NotificationBubbleView.types.ts b/src/layout/notification-bubble/NotificationBubbleView.types.ts index 1fac4e46..5c160b4e 100644 --- a/src/layout/notification-bubble/NotificationBubbleView.types.ts +++ b/src/layout/notification-bubble/NotificationBubbleView.types.ts @@ -1,7 +1,8 @@ -import { DetailsHTMLAttributes } from 'react'; +import { NitroLayoutBaseProps } from '../base'; -export interface NotificationBubbleViewProps extends DetailsHTMLAttributes +export interface NotificationBubbleViewProps extends NitroLayoutBaseProps { fadesOut?: boolean; + timeoutMs?: number; close: () => void; } diff --git a/src/layout/trophy/NitroLayoutTrophyView.scss b/src/layout/trophy/NitroLayoutTrophyView.scss index edcc05f8..795169b4 100644 --- a/src/layout/trophy/NitroLayoutTrophyView.scss +++ b/src/layout/trophy/NitroLayoutTrophyView.scss @@ -3,6 +3,7 @@ width: 340px; height: 173px; color: black; + pointer-events: all; background-position: 0px 0px; background-image: url('../../assets/images/room-widgets/trophy-widget/trophy-spritesheet.png'); From df11039759a93e4c20672dd36f90e6c43e7200d5 Mon Sep 17 00:00:00 2001 From: Bill Date: Thu, 7 Oct 2021 01:08:42 -0400 Subject: [PATCH 03/12] Update mannequin widget --- .../events/RoomWidgetUpdateMannequinEvent.ts | 41 ++ src/api/nitro/room/widgets/events/index.ts | 1 + .../FurnitureMannequinWidgetHandler.ts | 54 +++ src/api/nitro/room/widgets/handlers/index.ts | 1 + src/views/room/RoomView.tsx | 3 +- .../mannequin/FurnitureMannequinView.tsx | 353 ++++++++++-------- .../mannequin/common/MannequinViewMode.ts | 8 - .../preview/FurnitureMannequinPreviewView.tsx | 17 + .../FurnitureMannequinPreviewView.types.ts | 5 + 9 files changed, 311 insertions(+), 172 deletions(-) create mode 100644 src/api/nitro/room/widgets/events/RoomWidgetUpdateMannequinEvent.ts create mode 100644 src/api/nitro/room/widgets/handlers/FurnitureMannequinWidgetHandler.ts delete mode 100644 src/views/room/widgets/furniture/mannequin/common/MannequinViewMode.ts create mode 100644 src/views/room/widgets/furniture/mannequin/views/preview/FurnitureMannequinPreviewView.tsx create mode 100644 src/views/room/widgets/furniture/mannequin/views/preview/FurnitureMannequinPreviewView.types.ts diff --git a/src/api/nitro/room/widgets/events/RoomWidgetUpdateMannequinEvent.ts b/src/api/nitro/room/widgets/events/RoomWidgetUpdateMannequinEvent.ts new file mode 100644 index 00000000..1894a9fb --- /dev/null +++ b/src/api/nitro/room/widgets/events/RoomWidgetUpdateMannequinEvent.ts @@ -0,0 +1,41 @@ +import { RoomWidgetUpdateEvent } from './RoomWidgetUpdateEvent'; + +export class RoomWidgetUpdateMannequinEvent extends RoomWidgetUpdateEvent +{ + public static MANNEQUIN_UPDATE: string = 'RWUME_MANNEQUIN_UPDATE'; + + private _objectId: number; + private _figure: string; + private _gender: string; + private _name: string; + + constructor(type: string, objectId: number, figure: string, gender: string, name: string) + { + super(type); + + this._objectId = objectId; + this._figure = figure; + this._gender = gender; + this._name = name; + } + + public get objectId(): number + { + return this._objectId; + } + + public get figure(): string + { + return this._figure; + } + + public get gender(): string + { + return this._gender; + } + + public get name(): string + { + return this._name; + } +} diff --git a/src/api/nitro/room/widgets/events/index.ts b/src/api/nitro/room/widgets/events/index.ts index 775d210e..d79b9855 100644 --- a/src/api/nitro/room/widgets/events/index.ts +++ b/src/api/nitro/room/widgets/events/index.ts @@ -24,6 +24,7 @@ export * from './RoomWidgetUpdateInfostandFurniEvent'; export * from './RoomWidgetUpdateInfostandPetEvent'; export * from './RoomWidgetUpdateInfostandRentableBotEvent'; export * from './RoomWidgetUpdateInfostandUserEvent'; +export * from './RoomWidgetUpdateMannequinEvent'; export * from './RoomWidgetUpdatePresentDataEvent'; export * from './RoomWidgetUpdateRentableBotChatEvent'; export * from './RoomWidgetUpdateRoomViewEvent'; diff --git a/src/api/nitro/room/widgets/handlers/FurnitureMannequinWidgetHandler.ts b/src/api/nitro/room/widgets/handlers/FurnitureMannequinWidgetHandler.ts new file mode 100644 index 00000000..a2fc46bd --- /dev/null +++ b/src/api/nitro/room/widgets/handlers/FurnitureMannequinWidgetHandler.ts @@ -0,0 +1,54 @@ +import { NitroEvent, RoomEngineTriggerWidgetEvent, RoomObjectVariable, RoomWidgetEnum } from '@nitrots/nitro-renderer'; +import { RoomWidgetUpdateMannequinEvent } from '..'; +import { GetRoomEngine } from '../../GetRoomEngine'; +import { RoomWidgetUpdateEvent } from '../events/RoomWidgetUpdateEvent'; +import { RoomWidgetMessage } from '../messages/RoomWidgetMessage'; +import { RoomWidgetHandler } from './RoomWidgetHandler'; + +export class FurnitureMannequinWidgetHandler extends RoomWidgetHandler +{ + public processEvent(event: NitroEvent): void + { + switch(event.type) + { + case RoomEngineTriggerWidgetEvent.REQUEST_MANNEQUIN: { + const widgetEvent = (event as RoomEngineTriggerWidgetEvent); + const roomObject = GetRoomEngine().getRoomObject(widgetEvent.roomId, widgetEvent.objectId, widgetEvent.category); + + if(!roomObject) return; + + const model = roomObject.model; + const figure = model.getValue(RoomObjectVariable.FURNITURE_MANNEQUIN_FIGURE); + const gender = model.getValue(RoomObjectVariable.FURNITURE_MANNEQUIN_GENDER); + const name = model.getValue(RoomObjectVariable.FURNITURE_MANNEQUIN_NAME); + + this.container.eventDispatcher.dispatchEvent(new RoomWidgetUpdateMannequinEvent(RoomWidgetUpdateMannequinEvent.MANNEQUIN_UPDATE, roomObject.id, figure, gender, name)); + return; + } + } + } + + public processWidgetMessage(message: RoomWidgetMessage): RoomWidgetUpdateEvent + { + switch(message.type) + { + } + + return null; + } + + public get type(): string + { + return RoomWidgetEnum.MANNEQUIN; + } + + public get eventTypes(): string[] + { + return [ RoomEngineTriggerWidgetEvent.REQUEST_MANNEQUIN ]; + } + + public get messageTypes(): string[] + { + return []; + } +} diff --git a/src/api/nitro/room/widgets/handlers/index.ts b/src/api/nitro/room/widgets/handlers/index.ts index f2a12569..51f10e1a 100644 --- a/src/api/nitro/room/widgets/handlers/index.ts +++ b/src/api/nitro/room/widgets/handlers/index.ts @@ -5,6 +5,7 @@ export * from './FurnitureCreditWidgetHandler'; export * from './FurnitureCustomStackHeightWidgetHandler'; export * from './FurnitureDimmerWidgetHandler'; export * from './FurnitureExternalImageWidgetHandler'; +export * from './FurnitureMannequinWidgetHandler'; export * from './FurniturePresentWidgetHandler'; export * from './IRoomWidgetHandler'; export * from './IRoomWidgetHandlerManager'; diff --git a/src/views/room/RoomView.tsx b/src/views/room/RoomView.tsx index 7c9e4252..2ad37017 100644 --- a/src/views/room/RoomView.tsx +++ b/src/views/room/RoomView.tsx @@ -1,6 +1,6 @@ import { EventDispatcher, NitroRectangle, RoomGeometry, RoomVariableEnum, Vector3d } from '@nitrots/nitro-renderer'; import { FC, useEffect, useRef, useState } from 'react'; -import { DispatchMouseEvent, DispatchTouchEvent, DoorbellWidgetHandler, FurniChooserWidgetHandler, FurnitureContextMenuWidgetHandler, FurnitureCreditWidgetHandler, FurnitureCustomStackHeightWidgetHandler, FurnitureDimmerWidgetHandler, FurnitureExternalImageWidgetHandler, FurniturePresentWidgetHandler, GetNitroInstance, GetRoomEngine, InitializeRoomInstanceRenderingCanvas, IRoomWidgetHandlerManager, RoomWidgetAvatarInfoHandler, RoomWidgetChatHandler, RoomWidgetChatInputHandler, RoomWidgetHandlerManager, RoomWidgetInfostandHandler, RoomWidgetRoomToolsHandler, RoomWidgetUpdateRoomViewEvent, UserChooserWidgetHandler } from '../../api'; +import { DispatchMouseEvent, DispatchTouchEvent, DoorbellWidgetHandler, FurniChooserWidgetHandler, FurnitureContextMenuWidgetHandler, FurnitureCreditWidgetHandler, FurnitureCustomStackHeightWidgetHandler, FurnitureDimmerWidgetHandler, FurnitureExternalImageWidgetHandler, FurnitureMannequinWidgetHandler, FurniturePresentWidgetHandler, GetNitroInstance, GetRoomEngine, InitializeRoomInstanceRenderingCanvas, IRoomWidgetHandlerManager, RoomWidgetAvatarInfoHandler, RoomWidgetChatHandler, RoomWidgetChatInputHandler, RoomWidgetHandlerManager, RoomWidgetInfostandHandler, RoomWidgetRoomToolsHandler, RoomWidgetUpdateRoomViewEvent, UserChooserWidgetHandler } from '../../api'; import { RoomContextProvider } from './context/RoomContext'; import { RoomColorView } from './RoomColorView'; import { RoomViewProps } from './RoomView.types'; @@ -44,6 +44,7 @@ export const RoomView: FC = props => widgetHandlerManager.registerHandler(new FurnitureExternalImageWidgetHandler()); widgetHandlerManager.registerHandler(new FurniturePresentWidgetHandler()); widgetHandlerManager.registerHandler(new FurnitureDimmerWidgetHandler()); + widgetHandlerManager.registerHandler(new FurnitureMannequinWidgetHandler()); setWidgetHandler(widgetHandlerManager); diff --git a/src/views/room/widgets/furniture/mannequin/FurnitureMannequinView.tsx b/src/views/room/widgets/furniture/mannequin/FurnitureMannequinView.tsx index 5e3a3972..32929af4 100644 --- a/src/views/room/widgets/furniture/mannequin/FurnitureMannequinView.tsx +++ b/src/views/room/widgets/furniture/mannequin/FurnitureMannequinView.tsx @@ -1,15 +1,29 @@ -import { AvatarFigurePartType, FurnitureMannequinSaveLookComposer, FurnitureMannequinSaveNameComposer, FurnitureMultiStateComposer, IAvatarFigureContainer, NitroEvent, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer'; +import { AvatarFigurePartType, FurnitureMannequinSaveLookComposer, FurnitureMannequinSaveNameComposer, FurnitureMultiStateComposer, HabboClubLevelEnum, IAvatarFigureContainer, RoomControllerLevel } from '@nitrots/nitro-renderer'; import { FC, KeyboardEvent, useCallback, useEffect, useState } from 'react'; -import { GetAvatarRenderManager, GetNitroInstance, GetRoomEngine, GetRoomSession, GetSessionDataManager, LocalizeText, RoomWidgetRoomObjectUpdateEvent } from '../../../../../api'; +import { GetAvatarRenderManager, GetSessionDataManager, LocalizeText, RoomWidgetUpdateMannequinEvent } from '../../../../../api'; +import { BatchUpdates, SendMessageHook } from '../../../../../hooks'; import { CreateEventDispatcherHook } from '../../../../../hooks/events/event-dispatcher.base'; -import { useRoomEngineEvent } from '../../../../../hooks/events/nitro/room/room-engine-event'; -import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../../layout'; -import { AvatarImageView } from '../../../../shared/avatar-image/AvatarImageView'; +import { NitroCardContentView, NitroCardHeaderView, NitroCardView, NitroLayoutButton, NitroLayoutFlex, NitroLayoutFlexColumn, NitroLayoutGrid, NitroLayoutGridColumn } from '../../../../../layout'; +import { NitroLayoutBase } from '../../../../../layout/base'; import { useRoomContext } from '../../../context/RoomContext'; -import { MannequinViewMode } from './common/MannequinViewMode'; -import { FurnitureMannequinData } from './FurnitureMannequinData'; +import { FurnitureMannequinPreviewView } from './views/preview/FurnitureMannequinPreviewView'; -const parts = [ +const MODE_NONE: number = -1; +const MODE_CONTROLLER: number = 0; +const MODE_UPDATE: number = 1; +const MODE_PEER: number = 2; +const MODE_NO_CLUB: number = 3; +const MODE_WRONG_GENDER: number = 4; + +const ACTION_CLOSE: number = 0; +const ACTION_SET_NAME: number = 1; +const ACTION_LOAD_FIGURE: number = 2; +const ACTION_WEAR: number = 3; +const ACTION_SAVE: number = 4; +const ACTION_BACK: number = 5; + +const MANNEQUIN_FIGURE = ['hd', 99999, [ 99998 ]]; +const MANNEQUIN_CLOTHING_PART_TYPES = [ AvatarFigurePartType.CHEST_ACCESSORY, AvatarFigurePartType.COAT_CHEST, AvatarFigurePartType.CHEST, @@ -17,197 +31,210 @@ const parts = [ AvatarFigurePartType.SHOES, AvatarFigurePartType.WAIST_ACCESSORY ]; -const baseAvatar = ['hd', 99999, 99998]; export const FurnitureMannequinView: FC<{}> = props => { - const { eventDispatcher = null } = useRoomContext(); - - const [ mannequinData, setMannequinData ] = useState(null); - const [ viewMode, setViewMode ] = useState(''); + const [ objectId, setObjectId ] = useState(-1); + const [ figure, setFigure ] = useState(null); + const [ gender, setGender ] = useState(null); + const [ name, setName ] = useState(null); + const [ clubLevel, setClubLevel ] = useState(HabboClubLevelEnum.NO_CLUB); + const [ renderedFigure, setRenderedFigure ] = useState(null); + const [ renderedClubLevel, setRenderedClubLevel ] = useState(HabboClubLevelEnum.NO_CLUB); + const [ mode, setMode ] = useState(MODE_NONE); + const { roomSession = null, eventDispatcher = null } = useRoomContext(); - const loadMannequinFigure = useCallback((figureContainer: IAvatarFigureContainer) => - { - for(const item of figureContainer.getPartTypeIds()) - { - if(parts.indexOf(item) === -1) - { - figureContainer.removePart(item); - } - } - - figureContainer.updatePart(baseAvatar[0].toString(), Number(baseAvatar[1]), [ Number(baseAvatar[2]) ]); - - setMannequinData(mannequinData => new FurnitureMannequinData(mannequinData.objectId, mannequinData.category, mannequinData.name, mannequinData.figure, mannequinData.gender, mannequinData.clubLevel, figureContainer.getFigureString())); - }, []); - - useEffect(() => + const onRoomWidgetUpdateMannequinEvent = useCallback((event: RoomWidgetUpdateMannequinEvent) => { - if(mannequinData && !mannequinData.renderedFigure) - { - const figureContainer = GetAvatarRenderManager().createFigureContainer(mannequinData.figure); - loadMannequinFigure(figureContainer); - } - }, [loadMannequinFigure, mannequinData]); + const figureContainer = GetAvatarRenderManager().createFigureContainer(event.figure); + const figureClubLevel = GetAvatarRenderManager().getFigureClubLevel(figureContainer, event.gender, MANNEQUIN_CLOTHING_PART_TYPES); - const loadViewMode = useCallback((mannequinData: FurnitureMannequinData) => - { - if(!mannequinData) return; - - const userCanEdit = (GetRoomSession().isRoomOwner || GetSessionDataManager().isModerator); - const userGender = GetNitroInstance().sessionDataManager.gender; - const userClubLevel = GetNitroInstance().sessionDataManager.clubLevel; - - if(userCanEdit) + BatchUpdates(() => { - setViewMode(MannequinViewMode.EDIT); - } - else - { - if(!mannequinData.figure || mannequinData.figure.length <= 1) return; + setObjectId(event.objectId); + setFigure(event.figure); + setGender(event.gender); + setName(event.name); + setClubLevel(figureClubLevel); - if(userGender.toUpperCase() !== mannequinData.gender.toUpperCase()) + if(roomSession.isRoomOwner || (roomSession.controllerLevel >= RoomControllerLevel.GUEST) || GetSessionDataManager().isModerator) { - setViewMode(MannequinViewMode.INCOMPATIBLE_GENDER); + setMode(MODE_CONTROLLER); } - else if(userClubLevel < mannequinData.clubLevel) + + else if(GetSessionDataManager().gender.toLowerCase() !== event.gender.toLowerCase()) { - setViewMode(MannequinViewMode.CLUB); + setMode(MODE_WRONG_GENDER); + } + + else if(GetSessionDataManager().clubLevel < figureClubLevel) + { + setMode(MODE_NO_CLUB); } else { - setViewMode(MannequinViewMode.DEFAULT); + setMode(MODE_PEER); } - } - }, []); + }); + }, [ roomSession ]); - const onNitroEvent = useCallback((event: NitroEvent) => + CreateEventDispatcherHook(RoomWidgetUpdateMannequinEvent.MANNEQUIN_UPDATE, eventDispatcher, onRoomWidgetUpdateMannequinEvent); + + const getMergedFigureContainer = (figure: string, targetFigure: string) => { - switch(event.type) + const figureContainer = GetAvatarRenderManager().createFigureContainer(figure); + const targetFigureContainer = GetAvatarRenderManager().createFigureContainer(targetFigure); + + for(const part of MANNEQUIN_CLOTHING_PART_TYPES) figureContainer.removePart(part); + + for(const part of targetFigureContainer.getPartTypeIds()) { - case RoomEngineTriggerWidgetEvent.REQUEST_MANNEQUIN: { - const widgetEvent = (event as RoomEngineTriggerWidgetEvent); - - const roomObject = GetRoomEngine().getRoomObject(widgetEvent.roomId, widgetEvent.objectId, widgetEvent.category); - - if(!roomObject) return; - - const figure = roomObject.model.getValue(RoomObjectVariable.FURNITURE_MANNEQUIN_FIGURE); - const gender = roomObject.model.getValue(RoomObjectVariable.FURNITURE_MANNEQUIN_GENDER); - const name = roomObject.model.getValue(RoomObjectVariable.FURNITURE_MANNEQUIN_NAME); - - const figureContainer = GetAvatarRenderManager().createFigureContainer(figure); - const clubLevel = GetAvatarRenderManager().getFigureClubLevel(figureContainer, gender, parts); - - const mannequinData = new FurnitureMannequinData(widgetEvent.objectId, widgetEvent.category, name, figure, gender, clubLevel); - - setMannequinData(mannequinData); - loadViewMode(mannequinData); - return; - } - case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: { - const widgetEvent = (event as RoomWidgetRoomObjectUpdateEvent); - - setMannequinData(prevState => - { - if(!prevState || (widgetEvent.id !== prevState.objectId) || (widgetEvent.category !== prevState.category)) return prevState; - - return null; - }); - return; - } + figureContainer.updatePart(part, targetFigureContainer.getPartSetId(part), targetFigureContainer.getPartColorIds(part)); } - }, [loadViewMode]); - useRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_MANNEQUIN, onNitroEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, eventDispatcher, onNitroEvent); + return figureContainer; + } - const processAction = useCallback((type: string, value: string = null) => + const transformAsMannequinFigure = (figureContainer: IAvatarFigureContainer) => { - switch(type) + for(const part of figureContainer.getPartTypeIds()) { - case 'close': - setMannequinData(null); - return; - case 'set_name': - setMannequinData(mannequinData => new FurnitureMannequinData(mannequinData.objectId, mannequinData.category, value, mannequinData.figure, mannequinData.gender, mannequinData.clubLevel, mannequinData.renderedFigure)); - return; - case 'load_figure': - loadMannequinFigure(GetAvatarRenderManager().createFigureContainer(GetNitroInstance().sessionDataManager.figure)); - setViewMode(MannequinViewMode.SAVE); - return; - case 'back': - loadMannequinFigure(GetAvatarRenderManager().createFigureContainer(mannequinData.figure)); - setViewMode(MannequinViewMode.EDIT); - return; - case 'save_name': - GetRoomSession().connection.send(new FurnitureMannequinSaveNameComposer(mannequinData.objectId, mannequinData.name)); - return; - case 'save_figure': - GetRoomSession().connection.send(new FurnitureMannequinSaveLookComposer(mannequinData.objectId)); - processAction('save_name'); - processAction('close'); - return; - case 'wear': - GetRoomSession().connection.send(new FurnitureMultiStateComposer(mannequinData.objectId)); - processAction('close'); + if(MANNEQUIN_CLOTHING_PART_TYPES.indexOf(part) >= 0) continue; + + figureContainer.removePart(part); + } + + figureContainer.updatePart((MANNEQUIN_FIGURE[0] as string), (MANNEQUIN_FIGURE[1] as number), (MANNEQUIN_FIGURE[2] as number[])); + }; + + const processAction = useCallback((action: number, value: string = null) => + { + switch(action) + { + case ACTION_SAVE: + SendMessageHook(new FurnitureMannequinSaveLookComposer(objectId)); + break; + case ACTION_WEAR: + SendMessageHook(new FurnitureMultiStateComposer(objectId)); + break; + case ACTION_SET_NAME: + SendMessageHook(new FurnitureMannequinSaveNameComposer(objectId, name)); return; } - }, [ loadMannequinFigure, mannequinData ]); + + setMode(MODE_NONE); + }, [ objectId, name ]); const handleKeyDown = (event: KeyboardEvent) => { if(event.key !== 'Enter') return; - processAction('save_name'); + processAction(ACTION_SET_NAME); }; - if(!mannequinData) return null; + useEffect(() => + { + switch(mode) + { + case MODE_CONTROLLER: + case MODE_WRONG_GENDER: { + const figureContainer = GetAvatarRenderManager().createFigureContainer(figure); + + transformAsMannequinFigure(figureContainer); + + setRenderedFigure(figureContainer.getFigureString()); + setRenderedClubLevel(clubLevel); + break; + } + case MODE_UPDATE: { + const figureContainer = GetAvatarRenderManager().createFigureContainer(GetSessionDataManager().figure); + + transformAsMannequinFigure(figureContainer); + + setRenderedFigure(figureContainer.getFigureString()); + setRenderedClubLevel(GetAvatarRenderManager().getFigureClubLevel(figureContainer, GetSessionDataManager().gender, MANNEQUIN_CLOTHING_PART_TYPES)); + break; + } + case MODE_PEER: + case MODE_NO_CLUB: { + const figureContainer = getMergedFigureContainer(GetSessionDataManager().figure, figure); + + setRenderedFigure(figureContainer.getFigureString()); + setRenderedClubLevel(clubLevel); + break; + } + } + }, [ mode, figure, clubLevel ]); + + if(mode === MODE_NONE) return null; return ( - processAction('close') } /> + setMode(MODE_NONE) } /> -
-
-
- -
-
-
- { viewMode === MannequinViewMode.DEFAULT && - <> -
-
{ mannequinData.name }
-
{ LocalizeText('mannequin.widget.weartext') }
-
-
processAction('wear') }>{ LocalizeText('mannequin.widget.wear') }
- } - { viewMode === MannequinViewMode.EDIT && - <> - processAction('set_name', event.target.value) } onKeyDown={ event => handleKeyDown(event) } /> -
-
processAction('load_figure') }>{ LocalizeText('mannequin.widget.style') }
-
processAction('wear') }>{ LocalizeText('mannequin.widget.wear') }
-
- } - { viewMode === MannequinViewMode.SAVE && - <> -
-
{ mannequinData.name }
-
{ LocalizeText('mannequin.widget.savetext') }
-
-
-
processAction('back') }>{ LocalizeText('mannequin.widget.back') }
-
processAction('save_figure') }>{ LocalizeText('mannequin.widget.save') }
-
- } - { viewMode === MannequinViewMode.CLUB && -
{ LocalizeText('mannequin.widget.clubnotification') }
} - { viewMode === MannequinViewMode.INCOMPATIBLE_GENDER && -
{ LocalizeText('mannequin.widget.wronggender') }
} -
-
+ + + + + + { (mode === MODE_CONTROLLER) && + + + {/* */} + setName(event.target.value) } onKeyDown={ event => handleKeyDown(event) } /> + + + setMode(MODE_UPDATE) }> + { LocalizeText('mannequin.widget.style') } + + processAction(ACTION_WEAR) }> + { LocalizeText('mannequin.widget.wear') } + + + } + { (mode === MODE_UPDATE) && + + + + { name } + + + { LocalizeText('mannequin.widget.savetext') } + + + + setMode(MODE_CONTROLLER) }> + { LocalizeText('mannequin.widget.back') } + + processAction(ACTION_SAVE) }> + { LocalizeText('mannequin.widget.save') } + + + } + { (mode === MODE_PEER) && + + + + { name } + + + { LocalizeText('mannequin.widget.weartext') } + + + processAction(ACTION_WEAR) }> + { LocalizeText('mannequin.widget.wear') } + + } + { (mode === MODE_NO_CLUB) && + + { LocalizeText('mannequin.widget.clubnotification') } + } + { (mode === MODE_WRONG_GENDER) && + + { LocalizeText('mannequin.widget.wronggender') } + } + +
); diff --git a/src/views/room/widgets/furniture/mannequin/common/MannequinViewMode.ts b/src/views/room/widgets/furniture/mannequin/common/MannequinViewMode.ts deleted file mode 100644 index e588eea4..00000000 --- a/src/views/room/widgets/furniture/mannequin/common/MannequinViewMode.ts +++ /dev/null @@ -1,8 +0,0 @@ -export class MannequinViewMode -{ - public static readonly EDIT: string = 'edit'; - public static readonly SAVE: string = 'save'; - public static readonly CLUB: string = 'club'; - public static readonly DEFAULT: string = 'default'; - public static readonly INCOMPATIBLE_GENDER: string = 'incompatible_gender'; -} diff --git a/src/views/room/widgets/furniture/mannequin/views/preview/FurnitureMannequinPreviewView.tsx b/src/views/room/widgets/furniture/mannequin/views/preview/FurnitureMannequinPreviewView.tsx new file mode 100644 index 00000000..194700df --- /dev/null +++ b/src/views/room/widgets/furniture/mannequin/views/preview/FurnitureMannequinPreviewView.tsx @@ -0,0 +1,17 @@ +import { FC } from 'react'; +import { NitroLayoutBase } from '../../../../../../../layout/base'; +import { AvatarImageView } from '../../../../../../shared/avatar-image/AvatarImageView'; +import { CurrencyIcon } from '../../../../../../shared/currency-icon/CurrencyIcon'; +import { FurnitureMannequinPreviewViewProps } from './FurnitureMannequinPreviewView.types'; + +export const FurnitureMannequinPreviewView: FC = props => +{ + const { figure = null, clubLevel = 0 } = props; + + return ( + + + { (clubLevel > 0) && } + + ); +} diff --git a/src/views/room/widgets/furniture/mannequin/views/preview/FurnitureMannequinPreviewView.types.ts b/src/views/room/widgets/furniture/mannequin/views/preview/FurnitureMannequinPreviewView.types.ts new file mode 100644 index 00000000..1a5ee3fe --- /dev/null +++ b/src/views/room/widgets/furniture/mannequin/views/preview/FurnitureMannequinPreviewView.types.ts @@ -0,0 +1,5 @@ +export interface FurnitureMannequinPreviewViewProps +{ + figure: string; + clubLevel: number; +} From 5b8b57695019dd8eb5874e69cf10ba19cf75b39a Mon Sep 17 00:00:00 2001 From: Bill Date: Thu, 7 Oct 2021 01:43:01 -0400 Subject: [PATCH 04/12] Update exchange credit widget --- .../exchange-credit/exchange-credit-image.png | Bin 0 -> 9507 bytes .../FurnitureExchangeCreditView.scss | 7 ++- .../FurnitureExchangeCreditView.tsx | 54 +++++++++++------- 3 files changed, 39 insertions(+), 22 deletions(-) create mode 100644 src/assets/images/room-widgets/exchange-credit/exchange-credit-image.png diff --git a/src/assets/images/room-widgets/exchange-credit/exchange-credit-image.png b/src/assets/images/room-widgets/exchange-credit/exchange-credit-image.png new file mode 100644 index 0000000000000000000000000000000000000000..eef5da6cb5e1bcc91db1e615b5600064da805d73 GIT binary patch literal 9507 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 B4|V_m literal 0 HcmV?d00001 diff --git a/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.scss b/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.scss index 34b1b665..db574026 100644 --- a/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.scss +++ b/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.scss @@ -1,3 +1,8 @@ .nitro-exchange-credit { - width: 290px; + + .exchange-image { + background-image: url('../../../../../assets/images/room-widgets/exchange-credit/exchange-credit-image.png'); + width: 103px; + height: 103px; + } } diff --git a/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.tsx b/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.tsx index e8f6387b..d1078f66 100644 --- a/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.tsx +++ b/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.tsx @@ -2,7 +2,8 @@ import { FC, useCallback, useState } from 'react'; import { LocalizeText, RoomWidgetCreditFurniRedeemMessage, RoomWidgetUpdateCreditFurniEvent } from '../../../../../api'; import { BatchUpdates } from '../../../../../hooks'; import { CreateEventDispatcherHook } from '../../../../../hooks/events/event-dispatcher.base'; -import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../../layout'; +import { NitroCardContentView, NitroCardHeaderView, NitroCardView, NitroLayoutButton, NitroLayoutFlexColumn, NitroLayoutGrid, NitroLayoutGridColumn } from '../../../../../layout'; +import { NitroLayoutBase } from '../../../../../layout/base'; import { useRoomContext } from '../../../context/RoomContext'; export const FurnitureExchangeCreditView: FC<{}> = props => @@ -19,35 +20,46 @@ export const FurnitureExchangeCreditView: FC<{}> = props => CreateEventDispatcherHook(RoomWidgetUpdateCreditFurniEvent.CREDIT_FURNI_UPDATE, eventDispatcher, onRoomWidgetUpdateCreditFurniEvent); - const processAction = useCallback((type: string, value: string = null) => + const close = useCallback(() => { - switch(type) + BatchUpdates(() => { - case 'close': - BatchUpdates(() => - { - setObjectId(-1); - setValue(0); - }); - return; - case 'redeem': - widgetHandler.processWidgetMessage(new RoomWidgetCreditFurniRedeemMessage(RoomWidgetCreditFurniRedeemMessage.REDEEM, objectId)); + setObjectId(-1); + setValue(0); + }); + }, []); - processAction('close'); - return; - } - }, [ widgetHandler, objectId ]); + const redeem = useCallback(() => + { + widgetHandler.processWidgetMessage(new RoomWidgetCreditFurniRedeemMessage(RoomWidgetCreditFurniRedeemMessage.REDEEM, objectId)); + + close(); + }, [ widgetHandler, objectId, close ]); if(objectId === -1) return null; return ( - processAction('close') } /> + -
- { LocalizeText('widgets.furniture.credit.redeem.value', [ 'value' ], [ value.toString() ]) } -
- + + + + + + + + { LocalizeText('creditfurni.description', [ 'credits' ], [ value.toString() ]) } + + + { LocalizeText('creditfurni.prompt') } + + + + { LocalizeText('catalog.redeem.dialog.button.exchange') } + + +
); From d932c410deac022f8f83c44c49d8a907dc809f1f Mon Sep 17 00:00:00 2001 From: Bill Date: Thu, 7 Oct 2021 01:43:17 -0400 Subject: [PATCH 05/12] Update mannequin widget --- .../mannequin/FurnitureMannequinView.tsx | 32 ++++++++----------- 1 file changed, 14 insertions(+), 18 deletions(-) diff --git a/src/views/room/widgets/furniture/mannequin/FurnitureMannequinView.tsx b/src/views/room/widgets/furniture/mannequin/FurnitureMannequinView.tsx index 32929af4..b0ec3792 100644 --- a/src/views/room/widgets/furniture/mannequin/FurnitureMannequinView.tsx +++ b/src/views/room/widgets/furniture/mannequin/FurnitureMannequinView.tsx @@ -15,12 +15,9 @@ const MODE_PEER: number = 2; const MODE_NO_CLUB: number = 3; const MODE_WRONG_GENDER: number = 4; -const ACTION_CLOSE: number = 0; const ACTION_SET_NAME: number = 1; -const ACTION_LOAD_FIGURE: number = 2; -const ACTION_WEAR: number = 3; -const ACTION_SAVE: number = 4; -const ACTION_BACK: number = 5; +const ACTION_WEAR: number = 2; +const ACTION_SAVE: number = 3; const MANNEQUIN_FIGURE = ['hd', 99999, [ 99998 ]]; const MANNEQUIN_CLOTHING_PART_TYPES = [ @@ -173,16 +170,15 @@ export const FurnitureMannequinView: FC<{}> = props => setMode(MODE_NONE) } /> - + - + { (mode === MODE_CONTROLLER) && - - - {/* */} + <> + setName(event.target.value) } onKeyDown={ event => handleKeyDown(event) } /> - + setMode(MODE_UPDATE) }> { LocalizeText('mannequin.widget.style') } @@ -191,10 +187,10 @@ export const FurnitureMannequinView: FC<{}> = props => { LocalizeText('mannequin.widget.wear') } - } + } { (mode === MODE_UPDATE) && - - + <> + { name } @@ -210,10 +206,10 @@ export const FurnitureMannequinView: FC<{}> = props => { LocalizeText('mannequin.widget.save') } - } + } { (mode === MODE_PEER) && - - + <> + { name } @@ -224,7 +220,7 @@ export const FurnitureMannequinView: FC<{}> = props => processAction(ACTION_WEAR) }> { LocalizeText('mannequin.widget.wear') } - } + } { (mode === MODE_NO_CLUB) && { LocalizeText('mannequin.widget.clubnotification') } From 40cd7c6609df1e9dca450be36ed030b784a9c875 Mon Sep 17 00:00:00 2001 From: Bill Date: Sat, 16 Oct 2021 01:51:11 -0400 Subject: [PATCH 06/12] Update FurnitureCustomStackHeightView --- .../FurnitureCustomStackHeightView.scss | 4 + .../FurnitureCustomStackHeightView.tsx | 78 ++++++++++--------- 2 files changed, 45 insertions(+), 37 deletions(-) create mode 100644 src/views/room/widgets/furniture/custom-stack-height/FurnitureCustomStackHeightView.scss diff --git a/src/views/room/widgets/furniture/custom-stack-height/FurnitureCustomStackHeightView.scss b/src/views/room/widgets/furniture/custom-stack-height/FurnitureCustomStackHeightView.scss new file mode 100644 index 00000000..755c73d1 --- /dev/null +++ b/src/views/room/widgets/furniture/custom-stack-height/FurnitureCustomStackHeightView.scss @@ -0,0 +1,4 @@ +.nitro-widget-custom-stack-height { + width: $nitro-widget-custom-stack-height-width; + height: $nitro-widget-custom-stack-height-height; +} diff --git a/src/views/room/widgets/furniture/custom-stack-height/FurnitureCustomStackHeightView.tsx b/src/views/room/widgets/furniture/custom-stack-height/FurnitureCustomStackHeightView.tsx index 16f976a2..0b7c7ee1 100644 --- a/src/views/room/widgets/furniture/custom-stack-height/FurnitureCustomStackHeightView.tsx +++ b/src/views/room/widgets/furniture/custom-stack-height/FurnitureCustomStackHeightView.tsx @@ -2,9 +2,10 @@ import { FurnitureStackHeightComposer, FurnitureStackHeightEvent } from '@nitrot import { FC, useCallback, useEffect, useState } from 'react'; import ReactSlider from 'react-slider'; import { LocalizeText, RoomWidgetUpdateCustomStackHeightEvent } from '../../../../../api'; -import { CreateMessageHook, SendMessageHook } from '../../../../../hooks'; +import { BatchUpdates, CreateMessageHook, SendMessageHook } from '../../../../../hooks'; import { CreateEventDispatcherHook } from '../../../../../hooks/events'; -import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../../layout'; +import { NitroCardContentView, NitroCardHeaderView, NitroCardView, NitroLayoutButton, NitroLayoutFlex, NitroLayoutFlexColumn, NitroLayoutGrid, NitroLayoutGridColumn } from '../../../../../layout'; +import { NitroLayoutBase } from '../../../../../layout/base'; import { useRoomContext } from '../../../context/RoomContext'; const MAX_HEIGHT: number = 40; @@ -14,13 +15,15 @@ export const FurnitureCustomStackHeightView: FC<{}> = props => const [ objectId, setObjectId ] = useState(-1); const [ height, setHeight ] = useState(0); const [ pendingHeight, setPendingHeight ] = useState(-1); - - const { roomSession = null, eventDispatcher = null } = useRoomContext(); + const { eventDispatcher = null } = useRoomContext(); const close = useCallback(() => { - setObjectId(-1); - setHeight(0); + BatchUpdates(() => + { + setObjectId(-1); + setHeight(0); + }); }, []); const updateHeight = useCallback((height: number, fromServer: boolean = false) => @@ -31,9 +34,12 @@ export const FurnitureCustomStackHeightView: FC<{}> = props => if(!fromServer) ((height > MAX_HEIGHT) && (height = MAX_HEIGHT)); - setHeight(parseFloat(height.toFixed(2))); + BatchUpdates(() => + { + setHeight(parseFloat(height.toFixed(2))); - if(!fromServer) setPendingHeight(height * 100); + if(!fromServer) setPendingHeight(height * 100); + }); }, []); const onRoomWidgetUpdateCustomStackHeightEvent = useCallback((event: RoomWidgetUpdateCustomStackHeightEvent) => @@ -65,16 +71,6 @@ export const FurnitureCustomStackHeightView: FC<{}> = props => SendMessageHook(new FurnitureStackHeightComposer(objectId, ~~(height))); }, [ objectId ]); - const placeAboveStack = useCallback(() => - { - sendUpdate(-100); - }, [ sendUpdate ]); - - const placeAtFloor = useCallback(() => - { - sendUpdate(0); - }, [ sendUpdate ]); - useEffect(() => { if((objectId === -1) || (pendingHeight === -1)) return; @@ -87,27 +83,35 @@ export const FurnitureCustomStackHeightView: FC<{}> = props => if(objectId === -1) return null; return ( - + -
- - updateHeight(event) } - renderThumb={ (props, state) =>
{ state.valueNow }
} /> -
-
- updateHeight(parseFloat(event.target.value)) } /> -
-
- - -
+ + + + { LocalizeText('widget.custom.stack.height.text') } + + + + updateHeight(event) } + renderThumb={ (props, state) =>
{ state.valueNow }
} /> + updateHeight(parseFloat(event.target.value)) } /> +
+ sendUpdate(-100) }> + { LocalizeText('furniture.above.stack') } + + sendUpdate(0) }> + { LocalizeText('furniture.floor.level') } + +
+
+
); From 561a7ae93202bebb5deedc63e07bc5ca9b60abab Mon Sep 17 00:00:00 2001 From: Bill Date: Sat, 16 Oct 2021 01:52:14 -0400 Subject: [PATCH 07/12] Update events --- ....ts => RoomWidgetUpdateRoomEngineEvent.ts} | 6 +-- ....ts => RoomWidgetUpdateRoomObjectEvent.ts} | 20 ++++---- .../events/RoomWidgetUpdateTrophyEvent.ts | 48 +++++++++++++++++++ src/api/nitro/room/widgets/events/index.ts | 5 +- 4 files changed, 64 insertions(+), 15 deletions(-) rename src/api/nitro/room/widgets/events/{RoomWidgetRoomEngineUpdateEvent.ts => RoomWidgetUpdateRoomEngineEvent.ts} (62%) rename src/api/nitro/room/widgets/events/{RoomWidgetRoomObjectUpdateEvent.ts => RoomWidgetUpdateRoomObjectEvent.ts} (54%) create mode 100644 src/api/nitro/room/widgets/events/RoomWidgetUpdateTrophyEvent.ts diff --git a/src/api/nitro/room/widgets/events/RoomWidgetRoomEngineUpdateEvent.ts b/src/api/nitro/room/widgets/events/RoomWidgetUpdateRoomEngineEvent.ts similarity index 62% rename from src/api/nitro/room/widgets/events/RoomWidgetRoomEngineUpdateEvent.ts rename to src/api/nitro/room/widgets/events/RoomWidgetUpdateRoomEngineEvent.ts index c7e433a2..0e72f2c3 100644 --- a/src/api/nitro/room/widgets/events/RoomWidgetRoomEngineUpdateEvent.ts +++ b/src/api/nitro/room/widgets/events/RoomWidgetUpdateRoomEngineEvent.ts @@ -1,9 +1,9 @@ import { RoomWidgetUpdateEvent } from './RoomWidgetUpdateEvent'; -export class RoomWidgetRoomEngineUpdateEvent extends RoomWidgetUpdateEvent +export class RoomWidgetUpdateRoomEngineEvent extends RoomWidgetUpdateEvent { - public static GAME_MODE: string = 'RWREUE_GAME_MODE'; - public static NORMAL_MODE: string = 'RWREUE_NORMAL_MODE'; + public static GAME_MODE: string = 'RWUREE_GAME_MODE'; + public static NORMAL_MODE: string = 'RWUREE_NORMAL_MODE'; private _roomId: number = 0; diff --git a/src/api/nitro/room/widgets/events/RoomWidgetRoomObjectUpdateEvent.ts b/src/api/nitro/room/widgets/events/RoomWidgetUpdateRoomObjectEvent.ts similarity index 54% rename from src/api/nitro/room/widgets/events/RoomWidgetRoomObjectUpdateEvent.ts rename to src/api/nitro/room/widgets/events/RoomWidgetUpdateRoomObjectEvent.ts index 8c63ab4c..cbc1d9c9 100644 --- a/src/api/nitro/room/widgets/events/RoomWidgetRoomObjectUpdateEvent.ts +++ b/src/api/nitro/room/widgets/events/RoomWidgetUpdateRoomObjectEvent.ts @@ -1,16 +1,16 @@ import { RoomWidgetUpdateEvent } from './RoomWidgetUpdateEvent'; -export class RoomWidgetRoomObjectUpdateEvent extends RoomWidgetUpdateEvent +export class RoomWidgetUpdateRoomObjectEvent extends RoomWidgetUpdateEvent { - public static OBJECT_SELECTED: string = 'RWROUE_OBJECT_SELECTED'; - public static OBJECT_DESELECTED: string = 'RWROUE_OBJECT_DESELECTED'; - public static USER_REMOVED: string = 'RWROUE_USER_REMOVED'; - public static FURNI_REMOVED: string = 'RWROUE_FURNI_REMOVED'; - public static FURNI_ADDED: string = 'RWROUE_FURNI_ADDED'; - public static USER_ADDED: string = 'RWROUE_USER_ADDED'; - public static OBJECT_ROLL_OVER: string = 'RWROUE_OBJECT_ROLL_OVER'; - public static OBJECT_ROLL_OUT: string = 'RWROUE_OBJECT_ROLL_OUT'; - public static OBJECT_REQUEST_MANIPULATION: string = 'RWROUE_OBJECT_REQUEST_MANIPULATION'; + public static OBJECT_SELECTED: string = 'RWUROE_OBJECT_SELECTED'; + public static OBJECT_DESELECTED: string = 'RWUROE_OBJECT_DESELECTED'; + public static USER_REMOVED: string = 'RWUROE_USER_REMOVED'; + public static FURNI_REMOVED: string = 'RWUROE_FURNI_REMOVED'; + public static FURNI_ADDED: string = 'RWUROE_FURNI_ADDED'; + public static USER_ADDED: string = 'RWUROE_USER_ADDED'; + public static OBJECT_ROLL_OVER: string = 'RWUROE_OBJECT_ROLL_OVER'; + public static OBJECT_ROLL_OUT: string = 'RWUROE_OBJECT_ROLL_OUT'; + public static OBJECT_REQUEST_MANIPULATION: string = 'RWUROE_OBJECT_REQUEST_MANIPULATION'; private _id: number; private _category: number; diff --git a/src/api/nitro/room/widgets/events/RoomWidgetUpdateTrophyEvent.ts b/src/api/nitro/room/widgets/events/RoomWidgetUpdateTrophyEvent.ts new file mode 100644 index 00000000..b13b2b66 --- /dev/null +++ b/src/api/nitro/room/widgets/events/RoomWidgetUpdateTrophyEvent.ts @@ -0,0 +1,48 @@ +import { RoomWidgetUpdateEvent } from './RoomWidgetUpdateEvent'; + +export class RoomWidgetUpdateTrophyEvent extends RoomWidgetUpdateEvent +{ + public static TROPHY_UPDATE: string = 'RWUTE_TROPHY_UPDATE'; + + private _color: number; + private _name: string; + private _date: string; + private _message: string; + private _extra: number; + + constructor(type: string, color: number, name: string, date: string, message: string, extra: number) + { + super(type); + + this._color = color; + this._name = name; + this._date = date; + this._message = message; + this._extra = extra; + } + + public get color(): number + { + return this._color; + } + + public get name(): string + { + return this._name; + } + + public get date(): string + { + return this._date; + } + + public get message(): string + { + return this._message; + } + + public get extra(): number + { + return this._extra; + } +} diff --git a/src/api/nitro/room/widgets/events/index.ts b/src/api/nitro/room/widgets/events/index.ts index d79b9855..f4415bb9 100644 --- a/src/api/nitro/room/widgets/events/index.ts +++ b/src/api/nitro/room/widgets/events/index.ts @@ -6,8 +6,6 @@ export * from './RoomWidgetChooserContentEvent'; export * from './RoomWidgetDoorbellEvent'; export * from './RoomWidgetFloodControlEvent'; export * from './RoomWidgetObjectNameEvent'; -export * from './RoomWidgetRoomEngineUpdateEvent'; -export * from './RoomWidgetRoomObjectUpdateEvent'; export * from './RoomWidgetUpdateBackgroundColorPreviewEvent'; export * from './RoomWidgetUpdateChatEvent'; export * from './RoomWidgetUpdateChatInputContentEvent'; @@ -27,8 +25,11 @@ export * from './RoomWidgetUpdateInfostandUserEvent'; export * from './RoomWidgetUpdateMannequinEvent'; export * from './RoomWidgetUpdatePresentDataEvent'; export * from './RoomWidgetUpdateRentableBotChatEvent'; +export * from './RoomWidgetUpdateRoomEngineEvent'; +export * from './RoomWidgetUpdateRoomObjectEvent'; export * from './RoomWidgetUpdateRoomViewEvent'; export * from './RoomWidgetUpdateSongEvent'; +export * from './RoomWidgetUpdateTrophyEvent'; export * from './RoomWidgetUpdateUserDataEvent'; export * from './RoomWidgetUseProductBubbleEvent'; export * from './UseProductItem'; From c9d76ecf6e40c90ddba62bdaa6962875fe362448 Mon Sep 17 00:00:00 2001 From: Bill Date: Sat, 16 Oct 2021 01:56:53 -0400 Subject: [PATCH 08/12] Update room widgets --- src/views/room/widgets/RoomWidgetsView.tsx | 32 +-- .../avatar-info/AvatarInfoWidgetView.tsx | 36 ++-- .../widgets/chat-input/ChatInputView.scss | 2 +- .../room/widgets/chat-input/ChatInputView.tsx | 6 +- .../choosers/FurniChooserWidgetView.tsx | 12 +- .../choosers/UserChooserWidgetView.tsx | 12 +- .../widgets/context-menu/ContextMenu.scss | 4 +- .../widgets/furniture/FurnitureWidgets.scss | 6 + .../furniture/FurnitureWidgetsView.tsx | 2 +- .../FurnitureBackgroundColorView.tsx | 6 +- .../FurnitureBadgeDisplayView.tsx | 8 +- .../FurnitureExchangeCreditView.scss | 4 +- .../FurnitureExchangeCreditView.tsx | 2 +- .../friend-furni/FurnitureFriendFurniView.tsx | 8 +- .../gift-opening/FurnitureGiftOpeningView.tsx | 185 +++++++++++------- .../high-score/FurnitureHighScoreView.scss | 7 +- .../high-score/FurnitureHighScoreView.tsx | 59 ++++-- .../FurnitureManipulationMenuView.tsx | 14 +- .../stickie/FurnitureStickieView.scss | 1 + .../stickie/FurnitureStickieView.tsx | 8 +- .../widgets/infostand/InfoStandWidgetView.tsx | 28 +-- 21 files changed, 252 insertions(+), 190 deletions(-) diff --git a/src/views/room/widgets/RoomWidgetsView.tsx b/src/views/room/widgets/RoomWidgetsView.tsx index 61e40bc6..3fd67cdc 100644 --- a/src/views/room/widgets/RoomWidgetsView.tsx +++ b/src/views/room/widgets/RoomWidgetsView.tsx @@ -1,6 +1,6 @@ import { RoomEngineEvent, RoomEngineObjectEvent, RoomEngineRoomAdEvent, RoomEngineTriggerWidgetEvent, RoomEngineUseProductEvent, RoomId, RoomObjectCategory, RoomObjectOperationType, RoomObjectVariable, RoomSessionChatEvent, RoomSessionDanceEvent, RoomSessionDimmerPresetsEvent, RoomSessionDoorbellEvent, RoomSessionErrorMessageEvent, RoomSessionEvent, RoomSessionFriendRequestEvent, RoomSessionPetInfoUpdateEvent, RoomSessionPresentEvent, RoomSessionUserBadgesEvent, RoomZoomEvent } from '@nitrots/nitro-renderer'; import { FC, useCallback } from 'react'; -import { CanManipulateFurniture, GetRoomEngine, GetSessionDataManager, IsFurnitureSelectionDisabled, LocalizeText, ProcessRoomObjectOperation, RoomWidgetFurniToWidgetMessage, RoomWidgetRoomEngineUpdateEvent, RoomWidgetRoomObjectUpdateEvent } from '../../../api'; +import { CanManipulateFurniture, GetRoomEngine, GetSessionDataManager, IsFurnitureSelectionDisabled, LocalizeText, ProcessRoomObjectOperation, RoomWidgetFurniToWidgetMessage, RoomWidgetUpdateRoomEngineEvent, RoomWidgetUpdateRoomObjectEvent } from '../../../api'; import { useRoomEngineEvent, useRoomSessionManagerEvent } from '../../../hooks/events'; import { NotificationAlertType } from '../../notification-center/common/NotificationAlertType'; import { NotificationUtilities } from '../../notification-center/common/NotificationUtilities'; @@ -27,10 +27,10 @@ export const RoomWidgetsView: FC = props => switch(event.type) { case RoomEngineEvent.NORMAL_MODE: - eventDispatcher.dispatchEvent(new RoomWidgetRoomEngineUpdateEvent(RoomWidgetRoomEngineUpdateEvent.NORMAL_MODE, event.roomId)); + eventDispatcher.dispatchEvent(new RoomWidgetUpdateRoomEngineEvent(RoomWidgetUpdateRoomEngineEvent.NORMAL_MODE, event.roomId)); return; case RoomEngineEvent.GAME_MODE: - eventDispatcher.dispatchEvent(new RoomWidgetRoomEngineUpdateEvent(RoomWidgetRoomEngineUpdateEvent.GAME_MODE, event.roomId)); + eventDispatcher.dispatchEvent(new RoomWidgetUpdateRoomEngineEvent(RoomWidgetUpdateRoomEngineEvent.GAME_MODE, event.roomId)); return; case RoomZoomEvent.ROOM_ZOOM: { const zoomEvent = (event as RoomZoomEvent); @@ -67,15 +67,15 @@ export const RoomWidgetsView: FC = props => const objectId = event.objectId; const category = event.category; - let updateEvent: RoomWidgetRoomObjectUpdateEvent = null; + let updateEvent: RoomWidgetUpdateRoomObjectEvent = null; switch(event.type) { case RoomEngineObjectEvent.SELECTED: - if(!IsFurnitureSelectionDisabled(event)) updateEvent = new RoomWidgetRoomObjectUpdateEvent(RoomWidgetRoomObjectUpdateEvent.OBJECT_SELECTED, objectId, category, event.roomId); + if(!IsFurnitureSelectionDisabled(event)) updateEvent = new RoomWidgetUpdateRoomObjectEvent(RoomWidgetUpdateRoomObjectEvent.OBJECT_SELECTED, objectId, category, event.roomId); break; case RoomEngineObjectEvent.DESELECTED: - updateEvent = new RoomWidgetRoomObjectUpdateEvent(RoomWidgetRoomObjectUpdateEvent.OBJECT_DESELECTED, objectId, category, event.roomId); + updateEvent = new RoomWidgetUpdateRoomObjectEvent(RoomWidgetUpdateRoomObjectEvent.OBJECT_DESELECTED, objectId, category, event.roomId); break; case RoomEngineObjectEvent.ADDED: { let addedEventType: string = null; @@ -84,14 +84,14 @@ export const RoomWidgetsView: FC = props => { case RoomObjectCategory.FLOOR: case RoomObjectCategory.WALL: - addedEventType = RoomWidgetRoomObjectUpdateEvent.FURNI_ADDED; + addedEventType = RoomWidgetUpdateRoomObjectEvent.FURNI_ADDED; break; case RoomObjectCategory.UNIT: - addedEventType = RoomWidgetRoomObjectUpdateEvent.USER_ADDED; + addedEventType = RoomWidgetUpdateRoomObjectEvent.USER_ADDED; break; } - if(addedEventType) updateEvent = new RoomWidgetRoomObjectUpdateEvent(addedEventType, objectId, category, event.roomId); + if(addedEventType) updateEvent = new RoomWidgetUpdateRoomObjectEvent(addedEventType, objectId, category, event.roomId); break; } case RoomEngineObjectEvent.REMOVED: { @@ -101,14 +101,14 @@ export const RoomWidgetsView: FC = props => { case RoomObjectCategory.FLOOR: case RoomObjectCategory.WALL: - removedEventType = RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED; + removedEventType = RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED; break; case RoomObjectCategory.UNIT: - removedEventType = RoomWidgetRoomObjectUpdateEvent.USER_REMOVED; + removedEventType = RoomWidgetUpdateRoomObjectEvent.USER_REMOVED; break; } - if(removedEventType) updateEvent = new RoomWidgetRoomObjectUpdateEvent(removedEventType, objectId, category, event.roomId); + if(removedEventType) updateEvent = new RoomWidgetUpdateRoomObjectEvent(removedEventType, objectId, category, event.roomId); break; } case RoomEngineObjectEvent.REQUEST_MOVE: @@ -118,13 +118,13 @@ export const RoomWidgetsView: FC = props => if(CanManipulateFurniture(roomSession, objectId, category)) ProcessRoomObjectOperation(objectId, category, RoomObjectOperationType.OBJECT_ROTATE_POSITIVE); break; case RoomEngineObjectEvent.REQUEST_MANIPULATION: - if(CanManipulateFurniture(roomSession, objectId, category)) updateEvent = new RoomWidgetRoomObjectUpdateEvent(RoomWidgetRoomObjectUpdateEvent.OBJECT_REQUEST_MANIPULATION, objectId, category, event.roomId); + if(CanManipulateFurniture(roomSession, objectId, category)) updateEvent = new RoomWidgetUpdateRoomObjectEvent(RoomWidgetUpdateRoomObjectEvent.OBJECT_REQUEST_MANIPULATION, objectId, category, event.roomId); break; case RoomEngineObjectEvent.MOUSE_ENTER: - updateEvent = new RoomWidgetRoomObjectUpdateEvent(RoomWidgetRoomObjectUpdateEvent.OBJECT_ROLL_OVER, objectId, category, event.roomId); + updateEvent = new RoomWidgetUpdateRoomObjectEvent(RoomWidgetUpdateRoomObjectEvent.OBJECT_ROLL_OVER, objectId, category, event.roomId); break; case RoomEngineObjectEvent.MOUSE_LEAVE: - updateEvent = new RoomWidgetRoomObjectUpdateEvent(RoomWidgetRoomObjectUpdateEvent.OBJECT_ROLL_OUT, objectId, category, event.roomId); + updateEvent = new RoomWidgetUpdateRoomObjectEvent(RoomWidgetUpdateRoomObjectEvent.OBJECT_ROLL_OUT, objectId, category, event.roomId); break; case RoomEngineTriggerWidgetEvent.REQUEST_CREDITFURNI: widgetHandler.processWidgetMessage(new RoomWidgetFurniToWidgetMessage(RoomWidgetFurniToWidgetMessage.REQUEST_CREDITFURNI, objectId, category, event.roomId)); @@ -202,7 +202,7 @@ export const RoomWidgetsView: FC = props => { let dispatchEvent = true; - if(updateEvent instanceof RoomWidgetRoomObjectUpdateEvent) dispatchEvent = (!RoomId.isRoomPreviewerId(updateEvent.roomId)); + if(updateEvent instanceof RoomWidgetUpdateRoomObjectEvent) dispatchEvent = (!RoomId.isRoomPreviewerId(updateEvent.roomId)); if(dispatchEvent) widgetHandler.eventDispatcher.dispatchEvent(updateEvent); } diff --git a/src/views/room/widgets/avatar-info/AvatarInfoWidgetView.tsx b/src/views/room/widgets/avatar-info/AvatarInfoWidgetView.tsx index a12d17bc..7014b2f7 100644 --- a/src/views/room/widgets/avatar-info/AvatarInfoWidgetView.tsx +++ b/src/views/room/widgets/avatar-info/AvatarInfoWidgetView.tsx @@ -1,6 +1,6 @@ import { RoomEnterEffect, RoomObjectCategory } from '@nitrots/nitro-renderer'; import { FC, useCallback, useMemo, useState } from 'react'; -import { GetRoomSession, GetSessionDataManager, RoomWidgetObjectNameEvent, RoomWidgetRoomEngineUpdateEvent, RoomWidgetRoomObjectMessage, RoomWidgetRoomObjectUpdateEvent, RoomWidgetUpdateDanceStatusEvent, RoomWidgetUpdateDecorateModeEvent, RoomWidgetUpdateInfostandEvent, RoomWidgetUpdateInfostandFurniEvent, RoomWidgetUpdateInfostandPetEvent, RoomWidgetUpdateInfostandRentableBotEvent, RoomWidgetUpdateInfostandUserEvent, RoomWidgetUpdateRentableBotChatEvent, RoomWidgetUseProductBubbleEvent, UseProductItem } from '../../../../api'; +import { GetRoomSession, GetSessionDataManager, RoomWidgetObjectNameEvent, RoomWidgetRoomObjectMessage, RoomWidgetUpdateDanceStatusEvent, RoomWidgetUpdateDecorateModeEvent, RoomWidgetUpdateInfostandEvent, RoomWidgetUpdateInfostandFurniEvent, RoomWidgetUpdateInfostandPetEvent, RoomWidgetUpdateInfostandRentableBotEvent, RoomWidgetUpdateInfostandUserEvent, RoomWidgetUpdateRentableBotChatEvent, RoomWidgetUpdateRoomEngineEvent, RoomWidgetUpdateRoomObjectEvent, RoomWidgetUseProductBubbleEvent, UseProductItem } from '../../../../api'; import { CreateEventDispatcherHook } from '../../../../hooks/events/event-dispatcher.base'; import { useRoomContext } from '../../context/RoomContext'; import { AvatarInfoWidgetAvatarView } from './views/avatar/AvatarInfoWidgetAvatarView'; @@ -73,25 +73,25 @@ export const AvatarInfoWidgetView: FC<{}> = props => setProductBubbles([]); }, []); - const onRoomWidgetRoomEngineUpdateEvent = useCallback((event: RoomWidgetRoomEngineUpdateEvent) => + const onRoomWidgetRoomEngineUpdateEvent = useCallback((event: RoomWidgetUpdateRoomEngineEvent) => { switch(event.type) { - case RoomWidgetRoomEngineUpdateEvent.NORMAL_MODE: { + case RoomWidgetUpdateRoomEngineEvent.NORMAL_MODE: { if(isGameMode) setGameMode(false); return; } - case RoomWidgetRoomEngineUpdateEvent.GAME_MODE: { + case RoomWidgetUpdateRoomEngineEvent.GAME_MODE: { if(!isGameMode) setGameMode(true); return; } } }, [ isGameMode ]); - CreateEventDispatcherHook(RoomWidgetRoomEngineUpdateEvent.NORMAL_MODE, eventDispatcher, onRoomWidgetRoomEngineUpdateEvent); - CreateEventDispatcherHook(RoomWidgetRoomEngineUpdateEvent.GAME_MODE, eventDispatcher, onRoomWidgetRoomEngineUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomEngineEvent.NORMAL_MODE, eventDispatcher, onRoomWidgetRoomEngineUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomEngineEvent.GAME_MODE, eventDispatcher, onRoomWidgetRoomEngineUpdateEvent); - const onRoomObjectRemoved = useCallback((event: RoomWidgetRoomObjectUpdateEvent) => + const onRoomObjectRemoved = useCallback((event: RoomWidgetUpdateRoomObjectEvent) => { if(name) { @@ -152,15 +152,15 @@ export const AvatarInfoWidgetView: FC<{}> = props => } }, [ name, infoStandEvent, nameBubbles, productBubbles, removeNameBubble, clearInfoStandEvent ]); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.USER_REMOVED, eventDispatcher, onRoomObjectRemoved); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, eventDispatcher, onRoomObjectRemoved); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.USER_REMOVED, eventDispatcher, onRoomObjectRemoved); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED, eventDispatcher, onRoomObjectRemoved); - const onObjectRolled = useCallback((event: RoomWidgetRoomObjectUpdateEvent) => + const onObjectRolled = useCallback((event: RoomWidgetUpdateRoomObjectEvent) => { switch(event.type) { - case RoomWidgetRoomObjectUpdateEvent.OBJECT_ROLL_OVER: { - const roomObjectEvent = (event as RoomWidgetRoomObjectUpdateEvent); + case RoomWidgetUpdateRoomObjectEvent.OBJECT_ROLL_OVER: { + const roomObjectEvent = (event as RoomWidgetUpdateRoomObjectEvent); if(infoStandEvent) return; @@ -168,8 +168,8 @@ export const AvatarInfoWidgetView: FC<{}> = props => return; } - case RoomWidgetRoomObjectUpdateEvent.OBJECT_ROLL_OUT: { - const roomObjectEvent = (event as RoomWidgetRoomObjectUpdateEvent); + case RoomWidgetUpdateRoomObjectEvent.OBJECT_ROLL_OUT: { + const roomObjectEvent = (event as RoomWidgetUpdateRoomObjectEvent); if(!name || (name.roomIndex !== roomObjectEvent.id)) return; @@ -180,16 +180,16 @@ export const AvatarInfoWidgetView: FC<{}> = props => } }, [ infoStandEvent, name, widgetHandler ]); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.OBJECT_ROLL_OVER, eventDispatcher, onObjectRolled); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.OBJECT_ROLL_OUT, eventDispatcher, onObjectRolled); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.OBJECT_ROLL_OVER, eventDispatcher, onObjectRolled); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.OBJECT_ROLL_OUT, eventDispatcher, onObjectRolled); - const onObjectDeselected = useCallback((event: RoomWidgetRoomObjectUpdateEvent) => + const onObjectDeselected = useCallback((event: RoomWidgetUpdateRoomObjectEvent) => { if(infoStandEvent) clearInfoStandEvent(); if(productBubbles.length) setProductBubbles([]); }, [ infoStandEvent, productBubbles, clearInfoStandEvent ]); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.OBJECT_DESELECTED, eventDispatcher, onObjectDeselected); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.OBJECT_DESELECTED, eventDispatcher, onObjectDeselected); const onRoomWidgetObjectNameEvent = useCallback((event: RoomWidgetObjectNameEvent) => { diff --git a/src/views/room/widgets/chat-input/ChatInputView.scss b/src/views/room/widgets/chat-input/ChatInputView.scss index 90f754e5..d2814d44 100644 --- a/src/views/room/widgets/chat-input/ChatInputView.scss +++ b/src/views/room/widgets/chat-input/ChatInputView.scss @@ -71,7 +71,7 @@ max-height: $chat-input-style-selector-widget-height; .content-area { - max-height: $chat-input-style-selector-widget-height; + max-height: $chat-input-style-selector-widget-height !important; } .grid-item { diff --git a/src/views/room/widgets/chat-input/ChatInputView.tsx b/src/views/room/widgets/chat-input/ChatInputView.tsx index 4ad7f3ba..ca2b54d7 100644 --- a/src/views/room/widgets/chat-input/ChatInputView.tsx +++ b/src/views/room/widgets/chat-input/ChatInputView.tsx @@ -1,7 +1,7 @@ import { HabboClubLevelEnum, RoomControllerLevel } from '@nitrots/nitro-renderer'; import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { createPortal } from 'react-dom'; -import { GetConfiguration, GetSessionDataManager, LocalizeText, RoomWidgetChatMessage, RoomWidgetChatTypingMessage, RoomWidgetRoomObjectUpdateEvent, RoomWidgetUpdateChatInputContentEvent, RoomWidgetUpdateInfostandUserEvent } from '../../../../api'; +import { GetConfiguration, GetSessionDataManager, LocalizeText, RoomWidgetChatMessage, RoomWidgetChatTypingMessage, RoomWidgetUpdateChatInputContentEvent, RoomWidgetUpdateInfostandUserEvent, RoomWidgetUpdateRoomObjectEvent } from '../../../../api'; import { CreateEventDispatcherHook } from '../../../../hooks/events'; import { useRoomContext } from '../../context/RoomContext'; import { ChatInputStyleSelectorView } from './style-selector/ChatInputStyleSelectorView'; @@ -177,12 +177,12 @@ export const ChatInputView: FC<{}> = props => }, [ inputRef, chatModeIdWhisper, anotherInputHasFocus, setInputFocus, checkSpecialKeywordForInput, sendChatValue ]); - const onRoomWidgetRoomObjectUpdateEvent = useCallback((event: RoomWidgetRoomObjectUpdateEvent) => + const onRoomWidgetRoomObjectUpdateEvent = useCallback((event: RoomWidgetUpdateRoomObjectEvent) => { setSelectedUsername(''); }, []); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.OBJECT_DESELECTED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.OBJECT_DESELECTED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); const onRoomWidgetUpdateInfostandUserEvent = useCallback((event: RoomWidgetUpdateInfostandUserEvent) => { diff --git a/src/views/room/widgets/choosers/FurniChooserWidgetView.tsx b/src/views/room/widgets/choosers/FurniChooserWidgetView.tsx index ac257419..68a2971f 100644 --- a/src/views/room/widgets/choosers/FurniChooserWidgetView.tsx +++ b/src/views/room/widgets/choosers/FurniChooserWidgetView.tsx @@ -1,5 +1,5 @@ import { FC, useCallback, useState } from 'react'; -import { LocalizeText, RoomObjectItem, RoomWidgetChooserContentEvent, RoomWidgetRequestWidgetMessage, RoomWidgetRoomObjectUpdateEvent } from '../../../../api'; +import { LocalizeText, RoomObjectItem, RoomWidgetChooserContentEvent, RoomWidgetRequestWidgetMessage, RoomWidgetUpdateRoomObjectEvent } from '../../../../api'; import { CreateEventDispatcherHook } from '../../../../hooks'; import { useRoomContext } from '../../context/RoomContext'; import { ChooserWidgetView } from './ChooserWidgetView'; @@ -31,21 +31,21 @@ export const FurniChooserWidgetView: FC<{}> = props => CreateEventDispatcherHook(RoomWidgetChooserContentEvent.FURNI_CHOOSER_CONTENT, eventDispatcher, onRoomWidgetChooserContentEvent); - const onRoomWidgetRoomObjectUpdateEvent = useCallback((event: RoomWidgetRoomObjectUpdateEvent) => + const onRoomWidgetRoomObjectUpdateEvent = useCallback((event: RoomWidgetUpdateRoomObjectEvent) => { if(!isVisible) return; switch(event.type) { - case RoomWidgetRoomObjectUpdateEvent.FURNI_ADDED: - case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: + case RoomWidgetUpdateRoomObjectEvent.FURNI_ADDED: + case RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED: refreshChooser(); return; } }, [ isVisible, refreshChooser ]); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_ADDED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.FURNI_ADDED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); const close = useCallback(() => { diff --git a/src/views/room/widgets/choosers/UserChooserWidgetView.tsx b/src/views/room/widgets/choosers/UserChooserWidgetView.tsx index 327b7bd2..b9ab2460 100644 --- a/src/views/room/widgets/choosers/UserChooserWidgetView.tsx +++ b/src/views/room/widgets/choosers/UserChooserWidgetView.tsx @@ -1,5 +1,5 @@ import { FC, useCallback, useState } from 'react'; -import { LocalizeText, RoomObjectItem, RoomWidgetChooserContentEvent, RoomWidgetRequestWidgetMessage, RoomWidgetRoomObjectUpdateEvent } from '../../../../api'; +import { LocalizeText, RoomObjectItem, RoomWidgetChooserContentEvent, RoomWidgetRequestWidgetMessage, RoomWidgetUpdateRoomObjectEvent } from '../../../../api'; import { CreateEventDispatcherHook } from '../../../../hooks'; import { useRoomContext } from '../../context/RoomContext'; import { ChooserWidgetView } from './ChooserWidgetView'; @@ -31,21 +31,21 @@ export const UserChooserWidgetView: FC<{}> = props => CreateEventDispatcherHook(RoomWidgetChooserContentEvent.USER_CHOOSER_CONTENT, eventDispatcher, onRoomWidgetChooserContentEvent); - const onRoomWidgetRoomObjectUpdateEvent = useCallback((event: RoomWidgetRoomObjectUpdateEvent) => + const onRoomWidgetRoomObjectUpdateEvent = useCallback((event: RoomWidgetUpdateRoomObjectEvent) => { if(!isVisible) return; switch(event.type) { - case RoomWidgetRoomObjectUpdateEvent.USER_ADDED: - case RoomWidgetRoomObjectUpdateEvent.USER_REMOVED: + case RoomWidgetUpdateRoomObjectEvent.USER_ADDED: + case RoomWidgetUpdateRoomObjectEvent.USER_REMOVED: refreshChooser(); return; } }, [ isVisible, refreshChooser ]); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.USER_ADDED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.USER_REMOVED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.USER_ADDED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.USER_REMOVED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); const close = useCallback(() => { diff --git a/src/views/room/widgets/context-menu/ContextMenu.scss b/src/views/room/widgets/context-menu/ContextMenu.scss index 4df6199d..b9e313d1 100644 --- a/src/views/room/widgets/context-menu/ContextMenu.scss +++ b/src/views/room/widgets/context-menu/ContextMenu.scss @@ -7,6 +7,7 @@ border-radius: $border-radius; font-size: $font-size-sm; z-index: $context-menu-zindex; + pointer-events: all; &.name-only { background-color: rgba($black, 0.5); @@ -34,8 +35,7 @@ .menu-header { background-color: $william; color: $white; - width: 117px; - max-width: 117px; + min-width: 117px; height: 25px; max-height: 25px; font-size: 16px; diff --git a/src/views/room/widgets/furniture/FurnitureWidgets.scss b/src/views/room/widgets/furniture/FurnitureWidgets.scss index 0fe453bc..563b6733 100644 --- a/src/views/room/widgets/furniture/FurnitureWidgets.scss +++ b/src/views/room/widgets/furniture/FurnitureWidgets.scss @@ -1,3 +1,9 @@ +.nitro-room-widgets { + pointer-events: none; +} + +@import './custom-stack-height/FurnitureCustomStackHeightView'; + @import './dimmer/FurnitureDimmerView'; @import './exchange-credit/FurnitureExchangeCreditView'; @import './external-image/FurnitureExternalImageView'; diff --git a/src/views/room/widgets/furniture/FurnitureWidgetsView.tsx b/src/views/room/widgets/furniture/FurnitureWidgetsView.tsx index 2d152199..16663637 100644 --- a/src/views/room/widgets/furniture/FurnitureWidgetsView.tsx +++ b/src/views/room/widgets/furniture/FurnitureWidgetsView.tsx @@ -17,7 +17,7 @@ import { FurnitureTrophyView } from './trophy/FurnitureTrophyView'; export const FurnitureWidgetsView: FC<{}> = props => { return ( -
+
diff --git a/src/views/room/widgets/furniture/background-color/FurnitureBackgroundColorView.tsx b/src/views/room/widgets/furniture/background-color/FurnitureBackgroundColorView.tsx index 7b2e335e..a29c5454 100644 --- a/src/views/room/widgets/furniture/background-color/FurnitureBackgroundColorView.tsx +++ b/src/views/room/widgets/furniture/background-color/FurnitureBackgroundColorView.tsx @@ -1,7 +1,7 @@ import { ApplyTonerComposer, RoomControllerLevel, RoomEngineObjectEvent, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer'; import { FC, useCallback, useEffect, useState } from 'react'; import ReactSlider from 'react-slider'; -import { GetRoomEngine, GetSessionDataManager, LocalizeText, RoomWidgetRoomObjectUpdateEvent, RoomWidgetUpdateBackgroundColorPreviewEvent } from '../../../../../api'; +import { GetRoomEngine, GetSessionDataManager, LocalizeText, RoomWidgetUpdateBackgroundColorPreviewEvent, RoomWidgetUpdateRoomObjectEvent } from '../../../../../api'; import { SendMessageHook } from '../../../../../hooks'; import { CreateEventDispatcherHook, useRoomEngineEvent } from '../../../../../hooks/events'; import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../../layout'; @@ -48,7 +48,7 @@ export const FurnitureBackgroundColorView: FC<{}> = props => return; } - case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: { + case RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED: { if(objectId !== event.objectId) return; close(); @@ -58,7 +58,7 @@ export const FurnitureBackgroundColorView: FC<{}> = props => }, [ objectId, canOpenBackgroundToner, close ]); useRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_BACKGROUND_COLOR, onRoomEngineObjectEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, eventDispatcher, onRoomEngineObjectEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED, eventDispatcher, onRoomEngineObjectEvent); const processAction = useCallback((name: string) => { diff --git a/src/views/room/widgets/furniture/badge-display/FurnitureBadgeDisplayView.tsx b/src/views/room/widgets/furniture/badge-display/FurnitureBadgeDisplayView.tsx index c9c5fbde..9615bce6 100644 --- a/src/views/room/widgets/furniture/badge-display/FurnitureBadgeDisplayView.tsx +++ b/src/views/room/widgets/furniture/badge-display/FurnitureBadgeDisplayView.tsx @@ -1,6 +1,6 @@ import { NitroEvent, RoomEngineTriggerWidgetEvent, StringDataType } from '@nitrots/nitro-renderer'; import { FC, useCallback, useState } from 'react'; -import { GetRoomEngine, LocalizeBadgeDescription, LocalizeBadgeName, RoomWidgetRoomObjectUpdateEvent } from '../../../../../api'; +import { GetRoomEngine, LocalizeBadgeDescription, LocalizeBadgeName, RoomWidgetUpdateRoomObjectEvent } from '../../../../../api'; import { CreateEventDispatcherHook } from '../../../../../hooks'; import { useRoomEngineEvent } from '../../../../../hooks/events/nitro/room/room-engine-event'; import { NitroLayoutTrophyView } from '../../../../../layout'; @@ -36,8 +36,8 @@ export const FurnitureBadgeDisplayView: FC<{}> = props => setTrophyData(new FurnitureTrophyData(widgetEvent.objectId, widgetEvent.category, '1', senderName, date, badgeDesc, badgeName)); return; } - case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: { - const widgetEvent = (event as RoomWidgetRoomObjectUpdateEvent); + case RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED: { + const widgetEvent = (event as RoomWidgetUpdateRoomObjectEvent); setTrophyData(prevState => { @@ -52,7 +52,7 @@ export const FurnitureBadgeDisplayView: FC<{}> = props => useRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_BADGE_DISPLAY_ENGRAVING, onNitroEvent); useRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_ACHIEVEMENT_RESOLUTION_ENGRAVING, onNitroEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, widgetHandler.eventDispatcher, onNitroEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED, widgetHandler.eventDispatcher, onNitroEvent); const processAction = useCallback((type: string, value: string = null) => { diff --git a/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.scss b/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.scss index db574026..4c286c5e 100644 --- a/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.scss +++ b/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.scss @@ -1,4 +1,6 @@ -.nitro-exchange-credit { +.nitro-widget-exchange-credit { + width: $nitro-widget-exchange-credit-width; + height: $nitro-widget-exchange-credit-height; .exchange-image { background-image: url('../../../../../assets/images/room-widgets/exchange-credit/exchange-credit-image.png'); diff --git a/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.tsx b/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.tsx index d1078f66..2ee5d497 100644 --- a/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.tsx +++ b/src/views/room/widgets/furniture/exchange-credit/FurnitureExchangeCreditView.tsx @@ -39,7 +39,7 @@ export const FurnitureExchangeCreditView: FC<{}> = props => if(objectId === -1) return null; return ( - + diff --git a/src/views/room/widgets/furniture/friend-furni/FurnitureFriendFurniView.tsx b/src/views/room/widgets/furniture/friend-furni/FurnitureFriendFurniView.tsx index c8b5eb0b..b9c8163c 100644 --- a/src/views/room/widgets/furniture/friend-furni/FurnitureFriendFurniView.tsx +++ b/src/views/room/widgets/furniture/friend-furni/FurnitureFriendFurniView.tsx @@ -1,6 +1,6 @@ import { FriendFurniConfirmLockMessageComposer, LoveLockFurniFinishedEvent, LoveLockFurniFriendConfirmedEvent, LoveLockFurniStartEvent, NitroEvent, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer'; import { FC, useCallback, useState } from 'react'; -import { GetRoomEngine, GetRoomSession, LocalizeText, RoomWidgetRoomObjectUpdateEvent } from '../../../../../api'; +import { GetRoomEngine, GetRoomSession, LocalizeText, RoomWidgetUpdateRoomObjectEvent } from '../../../../../api'; import { CreateEventDispatcherHook } from '../../../../../hooks/events/event-dispatcher.base'; import { useRoomEngineEvent } from '../../../../../hooks/events/nitro/room/room-engine-event'; import { CreateMessageHook } from '../../../../../hooks/messages/message-event'; @@ -37,8 +37,8 @@ export const FurnitureFriendFurniView: FC<{}> = props => } return; } - case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: { - const widgetEvent = (event as RoomWidgetRoomObjectUpdateEvent); + case RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED: { + const widgetEvent = (event as RoomWidgetUpdateRoomObjectEvent); setEngravingLockData(prevState => { @@ -52,7 +52,7 @@ export const FurnitureFriendFurniView: FC<{}> = props => }; useRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_FRIEND_FURNITURE_ENGRAVING, onNitroEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, eventDispatcher, onNitroEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED, eventDispatcher, onNitroEvent); const onLoveLockFurniStartEvent = useCallback((event: LoveLockFurniStartEvent) => { diff --git a/src/views/room/widgets/furniture/gift-opening/FurnitureGiftOpeningView.tsx b/src/views/room/widgets/furniture/gift-opening/FurnitureGiftOpeningView.tsx index f0aabaf5..3348cada 100644 --- a/src/views/room/widgets/furniture/gift-opening/FurnitureGiftOpeningView.tsx +++ b/src/views/room/widgets/furniture/gift-opening/FurnitureGiftOpeningView.tsx @@ -1,8 +1,10 @@ import { RoomObjectCategory, RoomObjectOperationType } from '@nitrots/nitro-renderer'; import { FC, useCallback, useMemo, useState } from 'react'; -import { CreateLinkEvent, GetRoomEngine, GetSessionDataManager, LocalizeText, RoomWidgetPresentOpenMessage, RoomWidgetRoomObjectUpdateEvent, RoomWidgetUpdatePresentDataEvent } from '../../../../../api'; +import { CreateLinkEvent, GetRoomEngine, GetSessionDataManager, LocalizeText, RoomWidgetPresentOpenMessage, RoomWidgetUpdatePresentDataEvent, RoomWidgetUpdateRoomObjectEvent } from '../../../../../api'; +import { BatchUpdates } from '../../../../../hooks'; import { CreateEventDispatcherHook } from '../../../../../hooks/events/event-dispatcher.base'; -import { NitroCardContentView, NitroCardHeaderView, NitroCardView, NitroLayoutGiftCardView } from '../../../../../layout'; +import { NitroCardContentView, NitroCardHeaderView, NitroCardView, NitroLayoutButton, NitroLayoutFlex, NitroLayoutFlexColumn, NitroLayoutGiftCardView, NitroLayoutGrid, NitroLayoutGridColumn } from '../../../../../layout'; +import { NitroLayoutBase } from '../../../../../layout/base'; import { ProductTypeEnum } from '../../../../catalog/common/ProductTypeEnum'; import { useRoomContext } from '../../../context/RoomContext'; @@ -10,6 +12,11 @@ const FLOOR: string = 'floor'; const WALLPAPER: string = 'wallpaper'; const LANDSCAPE: string = 'landscape'; +const ACTION_GIVE_GIFT = 0; +const ACTION_OPEN = 1; +const ACTION_PLACE = 2; +const ACTION_INVENTORY = 3; + export const FurnitureGiftOpeningView: FC<{}> = props => { const [ objectId, setObjectId ] = useState(-1); @@ -44,57 +51,67 @@ export const FurnitureGiftOpeningView: FC<{}> = props => switch(event.type) { case RoomWidgetUpdatePresentDataEvent.PACKAGEINFO: { - setOpenRequested(false); - setObjectId(event.objectId); - setText(event.giftMessage); - setIsOwnerOfFurniture(event.isController); - setSenderName(event.purchaserName); - setSenderFigure(event.purchaserFigure); - setImageUrl(event.imageUrl); + BatchUpdates(() => + { + setOpenRequested(false); + setObjectId(event.objectId); + setText(event.giftMessage); + setIsOwnerOfFurniture(event.isController); + setSenderName(event.purchaserName); + setSenderFigure(event.purchaserFigure); + setImageUrl(event.imageUrl); + }); return; } case RoomWidgetUpdatePresentDataEvent.CONTENTS_FLOOR: case RoomWidgetUpdatePresentDataEvent.CONTENTS_LANDSCAPE: case RoomWidgetUpdatePresentDataEvent.CONTENTS_WALLPAPER: { - setObjectId(event.objectId); - setClassId(event.classId); - setItemType(event.itemType); - setText(event.giftMessage); - setIsOwnerOfFurniture(event.isController); - setPlacedItemId(event.placedItemId); - setPlacedItemType(event.placedItemType); - setPlacedInRoom(event.placedInRoom); - let imageType: string = null; if(event.type === RoomWidgetUpdatePresentDataEvent.CONTENTS_FLOOR) imageType = 'packagecard_icon_floor'; else if(event.type === RoomWidgetUpdatePresentDataEvent.CONTENTS_LANDSCAPE) imageType = 'packagecard_icon_landscape'; else if(event.type === RoomWidgetUpdatePresentDataEvent.CONTENTS_WALLPAPER) imageType = 'packagecard_icon_wallpaper'; - setImageUrl(getGiftImageUrl(imageType)); + BatchUpdates(() => + { + setObjectId(event.objectId); + setClassId(event.classId); + setItemType(event.itemType); + setText(event.giftMessage); + setIsOwnerOfFurniture(event.isController); + setPlacedItemId(event.placedItemId); + setPlacedItemType(event.placedItemType); + setPlacedInRoom(event.placedInRoom); + setImageUrl(getGiftImageUrl(imageType)); + }); return; } case RoomWidgetUpdatePresentDataEvent.CONTENTS_CLUB: { - setObjectId(event.objectId); - setClassId(event.classId); - setItemType(event.itemType); - setText(event.giftMessage); - setIsOwnerOfFurniture(event.isController); - setImageUrl(getGiftImageUrl('packagecard_icon_hc')); + BatchUpdates(() => + { + setObjectId(event.objectId); + setClassId(event.classId); + setItemType(event.itemType); + setText(event.giftMessage); + setIsOwnerOfFurniture(event.isController); + setImageUrl(getGiftImageUrl('packagecard_icon_hc')); + }); return; } case RoomWidgetUpdatePresentDataEvent.CONTENTS: { if(!openRequested) return; - setObjectId(event.objectId); - setClassId(event.classId); - setItemType(event.itemType); - setText(event.giftMessage); - setIsOwnerOfFurniture(event.isController); - setPlacedItemId(event.placedItemId); - setPlacedItemType(event.placedItemType); - setPlacedInRoom(event.placedInRoom); - + BatchUpdates(() => + { + setObjectId(event.objectId); + setClassId(event.classId); + setItemType(event.itemType); + setText(event.giftMessage); + setIsOwnerOfFurniture(event.isController); + setPlacedItemId(event.placedItemId); + setPlacedItemType(event.placedItemType); + setPlacedInRoom(event.placedInRoom); + }); return; } case RoomWidgetUpdatePresentDataEvent.CONTENTS_IMAGE: { @@ -113,7 +130,7 @@ export const FurnitureGiftOpeningView: FC<{}> = props => CreateEventDispatcherHook(RoomWidgetUpdatePresentDataEvent.CONTENTS_CLUB, eventDispatcher, onRoomWidgetUpdatePresentDataEvent); CreateEventDispatcherHook(RoomWidgetUpdatePresentDataEvent.CONTENTS_IMAGE, eventDispatcher, onRoomWidgetUpdatePresentDataEvent); - const onRoomWidgetRoomObjectUpdateEvent = useCallback((event: RoomWidgetRoomObjectUpdateEvent) => + const onRoomWidgetRoomObjectUpdateEvent = useCallback((event: RoomWidgetUpdateRoomObjectEvent) => { if(event.id === objectId) clearGift(); @@ -123,17 +140,20 @@ export const FurnitureGiftOpeningView: FC<{}> = props => } }, [ objectId, placedItemId, placedInRoom, clearGift ]); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); const close = useCallback(() => { - setObjectId(-1); - setOpenRequested(false); - setPlacedItemId(-1); - setPlacedInRoom(false); - setText(null); - setIsOwnerOfFurniture(false); - }, [ clearGift ]); + BatchUpdates(() => + { + setObjectId(-1); + setOpenRequested(false); + setPlacedItemId(-1); + setPlacedInRoom(false); + setText(null); + setIsOwnerOfFurniture(false); + }); + }, []); const isSpaces = useMemo(() => { @@ -152,26 +172,25 @@ export const FurnitureGiftOpeningView: FC<{}> = props => { if(objectId === -1) return ''; - if(isSpaces) - return 'widget.furni.present.spaces.message_opened'; + if(isSpaces) return 'widget.furni.present.spaces.message_opened'; return 'widget.furni.present.message_opened'; }, [ objectId, isSpaces ]); - const handleAction = useCallback((action: string) => + const handleAction = useCallback((action: number) => { switch(action) { - case 'give_gift': + case ACTION_GIVE_GIFT: CreateLinkEvent('catalog/open'); return; - case 'open': + case ACTION_OPEN: setOpenRequested(true); widgetHandler.processWidgetMessage(new RoomWidgetPresentOpenMessage(RoomWidgetPresentOpenMessage.OPEN_PRESENT, objectId)); return; - case 'room': + case ACTION_PLACE: return; - case 'inventory': + case ACTION_INVENTORY: if((placedItemId > 0) && placedInRoom) { if(placedItemType === ProductTypeEnum.PET) @@ -195,32 +214,48 @@ export const FurnitureGiftOpeningView: FC<{}> = props => return ( - + - { placedItemId === -1 && <> - - { isOwnerOfFurniture &&
- { senderName && } - -
} - } - { placedItemId !== -1 && <> -
-
- -
-
- { LocalizeText(productName, ['product'], [text]) } -
-
-
- - -
- { senderName && <> - - } - } + + { (placedItemId === -1) && + + + + + + { senderName && + handleAction(ACTION_GIVE_GIFT) }> + { LocalizeText('widget.furni.present.give_gift', [ 'name' ], [ senderName ]) } + } + handleAction(ACTION_OPEN) }> + { LocalizeText('widget.furni.present.open_gift') } + + + } + { (placedItemId > -1) && + + + + + { LocalizeText(productName, [ 'product' ], [ text ]) } + + + + + handleAction(ACTION_INVENTORY) }> + { LocalizeText('widget.furni.present.put_in_inventory') } + + handleAction(ACTION_PLACE) }> + { LocalizeText(placedInRoom ? 'widget.furni.present.keep_in_room' : 'widget.furni.present.place_in_room') } + + + { (senderName && senderName.length) && + handleAction(ACTION_GIVE_GIFT) }> + { LocalizeText('widget.furni.present.give_gift', [ 'name' ], [ senderName ]) } + } + + } +
); diff --git a/src/views/room/widgets/furniture/high-score/FurnitureHighScoreView.scss b/src/views/room/widgets/furniture/high-score/FurnitureHighScoreView.scss index 2635164f..a02f8b69 100644 --- a/src/views/room/widgets/furniture/high-score/FurnitureHighScoreView.scss +++ b/src/views/room/widgets/furniture/high-score/FurnitureHighScoreView.scss @@ -1,5 +1,6 @@ -.highscore-widget +.nitro-widget-high-score { - width: 150px; - max-width: 150px; + width: 250px; + max-width: 250px; + height: 200px; } diff --git a/src/views/room/widgets/furniture/high-score/FurnitureHighScoreView.tsx b/src/views/room/widgets/furniture/high-score/FurnitureHighScoreView.tsx index 3a322c20..981fe26a 100644 --- a/src/views/room/widgets/furniture/high-score/FurnitureHighScoreView.tsx +++ b/src/views/room/widgets/furniture/high-score/FurnitureHighScoreView.tsx @@ -2,13 +2,15 @@ import { HighScoreDataType, ObjectDataFactory, RoomEngineTriggerWidgetEvent, Roo import { FC, useCallback, useState } from 'react'; import { GetRoomEngine, LocalizeText } from '../../../../../api'; import { useRoomEngineEvent } from '../../../../../hooks'; +import { NitroLayoutGrid, NitroLayoutGridColumn } from '../../../../../layout'; +import { NitroLayoutBase } from '../../../../../layout/base'; import { useRoomContext } from '../../../context/RoomContext'; import { ContextMenuView } from '../../context-menu/ContextMenuView'; import { ContextMenuHeaderView } from '../../context-menu/views/header/ContextMenuHeaderView'; import { ContextMenuListView } from '../../context-menu/views/list/ContextMenuListView'; -const SCORE_TYPES = ['perteam', 'mostwins', 'classic']; -const CLEAR_TYPES = ['alltime', 'daily', 'weekly', 'monthly']; +const SCORE_TYPES = [ 'perteam', 'mostwins', 'classic' ]; +const CLEAR_TYPES = [ 'alltime', 'daily', 'weekly', 'monthly' ]; export const FurnitureHighScoreView: FC<{}> = props => { @@ -55,33 +57,48 @@ export const FurnitureHighScoreView: FC<{}> = props => if((objectId === -1) || !stuffData) return null; return ( - + { LocalizeText('high.score.display.caption', [ 'scoretype', 'cleartype' ], [LocalizeText(`high.score.display.scoretype.${ SCORE_TYPES[stuffData.scoreType] }`), LocalizeText(`high.score.display.cleartype.${ CLEAR_TYPES[stuffData.clearType] }`) ]) } -
-
{ LocalizeText('high.score.display.users.header') }
-
{ LocalizeText('high.score.display.score.header') }
-
-
-
-
- { stuffData.entries.map((entry, index) => - { - return
{entry.users.join()}
- }) - } -
-
-
+ + + + { LocalizeText('high.score.display.users.header') } + + + + + { LocalizeText('high.score.display.score.header') } + + + +
+ + { stuffData.entries.map((entry, index) => { - return
{entry.score}
+ return ( + + { entry.users.join(', ') } + + ); }) } -
-
+ + + { stuffData.entries.map((entry, index) => + { + return ( + + { entry.score } + + ); + }) + } + +
); diff --git a/src/views/room/widgets/furniture/manipulation-menu/FurnitureManipulationMenuView.tsx b/src/views/room/widgets/furniture/manipulation-menu/FurnitureManipulationMenuView.tsx index 33752c8f..5590392a 100644 --- a/src/views/room/widgets/furniture/manipulation-menu/FurnitureManipulationMenuView.tsx +++ b/src/views/room/widgets/furniture/manipulation-menu/FurnitureManipulationMenuView.tsx @@ -1,6 +1,6 @@ import { RoomObjectOperationType } from '@nitrots/nitro-renderer'; import { FC, useCallback, useEffect, useState } from 'react'; -import { ProcessRoomObjectOperation, RoomWidgetRoomObjectUpdateEvent, RoomWidgetUpdateDecorateModeEvent } from '../../../../../api'; +import { ProcessRoomObjectOperation, RoomWidgetUpdateDecorateModeEvent, RoomWidgetUpdateRoomObjectEvent } from '../../../../../api'; import { BatchUpdates } from '../../../../../hooks'; import { CreateEventDispatcherHook } from '../../../../../hooks/events/event-dispatcher.base'; import { useRoomContext } from '../../../context/RoomContext'; @@ -28,11 +28,11 @@ export const FurnitureManipulationMenuView: FC<{}> = props => ProcessRoomObjectOperation(objectId, objectType, RoomObjectOperationType.OBJECT_PICKUP); }, [ objectId, objectType ]); - const onRoomWidgetRoomObjectUpdateEvent = useCallback((event: RoomWidgetRoomObjectUpdateEvent) => + const onRoomWidgetRoomObjectUpdateEvent = useCallback((event: RoomWidgetUpdateRoomObjectEvent) => { switch(event.type) { - case RoomWidgetRoomObjectUpdateEvent.OBJECT_REQUEST_MANIPULATION: { + case RoomWidgetUpdateRoomObjectEvent.OBJECT_REQUEST_MANIPULATION: { BatchUpdates(() => { setIsVisible(true); @@ -41,7 +41,7 @@ export const FurnitureManipulationMenuView: FC<{}> = props => }); return; } - case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: { + case RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED: { if(event.id === objectId) { BatchUpdates(() => @@ -53,7 +53,7 @@ export const FurnitureManipulationMenuView: FC<{}> = props => } return; } - case RoomWidgetRoomObjectUpdateEvent.OBJECT_DESELECTED: { + case RoomWidgetUpdateRoomObjectEvent.OBJECT_DESELECTED: { BatchUpdates(() => { setIsVisible(false); @@ -65,8 +65,8 @@ export const FurnitureManipulationMenuView: FC<{}> = props => } }, [ objectId ]); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.OBJECT_REQUEST_MANIPULATION, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.OBJECT_DESELECTED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.OBJECT_REQUEST_MANIPULATION, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.OBJECT_DESELECTED, eventDispatcher, onRoomWidgetRoomObjectUpdateEvent); const onRoomWidgetUpdateDecorateModeEvent = useCallback((event: RoomWidgetUpdateDecorateModeEvent) => { diff --git a/src/views/room/widgets/furniture/stickie/FurnitureStickieView.scss b/src/views/room/widgets/furniture/stickie/FurnitureStickieView.scss index fc0c09da..95c8aecd 100644 --- a/src/views/room/widgets/furniture/stickie/FurnitureStickieView.scss +++ b/src/views/room/widgets/furniture/stickie/FurnitureStickieView.scss @@ -5,6 +5,7 @@ top: 25px; left: 25px; padding: 1px; + pointer-events: all; .stickie-header { width: 183px; diff --git a/src/views/room/widgets/furniture/stickie/FurnitureStickieView.tsx b/src/views/room/widgets/furniture/stickie/FurnitureStickieView.tsx index 1c4fb312..3e4718cf 100644 --- a/src/views/room/widgets/furniture/stickie/FurnitureStickieView.tsx +++ b/src/views/room/widgets/furniture/stickie/FurnitureStickieView.tsx @@ -1,6 +1,6 @@ import { NitroEvent, RoomEngineTriggerWidgetEvent, RoomObjectVariable } from '@nitrots/nitro-renderer'; import { FC, useCallback, useState } from 'react'; -import { ColorUtils, GetRoomEngine, GetRoomSession, GetSessionDataManager, RoomWidgetRoomObjectUpdateEvent } from '../../../../../api'; +import { ColorUtils, GetRoomEngine, GetRoomSession, GetSessionDataManager, RoomWidgetUpdateRoomObjectEvent } from '../../../../../api'; import { CreateEventDispatcherHook } from '../../../../../hooks/events/event-dispatcher.base'; import { useRoomEngineEvent } from '../../../../../hooks/events/nitro/room/room-engine-event'; import { DraggableWindowPosition } from '../../../../../layout'; @@ -45,8 +45,8 @@ export const FurnitureStickieView: FC<{}> = props => setStickieData(new FurnitureStickieData(widgetEvent.objectId, widgetEvent.category, color, text, (GetRoomSession().isRoomOwner || GetSessionDataManager().isModerator), false)); return; } - case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: { - const widgetEvent = (event as RoomWidgetRoomObjectUpdateEvent); + case RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED: { + const widgetEvent = (event as RoomWidgetUpdateRoomObjectEvent); setStickieData(prevState => { @@ -60,7 +60,7 @@ export const FurnitureStickieView: FC<{}> = props => }, []); useRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_STICKIE, onNitroEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, eventDispatcher, onNitroEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED, eventDispatcher, onNitroEvent); const processAction = useCallback((type: string, value: string = null) => { diff --git a/src/views/room/widgets/infostand/InfoStandWidgetView.tsx b/src/views/room/widgets/infostand/InfoStandWidgetView.tsx index 01190223..4f240121 100644 --- a/src/views/room/widgets/infostand/InfoStandWidgetView.tsx +++ b/src/views/room/widgets/infostand/InfoStandWidgetView.tsx @@ -1,5 +1,5 @@ import { FC, useCallback, useState } from 'react'; -import { RoomWidgetRoomObjectMessage, RoomWidgetRoomObjectUpdateEvent, RoomWidgetUpdateEvent, RoomWidgetUpdateInfostandEvent, RoomWidgetUpdateInfostandFurniEvent, RoomWidgetUpdateInfostandPetEvent, RoomWidgetUpdateInfostandRentableBotEvent, RoomWidgetUpdateInfostandUserEvent } from '../../../../api'; +import { RoomWidgetRoomObjectMessage, RoomWidgetUpdateEvent, RoomWidgetUpdateInfostandEvent, RoomWidgetUpdateInfostandFurniEvent, RoomWidgetUpdateInfostandPetEvent, RoomWidgetUpdateInfostandRentableBotEvent, RoomWidgetUpdateInfostandUserEvent, RoomWidgetUpdateRoomObjectEvent } from '../../../../api'; import { CreateEventDispatcherHook } from '../../../../hooks/events/event-dispatcher.base'; import { useRoomContext } from '../../context/RoomContext'; import { InfoStandWidgetBotView } from './views/bot/InfoStandWidgetBotView'; @@ -22,33 +22,33 @@ export const InfoStandWidgetView: FC<{}> = props => { switch(event.type) { - case RoomWidgetRoomObjectUpdateEvent.OBJECT_SELECTED: { - const roomObjectEvent = (event as RoomWidgetRoomObjectUpdateEvent); + case RoomWidgetUpdateRoomObjectEvent.OBJECT_SELECTED: { + const roomObjectEvent = (event as RoomWidgetUpdateRoomObjectEvent); widgetHandler.processWidgetMessage(new RoomWidgetRoomObjectMessage(RoomWidgetRoomObjectMessage.GET_OBJECT_INFO, roomObjectEvent.id, roomObjectEvent.category)); return; } - case RoomWidgetRoomObjectUpdateEvent.OBJECT_DESELECTED: { - const roomObjectEvent = (event as RoomWidgetRoomObjectUpdateEvent); + case RoomWidgetUpdateRoomObjectEvent.OBJECT_DESELECTED: { + const roomObjectEvent = (event as RoomWidgetUpdateRoomObjectEvent); closeInfostand(); return; } - case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: - case RoomWidgetRoomObjectUpdateEvent.USER_REMOVED: { - const roomObjectEvent = (event as RoomWidgetRoomObjectUpdateEvent); + case RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED: + case RoomWidgetUpdateRoomObjectEvent.USER_REMOVED: { + const roomObjectEvent = (event as RoomWidgetUpdateRoomObjectEvent); setInfoStandEvent(prevValue => { switch(event.type) { - case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: + case RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED: if(prevValue instanceof RoomWidgetUpdateInfostandFurniEvent) { if(prevValue.id === roomObjectEvent.id) return null; } break; - case RoomWidgetRoomObjectUpdateEvent.USER_REMOVED: + case RoomWidgetUpdateRoomObjectEvent.USER_REMOVED: if(prevValue instanceof RoomWidgetUpdateInfostandUserEvent || prevValue instanceof RoomWidgetUpdateInfostandRentableBotEvent) { if(prevValue.roomIndex === roomObjectEvent.id) return null; @@ -80,10 +80,10 @@ export const InfoStandWidgetView: FC<{}> = props => } }, [ widgetHandler, closeInfostand ]); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.OBJECT_SELECTED, eventDispatcher, onRoomWidgetUpdateEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.OBJECT_DESELECTED, eventDispatcher, onRoomWidgetUpdateEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.USER_REMOVED, eventDispatcher, onRoomWidgetUpdateEvent); - CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, eventDispatcher, onRoomWidgetUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.OBJECT_SELECTED, eventDispatcher, onRoomWidgetUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.OBJECT_DESELECTED, eventDispatcher, onRoomWidgetUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.USER_REMOVED, eventDispatcher, onRoomWidgetUpdateEvent); + CreateEventDispatcherHook(RoomWidgetUpdateRoomObjectEvent.FURNI_REMOVED, eventDispatcher, onRoomWidgetUpdateEvent); CreateEventDispatcherHook(RoomWidgetUpdateInfostandFurniEvent.FURNI, eventDispatcher, onRoomWidgetUpdateEvent); CreateEventDispatcherHook(RoomWidgetUpdateInfostandUserEvent.OWN_USER, eventDispatcher, onRoomWidgetUpdateEvent); CreateEventDispatcherHook(RoomWidgetUpdateInfostandUserEvent.PEER, eventDispatcher, onRoomWidgetUpdateEvent); From 6da92ac8c31b8a011c87c93b928fc89c4778b67c Mon Sep 17 00:00:00 2001 From: Bill Date: Sat, 16 Oct 2021 01:57:28 -0400 Subject: [PATCH 09/12] Update notification bubbles --- .../bubble-layouts/club-gift/NotificationClubGiftBubbleView.tsx | 2 +- .../bubble-layouts/default/NotificationDefaultBubbleView.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/views/notification-center/views/bubble-layouts/club-gift/NotificationClubGiftBubbleView.tsx b/src/views/notification-center/views/bubble-layouts/club-gift/NotificationClubGiftBubbleView.tsx index 0c03c440..e0913072 100644 --- a/src/views/notification-center/views/bubble-layouts/club-gift/NotificationClubGiftBubbleView.tsx +++ b/src/views/notification-center/views/bubble-layouts/club-gift/NotificationClubGiftBubbleView.tsx @@ -10,7 +10,7 @@ export const NotificationClubGiftBubbleView: FC +
{ LocalizeText('notifications.text.club_gift') } diff --git a/src/views/notification-center/views/bubble-layouts/default/NotificationDefaultBubbleView.tsx b/src/views/notification-center/views/bubble-layouts/default/NotificationDefaultBubbleView.tsx index 3e70b32c..4b748636 100644 --- a/src/views/notification-center/views/bubble-layouts/default/NotificationDefaultBubbleView.tsx +++ b/src/views/notification-center/views/bubble-layouts/default/NotificationDefaultBubbleView.tsx @@ -7,7 +7,7 @@ export const NotificationDefaultBubbleView: FC + { (item.iconUrl && item.iconUrl.length) && } { item.message } From f65947c8f68cd61a73a9ead714749a715dc1bbd5 Mon Sep 17 00:00:00 2001 From: Bill Date: Sat, 16 Oct 2021 01:57:41 -0400 Subject: [PATCH 10/12] Update inventory badges --- src/views/inventory/views/badge/InventoryBadgeView.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/views/inventory/views/badge/InventoryBadgeView.tsx b/src/views/inventory/views/badge/InventoryBadgeView.tsx index 506db989..342cc15a 100644 --- a/src/views/inventory/views/badge/InventoryBadgeView.tsx +++ b/src/views/inventory/views/badge/InventoryBadgeView.tsx @@ -85,7 +85,7 @@ export const InventoryBadgeView: FC = props => - { LocalizeText('inventory.badges.activebadges') } + { LocalizeText('inventory.badges.activebadges') } { badge && (badge.length > 0) && From c08e60ba2d22ab10f3a65b362870c5ec957d21bc Mon Sep 17 00:00:00 2001 From: Bill Date: Sat, 16 Oct 2021 01:58:12 -0400 Subject: [PATCH 11/12] Update CatalogGiftView --- src/views/catalog/views/gift/CatalogGiftView.tsx | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/views/catalog/views/gift/CatalogGiftView.tsx b/src/views/catalog/views/gift/CatalogGiftView.tsx index d466d5b6..258d07f5 100644 --- a/src/views/catalog/views/gift/CatalogGiftView.tsx +++ b/src/views/catalog/views/gift/CatalogGiftView.tsx @@ -54,8 +54,11 @@ export const CatalogGiftView: FC<{}> = props => if(giftData.colors && giftData.colors.length > 0) newColors.push({ id: colorId, color: `#${giftData.colors[0].toString(16)}` }); } - setSelectedColorId(newColors[0].id); - setColors(newColors); + if(newColors.length) + { + setSelectedColorId(newColors[0].id); + setColors(newColors); + } }, [ giftConfiguration ]); const close = useCallback(() => @@ -68,7 +71,8 @@ export const CatalogGiftView: FC<{}> = props => setMessage(''); setSelectedBoxIndex(0); setSelectedRibbonIndex(0); - setSelectedColorId(colors[0].id); + + if(colors.length) setSelectedColorId(colors[0].id); }, [ colors ]); const onCatalogEvent = useCallback((event: CatalogEvent) => From 1862fcb45c868c7c91923cc3f70168be66a2735d Mon Sep 17 00:00:00 2001 From: Bill Date: Sat, 16 Oct 2021 01:58:33 -0400 Subject: [PATCH 12/12] Update scss --- src/App.scss | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/App.scss b/src/App.scss index 9ae7fa7c..3ab4f7fd 100644 --- a/src/App.scss +++ b/src/App.scss @@ -35,6 +35,15 @@ $navigator-height: 420px; $chat-input-style-selector-widget-width: 200px; $chat-input-style-selector-widget-height: 200px; +$user-profile-width: 560px; +$user-profile-height: 500px; + +$nitro-widget-custom-stack-height-width: 275px; +$nitro-widget-custom-stack-height-height: 220px; + +$nitro-widget-exchange-credit-width: 375px; +$nitro-widget-exchange-credit-height: 150px; + .nitro-app { width: 100%; height: 100%;