gearheads/mastodon
Archived
2
0
Fork 0
Code Releases 4 Activity

Fix reblogs of reblogs in UI, add follow form in UI

Browse source
This commit is contained in:
Eugen Rochko 2016-09-03 14:01:10 +02:00
parent f24cb32e99
commit d0e2733f63
10 changed files with 113 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

8
app/assets/javascripts/components/components/composer_drawer.jsx → app/assets/javascripts/components/components/compose_form.jsx
View file

@ -4,7 +4,7 @@ import PureRenderMixin from 'react-addons-pure-render-mixin';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ReplyIndicator from './reply_indicator';
const ComposerDrawer = React.createClass({
const ComposeForm = React.createClass({
propTypes: {
text: React.PropTypes.string.isRequired,
@ -39,10 +39,10 @@ const ComposerDrawer = React.createClass({
}
return (
<div style={{ width: '280px', boxSizing: 'border-box', background: '#454b5e', margin: '10px', marginRight: '0', padding: '10px' }}>
<div style={{ marginBottom: '30px', padding: '10px' }}>
{replyArea}
<textarea disabled={this.props.is_submitting} placeholder='What is on your mind?' value={this.props.text} onKeyUp={this.handleKeyUp} onChange={this.handleChange} className='compose-drawer__textarea' style={{ display: 'block', boxSizing: 'border-box', width: '100%', height: '100px', resize: 'none', border: 'none', color: '#282c37', padding: '10px', fontFamily: 'Roboto', fontSize: '14px', margin: '0' }} />
<textarea disabled={this.props.is_submitting} placeholder='What is on your mind?' value={this.props.text} onKeyUp={this.handleKeyUp} onChange={this.handleChange} className='compose-form__textarea' style={{ display: 'block', boxSizing: 'border-box', width: '100%', height: '100px', resize: 'none', border: 'none', color: '#282c37', padding: '10px', fontFamily: 'Roboto', fontSize: '14px', margin: '0' }} />
<div style={{ marginTop: '10px', overflow: 'hidden' }}>
<div style={{ float: 'right' }}><Button text='Publish' onClick={this.handleSubmit} disabled={this.props.is_submitting} /></div>
@ -54,4 +54,4 @@ const ComposerDrawer = React.createClass({
});
export default ComposerDrawer;
export default ComposeForm;

17
app/assets/javascripts/components/components/drawer.jsx Normal file
View file

@ -0,0 +1,17 @@
import PureRenderMixin from 'react-addons-pure-render-mixin';
const Drawer = React.createClass({
mixins: [PureRenderMixin],
render () {
return (
<div style={{ width: '280px', boxSizing: 'border-box', background: '#454b5e', margin: '10px', marginRight: '0', padding: '0', display: 'flex', flexDirection: 'column' }}>
{this.props.children}
</div>
);
}
});
export default Drawer;

40
app/assets/javascripts/components/components/follow_form.jsx Normal file
View file

@ -0,0 +1,40 @@
import IconButton from './icon_button';
import PureRenderMixin from 'react-addons-pure-render-mixin';
const FollowForm = React.createClass({
propTypes: {
text: React.PropTypes.string.isRequired,
is_submitting: React.PropTypes.bool,
onChange: React.PropTypes.func.isRequired,
onSubmit: React.PropTypes.func.isRequired
},
mixins: [PureRenderMixin],
handleChange (e) {
this.props.onChange(e.target.value);
},
handleKeyUp (e) {
if (e.keyCode === 13) {
this.props.onSubmit();
}
},
handleSubmit () {
this.props.onSubmit();
},
render () {
return (
<div style={{ display: 'flex', lineHeight: '20px', padding: '10px', background: '#373b4a' }}>
<input type='text' disabled={this.props.is_submitting} placeholder='username@domain' value={this.props.text} onKeyUp={this.handleKeyUp} onChange={this.handleChange} className='follow-form__input' style={{ flex: '1 1 auto', boxSizing: 'border-box', display: 'block', border: 'none', padding: '10px', fontFamily: 'Roboto', color: '#282c37', fontSize: '14px', margin: '0' }} />
<div style={{ padding: '10px', paddingRight: '0' }}><IconButton title='Follow' size={20} icon='user-plus' onClick={this.handleSubmit} disabled={this.props.is_submitting} /></div>
</div>
);
}
});
export default FollowForm;

17
app/assets/javascripts/components/components/frontend.jsx
View file

@ -1,6 +1,8 @@
import ColumnsArea from './columns_area';
import ComposerDrawerContainer from '../containers/composer_drawer_container';
import PureRenderMixin from 'react-addons-pure-render-mixin';
import ColumnsArea from './columns_area';
import Drawer from './drawer';
import ComposeFormContainer from '../containers/compose_form_container';
import FollowFormContainer from '../containers/follow_form_container';
import PureRenderMixin from 'react-addons-pure-render-mixin';
const Frontend = React.createClass({
@ -9,7 +11,14 @@ const Frontend = React.createClass({
render () {
return (
<div style={{ flex: '0 0 auto', display: 'flex', width: '100%', height: '100%', background: '#1a1c23' }}>
<ComposerDrawerContainer />
<Drawer>
<div style={{ flex: '1 1 auto' }}>
<ComposeFormContainer />
</div>
<FollowFormContainer />
</Drawer>
<ColumnsArea />
</div>
);