diff --git a/src/api/nitro/room/widgets/events/RoomDimmerPreset.ts b/src/api/nitro/room/widgets/events/RoomDimmerPreset.ts new file mode 100644 index 00000000..cfae6512 --- /dev/null +++ b/src/api/nitro/room/widgets/events/RoomDimmerPreset.ts @@ -0,0 +1,35 @@ +export class RoomDimmerPreset +{ + private _id: number; + private _bgOnly: boolean; + private _color: string; + private _brightness: number; + + constructor(id: number, bgOnly: boolean, color: string, brightness: number) + { + this._id = id; + this._bgOnly = bgOnly; + this._color = color; + this._brightness = brightness; + } + + public get id(): number + { + return this._id; + } + + public get bgOnly(): boolean + { + return this._bgOnly; + } + + public get color(): string + { + return this._color; + } + + public get brightness(): number + { + return this._brightness; + } +} diff --git a/src/api/nitro/room/widgets/events/RoomWidgetDimmerStateUpdateEvent.ts b/src/api/nitro/room/widgets/events/RoomWidgetDimmerStateUpdateEvent.ts new file mode 100644 index 00000000..ae1a49b7 --- /dev/null +++ b/src/api/nitro/room/widgets/events/RoomWidgetDimmerStateUpdateEvent.ts @@ -0,0 +1,48 @@ +import { RoomWidgetUpdateEvent } from './RoomWidgetUpdateEvent'; + +export class RoomWidgetDimmerStateUpdateEvent extends RoomWidgetUpdateEvent +{ + public static DIMMER_STATE: string = 'RWDSUE_DIMMER_STATE'; + + private _state: number; + private _presetId: number; + private _effectId: number; + private _color: number; + private _brightness: number; + + constructor(state: number, presetId: number, effectId: number, color: number, brightness: number) + { + super(RoomWidgetDimmerStateUpdateEvent.DIMMER_STATE); + + this._state = state; + this._presetId = presetId; + this._effectId = effectId; + this._color = color; + this._brightness = brightness; + } + + public get state(): number + { + return this._state; + } + + public get presetId(): number + { + return this._presetId; + } + + public get effectId(): number + { + return this._effectId; + } + + public get color(): number + { + return this._color; + } + + public get brightness(): number + { + return this._brightness; + } +} diff --git a/src/api/nitro/room/widgets/events/RoomWidgetDimmerUpdateEvent.ts b/src/api/nitro/room/widgets/events/RoomWidgetDimmerUpdateEvent.ts new file mode 100644 index 00000000..74f149b7 --- /dev/null +++ b/src/api/nitro/room/widgets/events/RoomWidgetDimmerUpdateEvent.ts @@ -0,0 +1,50 @@ +import { RoomDimmerPreset } from './RoomDimmerPreset'; +import { RoomWidgetUpdateEvent } from './RoomWidgetUpdateEvent'; + +export class RoomWidgetDimmerUpdateEvent extends RoomWidgetUpdateEvent +{ + public static PRESETS: string = 'RWDUE_PRESETS'; + public static HIDE: string = 'RWDUE_HIDE'; + + private _selectedPresetId: number = 0; + private _presets: RoomDimmerPreset[]; + + constructor(type: string) + { + super(type); + + this._presets = []; + } + + public get presetCount(): number + { + return this._presets.length; + } + + public get presets(): RoomDimmerPreset[] + { + return this._presets; + } + + public get selectedPresetId(): number + { + return this._selectedPresetId; + } + + public set selectedPresetId(k: number) + { + this._selectedPresetId = k; + } + + public setPresetValues(id: number, bgOnly: boolean, color: string, brightness: number):void + { + const preset = new RoomDimmerPreset(id, bgOnly, color, brightness); + + this._presets[(id - 1)] = preset; + } + + public getPresetNumber(id: number): RoomDimmerPreset + { + return this._presets[id]; + } +} diff --git a/src/api/nitro/room/widgets/events/index.ts b/src/api/nitro/room/widgets/events/index.ts index 4b4810d0..e70cc1ed 100644 --- a/src/api/nitro/room/widgets/events/index.ts +++ b/src/api/nitro/room/widgets/events/index.ts @@ -2,6 +2,7 @@ export * from './IPhotoData'; export * from './RoomObjectItem'; export * from './RoomWidgetAvatarInfoEvent'; export * from './RoomWidgetChooserContentEvent'; +export * from './RoomWidgetDimmerUpdateEvent'; export * from './RoomWidgetDoorbellEvent'; export * from './RoomWidgetFloodControlEvent'; export * from './RoomWidgetObjectNameEvent'; diff --git a/src/api/nitro/room/widgets/handlers/FurnitureDimmerWidgetHandler.ts b/src/api/nitro/room/widgets/handlers/FurnitureDimmerWidgetHandler.ts new file mode 100644 index 00000000..0695304a --- /dev/null +++ b/src/api/nitro/room/widgets/handlers/FurnitureDimmerWidgetHandler.ts @@ -0,0 +1,111 @@ +import { NitroEvent, RoomControllerLevel, RoomEngineDimmerStateEvent, RoomEngineTriggerWidgetEvent, RoomSessionDimmerPresetsEvent, RoomWidgetEnum } from '@nitrots/nitro-renderer'; +import { GetRoomEngine } from '../..'; +import { GetSessionDataManager } from '../../..'; +import { RoomWidgetDimmerUpdateEvent, RoomWidgetUpdateEvent } from '../events'; +import { RoomWidgetDimmerStateUpdateEvent } from '../events/RoomWidgetDimmerStateUpdateEvent'; +import { RoomWidgetDimmerChangeStateMessage, RoomWidgetDimmerPreviewMessage, RoomWidgetFurniToWidgetMessage, RoomWidgetMessage } from '../messages'; +import { RoomWidgetDimmerSavePresetMessage } from '../messages/RoomWidgetDimmerSavePresetMessage'; +import { RoomWidgetHandler } from './RoomWidgetHandler'; + +export class FurnitureDimmerWidgetHandler extends RoomWidgetHandler +{ + public processEvent(event: NitroEvent): void + { + switch(event.type) + { + case RoomSessionDimmerPresetsEvent.ROOM_DIMMER_PRESETS: { + const presetsEvent = (event as RoomSessionDimmerPresetsEvent); + const updateEvent = new RoomWidgetDimmerUpdateEvent(RoomWidgetDimmerUpdateEvent.PRESETS); + + updateEvent.selectedPresetId = presetsEvent.selectedPresetId; + + let i = 0; + + while(i < presetsEvent.presetCount) + { + const preset = presetsEvent.getPreset(i); + + if(preset) updateEvent.setPresetValues(preset.id, preset.bgOnly, preset.color, preset.brightness); + + i++; + } + + this.container.eventDispatcher.dispatchEvent(updateEvent); + return; + } + case RoomEngineDimmerStateEvent.ROOM_COLOR: { + const stateEvent = (event as RoomEngineDimmerStateEvent); + + this.container.eventDispatcher.dispatchEvent(new RoomWidgetDimmerStateUpdateEvent(stateEvent.state, stateEvent.presetId, stateEvent.effectId, stateEvent.color, stateEvent.brightness)); + return; + } + case RoomEngineTriggerWidgetEvent.REMOVE_DIMMER: { + this.container.eventDispatcher.dispatchEvent(new RoomWidgetDimmerUpdateEvent(RoomWidgetDimmerUpdateEvent.HIDE)); + return; + } + } + } + + public processWidgetMessage(message: RoomWidgetMessage): RoomWidgetUpdateEvent + { + switch(message.type) + { + case RoomWidgetFurniToWidgetMessage.REQUEST_DIMMER: { + if(this.canOpenWidget()) this.container.roomSession.requestMoodlightSettings(); + break; + } + case RoomWidgetDimmerSavePresetMessage.SAVE_PRESET: { + if(this.canOpenWidget()) + { + const savePresetMessage = (message as RoomWidgetDimmerSavePresetMessage); + this.container.roomSession.updateMoodlightData(savePresetMessage.presetNumber, savePresetMessage.effectTypeId, savePresetMessage.color, savePresetMessage.brightness, savePresetMessage.apply); + } + break; + } + case RoomWidgetDimmerChangeStateMessage.CHANGE_STATE: { + if(this.canOpenWidget()) this.container.roomSession.toggleMoodlightState(); + break; + } + case RoomWidgetDimmerPreviewMessage.PREVIEW_DIMMER_PRESET: { + const roomId = this.container.roomSession.roomId; + const previewMessage = (message as RoomWidgetDimmerPreviewMessage); + + if(!previewMessage || !GetRoomEngine()) return null; + + GetRoomEngine().updateObjectRoomColor(roomId, previewMessage.color, previewMessage.brightness, previewMessage.bgOnly); + break; + } + } + + return null; + } + + private canOpenWidget(): boolean + { + return (this.container.roomSession.isRoomOwner || (this.container.roomSession.controllerLevel >= RoomControllerLevel.GUEST) || GetSessionDataManager().isModerator); + } + + public get type(): string + { + return RoomWidgetEnum.ROOM_DIMMER; + } + + public get eventTypes(): string[] + { + return [ + RoomSessionDimmerPresetsEvent.ROOM_DIMMER_PRESETS, + RoomEngineDimmerStateEvent.ROOM_COLOR, + RoomEngineTriggerWidgetEvent.REMOVE_DIMMER + ]; + } + + public get messageTypes(): string[] + { + return [ + RoomWidgetFurniToWidgetMessage.REQUEST_DIMMER, + RoomWidgetDimmerSavePresetMessage.SAVE_PRESET, + RoomWidgetDimmerChangeStateMessage.CHANGE_STATE, + RoomWidgetDimmerPreviewMessage.PREVIEW_DIMMER_PRESET + ]; + } +} diff --git a/src/api/nitro/room/widgets/handlers/index.ts b/src/api/nitro/room/widgets/handlers/index.ts index 500115e7..ebd2591f 100644 --- a/src/api/nitro/room/widgets/handlers/index.ts +++ b/src/api/nitro/room/widgets/handlers/index.ts @@ -2,6 +2,7 @@ export * from './DoorbellWidgetHandler'; export * from './FurniChooserWidgetHandler'; export * from './FurnitureContextMenuWidgetHandler'; export * from './FurnitureCustomStackHeightWidgetHandler'; +export * from './FurnitureDimmerWidgetHandler'; export * from './FurnitureExternalImageWidgetHandler'; export * from './FurniturePresentWidgetHandler'; export * from './IRoomWidgetHandler'; diff --git a/src/api/nitro/room/widgets/messages/RoomWidgetDimmerChangeStateMessage.ts b/src/api/nitro/room/widgets/messages/RoomWidgetDimmerChangeStateMessage.ts new file mode 100644 index 00000000..de83f498 --- /dev/null +++ b/src/api/nitro/room/widgets/messages/RoomWidgetDimmerChangeStateMessage.ts @@ -0,0 +1,11 @@ +import { RoomWidgetMessage } from './RoomWidgetMessage'; + +export class RoomWidgetDimmerChangeStateMessage extends RoomWidgetMessage +{ + public static CHANGE_STATE: string = 'RWCDSM_CHANGE_STATE'; + + constructor() + { + super(RoomWidgetDimmerChangeStateMessage.CHANGE_STATE); + } +} diff --git a/src/api/nitro/room/widgets/messages/RoomWidgetDimmerPreviewMessage.ts b/src/api/nitro/room/widgets/messages/RoomWidgetDimmerPreviewMessage.ts new file mode 100644 index 00000000..39708872 --- /dev/null +++ b/src/api/nitro/room/widgets/messages/RoomWidgetDimmerPreviewMessage.ts @@ -0,0 +1,34 @@ +import { RoomWidgetMessage } from './RoomWidgetMessage'; + +export class RoomWidgetDimmerPreviewMessage extends RoomWidgetMessage +{ + public static PREVIEW_DIMMER_PRESET: string = 'RWDPM_PREVIEW_DIMMER_PRESET'; + + private _color: number; + private _brightness: number; + private _bgOnly: boolean; + + constructor(color: number, brightness: number, bgOnly: boolean) + { + super(RoomWidgetDimmerPreviewMessage.PREVIEW_DIMMER_PRESET); + + this._color = color; + this._brightness = brightness; + this._bgOnly = bgOnly; + } + + public get color(): number + { + return this._color; + } + + public get brightness(): number + { + return this._brightness; + } + + public get bgOnly(): boolean + { + return this._bgOnly; + } +} diff --git a/src/api/nitro/room/widgets/messages/RoomWidgetDimmerSavePresetMessage.ts b/src/api/nitro/room/widgets/messages/RoomWidgetDimmerSavePresetMessage.ts new file mode 100644 index 00000000..8e7bd831 --- /dev/null +++ b/src/api/nitro/room/widgets/messages/RoomWidgetDimmerSavePresetMessage.ts @@ -0,0 +1,48 @@ +import { RoomWidgetMessage } from './RoomWidgetMessage'; + +export class RoomWidgetDimmerSavePresetMessage extends RoomWidgetMessage +{ + public static SAVE_PRESET: string = 'RWSDPM_SAVE_PRESET'; + + private _presetNumber: number; + private _effectTypeId: number; + private _color: number; + private _brightness: number; + private _apply: boolean; + + constructor(presetNumber: number, effectTypeId: number, color: number, brightness: number, apply: boolean) + { + super(RoomWidgetDimmerSavePresetMessage.SAVE_PRESET); + + this._presetNumber = presetNumber; + this._effectTypeId = effectTypeId; + this._color = color; + this._brightness = brightness; + this._apply = apply; + } + + public get presetNumber(): number + { + return this._presetNumber; + } + + public get effectTypeId(): number + { + return this._effectTypeId; + } + + public get color(): number + { + return this._color; + } + + public get brightness(): number + { + return this._brightness; + } + + public get apply(): boolean + { + return this._apply; + } +} diff --git a/src/api/nitro/room/widgets/messages/index.ts b/src/api/nitro/room/widgets/messages/index.ts index 2cfcba12..65309aad 100644 --- a/src/api/nitro/room/widgets/messages/index.ts +++ b/src/api/nitro/room/widgets/messages/index.ts @@ -5,6 +5,9 @@ export * from './RoomWidgetChatMessage'; export * from './RoomWidgetChatSelectAvatarMessage'; export * from './RoomWidgetChatTypingMessage'; export * from './RoomWidgetDanceMessage'; +export * from './RoomWidgetDimmerChangeStateMessage'; +export * from './RoomWidgetDimmerPreviewMessage'; +export * from './RoomWidgetDimmerSavePresetMessage'; export * from './RoomWidgetFurniActionMessage'; export * from './RoomWidgetFurniToWidgetMessage'; export * from './RoomWidgetLetUserInMessage'; diff --git a/src/assets/images/room-widgets/dimmer-widget/dimmer_banner.png b/src/assets/images/room-widgets/dimmer-widget/dimmer_banner.png new file mode 100644 index 00000000..fdc6e9fa Binary files /dev/null and b/src/assets/images/room-widgets/dimmer-widget/dimmer_banner.png differ diff --git a/src/views/groups/views/members/GroupMembersView.tsx b/src/views/groups/views/members/GroupMembersView.tsx index cbf08364..0ab607e9 100644 --- a/src/views/groups/views/members/GroupMembersView.tsx +++ b/src/views/groups/views/members/GroupMembersView.tsx @@ -115,7 +115,7 @@ export const GroupMembersView: FC = props => } searchMembers(pageData.pageIndex); - }, [ pageData ]); + }, [ pageData, searchMembers ]); const acceptMembership = useCallback((member) => { @@ -124,7 +124,7 @@ export const GroupMembersView: FC = props => SendMessageHook(new GroupMembershipAcceptComposer(pageData.groupId, member.id)); searchMembers(pageData.pageIndex); } - }, [ pageData ]); + }, [ pageData, searchMembers ]); const removeMemberOrDeclineMembership = useCallback((member) => { @@ -138,66 +138,68 @@ export const GroupMembersView: FC = props => setRemovingMemberName(member.name); SendMessageHook(new GroupConfirmRemoveMemberComposer(pageData.groupId, member.id)); } - }, [ pageData ]); + }, [ pageData, searchMembers ]); - if(!pageData) return null; + if(!groupId) return null; return ( - - -
-
- + + { pageData && <> + +
+
+ +
+
+ setSearchQuery(e.target.value) } onBlur={ () => searchMembers(pageData.pageIndex) } onKeyDown={ onKeyDown } /> + +
-
- setSearchQuery(e.target.value) } onBlur={ () => searchMembers(pageData.pageIndex) } onKeyDown={ onKeyDown } /> - -
-
-
- { pageData.result.map((member, index) => - { - return ( -
-
-
{ GetUserProfile(member.id) } }> - -
-
-
{ GetUserProfile(member.id) } }>{ member.name }
- { member.rank !== GroupRank.REQUESTED &&
{ LocalizeText('group.members.since', ['date'], [member.joinedAt]) }
} -
-
-
- toggleAdmin(member) } /> +
+ { pageData.result.map((member, index) => + { + return ( +
+
+
{ GetUserProfile(member.id) } }> + +
+
+
{ GetUserProfile(member.id) } }>{ member.name }
+ { member.rank !== GroupRank.REQUESTED &&
{ LocalizeText('group.members.since', ['date'], [member.joinedAt]) }
} +
+
+
+ toggleAdmin(member) } /> +
+ { member.rank === GroupRank.REQUESTED &&
+ acceptMembership(member) } /> +
} + { member.rank !== GroupRank.OWNER && pageData.admin && member.id !== GetSessionDataManager().userId &&
+ removeMemberOrDeclineMembership(member) } /> +
}
- { member.rank === GroupRank.REQUESTED &&
- acceptMembership(member) } /> -
} - { member.rank !== GroupRank.OWNER && pageData.admin && member.id !== GetSessionDataManager().userId &&
- removeMemberOrDeclineMembership(member) } /> -
}
-
- ); - }) } -
-
-
- + ); + }) }
-
{ LocalizeText('group.members.pageinfo', ['amount', 'page', 'totalPages'], [pageData.totalMembersCount.toString(), (pageData.pageIndex + 1).toString(), totalPages.toString()]) }
-
- +
+
+ +
+
{ LocalizeText('group.members.pageinfo', ['amount', 'page', 'totalPages'], [pageData.totalMembersCount.toString(), (pageData.pageIndex + 1).toString(), totalPages.toString()]) }
+
+ +
-
- + + } ); }; diff --git a/src/views/groups/views/room-information/GroupRoomInformationView.tsx b/src/views/groups/views/room-information/GroupRoomInformationView.tsx index 8a66491d..af2f73ee 100644 --- a/src/views/groups/views/room-information/GroupRoomInformationView.tsx +++ b/src/views/groups/views/room-information/GroupRoomInformationView.tsx @@ -12,13 +12,13 @@ export const GroupRoomInformationView: FC<{}> = props => const [ groupId, setGroupId ] = useState(null); const [ groupInformation, setGroupInformation ] = useState(null); const [ isExpended, setIsExpended ] = useState(true); - + const onRoomInfoEvent = useCallback((event: RoomInfoEvent) => { const parser = event.getParser(); setGroupInformation(null); - + if(parser.data.habboGroupId) { setGroupId(parser.data.habboGroupId); @@ -33,7 +33,7 @@ export const GroupRoomInformationView: FC<{}> = props => const parser = event.getParser(); if(parser.flag || groupId !== parser.id) return; - + console.log(parser); setGroupInformation(null); setGroupInformation(parser); }, [ groupId ]); @@ -110,7 +110,7 @@ export const GroupRoomInformationView: FC<{}> = props =>
{ isExpended && <> -
GetGroupInformation(groupInformation.id) }> +
GetGroupInformation(groupId) }>
diff --git a/src/views/room/RoomView.tsx b/src/views/room/RoomView.tsx index c1e18a1f..9ac948a8 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, FurnitureCustomStackHeightWidgetHandler, FurnitureExternalImageWidgetHandler, FurniturePresentWidgetHandler, GetNitroInstance, GetRoomEngine, InitializeRoomInstanceRenderingCanvas, IRoomWidgetHandlerManager, RoomWidgetAvatarInfoHandler, RoomWidgetChatHandler, RoomWidgetChatInputHandler, RoomWidgetHandlerManager, RoomWidgetInfostandHandler, RoomWidgetRoomToolsHandler, RoomWidgetUpdateRoomViewEvent, UserChooserWidgetHandler } from '../../api'; +import { DispatchMouseEvent, DispatchTouchEvent, DoorbellWidgetHandler, FurniChooserWidgetHandler, FurnitureContextMenuWidgetHandler, FurnitureCustomStackHeightWidgetHandler, FurnitureDimmerWidgetHandler, FurnitureExternalImageWidgetHandler, 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'; @@ -42,6 +42,7 @@ export const RoomView: FC = props => widgetHandlerManager.registerHandler(new FurnitureCustomStackHeightWidgetHandler()); widgetHandlerManager.registerHandler(new FurnitureExternalImageWidgetHandler()); widgetHandlerManager.registerHandler(new FurniturePresentWidgetHandler()); + widgetHandlerManager.registerHandler(new FurnitureDimmerWidgetHandler()); setWidgetHandler(widgetHandlerManager); diff --git a/src/views/room/widgets/RoomWidgetsView.tsx b/src/views/room/widgets/RoomWidgetsView.tsx index 2b5dee4e..5033181f 100644 --- a/src/views/room/widgets/RoomWidgetsView.tsx +++ b/src/views/room/widgets/RoomWidgetsView.tsx @@ -1,6 +1,7 @@ import { RoomEngineDimmerStateEvent, RoomEngineEvent, RoomEngineObjectEvent, RoomEngineTriggerWidgetEvent, RoomEngineUseProductEvent, RoomId, RoomObjectCategory, RoomObjectOperationType, RoomSessionChatEvent, RoomSessionDanceEvent, RoomSessionDimmerPresetsEvent, RoomSessionDoorbellEvent, RoomSessionErrorMessageEvent, RoomSessionEvent, RoomSessionFriendRequestEvent, RoomSessionPetInfoUpdateEvent, RoomSessionPresentEvent, RoomSessionUserBadgesEvent, RoomZoomEvent } from '@nitrots/nitro-renderer'; import { FC, useCallback } from 'react'; import { CanManipulateFurniture, GetRoomEngine, IsFurnitureSelectionDisabled, LocalizeText, ProcessRoomObjectOperation, RoomWidgetFurniToWidgetMessage, RoomWidgetRoomEngineUpdateEvent, RoomWidgetRoomObjectUpdateEvent } from '../../../api'; +import { RoomWidgetDimmerStateUpdateEvent } from '../../../api/nitro/room/widgets/events/RoomWidgetDimmerStateUpdateEvent'; import { useRoomEngineEvent, useRoomSessionManagerEvent } from '../../../hooks/events'; import { useRoomContext } from '../context/RoomContext'; import { AvatarInfoWidgetView } from './avatar-info/AvatarInfoWidgetView'; @@ -42,6 +43,9 @@ export const RoomWidgetsView: FC = props => return; } case RoomEngineDimmerStateEvent.ROOM_COLOR: { + const stateEvent = (event as RoomEngineDimmerStateEvent); + + eventDispatcher.dispatchEvent(new RoomWidgetDimmerStateUpdateEvent(stateEvent.state, stateEvent.presetId, stateEvent.effectId, stateEvent.color, stateEvent.brightness)); return; } } diff --git a/src/views/room/widgets/furniture/dimmer/FurnitureDimmerData.ts b/src/views/room/widgets/furniture/dimmer/FurnitureDimmerData.ts index 3076cea2..0836e20f 100644 --- a/src/views/room/widgets/furniture/dimmer/FurnitureDimmerData.ts +++ b/src/views/room/widgets/furniture/dimmer/FurnitureDimmerData.ts @@ -2,6 +2,5 @@ export class FurnitureDimmerData { constructor( public objectId: number, - public category: number, - public active: boolean) {} + public category: number) {} } diff --git a/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.scss b/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.scss index cbea044c..8cffc632 100644 --- a/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.scss +++ b/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.scss @@ -1,3 +1,9 @@ .nitro-dimmer { width: 300px; + + .dimmer-banner { + width: 56px; + height: 79px; + background: url(../../../../../assets/images/room-widgets/dimmer-widget/dimmer_banner.png) center no-repeat; + } } diff --git a/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.tsx b/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.tsx index c868e9cd..18cd0bcf 100644 --- a/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.tsx +++ b/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.tsx @@ -1,6 +1,12 @@ -import { FC, useCallback, useState } from 'react'; -import { LocalizeText } from '../../../../../api'; -import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../../layout'; +import { NitroEvent, RoomEngineTriggerWidgetEvent } from '@nitrots/nitro-renderer'; +import { FC, useCallback, useEffect, useMemo, useState } from 'react'; +import ReactSlider from 'react-slider'; +import { GetRoomEngine, LocalizeText, RoomWidgetDimmerPreviewMessage, RoomWidgetDimmerSavePresetMessage, RoomWidgetDimmerUpdateEvent, RoomWidgetFurniToWidgetMessage, RoomWidgetRoomObjectUpdateEvent } from '../../../../../api'; +import { RoomDimmerPreset } from '../../../../../api/nitro/room/widgets/events/RoomDimmerPreset'; +import { RoomWidgetDimmerStateUpdateEvent } from '../../../../../api/nitro/room/widgets/events/RoomWidgetDimmerStateUpdateEvent'; +import { RoomWidgetDimmerChangeStateMessage } from '../../../../../api/nitro/room/widgets/messages/RoomWidgetDimmerChangeStateMessage'; +import { CreateEventDispatcherHook, useRoomEngineEvent } from '../../../../../hooks'; +import { NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, NitroCardTabsView, NitroCardView } from '../../../../../layout'; import { useRoomContext } from '../../../context/RoomContext'; import { FurnitureDimmerData } from './FurnitureDimmerData'; @@ -9,72 +15,146 @@ export const FurnitureDimmerView: FC<{}> = props => const { eventDispatcher = null, widgetHandler = null } = useRoomContext(); const [ dimmerData, setDimmerData ] = useState(null); - // const onNitroEvent = useCallback((event: NitroEvent) => - // { - // switch(event.type) - // { - // case RoomEngineTriggerWidgetEvent.REQUEST_DIMMER: { - // const widgetEvent = (event as RoomEngineTriggerWidgetEvent); + const [ isActive, setIsActive ] = useState(false); + const [ selectedPresetId, setSelectedPresetId ] = useState(-1); + const [ presets, setPresets ] = useState([]); - // const roomObject = GetRoomEngine().getRoomObject(widgetEvent.roomId, widgetEvent.objectId, widgetEvent.category); + const [ previewColor, setPreviewColor ] = useState('#000000'); + const [ previewBrightness, setPreviewBrightness ] = useState(125); + const [ previewBgOnly, setPreviewBgOnly ] = useState(false); + + const previewColorInt = useMemo(() => + { + return parseInt(previewColor.replace('#', ''), 16); + }, [ previewColor ]); + + useEffect(() => + { + if(selectedPresetId === -1 || presets.length === 0 || !isActive) return; + + const preset = presets[selectedPresetId - 1]; + + if(!preset) return; + + setPreviewColor(preset.color); + setPreviewBrightness(preset.brightness); + setPreviewBgOnly(preset.bgOnly); + }, [ selectedPresetId, presets ]); + + useEffect(() => + { + if(!widgetHandler || selectedPresetId === -1 || !isActive) return; - // if(!roomObject) return; + widgetHandler.processWidgetMessage(new RoomWidgetDimmerPreviewMessage(previewColorInt, previewBrightness, previewBgOnly)); + }, [ previewBgOnly, previewBrightness, previewColor ]); - // const data = roomObject.model.getValue(RoomObjectVariable.FURNITURE_DATA); - - // console.log('data', data); + const onNitroEvent = useCallback((event: NitroEvent) => + { + switch(event.type) + { + case RoomEngineTriggerWidgetEvent.REQUEST_DIMMER: { + const widgetEvent = (event as RoomEngineTriggerWidgetEvent); - // setDimmerData(new FurnitureDimmerData(widgetEvent.objectId, widgetEvent.category, false)); - // return; - // } - // case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: { - // const widgetEvent = (event as RoomWidgetRoomObjectUpdateEvent); + const roomObject = GetRoomEngine().getRoomObject(widgetEvent.roomId, widgetEvent.objectId, widgetEvent.category); + + if(!roomObject) return; - // setDimmerData(prevState => - // { - // if(!prevState || (widgetEvent.id !== prevState.objectId) || (widgetEvent.category !== prevState.category)) return prevState; + setDimmerData(new FurnitureDimmerData(widgetEvent.objectId, widgetEvent.category)); + widgetHandler.processWidgetMessage(new RoomWidgetFurniToWidgetMessage(RoomWidgetFurniToWidgetMessage.REQUEST_DIMMER, widgetEvent.objectId, widgetEvent.category, widgetEvent.roomId)); + return; + } + case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: { + const widgetEvent = (event as RoomWidgetRoomObjectUpdateEvent); - // return null; - // }); - // return; - // } - // case RoomWidgetDimmerUpdateEvent.RWDUE_PRESETS: { - // const widgetEvent = (event as RoomWidgetDimmerUpdateEvent); + setDimmerData(prevState => + { + if(!prevState || (widgetEvent.id !== prevState.objectId) || (widgetEvent.category !== prevState.category)) return prevState; - // console.log(widgetEvent); - // return; - // } - // case RoomWidgetDimmerStateUpdateEvent.RWDSUE_DIMMER_STATE: { - // const widgetEvent = (event as RoomWidgetDimmerStateUpdateEvent); + return null; + }); + return; + } + case RoomWidgetDimmerUpdateEvent.PRESETS: { + const widgetEvent = (event as RoomWidgetDimmerUpdateEvent); - // console.log(widgetEvent); - // return; - // } - // } - // }, []); + setPresets(widgetEvent.presets); + setSelectedPresetId(widgetEvent.selectedPresetId); + return; + } + case RoomWidgetDimmerStateUpdateEvent.DIMMER_STATE: { + const widgetEvent = (event as RoomWidgetDimmerStateUpdateEvent); - // useRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_DIMMER, onNitroEvent); - // CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, props.events, onNitroEvent); - // CreateEventDispatcherHook(RoomWidgetDimmerUpdateEvent.RWDUE_PRESETS, props.events, onNitroEvent); - // CreateEventDispatcherHook(RoomWidgetDimmerStateUpdateEvent.RWDSUE_DIMMER_STATE, props.events, onNitroEvent); + setIsActive(widgetEvent.state === 1); + return; + } + } + }, [ widgetHandler ]); - const processAction = useCallback((type: string, value: string = null) => + useRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_DIMMER, onNitroEvent); + CreateEventDispatcherHook(RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED, eventDispatcher, onNitroEvent); + CreateEventDispatcherHook(RoomWidgetDimmerUpdateEvent.PRESETS, eventDispatcher, onNitroEvent); + CreateEventDispatcherHook(RoomWidgetDimmerStateUpdateEvent.DIMMER_STATE, eventDispatcher, onNitroEvent); + + const processAction = useCallback((type: string) => { switch(type) { + case 'toggle_state': + widgetHandler.processWidgetMessage(new RoomWidgetDimmerChangeStateMessage()); + return; case 'close': setDimmerData(null); return; + case 'save': + widgetHandler.processWidgetMessage(new RoomWidgetDimmerSavePresetMessage(selectedPresetId, previewBgOnly ? 2 : 1, previewColorInt, previewBrightness, true)); + return; } - }, []); + }, [ previewBgOnly, previewBrightness, previewColorInt, selectedPresetId, widgetHandler ]); if(!dimmerData) return null; return ( - processAction('close') } /> - - + processAction('close') } /> + + { !isActive &&
+
+
{ LocalizeText('widget.dimmer.info.off') }
+ +
} + { isActive && <> + + { presets.map(preset => + { + return setSelectedPresetId(preset.id) }>{ LocalizeText(`widget.dimmer.tab.${preset.id}`) } + }) } + +
+
+ + setPreviewColor(e.target.value) } /> +
+
+ + setPreviewBrightness(newValue) } + thumbClassName={ 'thumb degree' } + renderThumb={ (props, state) =>
{ state.valueNow - 75 }
} /> +
+
+ setPreviewBgOnly(e.target.checked) } /> + +
+
+ + +
+
+ } ); diff --git a/src/views/shared/currency-icon/CurrencyIcon.scss b/src/views/shared/currency-icon/CurrencyIcon.scss index 88462829..743b94ec 100644 --- a/src/views/shared/currency-icon/CurrencyIcon.scss +++ b/src/views/shared/currency-icon/CurrencyIcon.scss @@ -1,6 +1,6 @@ .nitro-currency-icon { background-position: center; background-repeat: no-repeat; - width: 15px; - height: 15px; + width: 18px; + height: 17px; } diff --git a/src/views/toolbar/ToolbarView.tsx b/src/views/toolbar/ToolbarView.tsx index 4d017724..74b22062 100644 --- a/src/views/toolbar/ToolbarView.tsx +++ b/src/views/toolbar/ToolbarView.tsx @@ -178,11 +178,6 @@ export const ToolbarView: FC = props => { (unseenInventoryCount > 0) && (
{ unseenInventoryCount }
) }
-
handleToolbarItemClick(ToolbarViewItems.FRIEND_LIST_ITEM) }> - - { (unseenFriendListCount > 0) && ( -
{ unseenFriendListCount }
) } -
{ isInRoom && (
handleToolbarItemClick(ToolbarViewItems.CAMERA_ITEM) }> @@ -194,6 +189,13 @@ export const ToolbarView: FC = props =>
+
+
handleToolbarItemClick(ToolbarViewItems.FRIEND_LIST_ITEM) }> + + { (unseenFriendListCount > 0) && ( +
{ unseenFriendListCount }
) } +
+