Merge branch 'hall-of-fame' into 'dev'

Added avatar to hotel view

See merge request nitro/nitro-react!16

public/ui-config.json.example

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

src/components/hotel-view/HotelView.scss

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

src/components/hotel-view/HotelView.tsx

@@ -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 { 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';
-
 export const HotelView: FC<{}> = props =>
 {
     const [isVisible, setIsVisible] = useState(true);
     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) =>
     {
@@ -94,6 +120,11 @@ export const HotelView: FC<{}> = props =>
             <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 position-absolute" style={(right && right.length) ? { backgroundImage: `url(${right})` } : {}} />
+            {GetConfiguration("hotelview")["show.avatar"] && (
+                <div className="avatar-image">
+                    <LayoutAvatarImageView figure={userFigure} direction={2} />
+                </div>
+            )}
         </div>
     );
 }