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

refactor: Lesson -> Level

Browse Source
This commit is contained in:
Alexander Polynomdivision 2018-09-06 20:13:29 +02:00
parent f4f686073f
commit 423e2263dc
4 changed files with 23 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/app.tsx
View File

@ -22,10 +22,10 @@ import AuthRoute from "../security/AuthRoute";
import Dashboard from "../pages/dashboard";
import LoginPage from "../pages/login";
import LessonsPage from "../pages/lessons";
import LevelListPage from "../pages/levelList";
import LevelPage from "../pages/level";
import { ILesson } from "../models/lesson";
import { ILevel } from "../models/level";
import { IVocab } from "../models/vocab";
interface IState {
@ -47,9 +47,9 @@ export default class Application extends React.Component<{}, IState> {
this.isAuthenticated = this.isAuthenticated.bind(this);
}
getLessons(): ILesson[] {
getLevels(): ILevel[] {
// TODO: Actually fetch them from somewhere
const lessons = [{
const levels = [{
name: "Der Bauer auf dem Feld",
desc: "So fängt alles an: Du bist ein einfacher Bauer und musst dich die Karriereleiter mit deinen freshen Latein-Skills hinaufarbeiten",
level: 1,
@ -61,7 +61,7 @@ export default class Application extends React.Component<{}, IState> {
done: false,
}];
return lessons;
return levels;
}
getLearners(): ILearner[] {
@ -80,7 +80,7 @@ export default class Application extends React.Component<{}, IState> {
}];
}
getNextLesson(): ILesson {
getNextLevel(): ILevel {
// TODO: Actually fetch data
return {
name: "???",
@ -203,11 +203,11 @@ export default class Application extends React.Component<{}, IState> {
<AuthRoute
isAuth={this.isAuthenticated}
path="/dashboard"
component={() => <Dashboard nextLesson={this.getNextLesson} learners={this.getLearners()} />} />
component={() => <Dashboard nextLevel={this.getNextLevel} learners={this.getLearners()} />} />
<AuthRoute
isAuth={this.isAuthenticated}
path="/levelList"
component={() => <LessonsPage lessons={this.getLessons()} />} />
component={() => <LevelListPage levels={this.getLevels()} />} />
{/*We cannot use AuthRoute here, because match is undefined otherwise*/}
<Route
path="/level/:id"

2
src/models/lesson.ts → src/models/level.ts
View File

@ -1,4 +1,4 @@
export interface ILesson {
export interface ILevel {
name: string;
desc: string;
level: number;

14
src/pages/dashboard.tsx
View File

@ -9,11 +9,11 @@ import Paper from "@material-ui/core/Paper";
import Scoreboard from "../components/scoreboard";
import { ILesson } from "../models/lesson";
import { ILevel } from "../models/level";
import { ILearner } from "../models/learner";
interface IProps {
nextLesson: () => ILesson;
nextLevel: () => ILevel;
learners: ILearner[];
}
@ -34,7 +34,7 @@ export default class Dashboard extends React.Component<IProps, IState> {
const small = window.matchMedia("(max-width: 700px)").matches;
const direction = small ? "column" : "row";
const lesson = this.props.nextLesson();
const level = this.props.nextLevel();
return <div>
{
@ -45,16 +45,16 @@ export default class Dashboard extends React.Component<IProps, IState> {
<Grid container direction={direction} spacing={16}>
<Grid item lg={4}>
<Paper className="paper">
<Typography variant="title">{`Level ${lesson.level}`}</Typography>
<Typography variant="title" component="p">{lesson.name}</Typography>
<Typography variant="title">{`Level ${level.level}`}</Typography>
<Typography variant="title" component="p">{level.name}</Typography>
<br />
<Typography component="p">
{lesson.desc}
{level.desc}
</Typography>
<Button className="lesson-card-btn"
onClick={() => {
this.setState({
toLevel: lesson.level,
toLevel: level.level,
});
}}>
Zum Level

14
src/pages/lessons.tsx → src/pages/levelList.tsx
View File

@ -7,10 +7,10 @@ import Card from '@material-ui/core/Card';
import CardActions from '@material-ui/core/CardActions';
import CardContent from '@material-ui/core/CardContent';
import { ILesson } from "../models/lesson";
import { ILevel } from "../models/lesson";
interface IProps {
lessons: ILesson[];
levels: ILevel[];
}
export default class Dashboard extends React.Component<{}> {
@ -23,17 +23,17 @@ export default class Dashboard extends React.Component<{}> {
const cName = small ? "lesson-card-xs" : "lesson-card-lg";
let key = 0;
const lessonToCard = (lesson: ILesson) => {
const levelToCard = (level: ILevel) => {
return <Grid item key={key++}>
<Card style={{
width: small ? window.width - 32 : "300px"
}}>
<CardContent className={cName}>
<Typography variant="title">{`Level ${lesson.level}`}</Typography>
<Typography variant="title" component="p">{lesson.name}</Typography>
<Typography variant="title">{`Level ${level.level}`}</Typography>
<Typography variant="title" component="p">{level.name}</Typography>
<br />
<Typography component="p">
{lesson.desc}
{level.desc}
</Typography>
</CardContent>
<CardActions>
@ -46,7 +46,7 @@ export default class Dashboard extends React.Component<{}> {
};
return <Grid container spacing={16} direction="row">
{this.props.lessons.map(lessonToCard)}
{this.props.levels.map(levelToCard)}
</Grid>
}
};