gitea/nas
1
0
Fork 2
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Adding content sensitivity toggle, spoilers for media

Browse source
This commit is contained in:
Eugen Rochko 2016-11-23 18:53:23 +01:00
parent 5434ad3002
commit 2112a81e86
10 changed files with 182 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

14
app/assets/javascripts/components/features/compose/components/compose_form.jsx
View file

@ -9,6 +9,7 @@ import AutosuggestAccountContainer from '../../compose/containers/autosuggest_ac
import { debounce } from 'react-decoration';
import UploadButtonContainer from '../containers/upload_button_container';
import { defineMessages, injectIntl } from 'react-intl';
import Toggle from 'react-toggle';
const messages = defineMessages({
placeholder: { id: 'compose_form.placeholder', defaultMessage: 'What is on your mind?' },
@ -67,6 +68,7 @@ const ComposeForm = React.createClass({
text: React.PropTypes.string.isRequired,
suggestion_token: React.PropTypes.string,
suggestions: React.PropTypes.array,
sensitive: React.PropTypes.bool,
is_submitting: React.PropTypes.bool,
is_uploading: React.PropTypes.bool,
in_reply_to: ImmutablePropTypes.map,
@ -75,7 +77,8 @@ const ComposeForm = React.createClass({
onCancelReply: React.PropTypes.func.isRequired,
onClearSuggestions: React.PropTypes.func.isRequired,
onFetchSuggestions: React.PropTypes.func.isRequired,
onSuggestionSelected: React.PropTypes.func.isRequired
onSuggestionSelected: React.PropTypes.func.isRequired,
onChangeSensitivity: React.PropTypes.func.isRequired
},
mixins: [PureRenderMixin],
@ -139,6 +142,10 @@ const ComposeForm = React.createClass({
this.autosuggest = c;
},
handleChangeSensitivity (e) {
this.props.onChangeSensitivity(e.target.checked);
},
render () {
const { intl } = this.props;
let replyArea = '';
@ -178,6 +185,11 @@ const ComposeForm = React.createClass({
<div style={{ float: 'right', marginRight: '16px', lineHeight: '36px' }}><CharacterCounter max={500} text={this.props.text} /></div>
<UploadButtonContainer style={{ paddingTop: '4px' }} />
</div>
<label style={{ display: 'block', lineHeight: '24px', verticalAlign: 'middle', marginTop: '10px', borderTop: '1px solid #616b86', paddingTop: '10px' }}>
<Toggle checked={this.props.sensitive} onChange={this.handleChangeSensitivity} />
<span style={{ display: 'inline-block', verticalAlign: 'middle', marginBottom: '14px', marginLeft: '8px', color: '#9baec8' }}>Sensitive content</span>
</label>
</div>
);
}

8
app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx
View file

@ -6,7 +6,8 @@ import {
cancelReplyCompose,
clearComposeSuggestions,
fetchComposeSuggestions,
selectComposeSuggestion
selectComposeSuggestion,
changeComposeSensitivity
} from '../../../actions/compose';
import { makeGetStatus } from '../../../selectors';
@ -18,6 +19,7 @@ const makeMapStateToProps = () => {
text: state.getIn(['compose', 'text']),
suggestion_token: state.getIn(['compose', 'suggestion_token']),
suggestions: state.getIn(['compose', 'suggestions']).toJS(),
sensitive: state.getIn(['compose', 'sensitive']),
is_submitting: state.getIn(['compose', 'is_submitting']),
is_uploading: state.getIn(['compose', 'is_uploading']),
in_reply_to: getStatus(state, state.getIn(['compose', 'in_reply_to']))
@ -51,6 +53,10 @@ const mapDispatchToProps = function (dispatch) {
onSuggestionSelected (position, accountId) {
dispatch(selectComposeSuggestion(position, accountId));
},
onChangeSensitivity (checked) {
dispatch(changeComposeSensitivity(checked));
}
}
};

4
app/assets/javascripts/components/features/status/components/detailed_status.jsx
View file

@ -36,9 +36,9 @@ const DetailedStatus = React.createClass({
if (status.get('media_attachments').size > 0) {
if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
media = <VideoPlayer media={status.getIn(['media_attachments', 0])} width={317} height={178} />;
media = <VideoPlayer sensitive={status.get('sensitive')} media={status.getIn(['media_attachments', 0])} width={317} height={178} />;
} else {
media = <MediaGallery media={status.get('media_attachments')} height={300} onOpenMedia={this.props.onOpenMedia} />;
media = <MediaGallery sensitive={status.get('sensitive')} media={status.get('media_attachments')} height={300} onOpenMedia={this.props.onOpenMedia} />;
}
}