Troplo/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Merge branch 'develop' of ssh.gitgud.io:lambadalambda/pleroma-fe into develop

Browse source
This commit is contained in:
Roger Braun 2017-02-16 22:27:10 +01:00
commit 0be2051588
17 changed files with 74 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
.gitlab-ci.yml
View file

@ -1,7 +1,7 @@
# This file is a template, and might need editing before it works on your project. # This file is a template, and might need editing before it works on your project.
# Official framework image. Look for the different tagged releases at: # Official framework image. Look for the different tagged releases at:
# https://hub.docker.com/r/library/node/tags/ # https://hub.docker.com/r/library/node/tags/
image: node:6 image: node:7
before_script: before_script:
# Install ssh-agent if not already installed, it is required by Docker. # Install ssh-agent if not already installed, it is required by Docker.
@ -29,12 +29,14 @@ cache:
test: test:
script: script:
- npm install - npm install -g yarn
- yarn
- npm run unit - npm run unit
build: build:
script: script:
- npm install - npm install -g yarn
- yarn
- npm run build - npm run build
artifacts: artifacts:
paths: paths:
@ -45,6 +47,7 @@ deploy:
only: only:
- develop - develop
script: script:
- npm install - npm install -g yarn
- yarn
- npm run build - npm run build
- scp -r dist/* pleroma@tenshi.heldscal.la:~/pleroma - scp -r dist/* pleroma@tenshi.heldscal.la:~/pleroma

1
.node-version Normal file
View file

@ -0,0 +1 @@
7.2.1

2
index.html
View file

@ -7,7 +7,7 @@
<link rel="stylesheet" href="/static/font/css/fontello.css"> <link rel="stylesheet" href="/static/font/css/fontello.css">
<link rel="stylesheet" href="/static/font/css/animation.css"> <link rel="stylesheet" href="/static/font/css/animation.css">
</head> </head>
<body> <body style="display: none">
<div id="app"></div> <div id="app"></div>
<!-- built files will be auto injected --> <!-- built files will be auto injected -->
</body> </body>

6
src/App.js
View file

@ -14,7 +14,11 @@ export default {
}), }),
computed: { computed: {
currentUser () { return this.$store.state.users.currentUser }, currentUser () { return this.$store.state.users.currentUser },
style () { return { 'background-image': `url(${this.currentUser.background_image})` } }, background () {
return this.currentUser.background_image || this.$store.state.config.background
},
logoStyle () { return { 'background-image': `url(${this.$store.state.config.logo})` } },
style () { return { 'background-image': `url(${this.background})` } },
sitename () { return this.$store.state.config.name } sitename () { return this.$store.state.config.name }
}, },
methods: { methods: {

4
src/App.scss
View file

@ -63,6 +63,10 @@ nav {
align-items: center; align-items: center;
flex-basis: 920px; flex-basis: 920px;
margin: auto; margin: auto;
height: 50px;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
} }
} }

2
src/App.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<div id="app" v-bind:style="style" class="base02-background"> <div id="app" v-bind:style="style" class="base02-background">
<nav class='container base01-background base04'> <nav class='container base01-background base04'>
<div class='inner-nav'> <div class='inner-nav' :style="logoStyle">
<div class='item'> <div class='item'>
<a route-to='friends-timeline' href="#">{{sitename}}</a> <a route-to='friends-timeline' href="#">{{sitename}}</a>
</div> </div>

10
src/components/status/status.js
View file

@ -3,6 +3,7 @@ import FavoriteButton from '../favorite_button/favorite_button.vue'
import RetweetButton from '../retweet_button/retweet_button.vue' import RetweetButton from '../retweet_button/retweet_button.vue'
import DeleteButton from '../delete_button/delete_button.vue' import DeleteButton from '../delete_button/delete_button.vue'
import PostStatusForm from '../post_status_form/post_status_form.vue' import PostStatusForm from '../post_status_form/post_status_form.vue'
import UserCardContent from '../user_card_content/user_card_content.vue'
const Status = { const Status = {
props: [ props: [
@ -12,7 +13,8 @@ const Status = {
data: () => ({ data: () => ({
replying: false, replying: false,
expanded: false, expanded: false,
unmuted: false unmuted: false,
userExpanded: false
}), }),
computed: { computed: {
retweet () { return !!this.statusoid.retweeted_status }, retweet () { return !!this.statusoid.retweeted_status },
@ -34,7 +36,8 @@ const Status = {
FavoriteButton, FavoriteButton,
RetweetButton, RetweetButton,
DeleteButton, DeleteButton,
PostStatusForm PostStatusForm,
UserCardContent
}, },
methods: { methods: {
toggleReplying () { toggleReplying () {
@ -45,6 +48,9 @@ const Status = {
}, },
toggleMute () { toggleMute () {
this.unmuted = !this.unmuted this.unmuted = !this.unmuted
},
toggleUserExpanded () {
this.userExpanded = !this.userExpanded
} }
} }
} }

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

@ -18,10 +18,13 @@
<div class="media status container"> <div class="media status container">
<div class="media-left"> <div class="media-left">
<a :href="status.user.statusnet_profile_url"> <a :href="status.user.statusnet_profile_url">
<img class='avatar' :src="status.user.profile_image_url_original"> <img @click.prevent="toggleUserExpanded" class='avatar' :src="status.user.profile_image_url_original">
</a> </a>
</div> </div>
<div class="media-body"> <div class="media-body">
<div class="base05 base05=border usercard" v-if="userExpanded">
<user-card-content :user="status.user"></user-card-content>
</div>
<div class="user-content"> <div class="user-content">
<h4 class="media-heading"> <h4 class="media-heading">
{{status.user.name}} {{status.user.name}}
@ -147,4 +150,11 @@
display: block; display: block;
margin-left: auto; margin-left: auto;
} }
.usercard {
border-style: solid;
border-width: 1px;
border-radius: 1em;
margin-bottom: 1em;
}
</style> </style>

7
src/main.js
View file

@ -39,7 +39,8 @@ const store = new Vuex.Store({
api: apiModule, api: apiModule,
config: configModule config: configModule
}, },
plugins: [createPersistedState(persistedStateOptions)] plugins: [createPersistedState(persistedStateOptions)],
strict: process.env.NODE_ENV !== 'production'
}) })
const routes = [ const routes = [
@ -72,7 +73,9 @@ new Vue({
window.fetch('/static/config.json') window.fetch('/static/config.json')
.then((res) => res.json()) .then((res) => res.json())
.then(({name, theme}) => { .then(({name, theme, background, logo}) => {
store.dispatch('setOption', { name: 'name', value: name }) store.dispatch('setOption', { name: 'name', value: name })
store.dispatch('setOption', { name: 'theme', value: theme }) store.dispatch('setOption', { name: 'theme', value: theme })
store.dispatch('setOption', { name: 'background', value: background })
store.dispatch('setOption', { name: 'logo', value: logo })
}) })

6
src/modules/statuses.js
View file

@ -153,16 +153,18 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us
} }
} }
// Decide if we should treat the status as new for this timeline.
let resultForCurrentTimeline
// Some statuses should only be added to the global status repository. // Some statuses should only be added to the global status repository.
if (timeline && addToTimeline) { if (timeline && addToTimeline) {
mergeOrAdd(timelineObject.statuses, status) resultForCurrentTimeline = mergeOrAdd(timelineObject.statuses, status)
} }
if (timeline && showImmediately) { if (timeline && showImmediately) {
// Add it directly to the visibleStatuses, don't change // Add it directly to the visibleStatuses, don't change
// newStatusCount // newStatusCount
mergeOrAdd(timelineObject.visibleStatuses, status) mergeOrAdd(timelineObject.visibleStatuses, status)
} else if (timeline && addToTimeline && result.new) { } else if (timeline && addToTimeline && resultForCurrentTimeline.new) {
// Just change newStatuscount // Just change newStatuscount
timelineObject.newStatusCount += 1 timelineObject.newStatusCount += 1
} }

7
src/modules/users.js
View file

@ -33,6 +33,9 @@ export const mutations = {
}, },
addNewUsers (state, users) { addNewUsers (state, users) {
each(users, (user) => mergeOrAdd(state.users, user)) each(users, (user) => mergeOrAdd(state.users, user))
},
setUserForStatus (state, status) {
status.user = find(state.users, status.user)
} }
} }
@ -54,11 +57,11 @@ const users = {
// Reconnect users to statuses // Reconnect users to statuses
each(statuses, (status) => { each(statuses, (status) => {
status.user = find(store.state.users, status.user) store.commit('setUserForStatus', status)
}) })
// Reconnect users to retweets // Reconnect users to retweets
each(compact(map(statuses, 'retweeted_status')), (status) => { each(compact(map(statuses, 'retweeted_status')), (status) => {
status.user = find(store.state.users, status.user) store.commit('setUserForStatus', status)
}) })
}, },
loginUser (store, userCredentials) { loginUser (store, userCredentials) {

2
src/services/style_setter/style_setter.js
View file

@ -34,7 +34,7 @@ const setStyle = (href) => {
styleSheet.insertRule(`a { color: ${base08Color}`, 'index-max') styleSheet.insertRule(`a { color: ${base08Color}`, 'index-max')
styleSheet.insertRule(`body { color: ${base05Color}`, 'index-max') styleSheet.insertRule(`body { color: ${base05Color}`, 'index-max')
styleSheet.insertRule(`.base05-border { color: ${base05Color}`, 'index-max') styleSheet.insertRule(`.base05-border { border-color: ${base05Color}`, 'index-max')
body.style.display = 'initial' body.style.display = 'initial'
} }
cssEl.addEventListener('load', setDynamic) cssEl.addEventListener('load', setDynamic)

BIN
static/bg.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 224 KiB

BIN
static/bgalt.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 323 KiB

4
static/config.json
View file

@ -1,4 +1,6 @@
{ {
"name": "Pleroma FE", "name": "Pleroma FE",
"theme": "base16-ashes.css" "theme": "base16-ashes.css",
"background": "/static/bg.jpg",
"logo": "/static/logo.png"
} }

BIN
static/logo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.4 KiB

18
test/unit/specs/modules/statuses.spec.js
View file

@ -79,6 +79,24 @@ describe('The Statuses module', () => {
expect(state.timelines.public.newStatusCount).to.equal(1) expect(state.timelines.public.newStatusCount).to.equal(1)
}) })
it('counts the status as new if it has not been seen on this timeline', () => {
const state = cloneDeep(defaultState)
const status = makeMockStatus({id: 1})
mutations.addNewStatuses(state, { statuses: [status], timeline: 'public' })
mutations.addNewStatuses(state, { statuses: [status], timeline: 'friends' })
expect(state.allStatuses).to.eql([status])
expect(state.timelines.public.statuses).to.eql([status])
expect(state.timelines.public.visibleStatuses).to.eql([])
expect(state.timelines.public.newStatusCount).to.equal(1)
expect(state.allStatuses).to.eql([status])
expect(state.timelines.friends.statuses).to.eql([status])
expect(state.timelines.friends.visibleStatuses).to.eql([])
expect(state.timelines.friends.newStatusCount).to.equal(1)
})
it('add the statuses to allStatuses if no timeline is given', () => { it('add the statuses to allStatuses if no timeline is given', () => {
const state = cloneDeep(defaultState) const state = cloneDeep(defaultState)
const status = makeMockStatus({id: 1}) const status = makeMockStatus({id: 1})