diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index 85e6d8ad..c6459edc 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -320,7 +320,8 @@ const conversation = {
expandingSubject: false,
showingLongSubject: false,
isReplying: false,
- mediaPlaying: []
+ mediaPlaying: [],
+ currentLanguage: undefined
}
if (this.statusContentPropertiesObject[id]) {
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 7577129e..18f7e4c3 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -94,11 +94,13 @@
:controlled-showing-long-subject="statusContentProperties[status.id].showingLongSubject"
:controlled-replying="statusContentProperties[status.id].replying"
:controlled-media-playing="statusContentProperties[status.id].mediaPlaying"
+ :controlled-current-language="statusContentProperties[status.id].currentLanguage"
:controlled-toggle-showing-tall="() => toggleStatusContentProperty(status.id, 'showingTall')"
:controlled-toggle-expanding-subject="() => toggleStatusContentProperty(status.id, 'expandingSubject')"
:controlled-toggle-showing-long-subject="() => toggleStatusContentProperty(status.id, 'showingLongSubject')"
:controlled-toggle-replying="() => toggleStatusContentProperty(status.id, 'replying')"
:controlled-set-media-playing="(newVal) => toggleStatusContentProperty(status.id, 'mediaPlaying', newVal)"
+ :controlled-set-current-language="(newVal) => setStatusContentProperty(status.id, 'currentLanguage', newVal)"
@goto="setHighlight"
@toggleExpanded="toggleExpanded"
diff --git a/src/components/status/status.js b/src/components/status/status.js
index 9a9bca7a..e2717fb8 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -19,6 +19,7 @@ import MentionLink from 'src/components/mention_link/mention_link.vue'
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { highlightClass, highlightStyle } from '../../services/user_highlighter/user_highlighter.js'
import { muteWordHits } from '../../services/status_parser/status_parser.js'
+import { controlledOrUncontrolledGetters, controlledOrUncontrolledSet, controlledOrUncontrolledToggle } from 'src/services/control/control.service.js'
import { unescape, uniqBy } from 'lodash'
import { library } from '@fortawesome/fontawesome-svg-core'
@@ -62,41 +63,6 @@ library.add(
faAngleDoubleRight
)
-const camelCase = name => name.charAt(0).toUpperCase() + name.slice(1)
-
-const controlledOrUncontrolledGetters = list => list.reduce((res, name) => {
- const camelized = camelCase(name)
- const toggle = `controlledToggle${camelized}`
- const controlledName = `controlled${camelized}`
- const uncontrolledName = `uncontrolled${camelized}`
- res[name] = function () {
- return ((this.$data[toggle] !== undefined || this.$props[toggle] !== undefined) && this[toggle]) ? this[controlledName] : this[uncontrolledName]
- }
- return res
-}, {})
-
-const controlledOrUncontrolledToggle = (obj, name) => {
- const camelized = camelCase(name)
- const toggle = `controlledToggle${camelized}`
- const uncontrolledName = `uncontrolled${camelized}`
- if (obj[toggle]) {
- obj[toggle]()
- } else {
- obj[uncontrolledName] = !obj[uncontrolledName]
- }
-}
-
-const controlledOrUncontrolledSet = (obj, name, val) => {
- const camelized = camelCase(name)
- const set = `controlledSet${camelized}`
- const uncontrolledName = `uncontrolled${camelized}`
- if (obj[set]) {
- obj[set](val)
- } else {
- obj[uncontrolledName] = val
- }
-}
-
const Status = {
name: 'Status',
components: {
@@ -149,6 +115,8 @@ const Status = {
'controlledToggleReplying',
'controlledMediaPlaying',
'controlledSetMediaPlaying',
+ 'controlledCurrentLanguage',
+ 'controlledSetCurrentLanguage',
'dive'
],
data () {
@@ -157,13 +125,14 @@ const Status = {
unmuted: false,
userExpanded: false,
uncontrolledMediaPlaying: [],
+ uncontrolledCurrentLanguage: undefined,
suspendable: true,
error: null,
headTailLinks: null
}
},
computed: {
- ...controlledOrUncontrolledGetters(['replying', 'mediaPlaying']),
+ ...controlledOrUncontrolledGetters(['replying', 'mediaPlaying', 'currentLanguage']),
muteWords () {
return this.mergedConfig.muteWords
},
@@ -448,6 +417,9 @@ const Status = {
removeMediaPlaying (id) {
controlledOrUncontrolledSet(this, 'mediaPlaying', this.mediaPlaying.filter(mediaId => mediaId !== id))
},
+ setCurrentLanguage (language) {
+ controlledOrUncontrolledSet(this, 'currentLanguage', language)
+ },
setHeadTailLinks (headTailLinks) {
this.headTailLinks = headTailLinks
},
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 35b15362..4347f1ae 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -356,9 +356,11 @@
:controlled-showing-tall="controlledShowingTall"
:controlled-expanding-subject="controlledExpandingSubject"
:controlled-showing-long-subject="controlledShowingLongSubject"
+ :controlled-current-language="controlledCurrentLanguage"
:controlled-toggle-showing-tall="controlledToggleShowingTall"
:controlled-toggle-expanding-subject="controlledToggleExpandingSubject"
:controlled-toggle-showing-long-subject="controlledToggleShowingLongSubject"
+ :controlled-set-current-language="controlledSetCurrentLanguage"
@mediaplay="addMediaPlaying($event)"
@mediapause="removeMediaPlaying($event)"
@parseReady="setHeadTailLinks"
diff --git a/src/components/status_body/status_body.js b/src/components/status_body/status_body.js
index b8f6f9a0..1dd4f3a6 100644
--- a/src/components/status_body/status_body.js
+++ b/src/components/status_body/status_body.js
@@ -32,7 +32,9 @@ const StatusContent = {
'showingLongSubject',
'toggleShowingTall',
'toggleExpandingSubject',
- 'toggleShowingLongSubject'
+ 'toggleShowingLongSubject',
+ 'currentLanguage',
+ 'setCurrentLanguage'
],
data () {
return {
@@ -78,6 +80,18 @@ const StatusContent = {
attachmentTypes () {
return this.status.attachments.map(file => fileType.fileType(file.mimetype))
},
+ languages () {
+ return this.status.languages
+ },
+ currentLanguageOrDefault () {
+ return this.currentLanguage || this.languages[0]
+ },
+ summary () {
+ return this.currentLanguageOrDefault ? this.status.summary_raw_html_map[this.currentLanguageOrDefault] : this.status.summary_raw_html
+ },
+ content () {
+ return this.currentLanguageOrDefault ? this.status.raw_html_map[this.currentLanguageOrDefault] : this.status.raw_html
+ },
...mapGetters(['mergedConfig'])
},
components: {
diff --git a/src/components/status_body/status_body.scss b/src/components/status_body/status_body.scss
index 8fd60afc..d7a6e29f 100644
--- a/src/components/status_body/status_body.scss
+++ b/src/components/status_body/status_body.scss
@@ -4,6 +4,12 @@
display: flex;
flex-direction: column;
+ .language-selector {
+ display: flex;
+ flex-direction: row;
+ overflow: hidden;
+ }
+
.emoji {
--_still_image-label-scale: 0.5;
}
diff --git a/src/components/status_body/status_body.vue b/src/components/status_body/status_body.vue
index fb356360..b35d5d3b 100644
--- a/src/components/status_body/status_body.vue
+++ b/src/components/status_body/status_body.vue
@@ -5,13 +5,27 @@
>
+
+
+