This commit is contained in:
Bill 2021-09-14 02:34:13 -04:00
commit d70afa28eb
20 changed files with 549 additions and 113 deletions

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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];
}
}

View File

@ -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';

View File

@ -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
];
}
}

View File

@ -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';

View File

@ -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);
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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';

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

@ -115,7 +115,7 @@ export const GroupMembersView: FC<GroupMembersViewProps> = props =>
}
searchMembers(pageData.pageIndex);
}, [ pageData ]);
}, [ pageData, searchMembers ]);
const acceptMembership = useCallback((member) =>
{
@ -124,7 +124,7 @@ export const GroupMembersView: FC<GroupMembersViewProps> = props =>
SendMessageHook(new GroupMembershipAcceptComposer(pageData.groupId, member.id));
searchMembers(pageData.pageIndex);
}
}, [ pageData ]);
}, [ pageData, searchMembers ]);
const removeMemberOrDeclineMembership = useCallback((member) =>
{
@ -138,13 +138,14 @@ export const GroupMembersView: FC<GroupMembersViewProps> = props =>
setRemovingMemberName(member.name);
SendMessageHook(new GroupConfirmRemoveMemberComposer(pageData.groupId, member.id));
}
}, [ pageData ]);
}, [ pageData, searchMembers ]);
if(!pageData) return null;
if(!groupId) return null;
return (
<NitroCardView className="nitro-group-members" simple={ true }>
<NitroCardHeaderView headerText={ LocalizeText('group.members.title', ['groupName'], [ pageData.groupTitle ]) } onCloseClick={ onClose } />
<NitroCardHeaderView headerText={ LocalizeText('group.members.title', ['groupName'], [ pageData ? pageData.groupTitle : '' ]) } onCloseClick={ onClose } />
{ pageData && <>
<NitroCardContentView className="pb-2">
<div className="d-flex gap-2 align-items-center mb-2">
<div className="group-badge">
@ -198,6 +199,7 @@ export const GroupMembersView: FC<GroupMembersViewProps> = props =>
</div>
</div>
</NitroCardContentView>
</> }
</NitroCardView>
);
};

View File

@ -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 =>
<i className={ 'fas fa-chevron-' + (isExpended ? 'up' : 'down') } />
</div>
{ isExpended && <>
<div className="d-flex cursor-pointer" onClick={ () => GetGroupInformation(groupInformation.id) }>
<div className="d-flex cursor-pointer" onClick={ () => GetGroupInformation(groupId) }>
<div className="group-badge flex-shrink-0 me-1">
<BadgeImageView badgeCode={ groupInformation.badge } isGroup={ true } />
</div>

View File

@ -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<RoomViewProps> = props =>
widgetHandlerManager.registerHandler(new FurnitureCustomStackHeightWidgetHandler());
widgetHandlerManager.registerHandler(new FurnitureExternalImageWidgetHandler());
widgetHandlerManager.registerHandler(new FurniturePresentWidgetHandler());
widgetHandlerManager.registerHandler(new FurnitureDimmerWidgetHandler());
setWidgetHandler(widgetHandlerManager);

View File

@ -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<RoomWidgetViewProps> = 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;
}
}

View File

@ -2,6 +2,5 @@ export class FurnitureDimmerData
{
constructor(
public objectId: number,
public category: number,
public active: boolean) {}
public category: number) {}
}

View File

@ -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;
}
}

View File

@ -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<FurnitureDimmerData>(null);
// const onNitroEvent = useCallback((event: NitroEvent) =>
// {
// switch(event.type)
// {
// case RoomEngineTriggerWidgetEvent.REQUEST_DIMMER: {
// const widgetEvent = (event as RoomEngineTriggerWidgetEvent);
const [ isActive, setIsActive ] = useState<boolean>(false);
const [ selectedPresetId, setSelectedPresetId ] = useState<number>(-1);
const [ presets, setPresets ] = useState<RoomDimmerPreset[]>([]);
// const roomObject = GetRoomEngine().getRoomObject(widgetEvent.roomId, widgetEvent.objectId, widgetEvent.category);
const [ previewColor, setPreviewColor ] = useState<string>('#000000');
const [ previewBrightness, setPreviewBrightness ] = useState<number>(125);
const [ previewBgOnly, setPreviewBgOnly ] = useState<boolean>(false);
// if(!roomObject) return;
const previewColorInt = useMemo(() =>
{
return parseInt(previewColor.replace('#', ''), 16);
}, [ previewColor ]);
// const data = roomObject.model.getValue<string[]>(RoomObjectVariable.FURNITURE_DATA);
useEffect(() =>
{
if(selectedPresetId === -1 || presets.length === 0 || !isActive) return;
// console.log('data', data);
const preset = presets[selectedPresetId - 1];
// setDimmerData(new FurnitureDimmerData(widgetEvent.objectId, widgetEvent.category, false));
// return;
// }
// case RoomWidgetRoomObjectUpdateEvent.FURNI_REMOVED: {
// const widgetEvent = (event as RoomWidgetRoomObjectUpdateEvent);
if(!preset) return;
// setDimmerData(prevState =>
// {
// if(!prevState || (widgetEvent.id !== prevState.objectId) || (widgetEvent.category !== prevState.category)) return prevState;
setPreviewColor(preset.color);
setPreviewBrightness(preset.brightness);
setPreviewBgOnly(preset.bgOnly);
}, [ selectedPresetId, presets ]);
// return null;
// });
// return;
// }
// case RoomWidgetDimmerUpdateEvent.RWDUE_PRESETS: {
// const widgetEvent = (event as RoomWidgetDimmerUpdateEvent);
useEffect(() =>
{
if(!widgetHandler || selectedPresetId === -1 || !isActive) return;
// console.log(widgetEvent);
// return;
// }
// case RoomWidgetDimmerStateUpdateEvent.RWDSUE_DIMMER_STATE: {
// const widgetEvent = (event as RoomWidgetDimmerStateUpdateEvent);
widgetHandler.processWidgetMessage(new RoomWidgetDimmerPreviewMessage(previewColorInt, previewBrightness, previewBgOnly));
}, [ previewBgOnly, previewBrightness, previewColor ]);
// console.log(widgetEvent);
// return;
// }
// }
// }, []);
const onNitroEvent = useCallback((event: NitroEvent) =>
{
switch(event.type)
{
case RoomEngineTriggerWidgetEvent.REQUEST_DIMMER: {
const widgetEvent = (event as RoomEngineTriggerWidgetEvent);
// 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);
const roomObject = GetRoomEngine().getRoomObject(widgetEvent.roomId, widgetEvent.objectId, widgetEvent.category);
const processAction = useCallback((type: string, value: string = null) =>
if(!roomObject) return;
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);
setDimmerData(prevState =>
{
if(!prevState || (widgetEvent.id !== prevState.objectId) || (widgetEvent.category !== prevState.category)) return prevState;
return null;
});
return;
}
case RoomWidgetDimmerUpdateEvent.PRESETS: {
const widgetEvent = (event as RoomWidgetDimmerUpdateEvent);
setPresets(widgetEvent.presets);
setSelectedPresetId(widgetEvent.selectedPresetId);
return;
}
case RoomWidgetDimmerStateUpdateEvent.DIMMER_STATE: {
const widgetEvent = (event as RoomWidgetDimmerStateUpdateEvent);
setIsActive(widgetEvent.state === 1);
return;
}
}
}, [ widgetHandler ]);
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 (
<NitroCardView className="nitro-dimmer">
<NitroCardHeaderView headerText={ LocalizeText('widget.dimmer.title') } onCloseClick={ event => processAction('close') } />
<NitroCardContentView>
<NitroCardHeaderView headerText={ LocalizeText('widget.dimmer.title') } onCloseClick={ () => processAction('close') } />
<NitroCardContentView className="p-0">
{ !isActive && <div className="d-flex flex-column gap-2 align-items-center p-2">
<div className="dimmer-banner"></div>
<div className="bg-muted rounded p-1 text-center text-black">{ LocalizeText('widget.dimmer.info.off') }</div>
<button className="btn-success btn w-100" onClick={ () => processAction('toggle_state') }>{ LocalizeText('widget.dimmer.button.on') }</button>
</div> }
{ isActive && <>
<NitroCardTabsView>
{ presets.map(preset =>
{
return <NitroCardTabsItemView key={ preset.id } isActive={ selectedPresetId === preset.id } onClick={ () => setSelectedPresetId(preset.id) }>{ LocalizeText(`widget.dimmer.tab.${preset.id}`) }</NitroCardTabsItemView>
}) }
</NitroCardTabsView>
<div className="p-2">
<div className="form-group mb-2">
<label className="fw-bold text-black">{ LocalizeText('widget.backgroundcolor.hue') }</label>
<input type="color" className="form-control" value={ previewColor } onChange={ (e) => setPreviewColor(e.target.value) } />
</div>
<div className="form-group mb-2">
<label className="fw-bold text-black">{ LocalizeText('widget.backgroundcolor.lightness') }</label>
<ReactSlider
className={ 'nitro-slider' }
min={ 75 }
max={ 255 }
value={ previewBrightness }
onChange={ newValue => setPreviewBrightness(newValue) }
thumbClassName={ 'thumb degree' }
renderThumb={ (props, state) => <div {...props}>{ state.valueNow - 75 }</div> } />
</div>
<div className="form-check mb-2">
<input className="form-check-input" type="checkbox" checked={ previewBgOnly } onChange={ (e) => setPreviewBgOnly(e.target.checked) } />
<label className="form-check-label text-black">{ LocalizeText('widget.dimmer.type.checkbox') }</label>
</div>
<div className="d-flex gap-2">
<button className="btn btn-danger w-100" onClick={ () => processAction('toggle_state') }>{ LocalizeText('widget.dimmer.button.off') }</button>
<button className="btn btn-success w-100" onClick={ () => processAction('save') }>{ LocalizeText('widget.dimmer.button.apply') }</button>
</div>
</div>
</> }
</NitroCardContentView>
</NitroCardView>
);

View File

@ -1,6 +1,6 @@
.nitro-currency-icon {
background-position: center;
background-repeat: no-repeat;
width: 15px;
height: 15px;
width: 18px;
height: 17px;
}

View File

@ -178,11 +178,6 @@ export const ToolbarView: FC<ToolbarViewProps> = props =>
{ (unseenInventoryCount > 0) && (
<div className="position-absolute bg-danger px-1 py-0 rounded shadow count">{ unseenInventoryCount }</div>) }
</div>
<div className="navigation-item" onClick={ event => handleToolbarItemClick(ToolbarViewItems.FRIEND_LIST_ITEM) }>
<i className="icon icon-friendall"></i>
{ (unseenFriendListCount > 0) && (
<div className="position-absolute bg-danger px-1 py-0 rounded shadow count">{ unseenFriendListCount }</div>) }
</div>
{ isInRoom && (
<div className="navigation-item" onClick={ event => handleToolbarItemClick(ToolbarViewItems.CAMERA_ITEM) }>
<i className="icon icon-camera"></i>
@ -194,6 +189,13 @@ export const ToolbarView: FC<ToolbarViewProps> = props =>
<div id="toolbar-chat-input-container" className="d-flex align-items-center" />
</div>
<div className="d-flex toolbar-right-side">
<div className="navigation-items">
<div className="navigation-item" onClick={ event => handleToolbarItemClick(ToolbarViewItems.FRIEND_LIST_ITEM) }>
<i className="icon icon-friendall"></i>
{ (unseenFriendListCount > 0) && (
<div className="position-absolute bg-danger px-1 py-0 rounded shadow count">{ unseenFriendListCount }</div>) }
</div>
</div>
<div id="toolbar-friend-bar-container" />
</div>
</div>