+
diff --git a/app/javascript/mastodon/features/compose/components/poll_button.js b/app/javascript/mastodon/features/compose/components/poll_button.js
new file mode 100644
index 000000000..76f96bfa4
--- /dev/null
+++ b/app/javascript/mastodon/features/compose/components/poll_button.js
@@ -0,0 +1,55 @@
+import React from 'react';
+import IconButton from '../../../components/icon_button';
+import PropTypes from 'prop-types';
+import { defineMessages, injectIntl } from 'react-intl';
+
+const messages = defineMessages({
+ add_poll: { id: 'poll_button.add_poll', defaultMessage: 'Add a poll' },
+ remove_poll: { id: 'poll_button.remove_poll', defaultMessage: 'Remove poll' },
+});
+
+const iconStyle = {
+ height: null,
+ lineHeight: '27px',
+};
+
+export default
+@injectIntl
+class PollButton extends React.PureComponent {
+
+ static propTypes = {
+ disabled: PropTypes.bool,
+ unavailable: PropTypes.bool,
+ active: PropTypes.bool,
+ onClick: PropTypes.func.isRequired,
+ intl: PropTypes.object.isRequired,
+ };
+
+ handleClick = () => {
+ this.props.onClick();
+ }
+
+ render () {
+ const { intl, active, unavailable, disabled } = this.props;
+
+ if (unavailable) {
+ return null;
+ }
+
+ return (
+
+
+
+ );
+ }
+
+}
diff --git a/app/javascript/mastodon/features/compose/components/poll_form.js b/app/javascript/mastodon/features/compose/components/poll_form.js
new file mode 100644
index 000000000..ff0062425
--- /dev/null
+++ b/app/javascript/mastodon/features/compose/components/poll_form.js
@@ -0,0 +1,121 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
+import IconButton from 'mastodon/components/icon_button';
+import Icon from 'mastodon/components/icon';
+import classNames from 'classnames';
+
+const messages = defineMessages({
+ option_placeholder: { id: 'compose_form.poll.option_placeholder', defaultMessage: 'Choice {number}' },
+ add_option: { id: 'compose_form.poll.add_option', defaultMessage: 'Add a choice' },
+ remove_option: { id: 'compose_form.poll.remove_option', defaultMessage: 'Remove this choice' },
+ poll_duration: { id: 'compose_form.poll.duration', defaultMessage: 'Poll duration' },
+ minutes: { id: 'intervals.full.minutes', defaultMessage: '{number, plural, one {# minute} other {# minutes}}' },
+ hours: { id: 'intervals.full.hours', defaultMessage: '{number, plural, one {# hour} other {# hours}}' },
+ days: { id: 'intervals.full.days', defaultMessage: '{number, plural, one {# day} other {# days}}' },
+});
+
+@injectIntl
+class Option extends React.PureComponent {
+
+ static propTypes = {
+ title: PropTypes.string.isRequired,
+ index: PropTypes.number.isRequired,
+ isPollMultiple: PropTypes.bool,
+ onChange: PropTypes.func.isRequired,
+ onRemove: PropTypes.func.isRequired,
+ intl: PropTypes.object.isRequired,
+ };
+
+ handleOptionTitleChange = e => {
+ this.props.onChange(this.props.index, e.target.value);
+ };
+
+ handleOptionRemove = () => {
+ this.props.onRemove(this.props.index);
+ };
+
+ render () {
+ const { isPollMultiple, title, index, intl } = this.props;
+
+ return (
+
+
+
+
+
+
+
+ );
+ }
+
+}
+
+export default
+@injectIntl
+class PollForm extends ImmutablePureComponent {
+
+ static propTypes = {
+ options: ImmutablePropTypes.list,
+ expiresIn: PropTypes.number,
+ isMultiple: PropTypes.bool,
+ onChangeOption: PropTypes.func.isRequired,
+ onAddOption: PropTypes.func.isRequired,
+ onRemoveOption: PropTypes.func.isRequired,
+ onChangeSettings: PropTypes.func.isRequired,
+ intl: PropTypes.object.isRequired,
+ };
+
+ handleAddOption = () => {
+ this.props.onAddOption('');
+ };
+
+ handleSelectDuration = e => {
+ this.props.onChangeSettings(e.target.value, this.props.isMultiple);
+ };
+
+ render () {
+ const { options, expiresIn, isMultiple, onChangeOption, onRemoveOption, intl } = this.props;
+
+ if (!options) {
+ return null;
+ }
+
+ return (
+
+
+ {options.map((title, i) => )}
+
+
+
+ {options.size < 4 && (
+
+ )}
+
+
+
+
+ );
+ }
+
+}
diff --git a/app/javascript/mastodon/features/compose/components/upload_button.js b/app/javascript/mastodon/features/compose/components/upload_button.js
index db55ad70b..90e2769f3 100644
--- a/app/javascript/mastodon/features/compose/components/upload_button.js
+++ b/app/javascript/mastodon/features/compose/components/upload_button.js
@@ -29,6 +29,7 @@ class UploadButton extends ImmutablePureComponent {
static propTypes = {
disabled: PropTypes.bool,
+ unavailable: PropTypes.bool,
onSelectFile: PropTypes.func.isRequired,
style: PropTypes.object,
resetFileKey: PropTypes.number,
@@ -51,8 +52,11 @@ class UploadButton extends ImmutablePureComponent {
}
render () {
+ const { intl, resetFileKey, unavailable, disabled, acceptContentTypes } = this.props;
- const { intl, resetFileKey, disabled, acceptContentTypes } = this.props;
+ if (unavailable) {
+ return null;
+ }
return (
diff --git a/app/javascript/mastodon/features/compose/containers/poll_button_container.js b/app/javascript/mastodon/features/compose/containers/poll_button_container.js
new file mode 100644
index 000000000..8f1cb7c10
--- /dev/null
+++ b/app/javascript/mastodon/features/compose/containers/poll_button_container.js
@@ -0,0 +1,24 @@
+import { connect } from 'react-redux';
+import PollButton from '../components/poll_button';
+import { addPoll, removePoll } from '../../../actions/compose';
+
+const mapStateToProps = state => ({
+ unavailable: state.getIn(['compose', 'is_uploading']) || (state.getIn(['compose', 'media_attachments']).size > 0),
+ active: state.getIn(['compose', 'poll']) !== null,
+});
+
+const mapDispatchToProps = dispatch => ({
+
+ onClick () {
+ dispatch((_, getState) => {
+ if (getState().getIn(['compose', 'poll'])) {
+ dispatch(removePoll());
+ } else {
+ dispatch(addPoll());
+ }
+ });
+ },
+
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(PollButton);
diff --git a/app/javascript/mastodon/features/compose/containers/poll_form_container.js b/app/javascript/mastodon/features/compose/containers/poll_form_container.js
new file mode 100644
index 000000000..da795a291
--- /dev/null
+++ b/app/javascript/mastodon/features/compose/containers/poll_form_container.js
@@ -0,0 +1,29 @@
+import { connect } from 'react-redux';
+import PollForm from '../components/poll_form';
+import { addPollOption, removePollOption, changePollOption, changePollSettings } from '../../../actions/compose';
+
+const mapStateToProps = state => ({
+ options: state.getIn(['compose', 'poll', 'options']),
+ expiresIn: state.getIn(['compose', 'poll', 'expires_in']),
+ isMultiple: state.getIn(['compose', 'poll', 'multiple']),
+});
+
+const mapDispatchToProps = dispatch => ({
+ onAddOption(title) {
+ dispatch(addPollOption(title));
+ },
+
+ onRemoveOption(index) {
+ dispatch(removePollOption(index));
+ },
+
+ onChangeOption(index, title) {
+ dispatch(changePollOption(index, title));
+ },
+
+ onChangeSettings(expiresIn, isMultiple) {
+ dispatch(changePollSettings(expiresIn, isMultiple));
+ },
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(PollForm);
diff --git a/app/javascript/mastodon/features/compose/containers/upload_button_container.js b/app/javascript/mastodon/features/compose/containers/upload_button_container.js
index 1f1d915bc..d8b8c4b6e 100644
--- a/app/javascript/mastodon/features/compose/containers/upload_button_container.js
+++ b/app/javascript/mastodon/features/compose/containers/upload_button_container.js
@@ -4,6 +4,7 @@ import { uploadCompose } from '../../../actions/compose';
const mapStateToProps = state => ({
disabled: state.getIn(['compose', 'is_uploading']) || (state.getIn(['compose', 'media_attachments']).size > 3 || state.getIn(['compose', 'media_attachments']).some(m => m.get('type') === 'video')),
+ unavailable: state.getIn(['compose', 'poll']) !== null,
resetFileKey: state.getIn(['compose', 'resetFileKey']),
});
diff --git a/app/javascript/mastodon/reducers/compose.js b/app/javascript/mastodon/reducers/compose.js
index 1622871b8..b45def281 100644
--- a/app/javascript/mastodon/reducers/compose.js
+++ b/app/javascript/mastodon/reducers/compose.js
@@ -29,6 +29,12 @@ import {
COMPOSE_UPLOAD_CHANGE_SUCCESS,
COMPOSE_UPLOAD_CHANGE_FAIL,
COMPOSE_RESET,
+ COMPOSE_POLL_ADD,
+ COMPOSE_POLL_REMOVE,
+ COMPOSE_POLL_OPTION_ADD,
+ COMPOSE_POLL_OPTION_CHANGE,
+ COMPOSE_POLL_OPTION_REMOVE,
+ COMPOSE_POLL_SETTINGS_CHANGE,
} from '../actions/compose';
import { TIMELINE_DELETE } from '../actions/timelines';
import { STORE_HYDRATE } from '../actions/store';
@@ -55,6 +61,7 @@ const initialState = ImmutableMap({
is_uploading: false,
progress: 0,
media_attachments: ImmutableList(),
+ poll: null,
suggestion_token: null,
suggestions: ImmutableList(),
default_privacy: 'public',
@@ -64,6 +71,12 @@ const initialState = ImmutableMap({
tagHistory: ImmutableList(),
});
+const initialPoll = ImmutableMap({
+ options: ImmutableList(['', '']),
+ expires_in: 24 * 3600,
+ multiple: false,
+});
+
function statusToTextMentions(state, status) {
let set = ImmutableOrderedSet([]);
@@ -85,6 +98,7 @@ function clearAll(state) {
map.set('privacy', state.get('default_privacy'));
map.set('sensitive', false);
map.update('media_attachments', list => list.clear());
+ map.set('poll', null);
map.set('idempotencyKey', uuid());
});
};
@@ -247,6 +261,7 @@ export default function compose(state = initialState, action) {
map.set('spoiler', false);
map.set('spoiler_text', '');
map.set('privacy', state.get('default_privacy'));
+ map.set('poll', null);
map.set('idempotencyKey', uuid());
});
case COMPOSE_SUBMIT_REQUEST:
@@ -329,7 +344,27 @@ export default function compose(state = initialState, action) {
map.set('spoiler', false);
map.set('spoiler_text', '');
}
+
+ if (action.status.get('poll')) {
+ map.set('poll', ImmutableMap({
+ options: action.status.getIn(['poll', 'options']).map(x => x.get('title')),
+ multiple: action.status.getIn(['poll', 'multiple']),
+ expires_in: 24 * 3600,
+ }));
+ }
});
+ case COMPOSE_POLL_ADD:
+ return state.set('poll', initialPoll);
+ case COMPOSE_POLL_REMOVE:
+ return state.set('poll', null);
+ case COMPOSE_POLL_OPTION_ADD:
+ return state.updateIn(['poll', 'options'], options => options.push(action.title));
+ case COMPOSE_POLL_OPTION_CHANGE:
+ return state.setIn(['poll', 'options', action.index], action.title);
+ case COMPOSE_POLL_OPTION_REMOVE:
+ return state.updateIn(['poll', 'options'], options => options.delete(action.index));
+ case COMPOSE_POLL_SETTINGS_CHANGE:
+ return state.update('poll', poll => poll.set('expires_in', action.expiresIn).set('multiple', action.isMultiple));
default:
return state;
}
diff --git a/app/javascript/mastodon/reducers/polls.js b/app/javascript/mastodon/reducers/polls.js
index 53d9b1d8c..9956cf83f 100644
--- a/app/javascript/mastodon/reducers/polls.js
+++ b/app/javascript/mastodon/reducers/polls.js
@@ -1,4 +1,3 @@
-import { POLL_VOTE_SUCCESS, POLL_FETCH_SUCCESS } from 'mastodon/actions/polls';
import { POLLS_IMPORT } from 'mastodon/actions/importer';
import { Map as ImmutableMap, fromJS } from 'immutable';
@@ -10,9 +9,6 @@ export default function polls(state = initialState, action) {
switch(action.type) {
case POLLS_IMPORT:
return importPolls(state, action.polls);
- case POLL_VOTE_SUCCESS:
- case POLL_FETCH_SUCCESS:
- return importPolls(state, [action.poll]);
default:
return state;
}
diff --git a/app/javascript/styles/mastodon/polls.scss b/app/javascript/styles/mastodon/polls.scss
index 7c6e61d63..4f8c94d83 100644
--- a/app/javascript/styles/mastodon/polls.scss
+++ b/app/javascript/styles/mastodon/polls.scss
@@ -5,6 +5,7 @@
li {
margin-bottom: 10px;
position: relative;
+ height: 18px + 12px;
}
&__chart {
@@ -27,15 +28,43 @@
padding: 6px 0;
line-height: 18px;
cursor: default;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
input[type=radio],
input[type=checkbox] {
display: none;
}
+ input[type=text] {
+ display: block;
+ box-sizing: border-box;
+ flex: 1 1 auto;
+ width: 20px;
+ font-size: 14px;
+ color: $inverted-text-color;
+ display: block;
+ outline: 0;
+ font-family: inherit;
+ background: $simple-background-color;
+ border: 1px solid darken($simple-background-color, 14%);
+ border-radius: 4px;
+ padding: 6px 10px;
+
+ &:focus {
+ border-color: $highlight-text-color;
+ }
+ }
+
&.selectable {
cursor: pointer;
}
+
+ &.editable {
+ display: flex;
+ align-items: center;
+ }
}
&__input {
@@ -45,6 +74,7 @@
box-sizing: border-box;
width: 18px;
height: 18px;
+ flex: 0 0 auto;
margin-right: 10px;
top: -1px;
border-radius: 50%;
@@ -98,3 +128,65 @@
font-size: 14px;
}
}
+
+.compose-form__poll-wrapper {
+ border-top: 1px solid darken($simple-background-color, 8%);
+
+ ul {
+ padding: 10px;
+ }
+
+ .poll__footer {
+ border-top: 1px solid darken($simple-background-color, 8%);
+ padding: 10px;
+ display: flex;
+ align-items: center;
+
+ button,
+ select {
+ flex: 1 1 50%;
+ }
+ }
+
+ .button.button-secondary {
+ font-size: 14px;
+ font-weight: 400;
+ padding: 6px 10px;
+ height: auto;
+ line-height: inherit;
+ color: $action-button-color;
+ border-color: $action-button-color;
+ margin-right: 5px;
+ }
+
+ li {
+ display: flex;
+ align-items: center;
+
+ .poll__text {
+ flex: 0 0 auto;
+ width: calc(100% - (23px + 6px));
+ margin-right: 6px;
+ }
+ }
+
+ select {
+ appearance: none;
+ box-sizing: border-box;
+ font-size: 14px;
+ color: $inverted-text-color;
+ display: inline-block;
+ width: auto;
+ outline: 0;
+ font-family: inherit;
+ background: $simple-background-color url("data:image/svg+xml;utf8,
") no-repeat right 8px center / auto 16px;
+ border: 1px solid darken($simple-background-color, 14%);
+ border-radius: 4px;
+ padding: 6px 10px;
+ padding-right: 30px;
+ }
+
+ .icon-button.disabled {
+ color: darken($simple-background-color, 14%);
+ }
+}
diff --git a/app/validators/poll_validator.rb b/app/validators/poll_validator.rb
index d4ae4c16a..fd497c8d0 100644
--- a/app/validators/poll_validator.rb
+++ b/app/validators/poll_validator.rb
@@ -13,7 +13,7 @@ class PollValidator < ActiveModel::Validator
poll.errors.add(:options, I18n.t('polls.errors.too_many_options', max: MAX_OPTIONS)) if poll.options.size > MAX_OPTIONS
poll.errors.add(:options, I18n.t('polls.errors.over_character_limit', max: MAX_OPTION_CHARS)) if poll.options.any? { |option| option.mb_chars.grapheme_length > MAX_OPTION_CHARS }
poll.errors.add(:options, I18n.t('polls.errors.duplicate_options')) unless poll.options.uniq.size == poll.options.size
- poll.errors.add(:expires_at, I18n.t('polls.errors.duration_too_long')) if poll.expires_at.nil? || poll.expires_at - current_time >= MAX_EXPIRATION
- poll.errors.add(:expires_at, I18n.t('polls.errors.duration_too_short')) if poll.expires_at.present? && poll.expires_at - current_time <= MIN_EXPIRATION
+ poll.errors.add(:expires_at, I18n.t('polls.errors.duration_too_long')) if poll.expires_at.nil? || poll.expires_at - current_time > MAX_EXPIRATION
+ poll.errors.add(:expires_at, I18n.t('polls.errors.duration_too_short')) if poll.expires_at.present? && poll.expires_at - current_time < MIN_EXPIRATION
end
end
diff --git a/config/locales/co.yml b/config/locales/co.yml
index d30fc9e96..8fcb27598 100644
--- a/config/locales/co.yml
+++ b/config/locales/co.yml
@@ -741,9 +741,9 @@ co:
duration_too_long: hè troppu luntanu indè u futuru
duration_too_short: hè troppu prossimu
expired: U scandagliu hè digià finitu
- over_character_limit: ùn ponu micca esse più longhi chè %{MAX} caratteri
+ over_character_limit: ùn ponu micca esse più longhi chè %{max} caratteri
too_few_options: deve avè più d'un'uzzione
- too_many_options: ùn pò micca avè più di %{MAX} uzzione
+ too_many_options: ùn pò micca avè più di %{max} uzzione
preferences:
languages: Lingue
other: Altre
diff --git a/config/locales/cs.yml b/config/locales/cs.yml
index e751b5266..fe83bd57a 100644
--- a/config/locales/cs.yml
+++ b/config/locales/cs.yml
@@ -752,9 +752,9 @@ cs:
duration_too_long: je příliš daleko v budoucnosti
duration_too_short: je příliš brzy
expired: Anketa již skončila
- over_character_limit: nesmí být každá delší než %{MAX} znaků
+ over_character_limit: nesmí být každá delší než %{max} znaků
too_few_options: musí mít více než jednu položku
- too_many_options: nesmí obsahovat více než %{MAX} položky
+ too_many_options: nesmí obsahovat více než %{max} položky
preferences:
languages: Jazyky
other: Ostatní
diff --git a/config/locales/el.yml b/config/locales/el.yml
index ca821c4fc..35da50af7 100644
--- a/config/locales/el.yml
+++ b/config/locales/el.yml
@@ -740,9 +740,9 @@ el:
duration_too_long: είναι πολύ μακριά στο μέλλον
duration_too_short: είναι πολύ σύντομα
expired: Η ψηφοφορία έχει ήδη λήξει
- over_character_limit: δε μπορεί να υπερβαίνει τους %{MAX} χαρακτήρες έκαστη
+ over_character_limit: δε μπορεί να υπερβαίνει τους %{max} χαρακτήρες έκαστη
too_few_options: πρέπει να έχει περισσότερες από μια επιλογές
- too_many_options: δεν μπορεί να έχει περισσότερες από %{MAX} επιλογές
+ too_many_options: δεν μπορεί να έχει περισσότερες από %{max} επιλογές
preferences:
languages: Γλώσσες
other: Άλλο
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 05f6243df..b77387890 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -745,9 +745,9 @@ en:
duration_too_long: is too far into the future
duration_too_short: is too soon
expired: The poll has already ended
- over_character_limit: cannot be longer than %{MAX} characters each
+ over_character_limit: cannot be longer than %{max} characters each
too_few_options: must have more than one item
- too_many_options: can't contain more than %{MAX} items
+ too_many_options: can't contain more than %{max} items
preferences:
languages: Languages
other: Other
diff --git a/config/locales/fa.yml b/config/locales/fa.yml
index 4cf8f415c..4214e793c 100644
--- a/config/locales/fa.yml
+++ b/config/locales/fa.yml
@@ -741,9 +741,9 @@ fa:
duration_too_long: در آیندهٔ خیلی دور است
duration_too_short: در آیندهٔ خیلی نزدیک است
expired: این نظرسنجی به پایان رسیده است
- over_character_limit: هر کدام نمیتواند از %{MAX} نویسه طولانیتر باشد
+ over_character_limit: هر کدام نمیتواند از %{max} نویسه طولانیتر باشد
too_few_options: حتماً باید بیش از یک گزینه داشته باشد
- too_many_options: نمیتواند بیشتر از %{MAX} گزینه داشته باشد
+ too_many_options: نمیتواند بیشتر از %{max} گزینه داشته باشد
preferences:
languages: تنظیمات زبان
other: سایر تنظیمات
diff --git a/config/locales/fr.yml b/config/locales/fr.yml
index c84dc8063..b9d813e9e 100644
--- a/config/locales/fr.yml
+++ b/config/locales/fr.yml
@@ -741,9 +741,9 @@ fr:
duration_too_long: est trop loin dans le futur
duration_too_short: est trop tôt
expired: Ce sondage est déjà terminé
- over_character_limit: ne peuvent être plus long que %{MAX} caractères chacun
+ over_character_limit: ne peuvent être plus long que %{max} caractères chacun
too_few_options: doit avoir plus qu'une proposition
- too_many_options: ne peut contenir plus que %{MAX} propositions
+ too_many_options: ne peut contenir plus que %{max} propositions
preferences:
languages: Langues
other: Autre
diff --git a/config/locales/gl.yml b/config/locales/gl.yml
index 3c58e04f5..2435137f9 100644
--- a/config/locales/gl.yml
+++ b/config/locales/gl.yml
@@ -741,9 +741,9 @@ gl:
duration_too_long: está moi lonxe no futuro
duration_too_short: é demasiado cedo
expired: A sondaxe rematou
- over_character_limit: non poden ter máis de %{MAX} caracteres cada unha
+ over_character_limit: non poden ter máis de %{max} caracteres cada unha
too_few_options: debe ter máis de unha opción
- too_many_options: non pode haber máis de %{MAX} opcións
+ too_many_options: non pode haber máis de %{max} opcións
preferences:
languages: Idiomas
other: Outro
diff --git a/config/locales/ko.yml b/config/locales/ko.yml
index 6fa18b12a..fe347a703 100644
--- a/config/locales/ko.yml
+++ b/config/locales/ko.yml
@@ -743,9 +743,9 @@ ko:
duration_too_long: 너무 먼 미래입니다
duration_too_short: 너무 가깝습니다
expired: 투표가 이미 끝났습니다
- over_character_limit: 각각 %{MAX} 글자를 넘을 수 없습니다
+ over_character_limit: 각각 %{max} 글자를 넘을 수 없습니다
too_few_options: 한가지 이상의 항목을 포함해야 합니다
- too_many_options: 항목은 %{MAX}개를 넘을 수 없습니다
+ too_many_options: 항목은 %{max}개를 넘을 수 없습니다
preferences:
languages: 언어
other: 기타
diff --git a/config/locales/sk.yml b/config/locales/sk.yml
index b29a7a934..0800b8f8c 100644
--- a/config/locales/sk.yml
+++ b/config/locales/sk.yml
@@ -752,9 +752,9 @@ sk:
duration_too_long: je príliš ďaleko do budúcnosti
duration_too_short: je príliš skoro
expired: Anketa už skončila
- over_character_limit: každá nemôže byť dlhšia ako %{MAX} znakov
+ over_character_limit: každá nemôže byť dlhšia ako %{max} znakov
too_few_options: musí mať viac ako jednu položku
- too_many_options: nemôže zahŕňať viac ako %{MAX} položiek
+ too_many_options: nemôže zahŕňať viac ako %{max} položiek
preferences:
languages: Jazyky
other: Ostatné