From 6184c88ac70b33e66a87222142344f693406bd87 Mon Sep 17 00:00:00 2001
From: Henry Jameson
Date: Sun, 3 Mar 2019 15:15:41 +0200
Subject: [PATCH 01/22] Initial work on deprecating scopeModesEnabled in favor
of minimalScopeMode
---
src/boot/after_store.js | 2 +-
.../features_panel/features_panel.js | 2 +-
.../post_status_form/post_status_form.js | 27 +++++----
.../post_status_form/post_status_form.vue | 13 +++--
.../scope_selector/scope_selector.js | 55 +++++++++++++++++++
.../scope_selector/scope_selector.vue | 30 ++++++++++
src/components/settings/settings.js | 10 +++-
src/components/settings/settings.vue | 6 ++
src/components/user_settings/user_settings.js | 6 +-
.../user_settings/user_settings.vue | 10 ++--
src/i18n/en.json | 1 +
src/i18n/ru.json | 10 ++++
src/modules/config.js | 3 +-
src/modules/instance.js | 2 +-
static/config.json | 3 +-
15 files changed, 149 insertions(+), 31 deletions(-)
create mode 100644 src/components/scope_selector/scope_selector.js
create mode 100644 src/components/scope_selector/scope_selector.vue
diff --git a/src/boot/after_store.js b/src/boot/after_store.js
index 53ecc083..73b6f227 100644
--- a/src/boot/after_store.js
+++ b/src/boot/after_store.js
@@ -78,7 +78,7 @@ const afterStoreSetup = ({ store, i18n }) => {
copyInstanceOption('redirectRootNoLogin')
copyInstanceOption('redirectRootLogin')
copyInstanceOption('showInstanceSpecificPanel')
- copyInstanceOption('scopeOptionsEnabled')
+ copyInstanceOption('minimalScopesMode')
copyInstanceOption('formattingOptionsEnabled')
copyInstanceOption('collapseMessageWithSubject')
copyInstanceOption('loginMethod')
diff --git a/src/components/features_panel/features_panel.js b/src/components/features_panel/features_panel.js
index e0b7a118..0a7234cc 100644
--- a/src/components/features_panel/features_panel.js
+++ b/src/components/features_panel/features_panel.js
@@ -6,7 +6,7 @@ const FeaturesPanel = {
gopher: function () { return this.$store.state.instance.gopherAvailable },
whoToFollow: function () { return this.$store.state.instance.suggestionsEnabled },
mediaProxy: function () { return this.$store.state.instance.mediaProxyAvailable },
- scopeOptions: function () { return this.$store.state.instance.scopeOptionsEnabled },
+ scopeOptionsMinimal: function () { return this.$store.state.instance.scopeOptionsMinimal },
textlimit: function () { return this.$store.state.instance.textlimit }
}
}
diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index c28c51bf..b0882f70 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -1,5 +1,6 @@
import statusPoster from '../../services/status_poster/status_poster.service.js'
import MediaUpload from '../media_upload/media_upload.vue'
+import ScopeSelector from '../scope_selector/scope_selector.vue'
import fileTypeService from '../../services/file_type/file_type.service.js'
import Completion from '../../services/completion/completion.js'
import { take, filter, reject, map, uniqBy } from 'lodash'
@@ -28,7 +29,8 @@ const PostStatusForm = {
'subject'
],
components: {
- MediaUpload
+ MediaUpload,
+ ScopeSelector
},
mounted () {
this.resize(this.$refs.textarea)
@@ -78,14 +80,6 @@ const PostStatusForm = {
}
},
computed: {
- vis () {
- return {
- public: { selected: this.newStatus.visibility === 'public' },
- unlisted: { selected: this.newStatus.visibility === 'unlisted' },
- private: { selected: this.newStatus.visibility === 'private' },
- direct: { selected: this.newStatus.visibility === 'direct' }
- }
- },
candidates () {
const firstchar = this.textAtCaret.charAt(0)
if (firstchar === '@') {
@@ -133,6 +127,15 @@ const PostStatusForm = {
users () {
return this.$store.state.users.users
},
+ userDefaultScope () {
+ return this.$store.state.users.currentUser.default_scope
+ },
+ showAllScopes () {
+ const minimalScopesMode = typeof this.$store.state.config.minimalScopesMode === 'undefined'
+ ? this.$store.state.instance.minimalScopesMode
+ : this.$store.state.config.minimalScopesMode
+ return !minimalScopesMode
+ },
emoji () {
return this.$store.state.instance.emoji || []
},
@@ -157,8 +160,8 @@ const PostStatusForm = {
isOverLengthLimit () {
return this.hasStatusLengthLimit && (this.charactersLeft < 0)
},
- scopeOptionsEnabled () {
- return this.$store.state.instance.scopeOptionsEnabled
+ scopeOptionsMinimal () {
+ return this.$store.state.instance.scopeOptionsMinimal
},
alwaysShowSubject () {
if (typeof this.$store.state.config.alwaysShowSubjectInput !== 'undefined') {
@@ -166,7 +169,7 @@ const PostStatusForm = {
} else if (typeof this.$store.state.instance.alwaysShowSubjectInput !== 'undefined') {
return this.$store.state.instance.alwaysShowSubjectInput
} else {
- return this.$store.state.instance.scopeOptionsEnabled
+ return true
}
},
formattingOptionsEnabled () {
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 5085570b..b3d731cd 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -44,12 +44,13 @@
-
-
-
-
-
-
+
diff --git a/src/components/scope_selector/scope_selector.js b/src/components/scope_selector/scope_selector.js
new file mode 100644
index 00000000..578f1ba5
--- /dev/null
+++ b/src/components/scope_selector/scope_selector.js
@@ -0,0 +1,55 @@
+const ScopeSelector = {
+ props: [
+ 'showAll',
+ 'userEnabled',
+ 'userDefault',
+ 'originalScope',
+ 'initialScope',
+ 'onScopeChange'
+ ],
+ data () {
+ return {
+ currentScope: this.initialScope
+ }
+ },
+ computed: {
+ showNothing () {
+ return !this.showPublic && !this.showUnlisted && !this.showPrivate && !this.showDirect
+ },
+ showPublic () {
+ return this.originalScope !== 'direct' && this.shouldShow('public')
+ },
+ showUnlisted () {
+ return this.originalScope !== 'direct' && this.shouldShow('unlisted')
+ },
+ showPrivate () {
+ return this.originalScope !== 'direct' && this.shouldShow('private')
+ },
+ showDirect () {
+ return this.shouldShow('direct')
+ },
+ css () {
+ return {
+ public: {selected: this.currentScope === 'public'},
+ unlisted: {selected: this.currentScope === 'unlisted'},
+ private: {selected: this.currentScope === 'private'},
+ direct: {selected: this.currentScope === 'direct'}
+ }
+ }
+ },
+ methods: {
+ shouldShow (scope) {
+ return this.showAll ||
+ this.currentScope === scope ||
+ this.originalScope === scope ||
+ this.userDefault === scope ||
+ this.userEnabled.includes(scope)
+ },
+ changeVis (scope) {
+ this.currentScope = scope
+ this.onScopeChange && this.onScopeChange(scope)
+ }
+ }
+}
+
+export default ScopeSelector
diff --git a/src/components/scope_selector/scope_selector.vue b/src/components/scope_selector/scope_selector.vue
new file mode 100644
index 00000000..33ea488f
--- /dev/null
+++ b/src/components/scope_selector/scope_selector.vue
@@ -0,0 +1,30 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js
index 6e2dff7b..104be1a8 100644
--- a/src/components/settings/settings.js
+++ b/src/components/settings/settings.js
@@ -60,13 +60,18 @@ const settings = {
alwaysShowSubjectInputLocal: typeof user.alwaysShowSubjectInput === 'undefined'
? instance.alwaysShowSubjectInput
: user.alwaysShowSubjectInput,
- alwaysShowSubjectInputDefault: instance.alwaysShowSubjectInput,
+ alwaysShowSubjectInputDefault: this.$t('settings.values.' + instance.alwaysShowSubjectInput),
scopeCopyLocal: typeof user.scopeCopy === 'undefined'
? instance.scopeCopy
: user.scopeCopy,
scopeCopyDefault: this.$t('settings.values.' + instance.scopeCopy),
+ minimalScopesModeLocal: typeof user.minimalScopesMode === 'undefined'
+ ? instance.minimalScopesMode
+ : user.minimalScopesMode,
+ minimalScopesModeDefault: this.$t('settings.values.' + instance.minimalScopesMode),
+
stopGifs: user.stopGifs,
webPushNotificationsLocal: user.webPushNotifications,
loopVideoSilentOnlyLocal: user.loopVideosSilentOnly,
@@ -175,6 +180,9 @@ const settings = {
postContentTypeLocal (value) {
this.$store.dispatch('setOption', { name: 'postContentType', value })
},
+ minimalScopesModeLocal (value) {
+ this.$store.dispatch('setOption', { name: 'minimalScopesMode', value })
+ },
stopGifs (value) {
this.$store.dispatch('setOption', { name: 'stopGifs', value })
},
diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue
index 5041b3a3..d9b72ee0 100644
--- a/src/components/settings/settings.vue
+++ b/src/components/settings/settings.vue
@@ -122,6 +122,12 @@
+
+
+
+
diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js
index d6972737..1911ab23 100644
--- a/src/components/user_settings/user_settings.js
+++ b/src/components/user_settings/user_settings.js
@@ -4,6 +4,7 @@ import get from 'lodash/get'
import TabSwitcher from '../tab_switcher/tab_switcher.js'
import ImageCropper from '../image_cropper/image_cropper.vue'
import StyleSwitcher from '../style_switcher/style_switcher.vue'
+import ScopeSelector from '../scope_selector/scope_selector.vue'
import fileSizeFormatService from '../../services/file_size_format/file_size_format.js'
import BlockCard from '../block_card/block_card.vue'
import MuteCard from '../mute_card/mute_card.vue'
@@ -66,6 +67,7 @@ const UserSettings = {
},
components: {
StyleSwitcher,
+ ScopeSelector,
TabSwitcher,
ImageCropper,
BlockList,
@@ -78,8 +80,8 @@ const UserSettings = {
pleromaBackend () {
return this.$store.state.instance.pleromaBackend
},
- scopeOptionsEnabled () {
- return this.$store.state.instance.scopeOptionsEnabled
+ scopeOptionsMinimal () {
+ return this.$store.state.instance.scopeOptionsMinimal
},
vis () {
return {
diff --git a/src/components/user_settings/user_settings.vue b/src/components/user_settings/user_settings.vue
index a1123638..7bd391ba 100644
--- a/src/components/user_settings/user_settings.vue
+++ b/src/components/user_settings/user_settings.vue
@@ -29,13 +29,13 @@
-
+
-
-
-
-
+
diff --git a/src/i18n/en.json b/src/i18n/en.json
index c5a4a90d..fb8fcfcc 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -211,6 +211,7 @@
"saving_ok": "Settings saved",
"security_tab": "Security",
"scope_copy": "Copy scope when replying (DMs are always copied)",
+ "minimal_scopes_mode": "Minimize post scope selection options",
"set_new_avatar": "Set new avatar",
"set_new_profile_background": "Set new profile background",
"set_new_profile_banner": "Set new profile banner",
diff --git a/src/i18n/ru.json b/src/i18n/ru.json
index 6799cc96..89aa43f4 100644
--- a/src/i18n/ru.json
+++ b/src/i18n/ru.json
@@ -111,6 +111,8 @@
"import_theme": "Загрузить Тему",
"inputRadius": "Поля ввода",
"checkboxRadius": "Чекбоксы",
+ "instance_default": "(по умолчанию: {value})",
+ "instance_default_simple": "(по умолчанию)",
"interface": "Интерфейс",
"interfaceLanguage": "Язык интерфейса",
"limited_availability": "Не доступно в вашем браузере",
@@ -149,7 +151,11 @@
"reply_visibility_all": "Показывать все ответы",
"reply_visibility_following": "Показывать только ответы мне и тех на кого я подписан",
"reply_visibility_self": "Показывать только ответы мне",
+ "saving_err": "Не удалось сохранить настройки",
+ "saving_ok": "Сохранено",
"security_tab": "Безопасность",
+ "scope_copy": "Копировать видимость поста при ответе (всегда включено для Личных Сообщений)",
+ "minimal_scopes_mode": "Минимизировать набор опций видимости поста",
"set_new_avatar": "Загрузить новый аватар",
"set_new_profile_background": "Загрузить новый фон профиля",
"set_new_profile_banner": "Загрузить новый баннер профиля",
@@ -164,6 +170,10 @@
"theme_help_v2_2": "Под некоторыми полями ввода это идикаторы контрастности, наведите на них мышью чтобы узнать больше. Приспользовании прозрачности контраст расчитывается для наихудшего варианта.",
"tooltipRadius": "Всплывающие подсказки/уведомления",
"user_settings": "Настройки пользователя",
+ "values": {
+ "false": "нет",
+ "true": "да"
+ },
"style": {
"switcher": {
"keep_color": "Оставить цвета",
diff --git a/src/modules/config.js b/src/modules/config.js
index 1c30c203..6d8aad35 100644
--- a/src/modules/config.js
+++ b/src/modules/config.js
@@ -32,7 +32,8 @@ const defaultState = {
scopeCopy: undefined, // instance default
subjectLineBehavior: undefined, // instance default
alwaysShowSubjectInput: undefined, // instance default
- postContentType: undefined // instance default
+ postContentType: undefined, // instance default
+ minimalScopesMode: undefined // instance default
}
const config = {
diff --git a/src/modules/instance.js b/src/modules/instance.js
index c31d02b9..7b67890f 100644
--- a/src/modules/instance.js
+++ b/src/modules/instance.js
@@ -15,7 +15,6 @@ const defaultState = {
redirectRootNoLogin: '/main/all',
redirectRootLogin: '/main/friends',
showInstanceSpecificPanel: false,
- scopeOptionsEnabled: true,
formattingOptionsEnabled: false,
alwaysShowSubjectInput: true,
collapseMessageWithSubject: false,
@@ -31,6 +30,7 @@ const defaultState = {
vapidPublicKey: undefined,
noAttachmentLinks: false,
showFeaturesPanel: true,
+ minimalScopesMode: false,
// Nasty stuff
pleromaBackend: true,
diff --git a/static/config.json b/static/config.json
index 533a5b08..b436daae 100644
--- a/static/config.json
+++ b/static/config.json
@@ -21,5 +21,6 @@
"webPushNotifications": false,
"noAttachmentLinks": false,
"nsfwCensorImage": "",
- "showFeaturesPanel": true
+ "showFeaturesPanel": true,
+ "minimalScopesMode": false
}
From b97a03383990d54573bd5e68393a1ad11e33608b Mon Sep 17 00:00:00 2001
From: jared
Date: Mon, 25 Mar 2019 22:38:15 -0400
Subject: [PATCH 02/22] #255 - add emoji input component
---
src/components/emoji-input/emoji-input.js | 106 ++++++++++++++++++
src/components/emoji-input/emoji-input.vue | 99 ++++++++++++++++
.../post_status_form/post_status_form.js | 4 +-
.../post_status_form/post_status_form.vue | 5 +-
4 files changed, 211 insertions(+), 3 deletions(-)
create mode 100644 src/components/emoji-input/emoji-input.js
create mode 100644 src/components/emoji-input/emoji-input.vue
diff --git a/src/components/emoji-input/emoji-input.js b/src/components/emoji-input/emoji-input.js
new file mode 100644
index 00000000..56414358
--- /dev/null
+++ b/src/components/emoji-input/emoji-input.js
@@ -0,0 +1,106 @@
+import Completion from '../../services/completion/completion.js'
+import { take, filter, map } from 'lodash'
+
+const EmojiInput = {
+ props: [
+ 'value',
+ 'placeholder',
+ 'type'
+ ],
+ data () {
+ return {
+ highlighted: 0,
+ caret: 0
+ }
+ },
+ computed: {
+ suggestions () {
+ const firstchar = this.textAtCaret.charAt(0)
+ if (firstchar === ':') {
+ if (this.textAtCaret === ':') { return }
+ const matchedEmoji = filter(this.emoji.concat(this.customEmoji), (emoji) => emoji.shortcode.startsWith(this.textAtCaret.slice(1)))
+ if (matchedEmoji.length <= 0) {
+ return false
+ }
+ return map(take(matchedEmoji, 5), ({shortcode, image_url, utf}, index) => ({
+ shortcode: `:${shortcode}:`,
+ utf: utf || '',
+ // eslint-disable-next-line camelcase
+ img: utf ? '' : this.$store.state.instance.server + image_url,
+ highlighted: index === this.highlighted
+ }))
+ } else {
+ return false
+ }
+ },
+ textAtCaret () {
+ return (this.wordAtCaret || {}).word || ''
+ },
+ wordAtCaret () {
+ const word = Completion.wordAtPosition(this.value, this.caret - 1) || {}
+ return word
+ },
+ emoji () {
+ return this.$store.state.instance.emoji || []
+ },
+ customEmoji () {
+ return this.$store.state.instance.customEmoji || []
+ }
+ },
+ methods: {
+ replace (replacement) {
+ const newValue = Completion.replaceWord(this.value, this.wordAtCaret, replacement)
+ this.$emit('input', newValue)
+ this.caret = 0
+ },
+ replaceEmoji (e) {
+ const len = this.suggestions.length || 0
+ if (this.textAtCaret === ':' || e.ctrlKey) { return }
+ if (len > 0) {
+ e.preventDefault()
+ const emoji = this.suggestions[this.highlighted]
+ const replacement = emoji.utf || (emoji.shortcode + ' ')
+ const newValue = Completion.replaceWord(this.value, this.wordAtCaret, replacement)
+ this.$emit('input', newValue)
+ this.caret = 0
+ this.highlighted = 0
+ }
+ },
+ cycleBackward (e) {
+ const len = this.suggestions.length || 0
+ if (len > 0) {
+ e.preventDefault()
+ this.highlighted -= 1
+ if (this.highlighted < 0) {
+ this.highlighted = this.suggestions.length - 1
+ }
+ } else {
+ this.highlighted = 0
+ }
+ },
+ cycleForward (e) {
+ const len = this.suggestions.length || 0
+ if (len > 0) {
+ if (e.shiftKey) { return }
+ e.preventDefault()
+ this.highlighted += 1
+ if (this.highlighted >= len) {
+ this.highlighted = 0
+ }
+ } else {
+ this.highlighted = 0
+ }
+ },
+ onKeydown (e) {
+ e.stopPropagation()
+ },
+ onInput (e) {
+ this.$emit('input', e.target.value)
+ },
+ setCaret ({target: {selectionStart}}) {
+ this.caret = selectionStart
+ }
+ }
+}
+
+export default EmojiInput
diff --git a/src/components/emoji-input/emoji-input.vue b/src/components/emoji-input/emoji-input.vue
new file mode 100644
index 00000000..95606305
--- /dev/null
+++ b/src/components/emoji-input/emoji-input.vue
@@ -0,0 +1,99 @@
+
+
+
+
+
+
+
diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index c5f30ca6..229aefb7 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -1,5 +1,6 @@
import statusPoster from '../../services/status_poster/status_poster.service.js'
import MediaUpload from '../media_upload/media_upload.vue'
+import EmojiInput from '../emoji-input/emoji-input.vue'
import fileTypeService from '../../services/file_type/file_type.service.js'
import Completion from '../../services/completion/completion.js'
import { take, filter, reject, map, uniqBy } from 'lodash'
@@ -28,7 +29,8 @@ const PostStatusForm = {
'subject'
],
components: {
- MediaUpload
+ MediaUpload,
+ EmojiInput
},
mounted () {
this.resize(this.$refs.textarea)
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 612f87c1..9d449b74 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -10,12 +10,13 @@
{{ $t('post_status.account_not_locked_warning_link') }}
{{ $t('post_status.direct_warning') }}
-
+ class="form-cw"
+ />