kopia lustrzana https://github.com/nextcloud/social
add dashboard widget, only handling internal 'Follow' subtypes for the moment
Signed-off-by: Julien Veyssier <eneiluj@posteo.net>pull/1162/head
Julien Veyssier
Carl Schwan
rodzic
3d439139d2
commit
0915e4e101
|
|
@ -0,0 +1,7 @@
|
|||
.icon-social {
|
||||
background-image: url('../img/social-dark.svg');
|
||||
}
|
||||
|
||||
body.theme--dark .icon-social {
|
||||
background-image: url('../img/social.svg');
|
||||
}
|
||||
|
|
@ -0,0 +1,87 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
id="Layer_1"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="67.6 244 270 309"
|
||||
enable-background="new 67.6 244 270 309"
|
||||
xml:space="preserve"
|
||||
sodipodi:docname="add_user.svg"
|
||||
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"><metadata
|
||||
id="metadata21"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs19" /><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1051"
|
||||
id="namedview17"
|
||||
showgrid="false"
|
||||
inkscape:zoom="2.1602227"
|
||||
inkscape:cx="83.542346"
|
||||
inkscape:cy="161.45735"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="-37"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="g14" />
|
||||
<g
|
||||
id="g14"
|
||||
style="stroke:#fffffc;stroke-width:30.91535837;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers;fill:#000000;fill-opacity:1"
|
||||
transform="matrix(0.90269049,0,0,0.90269049,23.302152,39.704365)">
|
||||
<path
|
||||
style="opacity:1;fill:#f8ffff;fill-opacity:1;stroke:#ffffc1;stroke-width:40.22747803;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0;paint-order:stroke fill markers"
|
||||
id="path833"
|
||||
sodipodi:type="arc"
|
||||
sodipodi:cx="198.81808"
|
||||
sodipodi:cy="396.06561"
|
||||
sodipodi:rx="149.41031"
|
||||
sodipodi:ry="149.1562"
|
||||
sodipodi:start="0"
|
||||
sodipodi:end="6.2410531"
|
||||
sodipodi:open="true"
|
||||
d="M 348.22839,396.06561 A 149.41031,149.1562 0 0 1 200.3918,545.21354 149.41031,149.1562 0 0 1 49.440927,399.20752 149.41031,149.1562 0 0 1 194.09763,246.98387 149.41031,149.1562 0 0 1 348.0958,389.78319" /><path
|
||||
d="m 149.87655,358.96547 c 1.05278,0.70188 2.10559,1.31601 3.24612,1.93014 7.63279,4.12346 16.58158,6.49226 25.88132,6.49226 8.77331,0 17.10797,-2.1056 24.38983,-5.7904 1.66693,-0.7896 3.24613,-1.75465 4.73759,-2.71973 15.17787,-9.65065 25.17945,-26.58317 25.17945,-45.88448 0,-30.00478 -24.30211,-54.30689 -54.30687,-54.30689 -30.00478,0.0878 -54.39462,24.38984 -54.39462,54.39462 0,19.30132 10.08932,36.23383 25.26718,45.88448 z"
|
||||
id="path2"
|
||||
style="fill:#2290d9;fill-opacity:1;stroke:#fffffc;stroke-width:40.5930941;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
inkscape:connector-curvature="0" />
|
||||
<g
|
||||
id="g10"
|
||||
style="fill:#2290d9;fill-opacity:1;stroke:#fffffc;stroke-width:46.26876822;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
transform="matrix(0.8773325,0,0,0.8773325,0.00262653,62.228176)">
|
||||
<path
|
||||
d="M 307.8,472.6 C 293.90109,406.30634 277.33359,395.35461 236.37585,401.91788 224.22113,403.86562 209.91842,407.35586 192.9,411.4 l -44.7,-32.9 c -56.1,6.7 -70.4,48.7 -70.4,99.5 0,55.5 47.91028,41.79733 111.41028,41.79733 4.55498,-0.049 8.82135,-0.22353 12.86645,-0.50114 1.99618,-0.137 3.92956,-0.47024 5.83497,-0.48358 34.63497,-0.2424 112.90594,15.34274 99.8883,-46.21261 z"
|
||||
id="path4"
|
||||
style="fill:#2290d9;fill-opacity:1;stroke:#fffffc;stroke-width:46.26876822;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
inkscape:connector-curvature="0"
|
||||
sodipodi:nodetypes="csccscssc" />
|
||||
<path
|
||||
d="M 307.8,472.6"
|
||||
id="path6"
|
||||
style="fill:#2290d9;fill-opacity:1;stroke:#fffffc;stroke-width:46.26876822;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
inkscape:connector-curvature="0" />
|
||||
|
||||
</g>
|
||||
<polygon
|
||||
points="250,445.1 250,480.4 214.8,480.4 214.8,510.7 250,510.7 250,545.9 280.3,545.9 280.3,510.7 315.5,510.7 315.5,480.4 280.3,480.4 280.3,445.1 "
|
||||
id="polygon12"
|
||||
style="fill:#2290d9;fill-opacity:1;stroke:#fffffc;stroke-width:34.87776947;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
transform="matrix(1.3568552,0,0,1.3568552,-91.018741,-238.59249)" />
|
||||
</g>
|
||||
</svg>
|
||||
|
Po Szerokość: | Wysokość: | Rozmiar: 4.6 KiB |
|
|
@ -38,6 +38,7 @@ use OCA\Social\Service\ConfigService;
|
|||
use OCA\Social\Service\UpdateService;
|
||||
use OCA\Social\WellKnown\WebfingerHandler;
|
||||
use OCA\Social\Listeners\ProfileSectionListener;
|
||||
use OCA\Social\Dashboard\SocialWidget;
|
||||
use OCP\AppFramework\App;
|
||||
use OCP\AppFramework\Bootstrap\IBootContext;
|
||||
use OCP\AppFramework\Bootstrap\IBootstrap;
|
||||
|
|
@ -68,6 +69,7 @@ class Application extends App implements IBootstrap {
|
|||
$context->registerSearchProvider(UnifiedSearchProvider::class);
|
||||
$context->registerWellKnownHandler(WebfingerHandler::class);
|
||||
$context->registerEventListener(BeforeTemplateRenderedEvent::class, ProfileSectionListener::class);
|
||||
$context->registerDashboardWidget(SocialWidget::class);
|
||||
}
|
||||
|
||||
public function boot(IBootContext $context): void {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,83 @@
|
|||
<?php
|
||||
/**
|
||||
* @copyright Copyright (c) 2020 Julien Veyssier <eneiluj@posteo.net>
|
||||
*
|
||||
* @author Julien Veyssier <eneiluj@posteo.net>
|
||||
*
|
||||
* @license GNU AGPL version 3 or any later version
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU Affero General Public License as
|
||||
* published by the Free Software Foundation, either version 3 of the
|
||||
* License, or (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU Affero General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Affero General Public License
|
||||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*
|
||||
*/
|
||||
|
||||
namespace OCA\Social\Dashboard;
|
||||
|
||||
use OCP\Dashboard\IWidget;
|
||||
use OCP\IL10N;
|
||||
use OCA\Social\AppInfo\Application;
|
||||
|
||||
class SocialWidget implements IWidget {
|
||||
|
||||
/** @var IL10N */
|
||||
private $l10n;
|
||||
|
||||
public function __construct(
|
||||
IL10N $l10n
|
||||
) {
|
||||
$this->l10n = $l10n;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
public function getId(): string {
|
||||
return 'social_notifications';
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
public function getTitle(): string {
|
||||
return $this->l10n->t('Social notifications');
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
public function getOrder(): int {
|
||||
return 10;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
public function getIconClass(): string {
|
||||
return 'icon-social';
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
public function getUrl(): ?string {
|
||||
return \OC::$server->getURLGenerator()->linkToRoute('social.local.streamNotifications', []);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
public function load(): void {
|
||||
\OC_Util::addScript(Application::APP_NAME, 'dashboard');
|
||||
\OC_Util::addStyle(Application::APP_NAME, 'dashboard');
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
/* jshint esversion: 6 */
|
||||
|
||||
/**
|
||||
* Nextcloud - social
|
||||
*
|
||||
*
|
||||
* This file is licensed under the Affero General Public License version 3 or
|
||||
* later. See the COPYING file.
|
||||
*
|
||||
* @author Julien Veyssier <eneiluj@posteo.net>
|
||||
* @copyright Julien Veyssier 2020
|
||||
*/
|
||||
|
||||
import Vue from 'vue'
|
||||
import { translate, translatePlural } from '@nextcloud/l10n'
|
||||
import Dashboard from './views/Dashboard'
|
||||
|
||||
Vue.prototype.t = translate
|
||||
Vue.prototype.n = translatePlural
|
||||
Vue.prototype.OC = window.OC
|
||||
Vue.prototype.OCA = window.OCA
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
OCA.Dashboard.register('social_notifications', (el, { widget }) => {
|
||||
const View = Vue.extend(Dashboard)
|
||||
new View({
|
||||
propsData: { title: widget.title },
|
||||
}).$mount(el)
|
||||
})
|
||||
|
||||
})
|
||||
|
|
@ -0,0 +1,200 @@
|
|||
<template>
|
||||
<DashboardWidget :items="items"
|
||||
:show-more-url="showMoreUrl"
|
||||
:show-more-text="title"
|
||||
:loading="state === 'loading'">
|
||||
<template #empty-content>
|
||||
<EmptyContent
|
||||
v-if="emptyContentMessage"
|
||||
:icon="emptyContentIcon">
|
||||
<template #desc>
|
||||
{{ emptyContentMessage }}
|
||||
<div v-if="state === 'error'" class="connect-button">
|
||||
<a class="button" :href="appUrl">
|
||||
{{ t('social', 'Go to Social app') }}
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
</EmptyContent>
|
||||
</template>
|
||||
</DashboardWidget>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from '@nextcloud/axios'
|
||||
import { generateUrl } from '@nextcloud/router'
|
||||
import { showError, showSuccess } from '@nextcloud/dialogs'
|
||||
import moment from '@nextcloud/moment'
|
||||
import { DashboardWidget } from '@nextcloud/vue-dashboard'
|
||||
import EmptyContent from '@nextcloud/vue/dist/Components/EmptyContent'
|
||||
|
||||
export default {
|
||||
name: 'Dashboard',
|
||||
|
||||
components: {
|
||||
DashboardWidget,
|
||||
EmptyContent,
|
||||
},
|
||||
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
notifications: [],
|
||||
showMoreUrl: generateUrl('/apps/social/timeline/notifications'),
|
||||
showMoreText: t('social', 'Social notifications'),
|
||||
loop: null,
|
||||
state: 'loading',
|
||||
appUrl: generateUrl('/apps/social'),
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
items() {
|
||||
return this.notifications.map((n) => {
|
||||
return {
|
||||
id: n.id,
|
||||
targetUrl: this.getNotificationTarget(n),
|
||||
avatarUrl: this.getAvatarUrl(n),
|
||||
avatarUsername: this.getActorName(n),
|
||||
overlayIconUrl: this.getNotificationTypeImage(n),
|
||||
mainText: this.getMainText(n),
|
||||
subText: this.getSubline(n),
|
||||
}
|
||||
})
|
||||
},
|
||||
lastTimestamp() {
|
||||
return this.notifications.length
|
||||
? this.notifications[0].publishedTime
|
||||
: 0
|
||||
},
|
||||
emptyContentMessage() {
|
||||
if (this.state === 'error') {
|
||||
return t('social', 'Error getting Social notifications')
|
||||
} else if (this.state === 'ok') {
|
||||
return t('social', 'No Social notifications!')
|
||||
}
|
||||
return ''
|
||||
},
|
||||
emptyContentIcon() {
|
||||
if (this.state === 'error') {
|
||||
return 'icon-close'
|
||||
} else if (this.state === 'ok') {
|
||||
return 'icon-checkmark'
|
||||
}
|
||||
return 'icon-checkmark'
|
||||
},
|
||||
},
|
||||
|
||||
beforeMount() {
|
||||
this.fetchNotifications()
|
||||
this.loop = setInterval(() => this.fetchNotifications(), 10000)
|
||||
},
|
||||
|
||||
methods: {
|
||||
fetchNotifications() {
|
||||
const req = {
|
||||
params: {
|
||||
limit: 10,
|
||||
},
|
||||
}
|
||||
const url = generateUrl('/apps/social/api/v1/stream/notifications')
|
||||
// TODO check why 'since' param is in fact 'until'
|
||||
/* if (this.lastDate) {
|
||||
req.params.since = this.lastTimestamp,
|
||||
} */
|
||||
axios.get(url, req).then((response) => {
|
||||
if (response.data?.result) {
|
||||
this.processNotifications(response.data.result)
|
||||
this.state = 'ok'
|
||||
} else {
|
||||
this.state = 'error'
|
||||
}
|
||||
}).catch((error) => {
|
||||
clearInterval(this.loop)
|
||||
if (error.response?.status && error.response.status >= 400) {
|
||||
showError(t('social', 'Failed to get Social notifications'))
|
||||
this.state = 'error'
|
||||
} else {
|
||||
// there was an error in notif processing
|
||||
console.error(error)
|
||||
}
|
||||
})
|
||||
},
|
||||
processNotifications(newNotifications) {
|
||||
if (this.lastTimestamp !== 0) {
|
||||
// just add those which are more recent than our most recent one
|
||||
let i = 0
|
||||
while (i < newNotifications.length && this.lastTimestamp < newNotifications[i].publishedTime) {
|
||||
i++
|
||||
}
|
||||
if (i > 0) {
|
||||
const toAdd = this.filter(newNotifications.slice(0, i))
|
||||
this.notifications = toAdd.concat(this.notifications)
|
||||
}
|
||||
} else {
|
||||
// first time, we don't check the date
|
||||
this.notifications = this.filter(newNotifications)
|
||||
}
|
||||
},
|
||||
filter(notifications) {
|
||||
return notifications
|
||||
// TODO check if we need to filter
|
||||
/* return notifications.filter((n) => {
|
||||
return (n.type === 'something' || n.subtype === 'somethingElse')
|
||||
}) */
|
||||
},
|
||||
getMainText(n) {
|
||||
if (n.subtype === 'Follow') {
|
||||
return t('social', '{account} is following you', { account: this.getActorName(n) })
|
||||
}
|
||||
},
|
||||
getAvatarUrl(n) {
|
||||
return undefined
|
||||
// TODO get external and internal avatars
|
||||
/* return this.getActorAccountName(n)
|
||||
? generateUrl('???')
|
||||
: undefined */
|
||||
},
|
||||
getActorName(n) {
|
||||
return n.actor_info && n.actor_info.type === 'Person' && n.actor_info.preferredUsername
|
||||
? n.actor_info.preferredUsername
|
||||
: ''
|
||||
},
|
||||
getActorAccountName(n) {
|
||||
return n.actor_info && n.actor_info.type === 'Person' && n.actor_info.account
|
||||
? n.actor_info.account
|
||||
: ''
|
||||
},
|
||||
getNotificationTarget(n) {
|
||||
if (n.subtype === 'Follow') {
|
||||
return generateUrl('/apps/social/@' + this.getActorAccountName(n) + '/')
|
||||
}
|
||||
return this.showMoreUrl
|
||||
},
|
||||
getSubline(n) {
|
||||
if (n.subtype === 'Follow') {
|
||||
return this.getActorAccountName(n)
|
||||
}
|
||||
return ''
|
||||
},
|
||||
getNotificationTypeImage(n) {
|
||||
if (n.subtype === 'Follow') {
|
||||
return generateUrl('/svg/social/add_user')
|
||||
}
|
||||
return ''
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
::v-deep .connect-button {
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -8,6 +8,5 @@ webpackConfig.entry = {
|
|||
social: path.join(__dirname, 'src', 'main.js'),
|
||||
ostatus: path.join(__dirname, 'src', 'ostatus.js'),
|
||||
profilePage: path.join(__dirname, 'src', 'profile.js'),
|
||||
dashboard: path.join(__dirname, 'src', 'dashboard.js'),
|
||||
}
|
||||
|
||||
module.exports = webpackConfig
|
||||
|
|
|
|||
|
|
@ -1,12 +0,0 @@
|
|||
const { merge } = require('webpack-merge');
|
||||
const common = require('./webpack.common.js');
|
||||
|
||||
module.exports = merge(common, {
|
||||
mode: 'development',
|
||||
devServer: {
|
||||
historyApiFallback: true,
|
||||
noInfo: true,
|
||||
overlay: true
|
||||
},
|
||||
devtool: 'source-map',
|
||||
})
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
const { merge } = require('webpack-merge')
|
||||
const common = require('./webpack.common.js')
|
||||
|
||||
module.exports = merge(common, {
|
||||
mode: 'production',
|
||||
devtool: '#source-map'
|
||||
})
|
||||
Ładowanie…
Reference in New Issue