logo

pleroma-fe

My custom branche(s) on git.pleroma.social/pleroma/pleroma-fe
commit: 0be2051588a8da939c329af0704a75ea09fae410
parent: 34bc38f0bf76a9add53652f5a7442be4f7fe9851
Author: Roger Braun <roger@rogerbraun.net>
Date:   Thu, 16 Feb 2017 22:27:10 +0100

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

Diffstat:

M.gitlab-ci.yml11+++++++----
A.node-version1+
Mindex.html2+-
Msrc/App.js6+++++-
Msrc/App.scss4++++
Msrc/App.vue2+-
Msrc/components/status/status.js10++++++++--
Msrc/components/status/status.vue12+++++++++++-
Msrc/main.js7+++++--
Msrc/modules/statuses.js6++++--
Msrc/modules/users.js7+++++--
Msrc/services/style_setter/style_setter.js2+-
Astatic/bg.jpg0
Astatic/bgalt.jpg0
Mstatic/config.json4+++-
Astatic/logo.png0
Mtest/unit/specs/modules/statuses.spec.js18++++++++++++++++++
17 files changed, 74 insertions(+), 18 deletions(-)

diff --git 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 @@ -0,0 +1 @@ +7.2.1 diff --git 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 @@ -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 @@ -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 @@ -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 @@ -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 @@ -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 @@ -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 @@ -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 @@ -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 @@ -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 Binary files differ. diff --git a/static/bgalt.jpg b/static/bgalt.jpg Binary files differ. diff --git 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 Binary files differ. diff --git 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})