This commit is contained in:
syuilo 2017-08-28 00:03:57 +09:00
parent f228788fcb
commit 3b77bc8299
6 changed files with 132 additions and 83 deletions

View file

@ -2,6 +2,10 @@ ChangeLog
========= =========
主に notable な changes を書いていきます 主に notable な changes を書いていきます
unreleased
----------
* 投稿ページに次の投稿/前の投稿リンクを作成 (#734)
2380 2380
---- ----
アプリケーションが作れない問題を修正 アプリケーションが作れない問題を修正

View file

@ -231,6 +231,10 @@ desktop:
attaches: "{} media attached" attaches: "{} media attached"
uploading-media: "Uploading {} media" uploading-media: "Uploading {} media"
mk-post-page:
prev: "Previous post"
next: "Next post"
mk-timeline-post: mk-timeline-post:
reposted-by: "Reposted by {}" reposted-by: "Reposted by {}"
reply: "Reply" reply: "Reply"

View file

@ -231,6 +231,10 @@ desktop:
attaches: "添付: {}メディア" attaches: "添付: {}メディア"
uploading-media: "{}個のメディアをアップロード中" uploading-media: "{}個のメディアをアップロード中"
mk-post-page:
prev: "前の投稿"
next: "次の投稿"
mk-timeline-post: mk-timeline-post:
reposted-by: "{}がRepost" reposted-by: "{}がRepost"
reply: "返信" reply: "返信"

View file

@ -73,14 +73,48 @@ const self = (
)); ));
} }
if (_post.reply_to_id && opts.detail) { // When requested a detailed post data
if (opts.detail) {
// Get previous post info
const prev = await Post.findOne({
user_id: _post.user_id,
_id: {
$lt: id
}
}, {
fields: {
_id: true
},
sort: {
_id: -1
}
});
_post.prev = prev ? prev._id : null;
// Get next post info
const next = await Post.findOne({
user_id: _post.user_id,
_id: {
$gt: id
}
}, {
fields: {
_id: true
},
sort: {
_id: 1
}
});
_post.next = next ? next._id : null;
if (_post.reply_to_id) {
// Populate reply to post // Populate reply to post
_post.reply_to = await self(_post.reply_to_id, me, { _post.reply_to = await self(_post.reply_to_id, me, {
detail: false detail: false
}); });
} }
if (_post.repost_id && opts.detail) { if (_post.repost_id) {
// Populate repost // Populate repost
_post.repost = await self(_post.repost_id, me, { _post.repost = await self(_post.repost_id, me, {
detail: _post.text == null detail: _post.text == null
@ -88,7 +122,7 @@ const self = (
} }
// Poll // Poll
if (me && _post.poll && opts.detail) { if (me && _post.poll) {
const vote = await Vote const vote = await Vote
.findOne({ .findOne({
user_id: me._id, user_id: me._id,
@ -101,7 +135,7 @@ const self = (
} }
// Fetch my reaction // Fetch my reaction
if (me && opts.detail) { if (me) {
const reaction = await Reaction const reaction = await Reaction
.findOne({ .findOne({
user_id: me._id, user_id: me._id,
@ -113,6 +147,7 @@ const self = (
_post.my_reaction = reaction.reaction; _post.my_reaction = reaction.reaction;
} }
} }
}
resolve(_post); resolve(_post);
}); });

View file

@ -1,7 +1,9 @@
<mk-post-page> <mk-post-page>
<mk-ui ref="ui"> <mk-ui ref="ui">
<main> <main if={ !parent.fetching }>
<a if={ parent.post.next } href={ parent.post.next }><i class="fa fa-angle-up"></i>%i18n:desktop.tags.mk-post-page.next%</a>
<mk-post-detail ref="detail" post={ parent.post }/> <mk-post-detail ref="detail" post={ parent.post }/>
<a if={ parent.post.prev } href={ parent.post.prev }><i class="fa fa-angle-down"></i>%i18n:desktop.tags.mk-post-page.prev%</a>
</main> </main>
</mk-ui> </mk-ui>
<style> <style>
@ -10,6 +12,19 @@
main main
padding 16px padding 16px
text-align center
> a
display inline-block
&:first-child
margin-bottom 4px
&:last-child
margin-top 4px
> i
margin-right 4px
> mk-post-detail > mk-post-detail
margin 0 auto margin 0 auto
@ -18,16 +33,23 @@
<script> <script>
import Progress from '../../../common/scripts/loading'; import Progress from '../../../common/scripts/loading';
this.post = this.opts.post; this.mixin('api');
this.fetching = true;
this.post = null;
this.on('mount', () => { this.on('mount', () => {
Progress.start(); Progress.start();
this.refs.ui.refs.detail.on('post-fetched', () => { this.api('posts/show', {
Progress.set(0.5); post_id: this.opts.post
}).then(post => {
this.update({
fetching: false,
post: post
}); });
this.refs.ui.refs.detail.on('loaded', () => {
Progress.done(); Progress.done();
}); });
}); });

View file

@ -1,8 +1,5 @@
<mk-post-detail title={ title }> <mk-post-detail title={ title }>
<div class="fetching" if={ fetching }> <div class="main">
<mk-ellipsis-icon/>
</div>
<div class="main" if={ !fetching }>
<button class="read-more" if={ p.reply_to && p.reply_to.reply_to_id && context == null } title="会話をもっと読み込む" onclick={ loadContext } disabled={ contextFetching }> <button class="read-more" if={ p.reply_to && p.reply_to.reply_to_id && context == null } title="会話をもっと読み込む" onclick={ loadContext } disabled={ contextFetching }>
<i class="fa fa-ellipsis-v" if={ !contextFetching }></i> <i class="fa fa-ellipsis-v" if={ !contextFetching }></i>
<i class="fa fa-spinner fa-pulse" if={ contextFetching }></i> <i class="fa fa-spinner fa-pulse" if={ contextFetching }></i>
@ -71,13 +68,11 @@
padding 0 padding 0
width 640px width 640px
overflow hidden overflow hidden
text-align left
background #fff background #fff
border solid 1px rgba(0, 0, 0, 0.1) border solid 1px rgba(0, 0, 0, 0.1)
border-radius 8px border-radius 8px
> .fetching
padding 64px 0
> .main > .main
> .read-more > .read-more
@ -262,29 +257,15 @@
this.mixin('api'); this.mixin('api');
this.mixin('user-preview'); this.mixin('user-preview');
this.fetching = true;
this.contextFetching = false; this.contextFetching = false;
this.context = null; this.context = null;
this.post = null; this.post = this.opts.post;
this.isRepost = this.post.repost != null;
this.p = this.isRepost ? this.post.repost : this.post;
this.p.reactions_count = this.p.reaction_counts ? Object.keys(this.p.reaction_counts).map(key => this.p.reaction_counts[key]).reduce((a, b) => a + b) : 0;
this.title = dateStringify(this.p.created_at);
this.on('mount', () => { this.on('mount', () => {
this.api('posts/show', {
post_id: this.opts.post
}).then(post => {
const isRepost = post.repost != null;
const p = isRepost ? post.repost : post;
p.reactions_count = p.reaction_counts ? Object.keys(p.reaction_counts).map(key => p.reaction_counts[key]).reduce((a, b) => a + b) : 0;
this.update({
fetching: false,
post: post,
isRepost: isRepost,
p: p,
title: dateStringify(p.created_at)
});
this.trigger('loaded');
if (this.p.text) { if (this.p.text) {
const tokens = this.p.ast; const tokens = this.p.ast;
@ -314,7 +295,6 @@
}); });
}); });
}); });
});
this.reply = () => { this.reply = () => {
riot.mount(document.body.appendChild(document.createElement('mk-post-form-window')), { riot.mount(document.body.appendChild(document.createElement('mk-post-form-window')), {