PapaTutuWawa/Lateinicus
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feat: Display a message when the user hits the max level

Browse Source
This commit is contained in:
Alexander Polynomdivision 2018-10-09 20:24:20 +02:00
parent 5c3603f595
commit ede271f604
1 changed files with 23 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
frontend/src/components/Drawer.tsx
View File

@ -56,7 +56,16 @@ export default class Drawer extends React.Component<IProps> {
}
render() {
const level = userScoreToLevel(this.props.user.score);
const { score } = this.props.user;
const level = userScoreToLevel(score);
// Determine whether we hit the maximum level
const maxLevel = score >= level.levelCap;
const scoreStr = maxLevel ? (
`${score}`
) : (
`${score} / ${level.levelCap}`
);
return (
<div>
@ -80,7 +89,7 @@ export default class Drawer extends React.Component<IProps> {
color="inherit"
buttonRef={node => this.scoreBtnRef = node}
onClick={this.toggleScorePopover}>
{`${this.props.user.score} / ${level.levelCap}`}
{scoreStr}
</Button>
) : undefined
}
@ -98,9 +107,17 @@ export default class Drawer extends React.Component<IProps> {
onClose={this.closeScorePopover}>
<div className="content">
<Typography variant="headline">Du bist: {level.name}</Typography>
<Typography variant="subheading">
Dir fehlen noch <b>{level.levelCap - this.props.user.score}</b> Erfahrungspunkte bis zum nächsten Level
</Typography>
{
maxLevel ? (
<Typography variant="subheading">
Veni Vidi Vici...
</Typography>
) : (
<Typography variant="subheading">
Dir fehlen noch <b>{level.levelCap - this.props.user.score}</b> Erfahrungspunkte bis zum nächsten Level
</Typography>
)
}
</div>
</Popover>
</Toolbar>
@ -189,7 +206,7 @@ export default class Drawer extends React.Component<IProps> {
</ListItem>
</List>
</SwipeableDrawer>
</div>
</div >
);
}
};