From c9f22b74d521715d2bce99f72e709e88b586c086 Mon Sep 17 00:00:00 2001 From: wildscotsmen Date: Mon, 29 Oct 2018 00:33:35 -0400 Subject: [PATCH 1/2] Cleaned code for consistency. Additionally added month function for report form. --- src/components/ReportForm.js | 55 +++++++++++++++-------- src/components/SightingMap.js | 85 ++++++++++++++++++----------------- 2 files changed, 80 insertions(+), 60 deletions(-) diff --git a/src/components/ReportForm.js b/src/components/ReportForm.js index 7d50473..b30952d 100644 --- a/src/components/ReportForm.js +++ b/src/components/ReportForm.js @@ -53,19 +53,6 @@ const styles = theme => ({ }, }); -/** - * Function for formatting the - * year as a string that - * Material UI can use. - * @param {*} date, Date passed in. - */ -function getYear(date) { - var d = new Date(date), - year = d.getFullYear(); - - return year; -} - /** * Types of sightings. Label is what is * viewed in the application, value is @@ -228,8 +215,8 @@ class ReportForm extends React.Component { * State of form components. */ state = { - month: '01', - year: getYear(new Date()), + month: this.getMonth(new Date()), + year: this.getYear(new Date()), time: 'unknown', type: 'visual', confidence: '1', @@ -249,6 +236,38 @@ class ReportForm extends React.Component { }); }; + /** + * Function for formatting the + * year as a string that + * Material UI can use. + * @param {*} date, Date passed in. + */ + getYear = date => { + var d = new Date(date), + year = d.getFullYear(); + + return year; + } + + /** + * Function for formatting the + * month as a string that + * Material UI can use. + * @param {*} date, Date passed in. + */ + getMonth = date => { + var d = new Date(date), + month = d.getMonth(); + + month = month.toString(); + + if (month.length == 1) { + month = "0" + month; + } + + return month; + } + /** * Handles closing the toast. */ @@ -294,8 +313,8 @@ class ReportForm extends React.Component { } sightingsRef.push(sighting); this.setState({ - year: getYear(new Date()), - month: '01', + year: this.getYear(new Date()), + month: this.getMonth(new Date()), time: 'unknown', type: 'visual', confidence: '1', @@ -479,7 +498,7 @@ class ReportForm extends React.Component { ContentProps={{ 'aria-describedby': 'message-id', }} - message={Report received.} + message={Report received.} action={[ { + for (var i = 0; i < sightingTypes.length; i++) { + if (sightingTypes[i].value === item) { + return sightingTypes[i].label; + } + } + } + + + /** + * Gets formatted time value. + */ + getTime = item => { + for (var i = 0; i < timeTypes.length; i++) { + if (timeTypes[i].value === item) { + return timeTypes[i].label; + } + } + } + + /** + * Gets formatted confidence value. + */ + getConfidence = item => { + for (var i = 0; i < confidenceLevels.length; i++) { + if (confidenceLevels[i].value === item) { + return confidenceLevels[i].label; + } + } + + } + // When the component has mounted to the DOM, get the user's location componentDidMount() { this.getLocation(); @@ -246,14 +247,14 @@ export class MapContainer extends Component { {this.state.sightings.map((sighting) => { return ( Confidence: {getConfidence(sighting.confidence)}} - date = {Date: {this.formatDate(sighting.date)}} - time = {Time: {getTime(sighting.time)}} - description = {Description: {sighting.desc}} + key={sighting.id} + position={{ lat: sighting.lat, lng: sighting.lng }} + onClick={this.onMarkerClick} + type={'Type: ' + this.getType(sighting.type)} + confidence={Confidence: {this.getConfidence(sighting.confidence)}} + date={Date: {this.formatDate(sighting.date)}} + time={Time: {this.getTime(sighting.time)}} + description={Description: {sighting.desc}} /> ) })} From 4617f31be21b9e5e56f3c76fc33b07180785ffee Mon Sep 17 00:00:00 2001 From: wildscotsmen Date: Mon, 29 Oct 2018 00:38:19 -0400 Subject: [PATCH 2/2] Fixed some issues with ordering in report form code. --- src/components/ReportForm.js | 64 ++++++++++++++++++------------------ 1 file changed, 32 insertions(+), 32 deletions(-) diff --git a/src/components/ReportForm.js b/src/components/ReportForm.js index b30952d..9068eec 100644 --- a/src/components/ReportForm.js +++ b/src/components/ReportForm.js @@ -211,6 +211,38 @@ class ReportForm extends React.Component { this.handleSubmit = this.handleSubmit.bind(this); } + /** + * Function for formatting the + * year as a string that + * Material UI can use. + * @param {*} date, Date passed in. + */ + getYear = date => { + var d = new Date(date), + year = d.getFullYear(); + + return year; +} + +/** +* Function for formatting the +* month as a string that +* Material UI can use. +* @param {*} date, Date passed in. +*/ +getMonth = date => { + var d = new Date(date), + month = d.getMonth() + 1; + + month = month.toString(); + + if (month.length === 1) { + month = "0" + month; + } + + return month; +} + /** * State of form components. */ @@ -236,38 +268,6 @@ class ReportForm extends React.Component { }); }; - /** - * Function for formatting the - * year as a string that - * Material UI can use. - * @param {*} date, Date passed in. - */ - getYear = date => { - var d = new Date(date), - year = d.getFullYear(); - - return year; - } - - /** - * Function for formatting the - * month as a string that - * Material UI can use. - * @param {*} date, Date passed in. - */ - getMonth = date => { - var d = new Date(date), - month = d.getMonth(); - - month = month.toString(); - - if (month.length == 1) { - month = "0" + month; - } - - return month; - } - /** * Handles closing the toast. */