nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2025-02-21 19:02:35 +01:00
Code Issues Packages Projects Releases Wiki Activity

Allow multiple highscores

Browse Source
This commit is contained in:
Bill 2022-03-27 20:08:48 -04:00
parent d96b5bd76e
commit 0ed2c09301
1 changed files with 62 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

113
src/components/room/widgets/furniture/high-score/FurnitureHighScoreView.tsx
View File

@ -13,16 +13,9 @@ const CLEAR_TYPES = ['alltime', 'daily', 'weekly', 'monthly'];
export const FurnitureHighScoreView: FC<{}> = props => export const FurnitureHighScoreView: FC<{}> = props =>
{ {
const [objectId, setObjectId] = useState(-1); const [ stuffDatas, setStuffDatas ] = useState<Map<number, HighScoreDataType>>(new Map());
const [stuffData, setStuffData] = useState<HighScoreDataType>(null);
const { roomSession = null } = useRoomContext(); const { roomSession = null } = useRoomContext();
const close = useCallback(() =>
{
setObjectId(-1);
setStuffData(null);
}, []);
const onRoomEngineTriggerWidgetEvent = useCallback((event: RoomEngineTriggerWidgetEvent) => const onRoomEngineTriggerWidgetEvent = useCallback((event: RoomEngineTriggerWidgetEvent) =>
{ {
switch(event.type) switch(event.type)
@ -32,65 +25,83 @@ export const FurnitureHighScoreView: FC<{}> = props =>
if(!object) return; if(!object) return;
setObjectId(object.id);
const formatKey = object.model.getValue<number>(RoomObjectVariable.FURNITURE_DATA_FORMAT); const formatKey = object.model.getValue<number>(RoomObjectVariable.FURNITURE_DATA_FORMAT);
const stuffData = (ObjectDataFactory.getData(formatKey) as HighScoreDataType); const stuffData = (ObjectDataFactory.getData(formatKey) as HighScoreDataType);
stuffData.initializeFromRoomObjectModel(object.model); stuffData.initializeFromRoomObjectModel(object.model);
setStuffData(stuffData); setStuffDatas(prevValue =>
{
const newValue = new Map(prevValue);
newValue.set(object.id, stuffData);
return newValue;
});
return; return;
} }
case RoomEngineTriggerWidgetEvent.REQUEST_HIDE_HIGH_SCORE_DISPLAY: 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; return;
} }
}, [roomSession, objectId, close]); }, [ roomSession ]);
UseRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_HIGH_SCORE_DISPLAY, onRoomEngineTriggerWidgetEvent); UseRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_HIGH_SCORE_DISPLAY, onRoomEngineTriggerWidgetEvent);
UseRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_HIDE_HIGH_SCORE_DISPLAY, onRoomEngineTriggerWidgetEvent); UseRoomEngineEvent(RoomEngineTriggerWidgetEvent.REQUEST_HIDE_HIGH_SCORE_DISPLAY, onRoomEngineTriggerWidgetEvent);
if((objectId === -1) || !stuffData) return null; if(!stuffDatas.size) return null;
return ( return (
<ObjectLocationView objectId={ objectId } category={ RoomObjectCategory.FLOOR }> <>
<div className="nitro-widget-high-score nitro-context-menu d-flex flex-column"> { Array.from(stuffDatas.entries()).map(([ objectId, stuffData ], index) =>
<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] }`)]) } return (
</ContextMenuHeaderView> <ObjectLocationView key={ index } objectId={ objectId } category={ RoomObjectCategory.FLOOR }>
<ContextMenuListView overflow="hidden" gap={ 1 } className="h-100"> <Column className="nitro-widget-high-score nitro-context-menu" gap={ 0 }>
<Column gap={ 1 }> <ContextMenuHeaderView>
<Flex alignItems="center"> { 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] }`)]) }
<Text center bold variant="white" className="col-8"> </ContextMenuHeaderView>
{ LocalizeText('high.score.display.users.header') } <ContextMenuListView overflow="hidden" gap={ 1 } className="h-100">
</Text> <Column gap={ 1 }>
<Text center bold variant="white" className="col-4"> <Flex alignItems="center">
{ LocalizeText('high.score.display.score.header') } <Text center bold variant="white" className="col-8">
</Text> { LocalizeText('high.score.display.users.header') }
</Flex> </Text>
<hr className="m-0" /> <Text center bold variant="white" className="col-4">
</Column> { LocalizeText('high.score.display.score.header') }
<Column overflow="auto" gap={ 1 } className="overflow-y-scroll"> </Text>
{ stuffData.entries.map((entry, index) => </Flex>
{ <hr className="m-0" />
return ( </Column>
<Flex key={ index } alignItems="center"> <Column overflow="auto" gap={ 1 } className="overflow-y-scroll">
<Text center variant="white" className="col-8"> { stuffData.entries.map((entry, index) =>
{ entry.users.join(', ') } {
</Text> return (
<Text center variant="white" className="col-4"> <Flex key={ index } alignItems="center">
{ entry.score } <Text center variant="white" className="col-8">
</Text> { entry.users.join(', ') }
</Flex> </Text>
); <Text center variant="white" className="col-4">
})} { entry.score }
</Column> </Text>
</ContextMenuListView> </Flex>
</div> );
</ObjectLocationView> })}
</Column>
</ContextMenuListView>
</Column>
</ObjectLocationView>
);
}) }
</>
); );
} }