-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #13 from bu-else/feature/start_tests
Feature/start tests
- Loading branch information
Showing
12 changed files
with
2,441 additions
and
600 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,67 @@ | ||
| 'use strict'; | ||
| const React = require('react'); | ||
| const ReactHelmet = require('react-helmet'); | ||
| //const Button = require('react-bootstrap/lib/Button'); | ||
| const ButtonToolbar = require('react-bootstrap/lib/ButtonToolbar'); | ||
| //const ButtonGroup = require('react-bootstrap/lib/ButtonGroup'); | ||
| const DropdownButton = require('react-bootstrap/lib/DropdownButton'); | ||
| const MenuItem = require('react-bootstrap/lib/MenuItem'); | ||
| const Helmet = ReactHelmet.Helmet; | ||
| const TestAPI = require('../testapi'); | ||
| const url = 'http://128.31.24.189:8001/api/survey/start/'; | ||
| const fetch = require('fetch-api'); | ||
| const axios = require('axios'); | ||
|
|
||
| class AssessPage extends React.Component { | ||
|
|
||
| constructor(props) { | ||
| super(props); | ||
|
|
||
| } | ||
|
|
||
| render() { | ||
|
|
||
| const buttonsInstance = ( | ||
| <ButtonToolbar> | ||
| <DropdownButton title="Dropdown" id="bg-nested-dropdown"> | ||
| <MenuItem eventKey="1">Dr</MenuItem> | ||
| <MenuItem eventKey="2">Dropdown link</MenuItem> | ||
| </DropdownButton> | ||
| </ButtonToolbar> | ||
|
|
||
| ); | ||
|
|
||
|
|
||
|
|
||
| return ( | ||
| <section className="section-about container"> | ||
| <Helmet> | ||
| <title>Start Assessment</title> | ||
| </Helmet> | ||
| <div className="row"> | ||
| <div className="col-sm-6"> | ||
| <h1 className="page-header">Take an assessment</h1> | ||
| <div> | ||
| <h4>Instructions</h4> | ||
| <li>Select List Forms to display available instruments.</li> | ||
| <li>Select an instrument and then click the 'Order Form' button to order the instrument.</li> | ||
| <li>Click the 'Administer Form' button to start the assessment.</li> | ||
| <li>Refresh page to try another instrument.</li> | ||
| <li>The 'Display Form' button will preview an instrument (display all items in the instrument).</li> | ||
| </div> | ||
| {/*<div className="buttonsInstance">{buttonsInstance}</div>*/} | ||
|
|
||
| {/*TestAPI component is a child of Index component*/} | ||
| <TestAPI/> | ||
|
|
||
| </div> | ||
|
|
||
| <hr /> | ||
| </div> | ||
| </section> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
|
|
||
| module.exports = AssessPage; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,145 @@ | ||
| // require the module | ||
| const React = require('react'); | ||
| const url = 'http://128.31.24.189:8001/api/survey/start/'; | ||
| const axios = require('axios'); | ||
| const _ = require('underscore'); | ||
|
|
||
| class TestAPI extends React.Component { | ||
|
|
||
| constructor(props) { | ||
| super(props); | ||
| this.state = { | ||
| questions: [], | ||
| responses: [], | ||
| selectedOption: [], | ||
| score: 0 | ||
| // surveyID: '', | ||
| // userID: '' | ||
| }; | ||
| //React components using ES6 classes no longer autobind this to non React methods. | ||
| this.handleFormReset = this.handleFormReset.bind(this); | ||
| this.handleFormSubmit = this.handleFormSubmit.bind(this); | ||
| } | ||
|
|
||
| componentDidMount() { | ||
| // this is where you make the axios call | ||
|
|
||
| axios.get(url) | ||
| .then(({ data })=> { | ||
| console.log(data); // entire json array | ||
| this.setState( | ||
| {questions: data.questions} | ||
| ); | ||
|
|
||
| _.map(this.state.questions, question => { | ||
| this.setState({responses: question.responseOptions }); | ||
| }); | ||
|
|
||
| _.map(this.state.responses, response => { | ||
| this.setState({selectedOption: response.value}); | ||
| }); | ||
|
|
||
|
|
||
| }) | ||
| .catch(function(error) { | ||
| if (error.response) { | ||
| console.log(error.response.data); | ||
| console.log(error.response.status); | ||
| console.log(error.response.headers); | ||
| } else if (error.request) { | ||
| console.log(error.request); | ||
| } else { | ||
| console.log('Error', error.message); | ||
| } | ||
| console.log(error.config); | ||
| }); | ||
|
|
||
| } | ||
|
|
||
| render () { | ||
|
|
||
| return ( | ||
| <div className ="container1"> | ||
| <div className="container2"> | ||
| <form onSubmit={this.handleFormSubmit} onReset={this.handleFormReset}> | ||
| {this.renderQuestions()} | ||
| <button className="btn btn-default" type="submit">Submit Responses</button> | ||
| <button className="btn btn-default" type="reset">Reset Responses</button> | ||
| </form> | ||
|
|
||
| {/*{this.renderRadioButtons()}*/} | ||
|
|
||
| </div> | ||
| </div> | ||
| ); | ||
|
|
||
| } | ||
|
|
||
| // handleOptionChange(changeEvent) { | ||
| // this.setState({ | ||
| // selectedOption: changeEvent.target.value | ||
| // }); | ||
| // } | ||
|
|
||
| handleFormSubmit(formSubmitEvent) { | ||
| formSubmitEvent.preventDefault(); | ||
| console.log('You have selected to submit'); | ||
| this.setState({ | ||
| score: 100 | ||
| }); | ||
| console.log(this.state.score); | ||
| } | ||
|
|
||
| handleFormReset(formSubmitEvent) { | ||
| formSubmitEvent.preventDefault(); | ||
| console.log('You have selected to reset'); | ||
| this.setState({ | ||
| selectedOption: [] | ||
| }); | ||
| console.log(this.state.selectedOption); | ||
| } | ||
|
|
||
|
|
||
| renderQuestions() { | ||
|
|
||
| console.log(this.state.questions); | ||
|
|
||
| console.log(this.state.responses); // the state of responses at a given time | ||
|
|
||
| return _.map(this.state.questions, question => { | ||
|
|
||
| var question_text= question.questionText; | ||
|
|
||
| //var question_id = question.tabindex; | ||
|
|
||
| return ( _.map(question.responseOptions, response => { | ||
|
|
||
| var response_text = response.displayText; | ||
| var response_id = response.id; | ||
|
|
||
| // currently returning the question multiple times | ||
| // how do i get it to show the question once, and then a list of responses for every question? | ||
| return ( | ||
|
|
||
| <ul><label>{question_text}</label> | ||
| <ul key ={response_id}></ul> | ||
|
|
||
| {/*// <input type='radio' value ="response option">{response_text}</input>*/} | ||
| <ul> | ||
| <button type = "button"ç>{response_text}</button> | ||
| </ul> | ||
| </ul> | ||
|
|
||
| ); | ||
| })); | ||
| } | ||
|
|
||
| ); | ||
|
|
||
|
|
||
| } | ||
| } | ||
|
|
||
|
|
||
| module.exports = TestAPI; | ||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.