More comments and comma-first notation. Slowly but surely...
This commit is contained in:
parent
24d9c87ccf
commit
5a9e14a7df
|
@ -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
|
||||||
|
|
|
@ -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>;
|
||||||
|
|
|
@ -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()}>
|
||||||
|
|
Loading…
Reference in New Issue