/g, '\n\n'); + + const quote_emojiMap = makeEmojiMap(normalStatus.quote); + + const quote_account_emojiMap = makeEmojiMap(status.quote.account); + const displayName = normalStatus.quote.account.display_name.length === 0 ? normalStatus.quote.account.username : normalStatus.quote.account.display_name; + normalStatus.quote.account.display_name_html = emojify(escapeTextContentForBrowser(displayName), quote_account_emojiMap); + normalStatus.quote.search_index = domParser.parseFromString(quote_searchContent, 'text/html').documentElement.textContent; + let docElem = domParser.parseFromString(normalStatus.quote.content, 'text/html').documentElement; + Array.from(docElem.querySelectorAll('p,br'), line => { + let parentNode = line.parentNode; + if (line.nextSibling) { + parentNode.insertBefore(document.createTextNode(' '), line.nextSibling); + } + }); + let _contentHtml = docElem.textContent; + normalStatus.quote.contentHtml = '
'+emojify(_contentHtml.substr(0, 150), quote_emojiMap) + (_contentHtml.substr(150) ? '...' : '')+'
'; + normalStatus.quote.spoilerHtml = emojify(escapeTextContentForBrowser(quote_spoilerText), quote_emojiMap); + normalStatus.quote_hidden = expandSpoilers ? false : quote_spoilerText.length > 0 || normalStatus.quote.sensitive; + } } return normalStatus; diff --git a/app/javascript/mastodon/actions/statuses.js b/app/javascript/mastodon/actions/statuses.js index adc24eabf..77edd45d7 100644 --- a/app/javascript/mastodon/actions/statuses.js +++ b/app/javascript/mastodon/actions/statuses.js @@ -30,6 +30,9 @@ export const STATUS_COLLAPSE = 'STATUS_COLLAPSE'; export const REDRAFT = 'REDRAFT'; +export const QUOTE_REVEAL = 'QUOTE_REVEAL'; +export const QUOTE_HIDE = 'QUOTE_HIDE'; + export const STATUS_FETCH_SOURCE_REQUEST = 'STATUS_FETCH_SOURCE_REQUEST'; export const STATUS_FETCH_SOURCE_SUCCESS = 'STATUS_FETCH_SOURCE_SUCCESS'; export const STATUS_FETCH_SOURCE_FAIL = 'STATUS_FETCH_SOURCE_FAIL'; @@ -310,3 +313,25 @@ export function toggleStatusCollapse(id, isCollapsed) { isCollapsed, }; } + +export function hideQuote(ids) { + if (!Array.isArray(ids)) { + ids = [ids]; + } + + return { + type: QUOTE_HIDE, + ids, + }; +}; + +export function revealQuote(ids) { + if (!Array.isArray(ids)) { + ids = [ids]; + } + + return { + type: QUOTE_REVEAL, + ids, + }; +}; diff --git a/app/javascript/mastodon/actions/timelines.js b/app/javascript/mastodon/actions/timelines.js index 44fedd5c2..87f2b3cf9 100644 --- a/app/javascript/mastodon/actions/timelines.js +++ b/app/javascript/mastodon/actions/timelines.js @@ -1,9 +1,11 @@ +import { fetchRelationships } from './accounts'; import { importFetchedStatus, importFetchedStatuses } from './importer'; import { submitMarkers } from './markers'; import api, { getLinks } from 'mastodon/api'; import { Map as ImmutableMap, List as ImmutableList } from 'immutable'; import compareId from 'mastodon/compare_id'; import { usePendingItems as preferPendingItems } from 'mastodon/initial_state'; +import { uniq } from '../utils/uniq'; export const TIMELINE_UPDATE = 'TIMELINE_UPDATE'; export const TIMELINE_DELETE = 'TIMELINE_DELETE'; @@ -39,6 +41,7 @@ export function updateTimeline(timeline, status, accept) { } dispatch(importFetchedStatus(status)); + dispatch(fetchRelationships([status.reblog ? status.reblog.account.id : status.account.id, status.quote ? status.quote.account.id : null].filter(function(e){return e}))); dispatch({ type: TIMELINE_UPDATE, @@ -111,6 +114,7 @@ export function expandTimeline(timelineId, path, params = {}, done = noOp) { api(getState).get(path, { params }).then(response => { const next = getLinks(response).refs.find(link => link.rel === 'next'); dispatch(importFetchedStatuses(response.data)); + dispatch(fetchRelationships(uniq(response.data.map(item => item.reblog ? item.reblog.account.id : item.account.id).concat(response.data.map(item => item.quote ? item.quote.account.id : null)).filter(function(e){return e})))); dispatch(expandTimelineSuccess(timelineId, response.data, next ? next.uri : null, response.status === 206, isLoadingRecent, isLoadingMore, isLoadingRecent && preferPendingItems)); if (timelineId === 'home') { diff --git a/app/javascript/mastodon/components/announcement_icon_button.js b/app/javascript/mastodon/components/announcement_icon_button.js new file mode 100644 index 000000000..0de58c6f7 --- /dev/null +++ b/app/javascript/mastodon/components/announcement_icon_button.js @@ -0,0 +1,90 @@ +import React from 'react'; +import Motion from 'react-motion/lib/Motion'; +import spring from 'react-motion/lib/spring'; +import PropTypes from 'prop-types'; + +class IconButton extends React.PureComponent { + + static propTypes = { + className: PropTypes.string, + title: PropTypes.string.isRequired, + icon: PropTypes.string.isRequired, + onClick: PropTypes.func, + size: PropTypes.number, + active: PropTypes.bool, + style: PropTypes.object, + activeStyle: PropTypes.object, + disabled: PropTypes.bool, + inverted: PropTypes.bool, + animate: PropTypes.bool, + overlay: PropTypes.bool, + }; + + static defaultProps = { + size: 18, + active: false, + disabled: false, + animate: false, + overlay: false, + }; + + handleClick = (e) => { + e.preventDefault(); + + if (!this.props.disabled) { + this.props.onClick(e); + } + } + + render () { + const style = { + fontSize: `${this.props.size}px`, + width: `${this.props.size * 1.28571429}px`, + height: `${this.props.size * 1.28571429}px`, + lineHeight: `${this.props.size}px`, + ...this.props.style, + ...(this.props.active ? this.props.activeStyle : {}), + }; + + const classes = ['icon-button']; + + if (this.props.active) { + classes.push('active'); + } + + if (this.props.disabled) { + classes.push('disabled'); + } + + if (this.props.inverted) { + classes.push('inverted'); + } + + if (this.props.overlay) { + classes.push('overlayed'); + } + + if (this.props.className) { + classes.push(this.props.className); + } + + return ( +
+
+ );
+ } else if (quote_status.get('visibility') === 'unlisted' && !!contextType && ['public', 'community', 'hashtag'].includes(contextType.split(':', 2)[0])) {
+ quote = (
+
+
+
+
+ );
+ } else {
+ quote = (
+
+
+
+
+
+ );
+ }
+ } else if (quote_muted) {
+ quote = (
+
+
+
+
+
+ );
+ }
+
return (
+
+
@@ -498,6 +686,7 @@ class Status extends ImmutablePureComponent {
@@ -231,7 +252,7 @@ export default class StatusContent extends React.PureComponent {
- {!!status.get('poll') &&
,
@@ -247,7 +268,7 @@ export default class StatusContent extends React.PureComponent {
- {!!status.get('poll') &&
diff --git a/app/javascript/mastodon/containers/status_container.js b/app/javascript/mastodon/containers/status_container.js
index ef0aca13a..de7bd0b93 100644
--- a/app/javascript/mastodon/containers/status_container.js
+++ b/app/javascript/mastodon/containers/status_container.js
@@ -4,6 +4,7 @@ import Status from '../components/status';
import { makeGetStatus, makeGetPictureInPicture } from '../selectors';
import {
replyCompose,
+ quoteCompose,
mentionCompose,
directCompose,
} from '../actions/compose';
@@ -24,6 +25,8 @@ import {
hideStatus,
revealStatus,
toggleStatusCollapse,
+ hideQuote,
+ revealQuote,
editStatus,
} from '../actions/statuses';
import {
@@ -51,6 +54,8 @@ const messages = defineMessages({
redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? Favourites and boosts will be lost, and replies to the original post will be orphaned.' },
replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
+ quoteConfirm: { id: 'confirmations.quote.confirm', defaultMessage: 'Quote' },
+ quoteMessage: { id: 'confirmations.quote.message', defaultMessage: 'Quoting now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
blockDomainConfirm: { id: 'confirmations.domain_block.confirm', defaultMessage: 'Hide entire domain' },
});
@@ -100,6 +105,22 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
}
},
+ onQuote (status, router) {
+ dispatch((_, getState) => {
+ let state = getState();
+
+ if (state.getIn(['compose', 'text']).trim().length !== 0) {
+ dispatch(openModal('CONFIRM', {
+ message: intl.formatMessage(messages.quoteMessage),
+ confirm: intl.formatMessage(messages.quoteConfirm),
+ onConfirm: () => dispatch(quoteCompose(status, router)),
+ }));
+ } else {
+ dispatch(quoteCompose(status, router));
+ }
+ });
+ },
+
onFavourite (status) {
if (status.get('favourited')) {
dispatch(unfavourite(status));
@@ -220,6 +241,14 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
dispatch(deployPictureInPicture(status.get('id'), status.getIn(['account', 'id']), type, mediaProps));
},
+ onQuoteToggleHidden (status) {
+ if (status.get('quote_hidden')) {
+ dispatch(revealQuote(status.get('id')));
+ } else {
+ dispatch(hideQuote(status.get('id')));
+ }
+ },
+
});
export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(Status));
diff --git a/app/javascript/mastodon/containers/timeline_container.js b/app/javascript/mastodon/containers/timeline_container.js
index ed8095f90..768169458 100644
--- a/app/javascript/mastodon/containers/timeline_container.js
+++ b/app/javascript/mastodon/containers/timeline_container.js
@@ -47,7 +47,9 @@ export default class TimelineContainer extends React.PureComponent {
+ {timeline}
+
{ReactDOM.createPortal(
+ {children}
+
+ }
+ -
+
-
+
+ +++{ this.nl2br(intl.formatMessage(messages.markdown, { domain: document.title }))}
+
+
+ (半角)は半角スペースを入力する必要がある場所です。(半角)だけの列は半角スペースのみが入力された列が必要であるを指します。
+ 〜〜〜〜〜〜見出し〜〜〜〜〜〜
+ #(半角)見出しテキスト
+ #は1〜6個重ねることができます。
+ 〜〜〜〜コードブロック〜〜〜〜
+ `コード`
+ 〜〜〜〜〜〜引用〜〜〜〜〜〜
+ >引用文
+ (半角)
+ ここから先は引用が切れます
+ 引用は複数回重ねることが可能です。
+ 〜〜〜〜〜〜リスト〜〜〜〜〜〜
+ (半角)
+ +(半角)内容1
+ +(半角)内容2
+ (半角)
+ 内容の数に制限はありません。
+ 投稿トップにリストを持ってくる場合に限り1行目の(半角)は必要ありません。
+ +(半角)を1.(半角)に置き換えることで数字付きリストになります。
+ 〜〜〜〜〜上付き文字〜〜〜〜〜
+ _上付き文字_
+ 〜〜〜〜〜下付き文字〜〜〜〜〜
+ __下付き文字__
+ 〜〜〜〜〜小さい文字〜〜〜〜〜
+ ___小さい文字___
+ 〜〜〜〜〜取り消し線〜〜〜〜〜
+ ~~取り消したい文字列~~
+ 〜〜〜〜〜〜横罫線〜〜〜〜〜〜
+ ___
+ 〜〜〜〜〜〜リンク〜〜〜〜〜〜
+ [リンク文章](https://・・・)
+ 〜〜〜〜〜〜画像〜〜〜〜〜〜
+ 
+ リンク、画像ともにURLにはhttps://から始まる物のみご利用可能です。 +++this.onClick('markdown', this.state)} size={20} animate active={this.state.showId === 'markdown'} /> +
+
-
+
+
);
diff --git a/app/javascript/mastodon/features/compose/components/quote_indicator.js b/app/javascript/mastodon/features/compose/components/quote_indicator.js
new file mode 100644
index 000000000..1d4c6a341
--- /dev/null
+++ b/app/javascript/mastodon/features/compose/components/quote_indicator.js
@@ -0,0 +1,71 @@
+import React from 'react';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import PropTypes from 'prop-types';
+import Avatar from '../../../components/avatar';
+import IconButton from '../../../components/icon_button';
+import DisplayName from '../../../components/display_name';
+import { defineMessages, injectIntl } from 'react-intl';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import AttachmentList from 'mastodon/components/attachment_list';
+
+const messages = defineMessages({
+ cancel: { id: 'quote_indicator.cancel', defaultMessage: 'Cancel' },
+});
+
+export default @injectIntl
+class QuoteIndicator extends ImmutablePureComponent {
+
+ static contextTypes = {
+ router: PropTypes.object,
+ };
+
+ static propTypes = {
+ status: ImmutablePropTypes.map,
+ onCancel: PropTypes.func.isRequired,
+ intl: PropTypes.object.isRequired,
+ };
+
+ handleClick = () => {
+ this.props.onCancel();
+ }
+
+ handleAccountClick = (e) => {
+ if (e.button === 0 && !(e.ctrlKey || e.metaKey)) {
+ e.preventDefault();
+ this.context.router.history.push(`/accounts/${this.props.status.getIn(['account', 'id'])}`);
+ }
+ }
+
+ render () {
+ const { status, intl } = this.props;
+
+ if (!status) {
+ return null;
+ }
+
+ const content = { __html: status.get('contentHtml') };
+
+ return (
+
+
+ );
+ }
+
+}
diff --git a/app/javascript/mastodon/features/compose/components/user_counter.js b/app/javascript/mastodon/features/compose/components/user_counter.js
new file mode 100644
index 000000000..e49d2f1a8
--- /dev/null
+++ b/app/javascript/mastodon/features/compose/components/user_counter.js
@@ -0,0 +1,10 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+export default class UserCounter extends React.PureComponent {
+ render () {
+ return (
+ 10人
+ );
+ }
+}
diff --git a/app/javascript/mastodon/features/compose/containers/announcements_container.js b/app/javascript/mastodon/features/compose/containers/announcements_container.js
new file mode 100644
index 000000000..e1dbb29b9
--- /dev/null
+++ b/app/javascript/mastodon/features/compose/containers/announcements_container.js
@@ -0,0 +1,11 @@
+import { connect } from 'react-redux';
+import Announcements from '../components/announcements';
+
+const mapStateToProps = state => {
+ return {
+ homeSize: state.getIn(['timelines', 'home', 'items']).size,
+ isLoading: state.getIn(['timelines', 'home', 'isLoading']),
+ };
+};
+
+export default connect(mapStateToProps)(Announcements);
diff --git a/app/javascript/mastodon/features/compose/containers/compose_form_container.js b/app/javascript/mastodon/features/compose/containers/compose_form_container.js
index 1be7633cc..bd2b3998e 100644
--- a/app/javascript/mastodon/features/compose/containers/compose_form_container.js
+++ b/app/javascript/mastodon/features/compose/containers/compose_form_container.js
@@ -11,6 +11,11 @@ import {
uploadCompose,
} from '../../../actions/compose';
+import {
+ submitGoji,
+ submitHarukin
+} from '../../../actions/UtilBtns';
+
const mapStateToProps = state => ({
text: state.getIn(['compose', 'text']),
suggestions: state.getIn(['compose', 'suggestions']),
@@ -62,6 +67,14 @@ const mapDispatchToProps = (dispatch) => ({
onPickEmoji (position, data, needsSpace) {
dispatch(insertEmojiCompose(position, data, needsSpace));
},
+
+ onGojiSubmit (textarea) {
+ dispatch(submitGoji(textarea));
+ },
+
+ onHarukinSubmit (textarea) {
+ dispatch(submitHarukin(textarea));
+ },
});
diff --git a/app/javascript/mastodon/features/compose/containers/quote_indicator_container.js b/app/javascript/mastodon/features/compose/containers/quote_indicator_container.js
new file mode 100644
index 000000000..8a3ad4959
--- /dev/null
+++ b/app/javascript/mastodon/features/compose/containers/quote_indicator_container.js
@@ -0,0 +1,24 @@
+import { connect } from 'react-redux';
+import { cancelQuoteCompose } from '../../../actions/compose';
+import { makeGetStatus } from '../../../selectors';
+import QuoteIndicator from '../components/quote_indicator';
+
+const makeMapStateToProps = () => {
+ const getStatus = makeGetStatus();
+
+ const mapStateToProps = state => ({
+ status: getStatus(state, { id: state.getIn(['compose', 'quote_from']) }),
+ });
+
+ return mapStateToProps;
+};
+
+const mapDispatchToProps = dispatch => ({
+
+ onCancel () {
+ dispatch(cancelQuoteCompose());
+ },
+
+});
+
+export default connect(makeMapStateToProps, mapDispatchToProps)(QuoteIndicator);
diff --git a/app/javascript/mastodon/features/compose/index.js b/app/javascript/mastodon/features/compose/index.js
index 711a55904..c7da412eb 100644
--- a/app/javascript/mastodon/features/compose/index.js
+++ b/app/javascript/mastodon/features/compose/index.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { Fragment } from 'react';
import ComposeFormContainer from './containers/compose_form_container';
import NavigationContainer from './containers/navigation_container';
import PropTypes from 'prop-types';
@@ -14,16 +14,28 @@ import SearchResultsContainer from './containers/search_results_container';
import { changeComposing } from '../../actions/compose';
import { openModal } from 'mastodon/actions/modal';
import elephantUIPlane from '../../../images/elephant_ui_plane.svg';
-import { mascot } from '../../initial_state';
+import { mascot, show_tab_bar_label } from '../../initial_state';
import Icon from 'mastodon/components/icon';
import { logOut } from 'mastodon/utils/log_out';
+import AnnouncementsContainer from './containers/announcements_container';
+import NotificationsCounterIcon from '../ui/components/notifications_counter_icon';
+import classNames from 'classnames';
const messages = defineMessages({
+ short_start: { id: 'navigation_bar.short.getting_started', defaultMessage: 'Started' },
+ short_home_timeline: { id: 'navigation_bar.short.home', defaultMessage: 'Home' },
+ short_notifications: { id: 'navigation_bar.short.notifications', defaultMessage: 'Notif.' },
+ short_public: { id: 'navigation_bar.short.public_timeline', defaultMessage: 'FTL' },
+ short_community: { id: 'navigation_bar.short.community_timeline', defaultMessage: 'LTL' },
+ short_lists: { id: 'navigation_bar.short.lists', defaultMessage: 'Lists' },
+ short_preferences: { id: 'navigation_bar.short.preferences', defaultMessage: 'Pref.' },
+ short_logout: { id: 'navigation_bar.short.logout', defaultMessage: 'Logout' },
start: { id: 'getting_started.heading', defaultMessage: 'Getting started' },
home_timeline: { id: 'tabs_bar.home', defaultMessage: 'Home' },
notifications: { id: 'tabs_bar.notifications', defaultMessage: 'Notifications' },
public: { id: 'navigation_bar.public_timeline', defaultMessage: 'Federated timeline' },
community: { id: 'navigation_bar.community_timeline', defaultMessage: 'Local timeline' },
+ lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' },
preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
logout: { id: 'navigation_bar.logout', defaultMessage: 'Logout' },
compose: { id: 'navigation_bar.compose', defaultMessage: 'Compose new post' },
@@ -89,30 +101,54 @@ class Compose extends React.PureComponent {
this.props.dispatch(changeComposing(false));
}
+ tab (id) {
+ const { columns, intl: { formatMessage } } = this.props;
+
+ if (!columns.some(column => column.get('id') === id)) {
+ const tabParams = {
+ 'START': { to: '/getting-started', title: formatMessage(messages.start), label: formatMessage(messages.short_start), icon_id: 'bars' },
+ 'HOME': { to: '/timelines/home', title: formatMessage(messages.home_timeline), label: formatMessage(messages.short_home_timeline), icon_id: 'home' },
+ 'NOTIFICATIONS': { to: '/notifications', title: formatMessage(messages.notifications), label: formatMessage(messages.short_notifications), icon_id: 'bell' },
+ 'COMMUNITY': { to: '/timelines/public/local', title: formatMessage(messages.community), label: formatMessage(messages.short_community), icon_id: 'users' },
+ 'PUBLIC': { to: '/timelines/public', title: formatMessage(messages.public), label: formatMessage(messages.short_public), icon_id: 'globe' },
+ 'LIST': { to: '/lists', title: formatMessage(messages.lists), label: formatMessage(messages.short_lists), icon_id: 'list-ul' },
+ 'PREFERENCES': { href: '/settings/preferences', title: formatMessage(messages.preferences), label: formatMessage(messages.short_preferences), icon_id: 'cog' },
+ 'SIGN_OUT': { href: '/auth/sign_out', title: formatMessage(messages.logout), label: formatMessage(messages.short_logout), icon_id: 'sign-out', method: 'delete' },
+ };
+
+ const { href, to, title, label, icon_id, method } = tabParams[id];
+
+ const icon = (id === 'NOTIFICATIONS') ?
+
+
+
+
+ {status.get('media_attachments').size > 0 && (
+
diff --git a/app/javascript/mastodon/features/status/components/detailed_status.js b/app/javascript/mastodon/features/status/components/detailed_status.js
index 13bce1b83..d0b01b1ca 100644
--- a/app/javascript/mastodon/features/status/components/detailed_status.js
+++ b/app/javascript/mastodon/features/status/components/detailed_status.js
@@ -1,4 +1,5 @@
import React from 'react';
+import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import Avatar from '../../../components/avatar';
@@ -6,7 +7,7 @@ import DisplayName from '../../../components/display_name';
import StatusContent from '../../../components/status_content';
import MediaGallery from '../../../components/media_gallery';
import { Link } from 'react-router-dom';
-import { injectIntl, defineMessages, FormattedDate } from 'react-intl';
+import { injectIntl, defineMessages, FormattedDate, FormattedMessage } from 'react-intl';
import Card from './card';
import ImmutablePureComponent from 'react-immutable-pure-component';
import Video from '../../video';
@@ -25,7 +26,31 @@ const messages = defineMessages({
direct_short: { id: 'privacy.direct.short', defaultMessage: 'Direct' },
});
-export default @injectIntl
+const mapStateToProps = (state, props) => {
+ let status = props.status;
+
+ if (status === null) {
+ return null;
+ }
+
+ if (status.get('reblog', null) !== null && typeof status.get('reblog') === 'object') {
+ status = status.get('reblog');
+ }
+
+ if (status.get('quote', null) === null) {
+ return {
+ quote_muted: status.get('quote_id', null) ? true : false,
+ };
+ }
+ const id = status.getIn(['quote', 'account', 'id'], null);
+
+ return {
+ quote_muted: id !== null && (state.getIn(['relationships', id, 'muting']) || state.getIn(['relationships', id, 'blocking']) || state.getIn(['relationships', id, 'blocked_by']) || state.getIn(['relationships', id, 'domain_blocking'])) || status.getIn(['quote', 'quote_muted']),
+ };
+};
+
+export default @connect(mapStateToProps)
+@injectIntl
class DetailedStatus extends ImmutablePureComponent {
static contextTypes = {
@@ -34,8 +59,11 @@ class DetailedStatus extends ImmutablePureComponent {
static propTypes = {
status: ImmutablePropTypes.map,
+ quote_muted: PropTypes.bool,
onOpenMedia: PropTypes.func.isRequired,
onOpenVideo: PropTypes.func.isRequired,
+ onOpenMediaQuote: PropTypes.func.isRequired,
+ onOpenVideoQuote: PropTypes.func.isRequired,
onToggleHidden: PropTypes.func.isRequired,
measureHeight: PropTypes.bool,
onHeightChange: PropTypes.func,
@@ -47,6 +75,9 @@ class DetailedStatus extends ImmutablePureComponent {
available: PropTypes.bool,
}),
onToggleMediaVisibility: PropTypes.func,
+ onQuoteToggleHidden: PropTypes.func.isRequired,
+ showQuoteMedia: PropTypes.bool,
+ onToggleQuoteMediaVisibility: PropTypes.func,
};
state = {
@@ -54,9 +85,10 @@ class DetailedStatus extends ImmutablePureComponent {
};
handleAccountClick = (e) => {
- if (e.button === 0 && !(e.ctrlKey || e.metaKey) && this.context.router) {
+ if (this.context.router && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
+ const id = e.currentTarget.getAttribute('data-id');
e.preventDefault();
- this.context.router.history.push(`/@${this.props.status.getIn(['account', 'acct'])}`);
+ this.context.router.history.push(`/accounts/${id}`);
}
e.stopPropagation();
@@ -66,6 +98,10 @@ class DetailedStatus extends ImmutablePureComponent {
this.props.onOpenVideo(this.props.status.getIn(['media_attachments', 0]), options);
}
+ handleOpenVideoQuote = (options) => {
+ this.props.onOpenVideoQuote(this.props.status.getIn(['quote', 'media_attachments', 0]), options);
+ }
+
handleExpandedToggle = () => {
this.props.onToggleHidden(this.props.status);
}
@@ -103,8 +139,22 @@ class DetailedStatus extends ImmutablePureComponent {
window.open(href, 'mastodon-intent', 'width=445,height=600,resizable=no,menubar=no,status=no,scrollbars=yes');
}
+ handleExpandedQuoteToggle = () => {
+ this.props.onQuoteToggleHidden(this.props.status);
+ }
+
+ handleQuoteClick = () => {
+ if (!this.context.router) {
+ return;
+ }
+
+ const { status } = this.props;
+ this.context.router.history.push(`/statuses/${status.getIn(['quote', 'id'])}`);
+ }
+
render () {
const status = (this.props.status && this.props.status.get('reblog')) ? this.props.status.get('reblog') : this.props.status;
+ const quote_muted = this.props.quote_muted
const outerStyle = { boxSizing: 'border-box' };
const { intl, compact, pictureInPicture } = this.props;
@@ -123,6 +173,95 @@ class DetailedStatus extends ImmutablePureComponent {
outerStyle.height = `${this.state.height}px`;
}
+ let quote = null;
+ if (status.get('quote', null) !== null) {
+ let quote_status = status.get('quote');
+
+ let quote_media = null;
+ if (quote_status.get('media_attachments').size > 0) {
+
+ if (quote_status.getIn(['media_attachments', 0, 'type']) === 'audio') {
+ const attachment = quote_status.getIn(['media_attachments', 0]);
+
+ quote_media = (
+
+ );
+ } else if (quote_status.getIn(['media_attachments', 0, 'type']) === 'video') {
+ const attachment = quote_status.getIn(['media_attachments', 0]);
+
+ quote_media = (
+
+ );
+ } else {
+ quote_media = (
+
+
+ );
+ } else {
+ quote = (
+
+
+
+
+
+ );
+ }
+ } else if (quote_muted) {
+ quote = (
+
+
+ );
+ }
+
if (pictureInPicture.get('inUse')) {
media =
+
+
diff --git a/app/javascript/mastodon/features/status/containers/detailed_status_container.js b/app/javascript/mastodon/features/status/containers/detailed_status_container.js
index bfed16620..8238f654d 100644
--- a/app/javascript/mastodon/features/status/containers/detailed_status_container.js
+++ b/app/javascript/mastodon/features/status/containers/detailed_status_container.js
@@ -20,6 +20,8 @@ import {
deleteStatus,
hideStatus,
revealStatus,
+ hideQuote,
+ revealQuote,
} from '../../../actions/statuses';
import { initMuteModal } from '../../../actions/mutes';
import { initBlockModal } from '../../../actions/blocks';
@@ -136,6 +138,14 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
dispatch(openModal('VIDEO', { media, options }));
},
+ onOpenMediaQuote (media, index) {
+ dispatch(openModal('MEDIA', { media, index }));
+ },
+
+ onOpenVideoQuote (media, options) {
+ dispatch(openModal('VIDEO', { media, options }));
+ },
+
onBlock (status) {
const account = status.get('account');
dispatch(initBlockModal(account));
@@ -165,6 +175,13 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
}
},
+ onQuoteToggleHidden (status) {
+ if (status.get('quote_hidden')) {
+ dispatch(revealQuote(status.get('id')));
+ } else {
+ dispatch(hideQuote(status.get('id')));
+ }
+ },
});
export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(DetailedStatus));
diff --git a/app/javascript/mastodon/features/status/index.js b/app/javascript/mastodon/features/status/index.js
index 4d7f24834..cc8403af5 100644
--- a/app/javascript/mastodon/features/status/index.js
+++ b/app/javascript/mastodon/features/status/index.js
@@ -22,6 +22,7 @@ import {
} from '../../actions/interactions';
import {
replyCompose,
+ quoteCompose,
mentionCompose,
directCompose,
} from '../../actions/compose';
@@ -32,6 +33,8 @@ import {
editStatus,
hideStatus,
revealStatus,
+ hideQuote,
+ revealQuote,
} from '../../actions/statuses';
import {
unblockAccount,
@@ -69,6 +72,8 @@ const messages = defineMessages({
detailedStatus: { id: 'status.detailed_status', defaultMessage: 'Detailed conversation view' },
replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
+ quoteConfirm: { id: 'confirmations.quote.confirm', defaultMessage: 'Quote' },
+ quoteMessage: { id: 'confirmations.quote.message', defaultMessage: 'Quoting now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
blockDomainConfirm: { id: 'confirmations.domain_block.confirm', defaultMessage: 'Hide entire domain' },
});
@@ -181,6 +186,7 @@ class Status extends ImmutablePureComponent {
state = {
fullscreen: false,
showMedia: defaultMediaVisibility(this.props.status),
+ showQuoteMedia: defaultMediaVisibility(this.props.status ? this.props.status.get('quote', null) : null),
loadedStatusId: undefined,
};
@@ -199,7 +205,8 @@ class Status extends ImmutablePureComponent {
}
if (nextProps.status && nextProps.status.get('id') !== this.state.loadedStatusId) {
- this.setState({ showMedia: defaultMediaVisibility(nextProps.status), loadedStatusId: nextProps.status.get('id') });
+ this.setState({ showMedia: defaultMediaVisibility(nextProps.status), loadedStatusId: nextProps.status.get('id'),
+ showQuoteMedia: defaultMediaVisibility(nextProps.status.get('quote', null)) });
}
}
@@ -207,6 +214,10 @@ class Status extends ImmutablePureComponent {
this.setState({ showMedia: !this.state.showMedia });
}
+ handleToggleQuoteMediaVisibility = () => {
+ this.setState({ showQuoteMedia: !this.state.showQuoteMedia });
+ }
+
handleFavouriteClick = (status) => {
if (status.get('favourited')) {
this.props.dispatch(unfavourite(status));
@@ -260,6 +271,19 @@ class Status extends ImmutablePureComponent {
}
}
+ handleQuoteClick = (status) => {
+ let { askReplyConfirmation, dispatch, intl } = this.props;
+ if (askReplyConfirmation) {
+ dispatch(openModal('CONFIRM', {
+ message: intl.formatMessage(messages.quoteMessage),
+ confirm: intl.formatMessage(messages.quoteConfirm),
+ onConfirm: () => dispatch(quoteCompose(status, this.context.router.history)),
+ }));
+ } else {
+ dispatch(quoteCompose(status, this.context.router.history));
+ }
+ }
+
handleDeleteClick = (status, history, withRedraft = false) => {
const { dispatch, intl } = this.props;
@@ -294,6 +318,14 @@ class Status extends ImmutablePureComponent {
this.props.dispatch(openModal('VIDEO', { statusId: this.props.status.get('id'), media, options }));
}
+ handleOpenMediaQuote = (media, index) => {
+ this.props.dispatch(openModal('MEDIA', { statusId: this.props.status.getIn(['quote', 'id']), media, index }));
+ }
+
+ handleOpenVideoQuote = (media, options) => {
+ this.props.dispatch(openModal('VIDEO', { statusId: this.props.status.getIn(['quote', 'id']), media, options }));
+ }
+
handleHotkeyOpenMedia = e => {
const { status } = this.props;
@@ -328,6 +360,14 @@ class Status extends ImmutablePureComponent {
}
}
+ handleQuoteToggleHidden = (status) => {
+ if (status.get('quote_hidden')) {
+ this.props.dispatch(revealQuote(status.get('id')));
+ } else {
+ this.props.dispatch(hideQuote(status.get('id')));
+ }
+ }
+
handleToggleAll = () => {
const { status, ancestorsIds, descendantsIds } = this.props;
const statusIds = [status.get('id')].concat(ancestorsIds.toJS(), descendantsIds.toJS());
@@ -557,11 +597,16 @@ class Status extends ImmutablePureComponent {
status={status}
onOpenVideo={this.handleOpenVideo}
onOpenMedia={this.handleOpenMedia}
+ onOpenVideoQuote={this.handleOpenVideoQuote}
+ onOpenMediaQuote={this.handleOpenMediaQuote}
onToggleHidden={this.handleToggleHidden}
domain={domain}
showMedia={this.state.showMedia}
onToggleMediaVisibility={this.handleToggleMediaVisibility}
pictureInPicture={pictureInPicture}
+ onQuoteToggleHidden={this.handleQuoteToggleHidden}
+ showQuoteMedia={this.state.showQuoteMedia}
+ onToggleQuoteMediaVisibility={this.handleToggleQuoteMediaVisibility}
/>
+
{links.map(this.renderView)}
) : (
-
{children}
+ {children}
);
return (
diff --git a/app/javascript/mastodon/features/ui/components/link_footer.js b/app/javascript/mastodon/features/ui/components/link_footer.js
index edf1104c4..78654a390 100644
--- a/app/javascript/mastodon/features/ui/components/link_footer.js
+++ b/app/javascript/mastodon/features/ui/components/link_footer.js
@@ -55,6 +55,7 @@ class LinkFooter extends React.PureComponent {
{profileDirectory &&
-