diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index fbe1f599..c05e34f4 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -1,7 +1,7 @@
# 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:
# https://hub.docker.com/r/library/node/tags/
-image: node:6
+image: node:7
before_script:
# Install ssh-agent if not already installed, it is required by Docker.
@@ -29,12 +29,14 @@ cache:
test:
script:
- - npm install
+ - npm install -g yarn
+ - yarn
- npm run unit
build:
script:
- - npm install
+ - npm install -g yarn
+ - yarn
- npm run build
artifacts:
paths:
@@ -45,6 +47,7 @@ deploy:
only:
- develop
script:
- - npm install
+ - npm install -g yarn
+ - yarn
- npm run build
- scp -r dist/* pleroma@tenshi.heldscal.la:~/pleroma
diff --git a/.node-version b/.node-version
new file mode 100644
index 00000000..b26a34e4
--- /dev/null
+++ b/.node-version
@@ -0,0 +1 @@
+7.2.1
diff --git a/index.html b/index.html
index 52216b15..668b21bb 100644
--- a/index.html
+++ b/index.html
@@ -7,7 +7,7 @@
<link rel="stylesheet" href="/static/font/css/fontello.css">
<link rel="stylesheet" href="/static/font/css/animation.css">
</head>
- <body>
+ <body style="display: none">
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
diff --git a/src/App.js b/src/App.js
index 03421c62..4b0e81d0 100644
--- a/src/App.js
+++ b/src/App.js
@@ -14,7 +14,11 @@ export default {
}),
computed: {
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 }
},
methods: {
diff --git a/src/App.scss b/src/App.scss
index e5d4c74f..b7bbf8ef 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -63,6 +63,10 @@ nav {
align-items: center;
flex-basis: 920px;
margin: auto;
+ height: 50px;
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: contain;
}
}
diff --git a/src/App.vue b/src/App.vue
index fc510fda..7bd79280 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,7 +1,7 @@
<template>
<div id="app" v-bind:style="style" class="base02-background">
<nav class='container base01-background base04'>
- <div class='inner-nav'>
+ <div class='inner-nav' :style="logoStyle">
<div class='item'>
<a route-to='friends-timeline' href="#">{{sitename}}</a>
</div>
diff --git a/src/components/status/status.js b/src/components/status/status.js
index 3d1d50fb..030e22b5 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -3,6 +3,7 @@ import FavoriteButton from '../favorite_button/favorite_button.vue'
import RetweetButton from '../retweet_button/retweet_button.vue'
import DeleteButton from '../delete_button/delete_button.vue'
import PostStatusForm from '../post_status_form/post_status_form.vue'
+import UserCardContent from '../user_card_content/user_card_content.vue'
const Status = {
props: [
@@ -12,7 +13,8 @@ const Status = {
data: () => ({
replying: false,
expanded: false,
- unmuted: false
+ unmuted: false,
+ userExpanded: false
}),
computed: {
retweet () { return !!this.statusoid.retweeted_status },
@@ -34,7 +36,8 @@ const Status = {
FavoriteButton,
RetweetButton,
DeleteButton,
- PostStatusForm
+ PostStatusForm,
+ UserCardContent
},
methods: {
toggleReplying () {
@@ -45,6 +48,9 @@ const Status = {
},
toggleMute () {
this.unmuted = !this.unmuted
+ },
+ toggleUserExpanded () {
+ this.userExpanded = !this.userExpanded
}
}
}
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index c215a00b..0c004936 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -18,10 +18,13 @@
<div class="media status container">
<div class="media-left">
<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>
</div>
<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">
<h4 class="media-heading">
{{status.user.name}}
@@ -147,4 +150,11 @@
display: block;
margin-left: auto;
}
+
+ .usercard {
+ border-style: solid;
+ border-width: 1px;
+ border-radius: 1em;
+ margin-bottom: 1em;
+ }
</style>
diff --git a/src/main.js b/src/main.js
index 9917ccd9..dfff1444 100644
--- a/src/main.js
+++ b/src/main.js
@@ -39,7 +39,8 @@ const store = new Vuex.Store({
api: apiModule,
config: configModule
},
- plugins: [createPersistedState(persistedStateOptions)]
+ plugins: [createPersistedState(persistedStateOptions)],
+ strict: process.env.NODE_ENV !== 'production'
})
const routes = [
@@ -72,7 +73,9 @@ new Vue({
window.fetch('/static/config.json')
.then((res) => res.json())
- .then(({name, theme}) => {
+ .then(({name, theme, background, logo}) => {
store.dispatch('setOption', { name: 'name', value: name })
store.dispatch('setOption', { name: 'theme', value: theme })
+ store.dispatch('setOption', { name: 'background', value: background })
+ store.dispatch('setOption', { name: 'logo', value: logo })
})
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index b1aa404a..871172b5 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -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.
if (timeline && addToTimeline) {
- mergeOrAdd(timelineObject.statuses, status)
+ resultForCurrentTimeline = mergeOrAdd(timelineObject.statuses, status)
}
if (timeline && showImmediately) {
// Add it directly to the visibleStatuses, don't change
// newStatusCount
mergeOrAdd(timelineObject.visibleStatuses, status)
- } else if (timeline && addToTimeline && result.new) {
+ } else if (timeline && addToTimeline && resultForCurrentTimeline.new) {
// Just change newStatuscount
timelineObject.newStatusCount += 1
}
diff --git a/src/modules/users.js b/src/modules/users.js
index dd65afe1..ae90abbd 100644
--- a/src/modules/users.js
+++ b/src/modules/users.js
@@ -33,6 +33,9 @@ export const mutations = {
},
addNewUsers (state, users) {
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
each(statuses, (status) => {
- status.user = find(store.state.users, status.user)
+ store.commit('setUserForStatus', status)
})
// Reconnect users to retweets
each(compact(map(statuses, 'retweeted_status')), (status) => {
- status.user = find(store.state.users, status.user)
+ store.commit('setUserForStatus', status)
})
},
loginUser (store, userCredentials) {
diff --git a/src/services/style_setter/style_setter.js b/src/services/style_setter/style_setter.js
index 79b68b38..0a5be77d 100644
--- a/src/services/style_setter/style_setter.js
+++ b/src/services/style_setter/style_setter.js
@@ -34,7 +34,7 @@ const setStyle = (href) => {
styleSheet.insertRule(`a { color: ${base08Color}`, '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'
}
cssEl.addEventListener('load', setDynamic)
diff --git a/static/bg.jpg b/static/bg.jpg
new file mode 100644
index 00000000..60e2311a
Binary files /dev/null and b/static/bg.jpg differ
diff --git a/static/bgalt.jpg b/static/bgalt.jpg
new file mode 100644
index 00000000..fdb666ff
Binary files /dev/null and b/static/bgalt.jpg differ
diff --git a/static/config.json b/static/config.json
index 058c9875..fb8d4015 100644
--- a/static/config.json
+++ b/static/config.json
@@ -1,4 +1,6 @@
{
"name": "Pleroma FE",
- "theme": "base16-ashes.css"
+ "theme": "base16-ashes.css",
+ "background": "/static/bg.jpg",
+ "logo": "/static/logo.png"
}
diff --git a/static/logo.png b/static/logo.png
new file mode 100644
index 00000000..f83d923b
Binary files /dev/null and b/static/logo.png differ
diff --git a/test/unit/specs/modules/statuses.spec.js b/test/unit/specs/modules/statuses.spec.js
index c130cbf3..b1581e03 100644
--- a/test/unit/specs/modules/statuses.spec.js
+++ b/test/unit/specs/modules/statuses.spec.js
@@ -79,6 +79,24 @@ describe('The Statuses module', () => {
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', () => {
const state = cloneDeep(defaultState)
const status = makeMockStatus({id: 1})