timw4mail/film-exif
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Form values in state

Browse Source
This commit is contained in:
Timothy Warren 2018-04-04 21:28:47 -04:00
parent 5f8d09bcaf
commit 1ea31115b8
8 changed files with 57 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env
View File

@ -1,2 +1,2 @@
BROWSER=none
NODE_PATH=src/
NODE_PATH=./src/

6
package.json
View File

@ -4,9 +4,9 @@
"private": true,
"dependencies": {
"dist-exiftool": "^10.53.0",
"inferno": "^5.0.1",
"inferno": "^5.0.2",
"inferno-bootstrap": "^5.0.0",
"inferno-router": "^5.0.1",
"inferno-router": "^5.0.2",
"inferno-scripts": "6.3.0",
"node-exiftool": "^2.3.0"
},
@ -33,7 +33,7 @@
"fix": "eslint --fix src/**/*.js",
"lint": "eslint src/**/*.js",
"pack": "build --dir",
"postinstall": "electron-builder install-app-deps",
"postinstall": "set NODE_DIR=src/ electron-builder install-app-deps",
"precommit": "yarn lint",
"react-start": "inferno-scripts start",
"start": "nf start -p 3000",

2
src/Routes.js
View File

@ -4,7 +4,7 @@ import * as V from './views';
export const Routes = (props) => (
<Switch>
<Route exact path='/' component={V.HomeView} />
<Route exact path="/" component={V.HomeView} />
<Route path="/camera" component={V.CameraListView} />
<Route path="/film" component={V.FilmAddView} />
<Route component={V.OopsView} />

4
src/components/Bootstrap/Bootstrap.js
View File

@ -28,8 +28,8 @@ import Tooltip from 'inferno-bootstrap/dist/Tooltip';
export const BSWrapper = (Component, tagName) => {
return ({children, ...props}) => (
<Component tag={tagName} {...props}>{children}</Component>
)
}
);
};
export const Alert = BSWrapper(BSAlert, 'bs-alert');
export const Jumbotron = BSWrapper(BSJumbotron, 'bs-jumbotron');

2
src/components/Bootstrap/Grid.js
View File

@ -2,7 +2,7 @@ import BSCol from 'inferno-bootstrap/dist/Col';
import BSContainer from 'inferno-bootstrap/dist/Container';
import BSRow from 'inferno-bootstrap/dist/Row';
import { BSWrapper } from './Bootstrap'
import { BSWrapper } from './Bootstrap';
export const Col = BSWrapper(BSCol, 'bs-col');
export const Container = BSWrapper(BSContainer, 'bs-container');

2
src/components/Form/FormBlock.js
View File

@ -16,7 +16,7 @@ export const FormBlock = ({
: <Input id={props.name} name={props.name} type={type} {...props} />;
return (
<Col xs={12} sm={6} md={3} className="d-flex align-items-baseline justify-content-around">
<Col xs={12} md={6} xl={4} className="d-flex align-items-baseline justify-content-around">
<FormGroup>
<Label for={props.name}>{label}</Label>
{formElement}

25
src/views/Film/FilmAddView.js
View File

@ -10,7 +10,7 @@ import {
Col,
Form,
Row,
} from 'components/Bootstrap'
} from 'components/Bootstrap';
import { FormBlock } from 'components/Form';
@ -22,19 +22,27 @@ export class FilmAddView extends Component {
form: {
valid: {},
values: {},
}
},
};
}
handleFormChange (e) {
console.log(e);
handleFormChange (instance, e) {
instance.setState({
form: {
...instance.state.form,
values: {
...instance.state.form.values,
[e.target.id]: e.target.value,
},
},
});
}
render () {
return (
<Row className="full-height">
<Col sm={12} md={8} lg={4} className="abs-center">
<Form onChange={ linkEvent(this, this.handleFormChange) }>
<Form onKeyDown={ linkEvent(this, this.handleFormChange) }>
<Card>
<CardHeader>
<CardTitle>Add a Film</CardTitle>
@ -45,11 +53,13 @@ export class FilmAddView extends Component {
label="Brand"
name="brand"
required
value={this.state.form.values['brand']}
/>
<FormBlock
label="Film Name"
name="film-name"
required
value={this.state.form.values['film-name']}
/>
<FormBlock
label="Film Speed (ISO)"
@ -57,15 +67,18 @@ export class FilmAddView extends Component {
name="film-speed-asa"
required
type="number"
value={this.state.form.values['film-speed-asa']}
/>
<FormBlock
label="Film Speed (DIN)"
name="film-speed-din"
type="number"
value={this.state.form.values['film-speed-din']}
/>
<FormBlock
label="Film Format"
name="film-format"
value={this.state.form.values['film-format']}
>
<select className="custom-select" id="film-format" name="film-format">
<option value="110">110</option>
@ -87,6 +100,6 @@ export class FilmAddView extends Component {
</Form>
</Col>
</Row>
)
);
}
}

33
yarn.lock
View File

@ -4035,6 +4035,10 @@ inferno-bootstrap@^5.0.0:
lodash.isobject "^3.0.2"
lodash.tonumber "^4.0.3"
inferno-clone-vnode@5.0.2:
version "5.0.2"
resolved "https://registry.yarnpkg.com/inferno-clone-vnode/-/inferno-clone-vnode-5.0.2.tgz#02616a86767e1d0aa2f1aa5a6d14beb662935109"
inferno-create-element@^5.0.1:
version "5.0.1"
resolved "https://registry.yarnpkg.com/inferno-create-element/-/inferno-create-element-5.0.1.tgz#22f476a10b8112aa832e9228329e0ed373e5935f"
@ -4074,14 +4078,15 @@ inferno-popper@^5.0.0:
is-equal-shallow "^0.1.3"
popper.js "^1.10.8"
inferno-router@^5.0.1:
version "5.0.1"
resolved "https://registry.yarnpkg.com/inferno-router/-/inferno-router-5.0.1.tgz#4097e7953772e9a0f3ffff876a702d05dd69c0f8"
inferno-router@^5.0.2:
version "5.0.2"
resolved "https://registry.yarnpkg.com/inferno-router/-/inferno-router-5.0.2.tgz#278dc64e9d2bce9975a8660756124b16c0faffa7"
dependencies:
history "^4.7.2"
hoist-non-inferno-statics "^1.1.3"
inferno "5.0.1"
inferno-shared "5.0.1"
inferno "5.0.2"
inferno-clone-vnode "5.0.2"
inferno-shared "5.0.2"
path-to-regexp-es6 "1.7.0"
inferno-scripts@6.3.0:
@ -4132,11 +4137,27 @@ inferno-shared@5.0.1, inferno-shared@^5.0.1:
version "5.0.1"
resolved "https://registry.yarnpkg.com/inferno-shared/-/inferno-shared-5.0.1.tgz#2f7ebdc36312afa4a9ef48b8aa71c3aa9be2068a"
inferno-shared@5.0.2:
version "5.0.2"
resolved "https://registry.yarnpkg.com/inferno-shared/-/inferno-shared-5.0.2.tgz#deab19bd0b78f0b6f653b541c9a070209a0af8a6"
inferno-vnode-flags@5.0.1, inferno-vnode-flags@^5.0.1:
version "5.0.1"
resolved "https://registry.yarnpkg.com/inferno-vnode-flags/-/inferno-vnode-flags-5.0.1.tgz#fbb377070ee9d2bd93978a6faa58cae15dd746b0"
inferno@5.0.1, inferno@^5.0.1:
inferno-vnode-flags@5.0.2:
version "5.0.2"
resolved "https://registry.yarnpkg.com/inferno-vnode-flags/-/inferno-vnode-flags-5.0.2.tgz#fe5eab4c5dfd953cc5c144ed6cb8b0a42fd2cbd9"
inferno@5.0.2, inferno@^5.0.2:
version "5.0.2"
resolved "https://registry.yarnpkg.com/inferno/-/inferno-5.0.2.tgz#d1cef3876f40b57e1ba6a58846c83df4f77ea18f"
dependencies:
inferno-shared "5.0.2"
inferno-vnode-flags "5.0.2"
opencollective "^1.0.3"
inferno@^5.0.1:
version "5.0.1"
resolved "https://registry.yarnpkg.com/inferno/-/inferno-5.0.1.tgz#dee61c256629cce3b263bb2ec7175813a702be08"
dependencies: