AkkomaGang
/
akkoma-fe
4
13
Fork 56
Code Issues 73 Pull Requests 18 Projects Releases 1 Wiki Activity

Merge branch 'develop' into feature/hash-routed

This commit is contained in:
Roger Braun 2017-02-04 13:57:24 +01:00
parent 51473f0484 2269e815e1
commit 670298cca1
17 changed files with 106 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
README.md
View File

@ -2,6 +2,10 @@
> A Qvitter-style frontend for certain GS servers.
# FOR ADMINS
You don't need to build Pleroma yourself. Check out https://gitgud.io/lambadalambda/pleroma-fe/wikis/dual-boot-with-qvitter to see how to run Pleroma and Qvitter at the same time.
## Build Setup
``` bash

19
src/components/conversation-page/conversation-page.js Normal file
View File

@ -0,0 +1,19 @@
import Conversation from '../conversation/conversation.vue'
import { find, toInteger } from 'lodash'
const conversationPage = {
components: {
Conversation
},
computed: {
statusoid () {
const id = toInteger(this.$route.params.id)
const statuses = this.$store.state.statuses.allStatuses
const status = find(statuses, {id})
return status
}
}
}
export default conversationPage

5
src/components/conversation-page/conversation-page.vue Normal file
View File

@ -0,0 +1,5 @@
<template>
<conversation :collapsable="false" :statusoid="statusoid"></conversation>
</template>
<script src="./conversation-page.js"></script>

14
src/components/conversation/conversation.js
View File

@ -1,4 +1,4 @@
import { find, filter, sortBy, toInteger } from 'lodash'
import { filter, sortBy } from 'lodash'
import { statusType } from '../../modules/statuses.js'
import Status from '../status/status.vue'
@ -8,14 +8,12 @@ const sortAndFilterConversation = (conversation) => {
}
const conversation = {
props: [
'statusoid',
'collapsable'
],
computed: {
status () {
const id = toInteger(this.$route.params.id)
const statuses = this.$store.state.statuses.allStatuses
const status = find(statuses, {id})
return status
},
status () { return this.statusoid },
conversation () {
if (!this.status) {
return false

9
src/components/conversation/conversation.vue
View File

@ -1,9 +1,14 @@
<template>
<div class="timeline panel panel-default base00-background">
<div class="panel-heading base01-background base04">Status</div>
<div class="panel-heading base01-background base04">
Conversation
<div v-if="collapsable">
<small><a href="#" @click.prevent="$emit('toggleExpanded')">Collapse</a></small>
</div>
</div>
<div class="panel-body">
<div class="timeline">
<status v-for="status in conversation" :key="status.id" v-bind:statusoid="status"></status>
<status v-for="status in conversation" :key="status.id" v-bind:statusoid="status":expandable='false'></status>
</div>
</div>
</div>

2
src/components/friends_timeline/friends_timeline.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="timeline panel panel-default base00-background">
<div class="timeline panel panel-default">
<div class="panel-heading base01-background base04">Friends Timeline</div>
<div class="panel-body">
<Timeline v-bind:timeline="timeline" v-bind:timeline-name="'friends'"/>

2
src/components/mentions/mentions.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="timeline panel panel-default base00-background">
<div class="timeline panel panel-default">
<div class="panel-heading base01-background base04">Mentions</div>
<div class="panel-body">
<Timeline v-bind:timeline="timeline" v-bind:timeline-name="'mentions'"/>

6
src/components/notifications/notifications.vue
View File

@ -9,15 +9,15 @@
</a>
<div class='text'>
<div v-if="notification.type === 'favorite'">
<h1>{{ notification.action.user.name }}<i class="fa icon-star"></i> favorited your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</h1>
<h1>{{ notification.action.user.name }}<br><i class="fa icon-star"></i> favorited your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</h1>
<p>{{ notification.status.text }}</p>
</div>
<div v-if="notification.type === 'repeat'">
<h1>{{ notification.action.user.name }}<i class="fa icon-retweet"></i> repeated your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</h1>
<h1>{{ notification.action.user.name }}<br><i class="fa icon-retweet"></i> repeated your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</h1>
<p>{{ notification.status.text }}</p>
</div>
<div v-if="notification.type === 'mention'">
<h1>{{ notification.action.user.name }}<i class="fa icon-reply"></i> <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">mentioned</router-link> you</h1>
<h1>{{ notification.action.user.name }}<br><i class="fa icon-reply"></i> <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">mentioned</router-link> you</h1>
<p>{{ notification.status.text }}</p>
</div>
</div>

2
src/components/public_and_external_timeline/public_and_external_timeline.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="timeline panel panel-default base00-background">
<div class="timeline panel panel-default">
<div class="panel-heading base01-background base04">THE WHOLE KNOWN NETWORK</div>
<div class="panel-body">
<Timeline v-bind:timeline="timeline" v-bind:timeline-name="'publicAndExternal'"/>

2
src/components/public_timeline/public_timeline.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="timeline panel panel-default base00-background">
<div class="timeline panel panel-default">
<div class="panel-heading base01-background base04">Public Timeline</div>
<div class="panel-body">
<Timeline v-bind:timeline="timeline" v-bind:timeline-name="'public'"/>

11
src/components/status/status.js
View File

@ -5,9 +5,13 @@ import DeleteButton from '../delete_button/delete_button.vue'
import PostStatusForm from '../post_status_form/post_status_form.vue'
const Status = {
props: [ 'statusoid' ],
props: [
'statusoid',
'expandable'
],
data: () => ({
replying: false
replying: false,
expanded: false
}),
computed: {
retweet () { return !!this.statusoid.retweeted_status },
@ -33,6 +37,9 @@ const Status = {
methods: {
toggleReplying () {
this.replying = !this.replying
},
toggleExpanded () {
this.$emit('toggleExpanded')
}
}
}

12
src/components/status/status.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="status-el" v-if="!status.deleted">
<div class="status-el base00-background" v-if="!status.deleted">
<div v-if="retweet" class="media container retweet-info">
<div class="media-left">
<i class='fa icon-retweet retweeted'></i>
@ -30,6 +30,12 @@
<timeago :since="status.created_at" :auto-update="60"></timeago>
</router-link>
</small>
<template v-if="expandable">
-
<small>
<a href="#" @click.prevent="toggleExpanded" >Expand</a>
</small>
</template>
<small v-if="!status.is_local" class="source_url">
<a :href="status.external_url" target="_blank" >Source</a>
</small>
@ -122,8 +128,4 @@
padding-right: 1em;
border-bottom: 1px solid;
}
.status-el:last-child .status {
border-bottom: none
}
</style>

22
src/components/status_or_conversation/status_or_conversation.js Normal file
View File

@ -0,0 +1,22 @@
import Status from '../status/status.vue'
import Conversation from '../conversation/conversation.vue'
const statusOrConversation = {
props: ['statusoid'],
data () {
return {
expanded: false
}
},
components: {
Status,
Conversation
},
methods: {
toggleExpanded () {
this.expanded = !this.expanded
}
}
}
export default statusOrConversation

14
src/components/status_or_conversation/status_or_conversation.vue Normal file
View File

@ -0,0 +1,14 @@
<template>
<div>
<conversation v-if="expanded" @toggleExpanded="toggleExpanded" :collapsable="true" :statusoid="statusoid"></conversation>
<status v-if="!expanded" @toggleExpanded="toggleExpanded" :expandable="true" :statusoid="statusoid"></status>
</div>
</template>
<script src="./status_or_conversation.js"></script>
<style lang="scss">
.spacer {
height: 1em
}
</style>

4
src/components/timeline/timeline.js
View File

@ -1,5 +1,6 @@
import Status from '../status/status.vue'
import timelineFetcher from '../../services/timeline_fetcher/timeline_fetcher.service.js'
import StatusOrConversation from '../status_or_conversation/status_or_conversation.vue'
const Timeline = {
props: [
@ -7,7 +8,8 @@ const Timeline = {
'timelineName'
],
components: {
Status
Status,
StatusOrConversation
},
created () {
const store = this.$store

2
src/components/timeline/timeline.vue
View File

@ -7,7 +7,7 @@
</p>
</div>
</a>
<status v-for="status in timeline.visibleStatuses" :key="status.id" v-bind:statusoid="status"></status>
<status-or-conversation v-for="status in timeline.visibleStatuses" :key="status.id" v-bind:statusoid="status"></status-or-conversation>
<a href="#" v-on:click.prevent='fetchOlderStatuses()' v-if="!timeline.loading">
<div class="base01-background base05-border new-status-notification">
<p class="text-center" >

4
src/main.js
View File

@ -5,7 +5,7 @@ import App from './App.vue'
import PublicTimeline from './components/public_timeline/public_timeline.vue'
import PublicAndExternalTimeline from './components/public_and_external_timeline/public_and_external_timeline.vue'
import FriendsTimeline from './components/friends_timeline/friends_timeline.vue'
import Conversation from './components/conversation/conversation.vue'
import ConversationPage from './components/conversation-page/conversation-page.vue'
import Mentions from './components/mentions/mentions.vue'
import UserProfile from './components/user_profile/user_profile.vue'
@ -39,7 +39,7 @@ const routes = [
{ path: '/main/all', component: PublicAndExternalTimeline },
{ path: '/main/public', component: PublicTimeline },
{ path: '/main/friends', component: FriendsTimeline },
{ name: 'conversation', path: '/notice/:id', component: Conversation },
{ name: 'conversation', path: '/notice/:id', component: ConversationPage },
{ name: 'user-profile', path: '/users/:id', component: UserProfile },
{ name: 'mentions', path: '/:username/mentions', component: Mentions }
]