logo

pleroma-fe

My custom branche(s) on git.pleroma.social/pleroma/pleroma-fe
commit: 79805584613bd3d3ec5fba6481fc1ba02986a1a8
parent: 8630f91a13e8b8f7b56d2cb3dd2b700ad5ebd6f6
Author: Roger Braun <roger@rogerbraun.net>
Date:   Sun, 30 Oct 2016 16:53:58 +0100

Basic status posting.

Diffstat:

Asrc/components/post_status_form/post_status_form.js20++++++++++++++++++++
Asrc/components/post_status_form/post_status_form.vue20++++++++++++++++++++
Msrc/components/user_panel/user_panel.js4+++-
Msrc/components/user_panel/user_panel.vue2+-
Msrc/services/api/api.service.js41+++++++++++++++++++++--------------------
Asrc/services/status_poster/status_poster.service.js52++++++++++++++++++++++++++++++++++++++++++++++++++++
6 files changed, 117 insertions(+), 22 deletions(-)

diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js @@ -0,0 +1,20 @@ +import statusPoster from '../../services/status_poster/status_poster.service.js' + +const PostStatusForm = { + data() { + return { + newStatus: { } + } + }, + methods: { + postStatus(newStatus) { + statusPoster.postStatus({ + status: newStatus.status, + store: this.$store + }) + this.newStatus = { } + } + } +} + +export default PostStatusForm diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue @@ -0,0 +1,20 @@ +<template> + <div class="post-status-form"> + <form v-on:submit.prevent="postStatus(newStatus)"> + <div class="form-group" > + <textarea v-model="newStatus.status" placeholder="Just landed in L.A." rows="3" class="form-control"></textarea> + </div> + <div class="attachments"> + <div class="attachment" v-for="file in newStatus.files"> + <img class="thumbnail media-upload" :src="file.image"></img> + </div> + </div> + <div class='form-bottom'> + <media-upload files="newStatus.files"></media-upload> + <button type="submit" class="btn btn-default" >Submit</button> + </div> + </form> + </div> +</template> + +<script src="./post_status_form.js"></script> diff --git a/src/components/user_panel/user_panel.js b/src/components/user_panel/user_panel.js @@ -1,4 +1,5 @@ import LoginForm from '../login_form/login_form.vue' +import PostStatusForm from '../post_status_form/post_status_form.vue' const UserPanel = { computed: { @@ -11,7 +12,8 @@ const UserPanel = { } }, components: { - LoginForm + LoginForm, + PostStatusForm } } diff --git a/src/components/user_panel/user_panel.vue b/src/components/user_panel/user_panel.vue @@ -29,7 +29,7 @@ </div> <div class="panel-footer"> - <post-status-form></post-status-form> + <post-status-form v-if='user'></post-status-form> </div> </div> <login-form v-if='!user'></login-form> diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js @@ -5,8 +5,8 @@ const PUBLIC_TIMELINE_URL = '/api/statuses/public_timeline.json' const PUBLIC_AND_EXTERNAL_TIMELINE_URL = '/api/statuses/public_and_external_timeline.json' const FAVORITE_URL = '/api/favorites/create' const UNFAVORITE_URL = '/api/favorites/destroy' +const STATUS_UPDATE_URL = '/api/statuses/update.json' // const CONVERSATION_URL = '/api/statusnet/conversation/'; -// const STATUS_UPDATE_URL = '/api/statuses/update.json'; // const MEDIA_UPLOAD_URL = '/api/statusnet/media/upload'; // const FORM_CONTENT_TYPE = {'Content-Type': 'application/x-www-form-urlencoded'}; @@ -57,11 +57,30 @@ const unfavorite = ({ id, credentials }) => { }) } +const postStatus = ({credentials, status, mediaIds, inReplyToStatusId}) => { + const idsText = mediaIds.join(',') + const form = new FormData() + + form.append('status', status) + form.append('source', 'Pleroma FE') + form.append('media_ids', idsText) + if (inReplyToStatusId) { + form.append('in_reply_to_status_id', inReplyToStatusId) + } + + return fetch(STATUS_UPDATE_URL, { + body: form, + method: 'POST', + headers: authHeaders(credentials) + }) +} + const apiService = { verifyCredentials, fetchTimeline, favorite, - unfavorite + unfavorite, + postStatus } export default apiService @@ -102,24 +121,6 @@ export default apiService // return $http.post(LOGIN_URL, null, { headers: authHeaders }); // }; -// const postStatus = ({status, mediaIds, in_reply_to_status_id}) => { -// const idsText = mediaIds.join(','); -// const form = new FormData(); - -// form.append('status', status); -// form.append('source', 'The Wired FE'); -// form.append('media_ids', idsText); -// if(in_reply_to_status_id) { -// form.append('in_reply_to_status_id', in_reply_to_status_id); -// }; - -// return fetch(STATUS_UPDATE_URL, { -// body: form, -// method: 'POST', -// headers: authHeaders -// }); -// }; - // const unfavorite = (id) => $http.post(`${UNFAVORITE_URL}/${id}.json`, null, {headers: authHeaders}); // // This was impossible to get to work with $http. You're supposed to set Content-Type diff --git a/src/services/status_poster/status_poster.service.js b/src/services/status_poster/status_poster.service.js @@ -0,0 +1,52 @@ +import { map } from 'lodash' +import apiService from '../api/api.service.js' + +const postStatus = ({ store, status, media = [], inReplyToStatusId = undefined }) => { + const mediaIds = map(media, 'id') + + return apiService.postStatus({credentials: store.state.users.currentUser.credentials, status, mediaIds, inReplyToStatusId}) + .then((data) => data.json()) + .then((data) => { + store.commit('addNewStatuses', + { statuses: [data], timeline: 'friends', showImmediately: true }) + }) +} + +const statusPosterService = { + postStatus +} + +export default statusPosterService + +// const statusPosterServiceFactory = (apiService, $ngRedux) => { +// const postStatus = ({status, media = [], in_reply_to_status_id = undefined}) => { +// const mediaIds = map(media, 'id'); + +// return apiService.postStatus({status, mediaIds, in_reply_to_status_id}). +// then((data) => data.json()). +// then((data) => { +// $ngRedux.dispatch({type: 'ADD_NEW_STATUSES', data: { statuses: [data], timeline: 'friends', showImmediately: true }}); +// }); +// }; + +// const uploadMedia = (formData) => { +// return apiService.uploadMedia(formData).then((xml) => { +// return { +// id: xml.getElementsByTagName('media_id')[0].textContent, +// url: xml.getElementsByTagName('media_url')[0].textContent, +// image: xml.getElementsByTagName('atom:link')[0].getAttribute('href') +// }; +// }); +// }; + +// const statusPosterService = { +// postStatus, +// uploadMedia +// }; + +// return statusPosterService; +// }; + +// statusPosterServiceFactory.$inject = ['apiService', '$ngRedux']; + +// export default statusPosterServiceFactory;