Mario Romano 29df96a085 react app
2016-04-06 17:52:19 +01:00

85 lines
3.4 KiB
JavaScript

var CommentBox = React.createClass({
displayName: 'CommentBox',
getInitialState: function () {
return { accept: 'image/*', action: 'target.php', droppable: '' };
},
onChangeAccept: function (e) {
this.setState({ accept: e.target.value });
},
onChangeAction: function (e) {
this.setState({ action: e.target.value });
},
onChangeDroppable: function (e) {
this.setState({ droppable: e.target.checked });
},
render: function () {
return React.createElement(
'div',
{ className: 'commentBox' },
React.createElement(
'div',
{ className: 'container' },
React.createElement('img', { className: 'nav-logo', src: 'http://facebook.github.io/react/img/logo.svg', width: '60', height: '60' }),
React.createElement(
'h1',
null,
'React'
),
React.createElement(
'form',
null,
React.createElement(
'div',
{ className: 'form-group' },
React.createElement(
'label',
{ htmlFor: 'exampleAction' },
'File action'
),
React.createElement('input', { className: 'form-control', id: 'exampleAction', type: 'text', onChange: this.onChangeAction, value: this.state.action, placeholder: 'action name' })
),
React.createElement(
'div',
{ className: 'form-group' },
React.createElement(
'label',
{ htmlFor: 'exampleAction' },
'File action'
),
React.createElement('input', { className: 'form-control', onChange: this.onChangeAccept, value: this.state.accept })
),
React.createElement(
'div',
{ className: 'checkbox' },
React.createElement(
'label',
null,
React.createElement('input', { type: 'checkbox', onChange: this.onChangeDroppable, defaultChecked: this.state.droppable }),
' Enable drop area'
)
),
React.createElement(
'div',
{ className: 'panel panel-default' },
React.createElement(
'div',
{ className: 'panel-body' },
'web component inside React'
),
React.createElement(
'file-upload',
{ raised: 'true', accept: this.state.accept, droppable: this.state.droppable, target: this.state.action, multi: 'false' },
'Choose File'
)
)
)
)
);
}
});
ReactDOM.render(React.createElement(CommentBox, null), document.getElementById('example'));