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 を書いていきます
unreleased
----------
* 投稿ページに次の投稿/前の投稿リンクを作成 (#734)
2380
----
アプリケーションが作れない問題を修正

View File

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

View File

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

View File

@ -73,44 +73,79 @@ const self = (
));
}
if (_post.reply_to_id && opts.detail) {
// Populate reply to post
_post.reply_to = await self(_post.reply_to_id, me, {
detail: false
// 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;
if (_post.repost_id && opts.detail) {
// Populate repost
_post.repost = await self(_post.repost_id, me, {
detail: _post.text == 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;
// Poll
if (me && _post.poll && opts.detail) {
const vote = await Vote
.findOne({
user_id: me._id,
post_id: id
if (_post.reply_to_id) {
// Populate reply to post
_post.reply_to = await self(_post.reply_to_id, me, {
detail: false
});
if (vote != null) {
_post.poll.choices.filter(c => c.id == vote.choice)[0].is_voted = true;
}
}
// Fetch my reaction
if (me && opts.detail) {
const reaction = await Reaction
.findOne({
user_id: me._id,
post_id: id,
deleted_at: { $exists: false }
if (_post.repost_id) {
// Populate repost
_post.repost = await self(_post.repost_id, me, {
detail: _post.text == null
});
}
if (reaction) {
_post.my_reaction = reaction.reaction;
// Poll
if (me && _post.poll) {
const vote = await Vote
.findOne({
user_id: me._id,
post_id: id
});
if (vote != null) {
_post.poll.choices.filter(c => c.id == vote.choice)[0].is_voted = true;
}
}
// Fetch my reaction
if (me) {
const reaction = await Reaction
.findOne({
user_id: me._id,
post_id: id,
deleted_at: { $exists: false }
});
if (reaction) {
_post.my_reaction = reaction.reaction;
}
}
}

View File

@ -1,7 +1,9 @@
<mk-post-page>
<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 }/>
<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>
</mk-ui>
<style>
@ -10,6 +12,19 @@
main
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
margin 0 auto
@ -18,16 +33,23 @@
<script>
import Progress from '../../../common/scripts/loading';
this.post = this.opts.post;
this.mixin('api');
this.fetching = true;
this.post = null;
this.on('mount', () => {
Progress.start();
this.refs.ui.refs.detail.on('post-fetched', () => {
Progress.set(0.5);
});
this.api('posts/show', {
post_id: this.opts.post
}).then(post => {
this.update({
fetching: false,
post: post
});
this.refs.ui.refs.detail.on('loaded', () => {
Progress.done();
});
});

View File

@ -1,8 +1,5 @@
<mk-post-detail title={ title }>
<div class="fetching" if={ fetching }>
<mk-ellipsis-icon/>
</div>
<div class="main" if={ !fetching }>
<div class="main">
<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-spinner fa-pulse" if={ contextFetching }></i>
@ -71,13 +68,11 @@
padding 0
width 640px
overflow hidden
text-align left
background #fff
border solid 1px rgba(0, 0, 0, 0.1)
border-radius 8px
> .fetching
padding 64px 0
> .main
> .read-more
@ -262,56 +257,41 @@
this.mixin('api');
this.mixin('user-preview');
this.fetching = true;
this.contextFetching = false;
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.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;
if (this.p.text) {
const tokens = this.p.ast;
this.update({
fetching: false,
post: post,
isRepost: isRepost,
p: p,
title: dateStringify(p.created_at)
this.refs.text.innerHTML = compile(tokens);
this.refs.text.children.forEach(e => {
if (e.tagName == 'MK-URL') riot.mount(e);
});
this.trigger('loaded');
if (this.p.text) {
const tokens = this.p.ast;
this.refs.text.innerHTML = compile(tokens);
this.refs.text.children.forEach(e => {
if (e.tagName == 'MK-URL') riot.mount(e);
// URLをプレビュー
tokens
.filter(t => (t.type == 'url' || t.type == 'link') && !t.silent)
.map(t => {
riot.mount(this.refs.text.appendChild(document.createElement('mk-url-preview')), {
url: t.url
});
});
}
// URLをプレビュー
tokens
.filter(t => (t.type == 'url' || t.type == 'link') && !t.silent)
.map(t => {
riot.mount(this.refs.text.appendChild(document.createElement('mk-url-preview')), {
url: t.url
});
});
}
// Get replies
this.api('posts/replies', {
post_id: this.p.id,
limit: 8
}).then(replies => {
this.update({
replies: replies
});
// Get replies
this.api('posts/replies', {
post_id: this.p.id,
limit: 8
}).then(replies => {
this.update({
replies: replies
});
});
});