commit: ce509937f677e3b272428e3a8fa98110fc77fd0d
parent: ee009f63dd2f4856f8daf29d66301f67ab8f2021
Author: lambadalambda <gitgud@rogerbraun.net>
Date: Mon, 14 Nov 2016 15:09:20 -0500
Merge branch 'feature/retweet' into 'master'
Feature/retweet
See merge request !1
Diffstat:
9 files changed, 91 insertions(+), 16 deletions(-)
diff --git a/src/App.scss b/src/App.scss
@@ -1,7 +1,4 @@
-$main-color: #f58d2c;
-$main-background: white;
-$darkened-background: whitesmoke;
-
+@import './_variables.scss';
#app {
background-color: $main-color;
background-size: cover;
@@ -225,9 +222,10 @@ status.ng-enter.ng-enter-active {
}
.fa {
- color: $main-color;
+ color: grey;
}
+
.status-actions {
width: 50%;
display: flex;
diff --git a/src/_variables.scss b/src/_variables.scss
@@ -0,0 +1,6 @@
+$main-color: #f58d2c;
+$main-background: white;
+$darkened-background: whitesmoke;
+$green: #0fa00f;
+$blue: #0095ff;
+
diff --git a/src/components/favorite_button/favorite_button.vue b/src/components/favorite_button/favorite_button.vue
@@ -7,8 +7,15 @@
<script src="./favorite_button.js" ></script>
-<style>
- .favorite-button {
- cursor: pointer
- }
+<style lang='scss'>
+ @import '../../_variables.scss';
+ .favorite-button {
+ cursor: pointer;
+ &:hover {
+ color: $main-color;
+ }
+ }
+ .icon-star {
+ color: $main-color;
+ }
</style>
diff --git a/src/components/retweet_button/retweet_button.js b/src/components/retweet_button/retweet_button.js
@@ -0,0 +1,19 @@
+const RetweetButton = {
+ props: [ 'status' ],
+ methods: {
+ retweet () {
+ if (!this.status.repeated) {
+ this.$store.dispatch('retweet', {id: this.status.id})
+ }
+ }
+ },
+ computed: {
+ classes () {
+ return {
+ 'retweeted': this.status.repeated
+ }
+ }
+ }
+}
+
+export default RetweetButton
diff --git a/src/components/retweet_button/retweet_button.vue b/src/components/retweet_button/retweet_button.vue
@@ -0,0 +1,22 @@
+<template>
+ <div>
+ <i :class='classes' class='icon-retweet fa' v-on:click.prevent='retweet()'></i>
+ <span v-if='status.repeat_num > 0'>{{status.repeat_num}}</span>
+ </div>
+</template>
+
+<script src="./retweet_button.js" ></script>
+
+<style lang='scss'>
+ @import '../../_variables.scss';
+ .icon-retweet {
+ cursor: pointer;
+ &:hover {
+ color: $green;
+ }
+ }
+ .retweeted {
+ cursor: auto;
+ color: $green;
+ }
+</style>
diff --git a/src/components/status/status.js b/src/components/status/status.js
@@ -1,5 +1,6 @@
import Attachment from '../attachment/attachment.vue'
import FavoriteButton from '../favorite_button/favorite_button.vue'
+import RetweetButton from '../retweet_button/retweet_button.vue'
import PostStatusForm from '../post_status_form/post_status_form.vue'
const Status = {
@@ -24,6 +25,7 @@ const Status = {
components: {
Attachment,
FavoriteButton,
+ RetweetButton,
PostStatusForm
},
methods: {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
@@ -37,9 +37,7 @@
<i class='fa icon-reply'></i>
</a>
</div>
- <div>
- <i class='fa icon-retweet'></i>
- </div>
+ <retweet-button :status=status></retweet-button>
<favorite-button :status=status></favorite-button>
</div>
@@ -53,7 +51,8 @@
<script src="./status.js" ></script>
<style lang="scss">
- .status-el {
+ @import '../../_variables.scss';
+ .status-el {
hyphens: auto;
overflow-wrap: break-word;
word-wrap: break-word;
@@ -68,9 +67,13 @@
margin-top: 3px;
margin-bottom: 3px;
}
- }
+ }
- .status-actions {
+ .status-actions {
padding-top: 5px;
- }
+ }
+
+ .icon-reply:hover {
+ color: $blue;
+ }
</style>
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
@@ -146,6 +146,10 @@ export const mutations = {
const newStatus = find(state.allStatuses, status)
newStatus.favorited = value
},
+ setRetweeted (state, { status, value }) {
+ const newStatus = find(state.allStatuses, status)
+ newStatus.repeated = value
+ },
setLoading (state, { timeline, value }) {
state.timelines[timeline].loading = value
},
@@ -167,6 +171,11 @@ const statuses = {
// Optimistic favoriting...
commit('setFavorited', { status, value: false })
apiService.unfavorite({ id: status.id, credentials: rootState.users.currentUser.credentials })
+ },
+ retweet ({ rootState, commit }, status) {
+ // Optimistic retweeting...
+ commit('setRetweeted', { status, value: true })
+ apiService.retweet({ id: status.id, credentials: rootState.users.currentUser.credentials })
}
},
mutations
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
@@ -5,6 +5,7 @@ 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 RETWEET_URL = '/api/statuses/retweet'
const STATUS_UPDATE_URL = '/api/statuses/update.json'
const MEDIA_UPLOAD_URL = '/api/statusnet/media/upload'
// const CONVERSATION_URL = '/api/statusnet/conversation/';
@@ -63,6 +64,13 @@ const unfavorite = ({ id, credentials }) => {
})
}
+const retweet = ({ id, credentials }) => {
+ return fetch(`${RETWEET_URL}/${id}.json`, {
+ headers: authHeaders(credentials),
+ method: 'POST'
+ })
+}
+
const postStatus = ({credentials, status, mediaIds, inReplyToStatusId}) => {
const idsText = mediaIds.join(',')
const form = new FormData()
@@ -96,6 +104,7 @@ const apiService = {
fetchTimeline,
favorite,
unfavorite,
+ retweet,
postStatus,
uploadMedia
}
