mirror of
https://github.com/pixelfed/pixelfed.git
synced 2024-11-10 08:44:49 +00:00
Update PostComponent
This commit is contained in:
parent
20957afccc
commit
58a9d5af98
1 changed files with 42 additions and 6 deletions
|
@ -137,6 +137,18 @@
|
||||||
<span v-if="reply.favourites_count" class="text-muted comment-reaction font-weight-bold mr-3">{{reply.favourites_count == 1 ? '1 like' : reply.favourites_count + ' likes'}}</span>
|
<span v-if="reply.favourites_count" class="text-muted comment-reaction font-weight-bold mr-3">{{reply.favourites_count == 1 ? '1 like' : reply.favourites_count + ' likes'}}</span>
|
||||||
<span class="text-muted comment-reaction font-weight-bold cursor-pointer" v-on:click="replyFocus(reply)">Reply</span>
|
<span class="text-muted comment-reaction font-weight-bold cursor-pointer" v-on:click="replyFocus(reply)">Reply</span>
|
||||||
</p>
|
</p>
|
||||||
|
<div v-if="reply.reply_count > 0" class="cursor-pointer" style="margin-left:30px;" v-on:click="toggleReplies(reply)">
|
||||||
|
<span class="show-reply-bar"></span>
|
||||||
|
<span class="comment-reaction font-weight-bold text-muted">{{reply.thread ? 'Hide' : 'View'}} Replies ({{reply.reply_count}})</span>
|
||||||
|
</div>
|
||||||
|
<div v-if="reply.thread == true" class="comment-thread">
|
||||||
|
<p class="d-flex justify-content-between align-items-top read-more pb-3" style="overflow-y: hidden;" v-for="(s, index) in reply.replies">
|
||||||
|
<span>
|
||||||
|
<a class="text-dark font-weight-bold mr-1" :href="s.account.url" :title="s.account.username">{{s.account.username}}</a>
|
||||||
|
<span class="text-break" v-html="s.content"></span>
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -331,7 +343,7 @@
|
||||||
}
|
}
|
||||||
.emoji-reactions .nav-item {
|
.emoji-reactions .nav-item {
|
||||||
font-size: 1.2rem;
|
font-size: 1.2rem;
|
||||||
padding: 7px;
|
padding: 9px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
.emoji-reactions::-webkit-scrollbar {
|
.emoji-reactions::-webkit-scrollbar {
|
||||||
|
@ -372,7 +384,9 @@ export default {
|
||||||
showComments: false,
|
showComments: false,
|
||||||
warning: false,
|
warning: false,
|
||||||
loaded: false,
|
loaded: false,
|
||||||
loading: null
|
loading: null,
|
||||||
|
replyingToId: this.statusId,
|
||||||
|
emoji: ['😀','😁','😂','🤣','😃','😄','😅','😆','😉','😊','😋','😎','😍','😘','😗','😙','😚','☺️','🙂','🤗','🤩','🤔','🤨','😐','😑','😶','🙄','😏','😣','😥','😮','🤐','😯','😪','😫','😴','😌','😛','😜','😝','🤤','😒','😓','😔','😕','🙃','🤑','😲','☹️','🙁','😖','😞','😟','😤','😢','😭','😦','😧','😨','😩','🤯','😬','😰','😱','😳','🤪','😵','😡','😠','🤬','😷','🤒','🤕','🤢','🤮','🤧','😇','🤠','🤡','🤥','🤫','🤭','🧐','🤓','😈','👿','👹','👺','💀','👻','👽','🤖','💩','😺','😸','😹','😻','😼','😽','🙀','😿','😾','🤲','👐','🙌','👏','🤝','👍','👎','👊','✊','🤛','🤜','🤞','✌️','🤟','🤘','👌','👈','👉','👆','👇','☝️','✋','🤚','🖐','🖖','👋','🤙','💪','🖕','✍️','🙏','💍','💄','💋','👄','👅','👂','👃','👣','👁','👀','🧠','🗣','👤','👥'],
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -668,16 +682,20 @@ export default {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let data = {
|
let data = {
|
||||||
item: this.statusId,
|
item: this.replyingToId,
|
||||||
comment: this.replyText
|
comment: this.replyText
|
||||||
}
|
}
|
||||||
axios.post('/i/comment', data)
|
axios.post('/i/comment', data)
|
||||||
.then(function(res) {
|
.then(function(res) {
|
||||||
let entity = res.data.entity;
|
let entity = res.data.entity;
|
||||||
|
if(entity.in_reply_to_id == self.status.id) {
|
||||||
self.results.push(entity);
|
self.results.push(entity);
|
||||||
self.replyText = '';
|
|
||||||
let elem = $('.status-comments')[0];
|
let elem = $('.status-comments')[0];
|
||||||
elem.scrollTop = elem.clientHeight;
|
elem.scrollTop = elem.clientHeight;
|
||||||
|
} else {
|
||||||
|
|
||||||
|
}
|
||||||
|
self.replyText = '';
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -699,6 +717,7 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
replyFocus(e) {
|
replyFocus(e) {
|
||||||
|
this.replyingToId = e.id;
|
||||||
this.reply_to_profile_id = e.account.id;
|
this.reply_to_profile_id = e.account.id;
|
||||||
this.replyText = '@' + e.account.username + ' ';
|
this.replyText = '@' + e.account.username + ' ';
|
||||||
$('textarea[name="comment"]').focus();
|
$('textarea[name="comment"]').focus();
|
||||||
|
@ -910,6 +929,23 @@ export default {
|
||||||
swal('Private Post', 'This post is only visible to followers.', 'info');
|
swal('Private Post', 'This post is only visible to followers.', 'info');
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
toggleReplies(reply) {
|
||||||
|
if(reply.thread) {
|
||||||
|
reply.thread = false;
|
||||||
|
} else {
|
||||||
|
if(reply.replies.length > 0) {
|
||||||
|
reply.thread = true;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let url = '/api/v2/comments/'+reply.account.username+'/status/'+reply.id;
|
||||||
|
axios.get(url)
|
||||||
|
.then(response => {
|
||||||
|
reply.replies = _.reverse(response.data.data);
|
||||||
|
reply.thread = true;
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in a new issue