Instead of using spoiler boolean and spoiler_text, simply check for non-blank spoiler_text

Federate spoiler_text using warning attribute on <content /> instead of a <category term="spoiler" />
Clean up schema file from accidental development migrations
This commit is contained in:
Eugen Rochko
2017-01-25 00:49:08 +01:00
parent f8da0dd490
commit 999cde94a6
23 changed files with 159 additions and 173 deletions

View File

@ -70,7 +70,6 @@ export function submitCompose() {
in_reply_to_id: getState().getIn(['compose', 'in_reply_to'], null),
media_ids: getState().getIn(['compose', 'media_attachments']).map(item => item.get('id')),
sensitive: getState().getIn(['compose', 'sensitive']),
spoiler: getState().getIn(['compose', 'spoiler']),
spoiler_text: getState().getIn(['compose', 'spoiler_text'], ''),
visibility: getState().getIn(['compose', 'private']) ? 'private' : (getState().getIn(['compose', 'unlisted']) ? 'unlisted' : 'public')
}).then(function (response) {

View File

@ -1,6 +1,7 @@
import ImmutablePropTypes from 'react-immutable-proptypes';
import PureRenderMixin from 'react-addons-pure-render-mixin';
import emojify from '../emoji';
import { FormattedMessage } from 'react-intl';
const StatusContent = React.createClass({
@ -13,17 +14,17 @@ const StatusContent = React.createClass({
onClick: React.PropTypes.func
},
getInitialState () {
return {
hidden: true
};
},
mixins: [PureRenderMixin],
componentDidMount () {
const node = ReactDOM.findDOMNode(this);
const links = node.querySelectorAll('a');
const spoilers = node.querySelectorAll('.spoiler');
for (var i = 0; i < spoilers.length; ++i) {
let spoiler = spoilers[i];
spoiler.addEventListener('click', this.onSpoilerClick.bind(this, spoiler), true);
}
for (var i = 0; i < links.length; ++i) {
let link = links[i];
@ -56,18 +57,6 @@ const StatusContent = React.createClass({
}
},
onSpoilerClick (spoiler, e) {
if (e.button === 0) {
//only toggle if we're not clicking a visible link
var hasClass = $(spoiler).hasClass('spoiler-on');
if (hasClass || e.target === spoiler) {
e.stopPropagation();
e.preventDefault();
$(spoiler).siblings(".spoiler").andSelf().toggleClass('spoiler-on', !hasClass);
}
}
},
handleMouseDown (e) {
this.startXY = [e.clientX, e.clientY];
},
@ -87,20 +76,40 @@ const StatusContent = React.createClass({
this.startXY = null;
},
handleSpoilerClick () {
this.setState({ hidden: !this.state.hidden });
},
render () {
const { status } = this.props;
const { hidden } = this.state;
const content = { __html: emojify(status.get('content')) };
const spoilerContent = { __html: emojify(status.get('spoiler_text')) };
return (
<div
className='status__content'
style={{ cursor: 'pointer' }}
dangerouslySetInnerHTML={content}
onMouseDown={this.handleMouseDown}
onMouseUp={this.handleMouseUp}
/>
);
if (status.get('spoiler_text').length > 0) {
const toggleText = hidden ? <FormattedMessage id='status.show_more' defaultMessage='Show more' /> : <FormattedMessage id='status.show_less' defaultMessage='Show less' />;
return (
<div className='status__content' style={{ cursor: 'pointer' }} onMouseDown={this.handleMouseDown} onMouseUp={this.handleMouseUp}>
<p>
<span dangerouslySetInnerHTML={spoilerContent} /> <a onClick={this.handleSpoilerClick}>{toggleText}</a>
</p>
<div style={{ display: hidden ? 'none' : 'block' }} dangerouslySetInnerHTML={content} />
</div>
);
} else {
return (
<div
className='status__content'
style={{ cursor: 'pointer' }}
onMouseDown={this.handleMouseDown}
onMouseUp={this.handleMouseUp}
dangerouslySetInnerHTML={content}
/>
);
}
},
});

View File

@ -155,7 +155,7 @@ const ComposeForm = React.createClass({
<div style={{ marginTop: '10px', overflow: 'hidden' }}>
<div style={{ float: 'right' }}><Button text={intl.formatMessage(messages.publish)} onClick={this.handleSubmit} disabled={disabled} /></div>
<div style={{ float: 'right', marginRight: '16px', lineHeight: '36px' }}><CharacterCounter max={500} text={this.props.spoiler ? (this.props.spoiler_text + "\n" + this.props.text) : this.props.text} /></div>
<div style={{ float: 'right', marginRight: '16px', lineHeight: '36px' }}><CharacterCounter max={500} text={[this.props.spoiler_text, this.props.text].join('')} /></div>
<UploadButtonContainer style={{ paddingTop: '4px' }} />
</div>

View File

@ -12,7 +12,8 @@ const UploadForm = React.createClass({
propTypes: {
media: ImmutablePropTypes.list.isRequired,
is_uploading: React.PropTypes.bool,
onRemoveFile: React.PropTypes.func.isRequired
onRemoveFile: React.PropTypes.func.isRequired,
intl: React.PropTypes.object.isRequired
},
mixins: [PureRenderMixin],

View File

@ -96,68 +96,68 @@ const insertSuggestion = (state, position, token, completion) => {
export default function compose(state = initialState, action) {
switch(action.type) {
case STORE_HYDRATE:
return state.merge(action.state.get('compose'));
case COMPOSE_MOUNT:
return state.set('mounted', true);
case COMPOSE_UNMOUNT:
return state.set('mounted', false);
case COMPOSE_SENSITIVITY_CHANGE:
return state.set('sensitive', action.checked);
case COMPOSE_SPOILERNESS_CHANGE:
return state.set('spoiler', action.checked);
case COMPOSE_SPOILER_TEXT_CHANGE:
return state.set('spoiler_text', action.text);
case COMPOSE_VISIBILITY_CHANGE:
return state.set('private', action.checked);
case COMPOSE_LISTABILITY_CHANGE:
return state.set('unlisted', action.checked);
case COMPOSE_CHANGE:
return state.set('text', action.text);
case COMPOSE_REPLY:
return state.withMutations(map => {
map.set('in_reply_to', action.status.get('id'));
map.set('text', statusToTextMentions(state, action.status));
});
case COMPOSE_REPLY_CANCEL:
return state.withMutations(map => {
map.set('in_reply_to', null);
map.set('text', '');
});
case COMPOSE_SUBMIT_REQUEST:
return state.set('is_submitting', true);
case COMPOSE_SUBMIT_SUCCESS:
return clearAll(state);
case COMPOSE_SUBMIT_FAIL:
return state.set('is_submitting', false);
case COMPOSE_UPLOAD_REQUEST:
return state.withMutations(map => {
map.set('is_uploading', true);
map.set('fileDropDate', new Date());
});
case COMPOSE_UPLOAD_SUCCESS:
return appendMedia(state, Immutable.fromJS(action.media));
case COMPOSE_UPLOAD_FAIL:
return state.set('is_uploading', false);
case COMPOSE_UPLOAD_UNDO:
return removeMedia(state, action.media_id);
case COMPOSE_UPLOAD_PROGRESS:
return state.set('progress', Math.round((action.loaded / action.total) * 100));
case COMPOSE_MENTION:
return state.update('text', text => `${text}@${action.account.get('acct')} `);
case COMPOSE_SUGGESTIONS_CLEAR:
return state.update('suggestions', Immutable.List(), list => list.clear()).set('suggestion_token', null);
case COMPOSE_SUGGESTIONS_READY:
return state.set('suggestions', Immutable.List(action.accounts.map(item => item.id))).set('suggestion_token', action.token);
case COMPOSE_SUGGESTION_SELECT:
return insertSuggestion(state, action.position, action.token, action.completion);
case TIMELINE_DELETE:
if (action.id === state.get('in_reply_to')) {
return state.set('in_reply_to', null);
} else {
return state;
}
default:
case STORE_HYDRATE:
return state.merge(action.state.get('compose'));
case COMPOSE_MOUNT:
return state.set('mounted', true);
case COMPOSE_UNMOUNT:
return state.set('mounted', false);
case COMPOSE_SENSITIVITY_CHANGE:
return state.set('sensitive', action.checked);
case COMPOSE_SPOILERNESS_CHANGE:
return (action.checked ? state : state.set('spoiler_text', '')).set('spoiler', action.checked);
case COMPOSE_SPOILER_TEXT_CHANGE:
return state.set('spoiler_text', action.text);
case COMPOSE_VISIBILITY_CHANGE:
return state.set('private', action.checked);
case COMPOSE_LISTABILITY_CHANGE:
return state.set('unlisted', action.checked);
case COMPOSE_CHANGE:
return state.set('text', action.text);
case COMPOSE_REPLY:
return state.withMutations(map => {
map.set('in_reply_to', action.status.get('id'));
map.set('text', statusToTextMentions(state, action.status));
});
case COMPOSE_REPLY_CANCEL:
return state.withMutations(map => {
map.set('in_reply_to', null);
map.set('text', '');
});
case COMPOSE_SUBMIT_REQUEST:
return state.set('is_submitting', true);
case COMPOSE_SUBMIT_SUCCESS:
return clearAll(state);
case COMPOSE_SUBMIT_FAIL:
return state.set('is_submitting', false);
case COMPOSE_UPLOAD_REQUEST:
return state.withMutations(map => {
map.set('is_uploading', true);
map.set('fileDropDate', new Date());
});
case COMPOSE_UPLOAD_SUCCESS:
return appendMedia(state, Immutable.fromJS(action.media));
case COMPOSE_UPLOAD_FAIL:
return state.set('is_uploading', false);
case COMPOSE_UPLOAD_UNDO:
return removeMedia(state, action.media_id);
case COMPOSE_UPLOAD_PROGRESS:
return state.set('progress', Math.round((action.loaded / action.total) * 100));
case COMPOSE_MENTION:
return state.update('text', text => `${text}@${action.account.get('acct')} `);
case COMPOSE_SUGGESTIONS_CLEAR:
return state.update('suggestions', Immutable.List(), list => list.clear()).set('suggestion_token', null);
case COMPOSE_SUGGESTIONS_READY:
return state.set('suggestions', Immutable.List(action.accounts.map(item => item.id))).set('suggestion_token', action.token);
case COMPOSE_SUGGESTION_SELECT:
return insertSuggestion(state, action.position, action.token, action.completion);
case TIMELINE_DELETE:
if (action.id === state.get('in_reply_to')) {
return state.set('in_reply_to', null);
} else {
return state;
}
default:
return state;
}
};

View File

@ -14,16 +14,6 @@ $(() => {
}
});
$.each($('.spoiler'), (_, content) => {
$(content).on('click', e => {
var hasClass = $(content).hasClass('spoiler-on');
if (hasClass || e.target === content) {
e.preventDefault();
$(content).siblings(".spoiler").andSelf().toggleClass('spoiler-on', !hasClass);
}
});
});
$('.media-spoiler').on('click', e => {
$(e.target).hide();
});