diff --git a/src/components/room/widgets/furniture/high-score/FurnitureHighScoreView.tsx b/src/components/room/widgets/furniture/high-score/FurnitureHighScoreView.tsx index 3f8598a6..638f50fb 100644 --- a/src/components/room/widgets/furniture/high-score/FurnitureHighScoreView.tsx +++ b/src/components/room/widgets/furniture/high-score/FurnitureHighScoreView.tsx @@ -13,16 +13,9 @@ const CLEAR_TYPES = ['alltime', 'daily', 'weekly', 'monthly']; export const FurnitureHighScoreView: FC<{}> = props => { - const [objectId, setObjectId] = useState(-1); - const [stuffData, setStuffData] = useState(null); + const [ stuffDatas, setStuffDatas ] = useState>(new Map()); const { roomSession = null } = useRoomContext(); - const close = useCallback(() => - { - setObjectId(-1); - setStuffData(null); - }, []); - const onRoomEngineTriggerWidgetEvent = useCallback((event: RoomEngineTriggerWidgetEvent) => { switch(event.type) @@ -32,65 +25,83 @@ export const FurnitureHighScoreView: FC<{}> = props => if(!object) return; - setObjectId(object.id); - const formatKey = object.model.getValue(RoomObjectVariable.FURNITURE_DATA_FORMAT); const stuffData = (ObjectDataFactory.getData(formatKey) as HighScoreDataType); stuffData.initializeFromRoomObjectModel(object.model); - setStuffData(stuffData); + setStuffDatas(prevValue => + { + const newValue = new Map(prevValue); + + newValue.set(object.id, stuffData); + + return newValue; + }); return; } case RoomEngineTriggerWidgetEvent.REQUEST_HIDE_HIGH_SCORE_DISPLAY: - if((event.roomId !== roomSession.roomId) || (event.objectId !== objectId)) return; + if(event.roomId !== roomSession.roomId) return; - close(); + setStuffDatas(prevValue => + { + const newValue = new Map(prevValue); + + newValue.delete(event.objectId); + + return newValue; + }); return; } - }, [roomSession, objectId, close]); + }, [ roomSession ]); UseRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_HIGH_SCORE_DISPLAY, onRoomEngineTriggerWidgetEvent); UseRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_HIDE_HIGH_SCORE_DISPLAY, onRoomEngineTriggerWidgetEvent); - if((objectId === -1) || !stuffData) return null; + if(!stuffDatas.size) 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(', ') } - - - { entry.score } - - - ); - })} - -
-
-
- + <> + { Array.from(stuffDatas.entries()).map(([ objectId, stuffData ], index) => + { + 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(', ') } + + + { entry.score } + + + ); + })} + +
+
+
+ ); + }) } + ); }