{"size": 6064, "ext": "js", "max_stars_repo_path": "app/src/react-components/ProfessorCheckQuiz.js", "max_stars_repo_name": "Accelsnow/phonogenesis", "max_stars_repo_stars_event_min_datetime": "2021-12-03T17:19:31.000Z", "max_stars_repo_stars_event_max_datetime": "2021-12-03T17:19:31.000Z", "max_issues_repo_path": "app/src/react-components/ProfessorCheckQuiz.js", "max_issues_repo_name": "Accelsnow/phonogenesis", "max_issues_repo_issues_event_min_datetime": "2021-04-06T18:13:18.000Z", "max_issues_repo_issues_event_max_datetime": "2021-06-14T17:00:10.000Z", "max_forks_repo_path": "app/src/react-components/ProfessorCheckQuiz.js", "max_forks_repo_name": "Accelsnow/phonogenesis", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 1, "max_issues_count": 3, "max_forks_count": null, "avg_line_length": 43.9420289855, "max_line_length": 123, "alphanum_fraction": 0.4647097625}
import React from "react";

import Table from '@material-ui/core/Table';
import TableBody from '@material-ui/core/TableBody';
import TableCell from '@material-ui/core/TableCell';
import TableContainer from '@material-ui/core/TableContainer';
import TableHead from '@material-ui/core/TableHead';
import TableRow from '@material-ui/core/TableRow';
import Paper from '@material-ui/core/Paper';
import Grid from '@material-ui/core/Grid';
import ToolBar from "./ToolBar.js";
import {withRouter} from "react-router-dom";
import Button from "@material-ui/core/Button";
import "./ProfessorCheckQuiz.css"
import {Select} from "@material-ui/core";
import MenuItem from "@material-ui/core/MenuItem";
import FormControl from "@material-ui/core/FormControl";
import InputLabel from "@material-ui/core/InputLabel";
import {readCookie} from "../actions/user";
import {adjustFooter, footer, theme} from "../App";
import {ThemeProvider} from '@material-ui/styles';

class ProfessorCheckQuiz extends React.Component {

    constructor(props) {
        super(props);
        this.props.history.push("/professor/quizresult");
        this.state = {
            footerClass: "copyright-info abs-bottom",
            showResult: false,
            studentQuizObj: [],
            quizIndex: "",
            currQuiz: null
        };
        readCookie(this.props.app);
    }

    showDetails = (quiz) => {
        localStorage.setItem("quiz", JSON.stringify(quiz));
        localStorage.setItem("isActive", "0");
        this.props.history.push("/quiztaker");
    };

    getStudentQuiz = () => {
        const quizIndex = this.state.quizIndex;

        if (quizIndex === "") {
            alert("No quiz selected!")
        }

        this.setState({currQuiz: this.props.app.state.currentUser.owned_quizzes[quizIndex]})
    };

    onQuizSelectChange = (event) => {
        this.setState({quizIndex: event.target.value});
    };

    componentDidUpdate(prevProps, prevState, snap) {
        adjustFooter(this);
    };

    componentDidMount() {
        adjustFooter(this);
    }

    render() {
        const quizzes = this.props.app.state.currentUser.owned_quizzes;

        return (
            <ThemeProvider theme={theme}>
                <ToolBar history={this.props.history} app={this.props.app}/>
                <br/><br/>

                <Grid container direction="column" spacing={2} justify="center" alignItems="center">
                    <Grid item>
                        <Grid container direction="row" justify="center" alignItems="center" spacing={4}>
                            <Grid item>
                                <FormControl variant="outlined">
                                    <InputLabel id="quiz-sel-label">Quiz</InputLabel>
                                    <Select value={this.state.quizIndex} label="quiz" id="quiz-sel"
                                            labelId={"quiz-sel-label"} onChange={this.onQuizSelectChange}>
                                        {quizzes.map((quiz, index) => (
                                            <MenuItem key={quiz.id} value={index}>{quiz.name}</MenuItem>
                                        ))}
                                    </Select>
                                </FormControl>
                            </Grid>
                            <Grid item>
                                <Button variant="outlined" color="secondary" onClick={this.getStudentQuiz.bind(this)}>
                                    Check Results</Button>
                            </Grid>
                        </Grid>
                    </Grid>

                    {this.state.currQuiz ? <Grid item>
                        <Grid container direction="row" justify="flex-start"
                              alignItems="center">
                            <Grid item><h2>Quiz: &nbsp; {this.state.currQuiz.name}</h2></Grid>
                        </Grid>

                        <TableContainer component={Paper}>
                            <Table aria-label="student-quiz table">
                                <TableHead>
                                    <TableRow>
                                        <TableCell><b>Name</b></TableCell>
                                        <TableCell><b>Email</b></TableCell>
                                        <TableCell><b>Username</b></TableCell>
                                        <TableCell><b>Score</b></TableCell>
                                        <TableCell><b>Time Completed</b></TableCell>
                                        <TableCell><b>Detailed Answer</b></TableCell>
                                    </TableRow>
                                </TableHead>
                                <TableBody>
                                    {this.state.currQuiz.attempts.map((attempt) => (
                                        <TableRow key={attempt.id}>
                                            <TableCell>{attempt.user.name}</TableCell>
                                            <TableCell>{attempt.user.email}</TableCell>
                                            <TableCell>{attempt.user.username}</TableCell>
                                            <TableCell>{attempt.score}</TableCell>
                                            <TableCell>{attempt.timestamp}</TableCell>
                                            <TableCell>
                                                <Button disabled={!attempt.quiz}
                                                        onClick={this.showDetails.bind(this, attempt.quiz)}>Detail</Button>
                                            </TableCell>
                                        </TableRow>
                                    ))}
                                </TableBody>
                            </Table>
                        </TableContainer>
                    </Grid> : null}
                </Grid>
                {footer(this)}
            </ThemeProvider>
        )
    }
}

export default withRouter(ProfessorCheckQuiz);