Verified Commit 87c5283e authored by Georg Krause's avatar Georg Krause
Browse files

Lint all changes files

parent 625a9b3d
<template>
<main class="main pusher page-about" v-title="labels.title">
<main
v-title="labels.title"
class="main pusher page-about"
>
<div class="ui container">
<div class="ui horizontally fitted basic stripe segment">
<div class="ui horizontally fitted basic very padded segment">
<div class="ui center aligned text container">
<div class="ui text container">
<div class="ui equal width compact stackable grid">
<div class="column"></div>
<div class="column" />
<div class="ten wide column">
<div class="ui vertically fitted basic segment">
<router-link to="/">
......@@ -14,68 +17,115 @@
</router-link>
</div>
</div>
<div class="column"></div>
<div class="column" />
</div>
<h2 class="header">
<translate translate-context="Content/About/Heading">A social platform to enjoy and share music</translate>
<translate translate-context="Content/About/Heading">
A social platform to enjoy and share music
</translate>
</h2>
<p>
<translate translate-context="Content/About/Paragraph">Funkwhale is a community-driven project that lets you listen and share music and audio within a decentralized, open network.</translate>
<translate translate-context="Content/About/Paragraph">
Funkwhale is a community-driven project that lets you listen and share music and audio within a decentralized, open network.
</translate>
</p>
</div>
</div>
</div>
<div class="ui hidden divider"></div>
<div class="ui hidden divider" />
<div class="ui vertically fitted basic stripe segment">
<div class="ui two stackable cards">
<div class="ui card">
<div class="signup-form content" v-if="!$store.state.auth.authenticated">
<div
v-if="!$store.state.auth.authenticated"
class="signup-form content"
>
<h3 class="header">
<translate translate-context="*/Signup/Title">Sign up</translate>
<translate translate-context="*/Signup/Title">
Sign up
</translate>
</h3>
<template v-if="openRegistrations">
<p>
<translate translate-context="Content/About/Paragraph">Sign up now to keep a track of your favorites, create playlists, discover new content and much more!</translate>
<translate translate-context="Content/About/Paragraph">
Sign up now to keep a track of your favorites, create playlists, discover new content and much more!
</translate>
</p>
<p v-if="defaultUploadQuota">
<translate translate-context="Content/About/Paragraph" :translate-params="{quota: defaultUploadQuota}">Users on this pod also get %{ quota } of free storage to upload their own content!</translate>
<translate
translate-context="Content/About/Paragraph"
:translate-params="{quota: defaultUploadQuota}"
>
Users on this pod also get %{ quota } of free storage to upload their own content!
</translate>
</p>
<signup-form button-classes="success" :show-login="false"></signup-form>
<signup-form
button-classes="success"
:show-login="false"
/>
</template>
<div v-else>
<p translate-context="Content/About/Paragraph">Registrations are closed on this pod. You can signup on another pod using the link below.</p>
<p translate-context="Content/About/Paragraph">
Registrations are closed on this pod. You can signup on another pod using the link below.
</p>
<a target="_blank" rel="noopener" href="https://funkwhale.audio/#get-started">
<a
target="_blank"
rel="noopener"
href="https://funkwhale.audio/#get-started"
>
<translate translate-context="Content/About/Link">Find another pod</translate>
<i class="external alternate icon margin-left"></i>
<i class="external alternate icon margin-left" />
</a>
</div>
</div>
<div class="signup-form content" v-else>
<div
v-else
class="signup-form content"
>
<div class="ui positive message">
<div class="header">
<translate translate-context="Content/About/Message">You're already signed in!</translate>
<translate translate-context="Content/About/Message">
You're already signed in!
</translate>
</div>
<p><translate translate-contect="Content/About/Hello">Hello</translate> {{ $store.state.auth.username }}</p>
<p>
<translate translate-contect="Content/About/Hello">
Hello
</translate> {{ $store.state.auth.username }}
</p>
</div>
</div>
</div>
<div class="ui card">
<section :class="['ui', 'head', {'with-background': banner}, 'vertical', 'center', 'aligned', 'stripe', 'segment']" :style="headerStyle">
<h1>
<i class="music icon"></i>
{{ podName }}
</h1>
<section
:class="['ui', 'head', {'with-background': banner}, 'vertical', 'center', 'aligned', 'stripe', 'segment']"
:style="headerStyle"
>
<h1>
<i class="music icon" />
{{ podName }}
</h1>
</section>
<div class="content padding-top padding-bottom">
<h3 class="ui header" id="description">
<translate translate-context="Content/About/Header">About this pod</translate>
<h3
id="description"
class="ui header"
>
<translate translate-context="Content/About/Header">
About this pod
</translate>
</h3>
<div v-if="shortDescription" class="sub header">
<div
v-if="shortDescription"
class="sub header"
>
{{ shortDescription }}
</div>
<p v-else>
<translate translate-context="Content/About/Paragraph">No description available.</translate>
<translate translate-context="Content/About/Paragraph">
No description available.
</translate>
</p>
<template v-if="stats">
......@@ -84,54 +134,89 @@
<div class="column">
<span class="statistics-figure ui text">
<span class="ui big text"><strong>{{ stats.users.toLocaleString($store.state.ui.momentLocale) }}</strong></span>
<br />
<translate translate-context="Content/About/*" :translate-n="stats.users" translate-plural="active users">active user</translate>
<br>
<translate
translate-context="Content/About/*"
:translate-n="stats.users"
translate-plural="active users"
>active user</translate>
</span>
</div>
<div class="column">
<span class="statistics-figure ui text">
<span class="ui big text"><strong>{{ parseInt(stats.hours).toLocaleString($store.state.ui.momentLocale) }}</strong></span>
<br />
<translate translate-context="Content/About/*" :translate-n="parseInt(stats.hours)" translate-plural="hours of music">hour of music</translate>
<br>
<translate
translate-context="Content/About/*"
:translate-n="parseInt(stats.hours)"
translate-plural="hours of music"
>hour of music</translate>
</span>
</div>
</div>
</div>
</template>
<router-link to="/about/pod" class="ui fluid basic secondary button">
<translate translate-context="Content/About/Paragraph">Learn More</translate>
<router-link
to="/about/pod"
class="ui fluid basic secondary button"
>
<translate translate-context="Content/About/Paragraph">
Learn More
</translate>
</router-link>
</div>
</div>
</div>
<div class="ui three stackable cards">
<router-link to="/" class="ui card">
<router-link
to="/"
class="ui card"
>
<div class="content">
<h3 class="ui header" id="description">
<translate translate-context="Content/About/Header">Browse public content</translate>
<h3
id="description"
class="ui header"
>
<translate translate-context="Content/About/Header">
Browse public content
</translate>
</h3>
<p>
<translate translate-context="Content/About/Paragraph">Listen to public albums and playlists shared on this pod.</translate>
<translate translate-context="Content/About/Paragraph">
Listen to public albums and playlists shared on this pod.
</translate>
</p>
</div>
</router-link>
<a href="https://funkwhale.audio/#get-started" class="ui card">
<a
href="https://funkwhale.audio/#get-started"
class="ui card"
>
<div class="content">
<h3 class="ui header" id="description">
<h3
id="description"
class="ui header"
>
<translate translate-context="Content/About/Header">Find another pod</translate>
<i class="external alternate icon margin-left"></i>
<i class="external alternate icon margin-left" />
</h3>
<p>
<translate translate-context="Content/About/Paragraph">Listen to public albums and playlists shared on this pod.</translate>
</p>
</div>
</a>
<a href="https://funkwhale.audio/apps" class="ui card">
<a
href="https://funkwhale.audio/apps"
class="ui card"
>
<div class="content">
<h3 class="ui header" id="description">
<h3
id="description"
class="ui header"
>
<translate translate-context="Content/About/Header">Find an app</translate>
<i class="external alternate icon margin-left"></i>
<i class="external alternate icon margin-left" />
</h3>
<p>
<translate translate-context="Content/About/Paragraph">Use Funkwhale on other devices with our apps.</translate>
......@@ -140,9 +225,14 @@
</a>
</div>
<div class="ui fluid horizontally fitted basic clearing segment container">
<router-link to="/about/pod" class="ui right floated basic secondary button">
<translate translate-context="Content/About/Paragraph">About this pod</translate>
<i class="icon arrow right"></i>
<router-link
to="/about/pod"
class="ui right floated basic secondary button"
>
<translate translate-context="Content/About/Paragraph">
About this pod
</translate>
<i class="icon arrow right" />
</router-link>
</div>
</div>
......@@ -152,37 +242,37 @@
</template>
<script>
import { mapState } from "vuex"
import { mapState } from 'vuex'
import _ from '@/lodash'
import showdown from 'showdown'
import {humanSize} from '@/filters'
import { humanSize } from '@/filters'
import SignupForm from "@/components/auth/SignupForm"
import LogoText from "@/components/LogoText"
import SignupForm from '@/components/auth/SignupForm'
import LogoText from '@/components/LogoText'
export default {
components: {
SignupForm,
LogoText,
LogoText
},
data () {
return {
markdown: new showdown.Converter(),
showAllowedDomains: false,
showAllowedDomains: false
}
},
computed: {
...mapState({
nodeinfo: state => state.instance.nodeinfo,
...mapState({
nodeinfo: state => state.instance.nodeinfo
}),
labels() {
labels () {
return {
title: this.$pgettext('Head/About/Title', "About")
title: this.$pgettext('Head/About/Title', 'About')
}
},
podName() {
return _.get(this.nodeinfo, 'metadata.nodeName') || "Funkwhale"
podName () {
return _.get(this.nodeinfo, 'metadata.nodeName') || 'Funkwhale'
},
banner () {
return _.get(this.nodeinfo, 'metadata.banner')
......@@ -200,13 +290,13 @@ export default {
return _.get(this.nodeinfo, 'metadata.terms')
},
stats () {
let data = {
const data = {
users: _.get(this.nodeinfo, 'usage.users.activeMonth', null),
hours: _.get(this.nodeinfo, 'metadata.library.music.hours', null),
artists: _.get(this.nodeinfo, 'metadata.library.artists.total', null),
albums: _.get(this.nodeinfo, 'metadata.library.albums.total', null),
tracks: _.get(this.nodeinfo, 'metadata.library.tracks.total', null),
listenings: _.get(this.nodeinfo, 'metadata.usage.listenings.total', null),
listenings: _.get(this.nodeinfo, 'metadata.usage.listenings.total', null)
}
if (data.users === null || data.artists === null) {
return
......@@ -237,16 +327,16 @@ export default {
federationEnabled () {
return _.get(this.nodeinfo, 'metadata.library.federationEnabled')
},
headerStyle() {
headerStyle () {
if (!this.banner) {
return ""
return ''
}
return (
"background-image: url(" +
this.$store.getters["instance/absoluteUrl"](this.banner) +
")"
'background-image: url(' +
this.$store.getters['instance/absoluteUrl'](this.banner) +
')'
)
},
}
}
}
</script>
......
This diff is collapsed.
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment