This commit is contained in:
syuilo 2018-03-17 03:33:36 +09:00
parent c38b5a9b8b
commit 128b56da28
6 changed files with 243 additions and 58 deletions

View file

@ -27,6 +27,10 @@ module.exports = (params) => new Promise(async (res, rej) => {
const [poll, pollErr] = $(params.poll).optional.boolean().$;
if (pollErr) return rej('invalid poll param');
// Get 'bot' parameter
//const [bot, botErr] = $(params.bot).optional.boolean().$;
//if (botErr) return rej('invalid bot param');
// Get 'limit' parameter
const [limit = 10, limitErr] = $(params.limit).optional.number().range(1, 100).$;
if (limitErr) return rej('invalid limit param');
@ -76,6 +80,11 @@ module.exports = (params) => new Promise(async (res, rej) => {
query.poll = poll ? { $exists: true, $ne: null } : null;
}
// TODO
//if (bot != undefined) {
// query.is_bot = bot;
//}
// Issue query
const posts = await Post
.find(query, {

View file

@ -23,6 +23,7 @@ import twitterSetting from './twitter-setting.vue';
import fileTypeIcon from './file-type-icon.vue';
import Switch from './switch.vue';
import Othello from './othello.vue';
import welcomeTimeline from './welcome-timeline.vue';
Vue.component('mk-signin', signin);
Vue.component('mk-signup', signup);
@ -47,3 +48,4 @@ Vue.component('mk-twitter-setting', twitterSetting);
Vue.component('mk-file-type-icon', fileTypeIcon);
Vue.component('mk-switch', Switch);
Vue.component('mk-othello', Othello);
Vue.component('mk-welcome-timeline', welcomeTimeline);

View file

@ -0,0 +1,115 @@
<template>
<div class="mk-welcome-timeline">
<div v-for="post in posts">
<router-link class="avatar-anchor" :to="`/${post.user.username}`">
<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=96`" alt="avatar"/>
</router-link>
<div class="body">
<header>
<router-link class="name" :to="`/${post.user.username}`">{{ post.user.name }}</router-link>
<span class="username">@{{ post.user.username }}</span>
<div class="info">
<router-link class="created-at" :to="`/${post.user.username}/${post.id}`">
<mk-time :time="post.created_at"/>
</router-link>
</div>
</header>
<div class="text">
<mk-post-html :ast="post.ast"/>
</div>
</div>
</div>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
data() {
return {
fetching: true,
posts: []
};
},
mounted() {
this.fetch();
},
methods: {
fetch(cb?) {
this.fetching = true;
(this as any).api('posts', {
reply: false,
repost: false,
media: false,
poll: false,
bot: false
}).then(posts => {
this.posts = posts;
this.fetching = false;
});
}
}
});
</script>
<style lang="stylus" scoped>
.mk-welcome-timeline
background #fff
> div
padding 16px
overflow-wrap break-word
font-size .9em
color #4C4C4C
border-bottom 1px solid rgba(0, 0, 0, 0.05)
&:after
content ""
display block
clear both
> .avatar-anchor
display block
float left
position -webkit-sticky
position sticky
top 16px
> img
display block
width 36px
height 36px
border-radius 6px
> .body
float right
width calc(100% - 36px)
padding-left 8px
> header
display flex
align-items center
margin-bottom 4px
white-space nowrap
> .name
display block
margin 0 .5em 0 0
padding 0
overflow hidden
font-weight bold
text-overflow ellipsis
> .username
margin 0 .5em 0 0
color #ccc
> .info
margin-left auto
font-size 0.9em
> .created-at
color #c0c0c0
</style>

View file

@ -1,13 +1,20 @@
<template>
<div class="mk-welcome">
<main>
<div class="top">
<div>
<div>
<h1>Share<br>Everything!</h1>
<p>ようこそ <b>Misskey</b>はTwitter風ミニブログSNSです思ったこと共有したいことをシンプルに書き残せますタイムラインを見れば皆の反応や皆がどう思っているのかもすぐにわかります<a>詳しく...</a></p>
<p>ようこそ <b>Misskey</b>はTwitter風ミニブログSNSです思ったことや皆と共有したいことを投稿しましょうタイムラインを見れば皆の関心事をすぐにチェックすることもできます<a>詳しく...</a></p>
<p><button class="signup" @click="signup">はじめる</button><button class="signin" @click="signin">ログイン</button></p>
</div>
<div>
<div>
<header>%fa:comments R% タイムライン</header>
<mk-welcome-timeline/>
</div>
</div>
</div>
</div>
</main>
<mk-forkit/>
@ -69,13 +76,22 @@ export default Vue.extend({
> main
display flex
flex 1
> .top
display flex
width 100%
background-image url('/assets/welcome.svg')
background-size cover
background-position top center
> div
display flex
max-width $width
margin 0 auto
padding 80px 0 0 0
> div:first-child
margin 0 auto 0 0
width calc(100% - 500px)
margin 0 48px 0 0
color #777
> h1
@ -120,10 +136,25 @@ export default Vue.extend({
color #333
> div:last-child
margin 0 0 0 auto
> div
width 410px
background #fff
border-radius 8px
overflow hidden
> header
z-index 1
padding 12px 16px
color #888d94
box-shadow 0 1px 0px rgba(0, 0, 0, 0.1)
> .mk-welcome-timeline
max-height 350px
overflow auto
> footer
color #666
color #949ea5
background #fff
> div

View file

@ -1,9 +1,9 @@
<template>
<div class="welcome">
<h1><b>Misskey</b>へようこそ</h1>
<p>Twitter風ミニブログSNSMisskeyへようこそ思ったことを投稿したりタイムラインでみんなの投稿を読むこともできます</p>
<p>Twitter風ミニブログSNSMisskeyへようこそ思ったことを投稿したりタイムラインでみんなの投稿を読むこともできます<a href="/signup">アカウントを作成する</a></p>
<div class="form">
<p>ログイン</p>
<p>%fa:lock% ログイン</p>
<div>
<form @submit.prevent="onSubmit">
<input v-model="username" type="text" pattern="^[a-zA-Z0-9-]+$" placeholder="ユーザー名" autofocus required @change="onUsernameChange"/>
@ -16,13 +16,19 @@
</div>
</div>
</div>
<a href="/signup">アカウントを作成する</a>
<div class="tl">
<p>%fa:comments R% タイムラインを見てみる</p>
<mk-welcome-timeline/>
</div>
<footer>
<small>{{ copyright }}</small>
</footer>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
import { apiUrl } from '../../../config';
import { apiUrl, copyright } from '../../../config';
export default Vue.extend({
data() {
@ -32,7 +38,8 @@ export default Vue.extend({
username: '',
password: '',
token: '',
apiUrl
apiUrl,
copyright
};
},
mounted() {
@ -83,16 +90,12 @@ export default Vue.extend({
color #949fa9
.form
margin-bottom 16px
background #fff
border solid 1px rgba(0, 0, 0, 0.2)
border-radius 8px
overflow hidden
& + a
display block
margin-top 16px
text-align center
> p
margin 0
padding 12px 20px
@ -143,4 +146,29 @@ export default Vue.extend({
padding 16px
text-align center
.tl
background #fff
border solid 1px rgba(0, 0, 0, 0.2)
border-radius 8px
overflow hidden
> p
margin 0
padding 12px 20px
color #555
background #f5f5f5
border-bottom solid 1px #ddd
> .mk-welcome-timeline
max-height 300px
overflow auto
> footer
text-align center
color #949fa9
> small
display block
margin 16px 0 0 0
</style>

BIN
src/web/assets/welcome.svg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB