chris/pixelfed
1
0
Fork 0
forked from mirror/pixelfed
Code Pull requests Activity

Update PostComponent

Browse source
This commit is contained in:
Daniel Supernault 2019-02-10 22:31:49 -07:00
parent 4c4f8a7394
commit 276712014b
No known key found for this signature in database
GPG key ID: 0DEF1C662C9033F7
1 changed files with 47 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

81
resources/assets/js/components/PostComponent.vue
View file

@ -1,10 +1,4 @@
<style scoped>
#l-modal .modal-body,
#s-modal .modal-body {
max-height: 70vh;
overflow-y: scroll;
}
.status-comments,
.reactions,
.col-md-4 {
@ -21,7 +15,7 @@
</style>
<template>
<div class="postComponent d-none">
<div class="container px-0 mt-md-4">
<div class="container px-0">
<div class="card card-md-rounded-0 status-container orientation-unknown">
<div class="row px-0 mx-0">
<div class="d-flex d-md-none align-items-center justify-content-between card-header bg-white w-100">
@ -46,8 +40,9 @@
<a class="dropdown-item font-weight-bold" v-on:click="blockProfile">Block Profile</a>
</span>
<span class="menu-author d-none">
<!-- <a class="dropdown-item font-weight-bold" :href="editUrl()">Disable Comments</a> -->
<a class="dropdown-item font-weight-bold" :href="editUrl()">Edit</a>
<a class="dropdown-item font-weight-bold text-danger" v-on:click="deletePost">Delete</a>
<a class="dropdown-item font-weight-bold text-danger" v-on:click="deletePost(status)">Delete</a>
</span>
</div>
</div>
@ -108,6 +103,8 @@
<a class="dropdown-item font-weight-bold" v-on:click="blockProfile">Block Profile</a>
</span>
<span class="menu-author d-none">
<!-- <a class="dropdown-item font-weight-bold" :href="editUrl()">Mute Comments</a>
<a class="dropdown-item font-weight-bold" :href="editUrl()">Disable Comments</a> -->
<a class="dropdown-item font-weight-bold" :href="editUrl()">Edit</a>
<a class="dropdown-item font-weight-bold text-danger" v-on:click="deletePost">Delete</a>
</span>
@ -172,7 +169,7 @@
title="Likes"
body-class="list-group-flush p-0">
<div class="list-group">
<div class="list-group-item border-0" v-for="user in likes">
<div class="list-group-item border-0" v-for="(user, index) in likes" :key="'modal_likes_'+index">
<div class="media">
<a :href="user.url">
<img class="mr-3 rounded-circle box-shadow" :src="user.avatar" :alt="user.username + '\'s avatar'" width="30px">
@ -203,21 +200,24 @@
title="Shares"
body-class="list-group-flush p-0">
<div class="list-group">
<div class="list-group-item border-0" v-for="user in shares">
<div class="list-group-item border-0" v-for="(user, index) in shares" :key="'modal_shares_'+index">
<div class="media">
<a :href="user.url">
<img class="mr-3 rounded-circle box-shadow" :src="user.avatar" :alt="user.username + '\'s avatar'" width="30px">
</a>
<div class="media-body">
<p class="mb-0" style="font-size: 14px">
<a :href="user.url" class="font-weight-bold text-dark">
{{user.username}}
</a>
</p>
<p class="text-muted mb-0" style="font-size: 14px">
{{user.display_name}}
</a>
</p>
<div class="d-inline-block">
<p class="mb-0" style="font-size: 14px">
<a :href="user.url" class="font-weight-bold text-dark">
{{user.username}}
</a>
</p>
<p class="text-muted mb-0" style="font-size: 14px">
{{user.display_name}}
</a>
</p>
</div>
<p class="float-right"><a class="btn btn-primary font-weight-bold py-1" href="#">Follow</a></p>
</div>
</div>
</div>
@ -245,9 +245,9 @@ export default {
liked: false,
shared: false
},
likes: {},
likes: [],
likesPage: 1,
shares: {},
shares: [],
sharesPage: 1,
}
},
@ -267,13 +267,13 @@ export default {
if(this.reactions) {
if(this.reactions.bookmarked == true) {
$('.far.fa-bookmark').removeClass('far').addClass('fas text-warning');
$('.postComponent .far.fa-bookmark').removeClass('far').addClass('fas text-warning');
}
if(this.reactions.shared == true) {
$('.far.fa-share-square').addClass('text-primary');
$('.postComponent .far.fa-share-square').addClass('text-primary');
}
if(this.reactions.liked == true) {
$('.far.fa-heart ').removeClass('far text-dark').addClass('fas text-danger');
$('.postComponent .far.fa-heart').removeClass('far text-dark').addClass('fas text-danger');
}
}
@ -383,9 +383,9 @@ export default {
page: this.likesPage,
},
}).then(({ data }) => {
if (data.data.length) {
this.likesPage += 1;
if (data.data.length > 0) {
this.likes.push(...data.data);
this.likesPage++;
$state.loaded();
} else {
$state.complete();
@ -399,9 +399,9 @@ export default {
page: this.sharesPage,
},
}).then(({ data }) => {
if (data.data.length) {
this.sharesPage += 1;
if (data.data.length > 0) {
this.shares.push(...data.data);
this.sharesPage++;
$state.loaded();
} else {
$state.complete();
@ -420,10 +420,17 @@ export default {
this.status.favourites_count = res.data.count;
if(this.reactions.liked == true) {
this.reactions.liked = false;
let user = this.user.id;
this.likes = this.likes.filter(function(like) {
return like.id !== user;
});
} else {
this.reactions.liked = true;
let user = this.user;
this.likes.push(user);
}
}).catch(err => {
console.error(err);
swal('Error', 'Something went wrong, please try again later.', 'error');
});
},
@ -439,10 +446,17 @@ export default {
this.status.reblogs_count = res.data.count;
if(this.reactions.shared == true) {
this.reactions.shared = false;
let user = this.user.id;
this.shares = this.shares.filter(function(reaction) {
return reaction.id !== user;
});
} else {
this.reactions.shared = true;
let user = this.user;
this.shares.push(user);
}
}).catch(err => {
console.error(err);
swal('Error', 'Something went wrong, please try again later.', 'error');
});
},
@ -495,20 +509,19 @@ export default {
});
},
deletePost() {
deletePost(status) {
var result = confirm('Are you sure you want to delete this post?');
if (result) {
if($('body').hasClass('loggedIn') == false) {
return;
}
axios.post('/i/delete', {
type: 'status',
item: this.status.id
type: 'status',
item: status.id
}).then(res => {
swal('Success', 'You have successfully deleted this post', 'success');
swal('Success', 'You have successfully deleted this post', 'success');
}).catch(err => {
swal('Error', 'Something went wrong. Please try again later.', 'error');
swal('Error', 'Something went wrong. Please try again later.', 'error');
});
}
}