nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-11-22 22:30:52 +01:00
Code Issues Packages Projects Releases Wiki Activity

Added avatar to hotel view

Browse Source
This commit is contained in:
robbis1111 2022-03-17 22:57:20 +00:00 committed by skeletor
parent ca7f25e71e
commit 88b8a4e91b
3 changed files with 36 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
public/ui-config.json.example
View File

@ -14,6 +14,7 @@
"camera.publish.disabled": false, "camera.publish.disabled": false,
"hc.disabled": false, "hc.disabled": false,
"hotelview": { "hotelview": {
"show.avatar": true,
"widgets": { "widgets": {
"slot.1.widget": "promoarticle", "slot.1.widget": "promoarticle",
"slot.1.conf": "", "slot.1.conf": "",

2
src/components/hotel-view/HotelView.scss
View File

@ -8,7 +8,7 @@
.avatar-image { .avatar-image {
bottom: 12px; bottom: 12px;
left: 63px; left: 57px;
position: absolute; position: absolute;
z-index: 1; z-index: 1;
} }

37
src/components/hotel-view/HotelView.tsx
View File

@ -1,13 +1,39 @@
import { RoomSessionEvent } from '@nitrots/nitro-renderer'; import { FigureUpdateEvent, RoomSessionEvent, UserInfoDataParser, UserInfoEvent } from '@nitrots/nitro-renderer';
import { FC, useCallback, useState } from 'react'; import { FC, useCallback, useState } from 'react';
import { GetConfiguration, GetConfigurationManager } from '../../api'; import { GetConfiguration, GetConfigurationManager } from '../../api';
import { UseRoomSessionManagerEvent } from '../../hooks'; import { LayoutAvatarImageView } from '../../common';
import { BatchUpdates, UseMessageEventHook, UseRoomSessionManagerEvent } from '../../hooks';
import { WidgetSlotView } from './views/widget-slot/WidgetSlotView'; import { WidgetSlotView } from './views/widget-slot/WidgetSlotView';
export const HotelView: FC<{}> = props => export const HotelView: FC<{}> = props =>
{ {
const [isVisible, setIsVisible] = useState(true); const [isVisible, setIsVisible] = useState(true);
const widgetSlotCount = 7; const widgetSlotCount = 7;
const [ userFigure, setUserFigure ] = useState<string>(null);
const [ userInfo, setUserInfo ] = useState<UserInfoDataParser>(null);
const onUserInfoEvent = useCallback((event: UserInfoEvent) =>
{
const parser = event.getParser();
BatchUpdates(() =>
{
setUserInfo(parser.userInfo);
setUserFigure(parser.userInfo.figure);
});
}, []);
UseMessageEventHook(UserInfoEvent, onUserInfoEvent);
const onUserFigureEvent = useCallback((event: FigureUpdateEvent) =>
{
const parser = event.getParser();
setUserFigure(parser.figure);
}, []);
UseMessageEventHook(FigureUpdateEvent, onUserFigureEvent);
const onRoomSessionEvent = useCallback((event: RoomSessionEvent) => const onRoomSessionEvent = useCallback((event: RoomSessionEvent) =>
{ {
@ -94,6 +120,11 @@ export const HotelView: FC<{}> = props =>
<div className="left position-absolute" style={(left && left.length) ? { backgroundImage: `url(${left})` } : {}} /> <div className="left position-absolute" style={(left && left.length) ? { backgroundImage: `url(${left})` } : {}} />
<div className="right-repeat position-absolute" style={(rightRepeat && rightRepeat.length) ? { backgroundImage: `url(${rightRepeat})` } : {}} /> <div className="right-repeat position-absolute" style={(rightRepeat && rightRepeat.length) ? { backgroundImage: `url(${rightRepeat})` } : {}} />
<div className="right position-absolute" style={(right && right.length) ? { backgroundImage: `url(${right})` } : {}} /> <div className="right position-absolute" style={(right && right.length) ? { backgroundImage: `url(${right})` } : {}} />
{GetConfiguration("hotelview")["show.avatar"] && (
<div className="avatar-image">
<LayoutAvatarImageView figure={userFigure} direction={2} />
</div>
)}
</div> </div>
); );
} }