More comments and comma-first notation. Slowly but surely...

This commit is contained in:
Robbie Antenesse 2016-11-03 12:49:38 -06:00
parent 24d9c87ccf
commit 5a9e14a7df
3 changed files with 27 additions and 23 deletions

View File

@ -1,19 +1,17 @@
import React from 'react'; import React from 'react';
import {Input} from './Input'; import {Input} from './Input';
import {Button} from './Button';
export class Checkbox extends Input { export class Checkbox extends Input {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
value: props.value || false, value: props.value || false
isDisabled: props.isDisabled || false , isDisabled: props.isDisabled || false
}; };
} }
// Whenever the input changes we update the value state of this component // Whenever the input changes, update the value state of this component
handleOnChange(event) { handleOnChange(event) {
this.setState({ this.setState({
value: event.target.checked value: event.target.checked

View File

@ -1,24 +1,27 @@
import React from 'react'; import React from 'react';
import {Word} from './Word'; import {Word} from './Word';
import {Button} from './Button';
// A component for showing just the list of words provided to it as a prop.
export class Dictionary extends React.Component { export class Dictionary extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
} }
// Take the word list, given as a component prop, map its values to a Word component, and return it in a div tag.
showWords() { showWords() {
if (this.props.words.length > 0) { if (this.props.words.length > 0) {
let words = this.props.words.map((word) => { let words = this.props.words.map((word) => {
return <Word key={'d:' + this.props.details.name + this.props.details.externalID.toString() + 'w:' + word.wordId.toString()} isEditing={true} return (
<Word key={'d:' + this.props.details.name + this.props.details.externalID.toString() + 'w:' + word.wordId.toString()} isEditing={true}
name={word.name} name={word.name}
pronunciation={word.pronunciation} pronunciation={word.pronunciation}
partOfSpeech={word.partOfSpeech} partOfSpeech={word.partOfSpeech}
simpleDefinition={word.simpleDefinition} simpleDefinition={word.simpleDefinition}
longDefinition={word.longDefinition} longDefinition={word.longDefinition}
wordId={word.wordId} wordId={word.wordId}
updateWord={(wordId, wordObject) => this.props.updateWord(wordId, wordObject)} />; updateWord={(wordId, wordObject) => this.props.updateWord(wordId, wordObject)} />
);
}); });
return <div>{words}</div>; return <div>{words}</div>;

View File

@ -6,6 +6,7 @@ import {Checkbox} from './Checkbox';
import {Button} from './Button'; import {Button} from './Button';
import {FixedPage} from './FixedPage'; import {FixedPage} from './FixedPage';
// A component that allows you to edit the dictionary's details and settings.
export class EditDictionaryForm extends React.Component { export class EditDictionaryForm extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
@ -21,20 +22,22 @@ export class EditDictionaryForm extends React.Component {
this.isPublicField = null; this.isPublicField = null;
} }
// Pass the changes to the saveChanges function provided in the component props.
saveOnClose() { saveOnClose() {
this.props.saveChanges({ this.props.saveChanges({
name: this.nameField.state.value, name: this.nameField.state.value
listTypeName: this.listTypeNameField.state.value, , listTypeName: this.listTypeNameField.state.value
description: this.descriptionField.state.value, , description: this.descriptionField.state.value
partsOfSpeech: this.partsOfSpeechField.state.value, , partsOfSpeech: this.partsOfSpeechField.state.value
allowDuplicates: this.allowDuplicatesField.state.value, , allowDuplicates: this.allowDuplicatesField.state.value
caseSensitive: this.caseSensitiveField.state.value, , caseSensitive: this.caseSensitiveField.state.value
sortByEquivalent: this.sortByEquivalentField.state.value, , sortByEquivalent: this.sortByEquivalentField.state.value
isComplete: this.isCompleteField.state.value, , isComplete: this.isCompleteField.state.value
isPublic: this.isPublicField.state.value , isPublic: this.isPublicField.state.value
}); });
} }
// Displays the form inside of a FixedPage component, which provides a button to click before displaying its contents.
render() { render() {
return ( return (
<FixedPage buttonClasses='right' buttonText='Edit Dictionary' onHide={() => this.saveOnClose()}> <FixedPage buttonClasses='right' buttonText='Edit Dictionary' onHide={() => this.saveOnClose()}>