Allow multiple highscores

This commit is contained in:
Bill 2022-03-27 20:08:48 -04:00
parent d96b5bd76e
commit 0ed2c09301

View File

@ -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<HighScoreDataType>(null);
const [ stuffDatas, setStuffDatas ] = useState<Map<number, HighScoreDataType>>(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<number>(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 (
<ObjectLocationView objectId={ objectId } category={ RoomObjectCategory.FLOOR }>
<div className="nitro-widget-high-score nitro-context-menu d-flex flex-column">
<ContextMenuHeaderView>
{ 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] }`)]) }
</ContextMenuHeaderView>
<ContextMenuListView overflow="hidden" gap={ 1 } className="h-100">
<Column gap={ 1 }>
<Flex alignItems="center">
<Text center bold variant="white" className="col-8">
{ LocalizeText('high.score.display.users.header') }
</Text>
<Text center bold variant="white" className="col-4">
{ LocalizeText('high.score.display.score.header') }
</Text>
</Flex>
<hr className="m-0" />
</Column>
<Column overflow="auto" gap={ 1 } className="overflow-y-scroll">
{ stuffData.entries.map((entry, index) =>
{
return (
<Flex key={ index } alignItems="center">
<Text center variant="white" className="col-8">
{ entry.users.join(', ') }
</Text>
<Text center variant="white" className="col-4">
{ entry.score }
</Text>
</Flex>
);
})}
</Column>
</ContextMenuListView>
</div>
</ObjectLocationView>
<>
{ Array.from(stuffDatas.entries()).map(([ objectId, stuffData ], index) =>
{
return (
<ObjectLocationView key={ index } objectId={ objectId } category={ RoomObjectCategory.FLOOR }>
<Column className="nitro-widget-high-score nitro-context-menu" gap={ 0 }>
<ContextMenuHeaderView>
{ 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] }`)]) }
</ContextMenuHeaderView>
<ContextMenuListView overflow="hidden" gap={ 1 } className="h-100">
<Column gap={ 1 }>
<Flex alignItems="center">
<Text center bold variant="white" className="col-8">
{ LocalizeText('high.score.display.users.header') }
</Text>
<Text center bold variant="white" className="col-4">
{ LocalizeText('high.score.display.score.header') }
</Text>
</Flex>
<hr className="m-0" />
</Column>
<Column overflow="auto" gap={ 1 } className="overflow-y-scroll">
{ stuffData.entries.map((entry, index) =>
{
return (
<Flex key={ index } alignItems="center">
<Text center variant="white" className="col-8">
{ entry.users.join(', ') }
</Text>
<Text center variant="white" className="col-4">
{ entry.score }
</Text>
</Flex>
);
})}
</Column>
</ContextMenuListView>
</Column>
</ObjectLocationView>
);
}) }
</>
);
}