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

Update highscore widget

Browse Source
This commit is contained in:
Bill 2022-03-01 04:07:39 -05:00
parent 526d50d9dc
commit 26c047b295
1 changed files with 29 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

70
src/views/room/widgets/furniture/high-score/FurnitureHighScoreView.tsx
View File

@ -1,12 +1,11 @@
import { HighScoreDataType, ObjectDataFactory, RoomEngineTriggerWidgetEvent, RoomObjectCategory, RoomObjectVariable } from '@nitrots/nitro-renderer'; import { HighScoreDataType, ObjectDataFactory, RoomEngineTriggerWidgetEvent, RoomObjectCategory, RoomObjectVariable } from '@nitrots/nitro-renderer';
import { FC, useCallback, useState } from 'react'; import { FC, useCallback, useState } from 'react';
import { GetRoomEngine, LocalizeText } from '../../../../../api'; import { GetRoomEngine, LocalizeText } from '../../../../../api';
import { Column, Flex, Text } from '../../../../../common';
import { useRoomEngineEvent } from '../../../../../hooks'; import { useRoomEngineEvent } from '../../../../../hooks';
import { NitroLayoutGrid, NitroLayoutGridColumn } from '../../../../../layout';
import { NitroLayoutBase } from '../../../../../layout/base';
import { useRoomContext } from '../../../context/RoomContext'; import { useRoomContext } from '../../../context/RoomContext';
import { ContextMenuHeaderView } from '../../context-menu/views/header/ContextMenuHeaderView'; import { ContextMenuHeaderView } from '../../context-menu/ContextMenuHeaderView';
import { ContextMenuListView } from '../../context-menu/views/list/ContextMenuListView'; import { ContextMenuListView } from '../../context-menu/ContextMenuListView';
import { ObjectLocationView } from '../../object-location/ObjectLocationView'; import { ObjectLocationView } from '../../object-location/ObjectLocationView';
const SCORE_TYPES = ['perteam', 'mostwins', 'classic']; const SCORE_TYPES = ['perteam', 'mostwins', 'classic'];
@ -57,49 +56,38 @@ export const FurnitureHighScoreView: FC<{}> = props =>
if((objectId === -1) || !stuffData) return null; if((objectId === -1) || !stuffData) return null;
return ( return (
<ObjectLocationView objectId={objectId} category={RoomObjectCategory.FLOOR} > <ObjectLocationView objectId={ objectId } category={ RoomObjectCategory.FLOOR }>
<div className="nitro-widget-high-score nitro-context-menu"> <div className="nitro-widget-high-score nitro-context-menu">
<ContextMenuHeaderView> <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]}`)])} { 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> </ContextMenuHeaderView>
<ContextMenuListView> <ContextMenuListView overflow="hidden" gap={ 1 }>
<NitroLayoutGrid> <Column gap={ 1 }>
<NitroLayoutGridColumn size={6}> <Flex alignItems="center">
<NitroLayoutBase className="text-center fw-bold"> <Text center bold variant="white" className="col-8">
{LocalizeText('high.score.display.users.header')} { LocalizeText('high.score.display.users.header') }
</NitroLayoutBase> </Text>
</NitroLayoutGridColumn> <Text center bold variant="white" className="col-4">
<NitroLayoutGridColumn size={6}> { LocalizeText('high.score.display.score.header') }
<NitroLayoutBase className="text-center fw-bold"> </Text>
{LocalizeText('high.score.display.score.header')} </Flex>
</NitroLayoutBase> <hr className="m-0" />
</NitroLayoutGridColumn> </Column>
</NitroLayoutGrid> <Column overflow="auto" gap={ 1 }>
<hr className="m-0 my-1" /> { stuffData.entries.map((entry, index) =>
<NitroLayoutGrid overflow="hidden">
<NitroLayoutGridColumn size={6}>
{stuffData.entries.map((entry, index) =>
{ {
return ( return (
<NitroLayoutBase key={index} className="text-center"> <Flex key={ index } alignItems="center">
{entry.users.join(', ')} <Text center variant="white" className="col-8">
</NitroLayoutBase> { entry.users.join(', ') }
</Text>
<Text center variant="white" className="col-4">
{ entry.score }
</Text>
</Flex>
); );
}) }) }
} </Column>
</NitroLayoutGridColumn>
<NitroLayoutGridColumn size={6}>
{stuffData.entries.map((entry, index) =>
{
return (
<NitroLayoutBase key={index} className="text-center">
{entry.score}
</NitroLayoutBase>
);
})
}
</NitroLayoutGridColumn>
</NitroLayoutGrid>
</ContextMenuListView> </ContextMenuListView>
</div> </div>
</ObjectLocationView> </ObjectLocationView>