Merge branch 'feature/rich-text' into 'develop'

initial rich text authoring support

See merge request pleroma/pleroma-fe!325
This commit is contained in:
kaniini 2018-08-31 03:54:37 +00:00
commit 84aa1ecdcd
6 changed files with 31 additions and 10 deletions

View file

@ -451,6 +451,10 @@ nav {
color: $fallback--lightFg; color: $fallback--lightFg;
color: var(--lightFg, $fallback--lightFg); color: var(--lightFg, $fallback--lightFg);
} }
.text-format {
float: right;
}
} }
.visibility-notice { .visibility-notice {

View file

@ -55,6 +55,7 @@ const PostStatusForm = {
newStatus: { newStatus: {
spoilerText: this.subject, spoilerText: this.subject,
status: statusText, status: statusText,
contentType: 'text/plain',
nsfw: false, nsfw: false,
files: [], files: [],
visibility: this.messageScope || this.$store.state.users.currentUser.default_scope visibility: this.messageScope || this.$store.state.users.currentUser.default_scope
@ -210,13 +211,15 @@ const PostStatusForm = {
sensitive: newStatus.nsfw, sensitive: newStatus.nsfw,
media: newStatus.files, media: newStatus.files,
store: this.$store, store: this.$store,
inReplyToStatusId: this.replyTo inReplyToStatusId: this.replyTo,
contentType: newStatus.contentType
}).then((data) => { }).then((data) => {
if (!data.error) { if (!data.error) {
this.newStatus = { this.newStatus = {
status: '', status: '',
files: [], files: [],
visibility: newStatus.visibility visibility: newStatus.visibility,
contentType: newStatus.contentType
} }
this.$emit('posted') this.$emit('posted')
let el = this.$el.querySelector('textarea') let el = this.$el.querySelector('textarea')

View file

@ -32,13 +32,23 @@
@input="resize" @input="resize"
@paste="paste"> @paste="paste">
</textarea> </textarea>
<div v-if="scopeOptionsEnabled" class="visibility-tray"> <div class="visibility-tray">
<span class="text-format">
<select v-model="newStatus.contentType" class="form-control">
<option value="text/plain">{{$t('post_status.content_type.plain_text')}}</option>
<option value="text/html">HTML</option>
<option value="text/markdown">Markdown</option>
</select>
</span>
<div v-if="scopeOptionsEnabled">
<i v-on:click="changeVis('direct')" class="icon-mail-alt" :class="vis.direct" :title="$t('post_status.scope.direct')"></i> <i v-on:click="changeVis('direct')" class="icon-mail-alt" :class="vis.direct" :title="$t('post_status.scope.direct')"></i>
<i v-on:click="changeVis('private')" class="icon-lock" :class="vis.private" :title="$t('post_status.scope.private')"></i> <i v-on:click="changeVis('private')" class="icon-lock" :class="vis.private" :title="$t('post_status.scope.private')"></i>
<i v-on:click="changeVis('unlisted')" class="icon-lock-open-alt" :class="vis.unlisted" :title="$t('post_status.scope.unlisted')"></i> <i v-on:click="changeVis('unlisted')" class="icon-lock-open-alt" :class="vis.unlisted" :title="$t('post_status.scope.unlisted')"></i>
<i v-on:click="changeVis('public')" class="icon-globe" :class="vis.public" :title="$t('post_status.scope.public')"></i> <i v-on:click="changeVis('public')" class="icon-globe" :class="vis.public" :title="$t('post_status.scope.public')"></i>
</div> </div>
</div> </div>
</div>
<div style="position:relative;" v-if="candidates"> <div style="position:relative;" v-if="candidates">
<div class="autocomplete-panel"> <div class="autocomplete-panel">
<div v-for="candidate in candidates" @click="replace(candidate.utf || (candidate.screen_name + ' '))"> <div v-for="candidate in candidates" @click="replace(candidate.utf || (candidate.screen_name + ' '))">

View file

@ -392,6 +392,9 @@ const en = {
unlisted: 'Unlisted - Do not post to public timelines', unlisted: 'Unlisted - Do not post to public timelines',
private: 'Followers-only - Post to followers only', private: 'Followers-only - Post to followers only',
direct: 'Direct - Post to mentioned users only' direct: 'Direct - Post to mentioned users only'
},
content_type: {
plain_text: 'Plain text'
} }
}, },
finder: { finder: {

View file

@ -373,7 +373,7 @@ const unretweet = ({ id, credentials }) => {
}) })
} }
const postStatus = ({credentials, status, spoilerText, visibility, sensitive, mediaIds, inReplyToStatusId}) => { const postStatus = ({credentials, status, spoilerText, visibility, sensitive, mediaIds, inReplyToStatusId, contentType}) => {
const idsText = mediaIds.join(',') const idsText = mediaIds.join(',')
const form = new FormData() const form = new FormData()
@ -382,6 +382,7 @@ const postStatus = ({credentials, status, spoilerText, visibility, sensitive, me
if (spoilerText) form.append('spoiler_text', spoilerText) if (spoilerText) form.append('spoiler_text', spoilerText)
if (visibility) form.append('visibility', visibility) if (visibility) form.append('visibility', visibility)
if (sensitive) form.append('sensitive', sensitive) if (sensitive) form.append('sensitive', sensitive)
if (contentType) form.append('content_type', contentType)
form.append('media_ids', idsText) form.append('media_ids', idsText)
if (inReplyToStatusId) { if (inReplyToStatusId) {
form.append('in_reply_to_status_id', inReplyToStatusId) form.append('in_reply_to_status_id', inReplyToStatusId)

View file

@ -1,10 +1,10 @@
import { map } from 'lodash' import { map } from 'lodash'
import apiService from '../api/api.service.js' import apiService from '../api/api.service.js'
const postStatus = ({ store, status, spoilerText, visibility, sensitive, media = [], inReplyToStatusId = undefined }) => { const postStatus = ({ store, status, spoilerText, visibility, sensitive, media = [], inReplyToStatusId = undefined, contentType = 'text/plain' }) => {
const mediaIds = map(media, 'id') const mediaIds = map(media, 'id')
return apiService.postStatus({credentials: store.state.users.currentUser.credentials, status, spoilerText, visibility, sensitive, mediaIds, inReplyToStatusId}) return apiService.postStatus({credentials: store.state.users.currentUser.credentials, status, spoilerText, visibility, sensitive, mediaIds, inReplyToStatusId, contentType})
.then((data) => data.json()) .then((data) => data.json())
.then((data) => { .then((data) => {
if (!data.error) { if (!data.error) {