فهرست منبع

Update vue components

Daniel Supernault 4 سال پیش
والد
کامیت
c238b82ed1

+ 14 - 2
resources/assets/js/components/PostComponent.vue

@@ -859,7 +859,9 @@ export default {
                   }
                 }
                 this.loaded = true;
-                this.fetchProfilePosts();
+                setTimeout(function() {
+                  self.fetchProfilePosts();
+                }, 3000);
                 setTimeout(function() {
                   document.querySelectorAll('.status-comment .comment-text a').forEach(function(i, e) { 
                     if(i.href.startsWith(window.location.origin)) {
@@ -947,12 +949,16 @@ export default {
           } else {
             this.reactions.liked = true;
             let user = this.user;
-            this.likes.push(user);
+            this.likes.unshift(user);
+            setTimeout(function() {
+              event.target.classList.add('animate__animated', 'animate__bounce');
+            },100);
           }
         }).catch(err => {
           console.error(err);
           swal('Error', 'Something went wrong, please try again later.', 'error');
         });
+        window.navigator.vibrate(200);
       },
 
       shareStatus() {
@@ -1383,6 +1389,9 @@ export default {
       },
 
       fetchProfilePosts() {
+        if(!$('body').hasClass('loggedIn') && this.loaded) {
+          return;
+        }
         let self = this;
         let apiUrl = '/api/pixelfed/v1/accounts/' + this.statusProfileId + '/statuses';
         axios.get(apiUrl, {
@@ -1426,6 +1435,9 @@ export default {
       },
 
       showTaggedPeopleModal() {
+        if(!$('body').hasClass('loggedIn') && this.loaded) {
+          return;
+        }
         this.$refs.taggedModal.show();
       },
 

+ 105 - 3
resources/assets/js/components/SearchResults.vue

@@ -11,10 +11,57 @@
 
 	<div v-if="!loading && !networkError" class="mt-5">
 		<div v-if="analysis == 'all'" class="row">
-			<div class="col-12 mb-5">
+			<div class="col-12 d-flex justify-content-between align-items-center">
 				<p class="h5 font-weight-bold text-dark">Showing results for <i>{{query}}</i></p>
+				<div v-if="placesSearchEnabled" title="Show Places" data-toggle="tooltip">
+					<span v-if="results.placesPagination.total > 0" class="badge badge-light mr-2 p-1 border" style="margin-top:-5px;">{{formatCount(results.placesPagination.total)}}</span>
+					<div class="d-inline custom-control custom-switch">
+						<input type="checkbox" class="custom-control-input" id="placesSwitch" v-model="showPlaces">
+						<label class="custom-control-label font-weight-bold text-sm text-lighter" for="placesSwitch"><i class="fas fa-map-marker-alt"></i></label>
+					</div>
+				</div>
+			</div>
+			<div class="col-12 mb-5">
 				<hr>
 			</div>
+			<div v-if="placesSearchEnabled && showPlaces" class="col-12">
+				<div class="mb-4">
+					<p class="text-secondary small font-weight-bold">PLACES <span class="pl-1 text-lighter">({{results.placesPagination.total}})</span></p>
+				</div>
+				<div v-if="results.places.length" class="mb-5">
+					<a v-for="(hashtag, index) in results.places" class="mr-3 pr-4 d-inline-block text-decoration-none" :href="buildUrl('places', hashtag)">
+						<div class="pb-2">
+							<div class="media align-items-center py-2">
+								<div class="media-body text-truncate">
+									<p class="mb-0 text-truncate text-dark font-weight-bold" data-toggle="tooltip" :title="hashtag.value">
+										<i class="fas fa-map-marker-alt text-lighter mr-2"></i> {{hashtag.value}}
+									</p>
+								</div>
+							</div>
+						</div>
+					</a>
+					<p v-if="results.places.length == 20 || placesCursor > 0" class="text-center mt-3">
+						<a v-if="placesCursor == 1" href="#" class="btn btn-outline-secondary btn-sm font-weight-bold py-0 disabled" disabled>
+							<i class="fas fa-chevron-left mr-2"></i> Previous
+						</a>
+						<a v-else href="#" @click.prevent="placesPrevPage()" class="btn btn-outline-secondary btn-sm font-weight-bold py-0">
+							<i class="fas fa-chevron-left mr-2"></i> Previous
+						</a>
+
+						<span class="mx-4 small text-lighter">{{placesCursor}}/{{results.placesPagination.last_page}}</span>
+
+						<a v-if="placesCursor !== results.placesPagination.last_page" @click.prevent="placesNextPage()" href="#" class="btn btn-primary btn-sm font-weight-bold py-0">
+							Next <i class="fas fa-chevron-right ml-2"></i>
+						</a>
+						<a v-else href="#" class="btn btn-primary btn-sm font-weight-bold py-0 disabled" disabled>
+							Next <i class="fas fa-chevron-right ml-2"></i>
+						</a>
+					</p>
+				</div>
+				<div v-else>
+					<div class="border py-3 text-center font-weight-bold">No results found</div>
+				</div>			
+			</div>
 			<div class="col-md-3">
 				<div class="mb-4">
 					<p class="text-secondary small font-weight-bold">HASHTAGS <span class="pl-1 text-lighter">({{results.hashtags.length}})</span></p>
@@ -284,7 +331,8 @@ export default {
 			results: {
 				hashtags: [],
 				profiles: [],
-				statuses: []
+				statuses: [],
+				places: [],
 			},
 			filters: {
 				hashtags: true,
@@ -292,6 +340,10 @@ export default {
 				statuses: true
 			},
 			analysis: 'profile',
+			showPlaces: false,
+			placesCursor: 1,
+			placesCache: [],
+			placesSearchEnabled: false
 		}
 	},
 	beforeMount() {
@@ -300,6 +352,9 @@ export default {
 	mounted() {
 		$('.search-bar input').val(this.query);
 	},
+	updated() {
+		$('[data-toggle="tooltip"]').tooltip();
+	},
 	methods: {
 		bootSearch() {
 			let lexer = this.searchLexer();
@@ -388,7 +443,7 @@ export default {
 						params: {
 							'q': this.query,
 							'src': 'metro',
-							'v': 1,
+							'v': 2,
 							'scope': 'all'
 						}
 					}).then(res => {
@@ -396,6 +451,9 @@ export default {
 						this.results.hashtags = results.hashtags ? results.hashtags : [];
 						this.results.profiles = results.profiles ? results.profiles : [];
 						this.results.statuses = results.posts ? results.posts : [];
+						this.results.places   = results.places ? results.places : [];
+						this.placesCache = results.places;
+						this.results.placesPagination   = results.placesPagination ? results.placesPagination : [];
 						this.loading = false;
 					}).catch(err => {
 						this.loading = false;
@@ -500,6 +558,50 @@ export default {
 					this.networkError = true;
 				break;
 			}
+		},
+
+		placesPrevPage() {
+			this.placesCursor--;
+			if(this.placesCursor == 1) {
+				this.results.places = this.placesCache.slice(0, 20);
+				return;
+			}
+			let plc = this.placesCursor * 20;
+			this.results.places = this.placesCache.slice(plc, 20);
+			return;
+		},
+
+		placesNextPage() {
+			this.placesCursor++;
+			let plc = this.placesCursor * 20;
+			if(this.placesCache.length > 20) {
+				this.results.places = this.placesCache.slice(this.placesCursor == 1 ? 0 : plc, 20);
+				return;
+			} 
+			axios.get('/api/search', {
+				params: {
+					'q': this.query,
+					'src': 'metro',
+					'v': 2,
+					'scope': 'all',
+					'page': this.placesCursor
+				}
+			}).then(res => {
+				let results = res.data;
+				this.results.places = results.places ? results.places : [];
+				this.placesCache.push(...results.places);
+				this.loading = false;
+			}).catch(err => {
+				this.loading = false;
+				console.log(err);
+				this.networkError = true;
+			});
+
+		},
+
+		formatCount(num) {
+			let count = window.App.util.format.count(num);
+			return count;
 		}
 	}
 

+ 11 - 4
resources/assets/js/components/Timeline.vue

@@ -162,7 +162,8 @@
 
 						<div class="card-body">
 							<div v-if="!modes.distractionFree" class="reactions my-1 pb-2">
-								<h3 v-bind:class="[status.favourited ? 'fas fa-heart text-danger pr-3 m-0 cursor-pointer' : 'far fa-heart pr-3 m-0 like-btn text-lighter cursor-pointer']" title="Like" v-on:click="likeStatus(status, $event)"></h3>
+								<h3 v-if="status.favourited" class="fas fa-heart text-danger pr-3 m-0 cursor-pointer" title="Like" v-on:click="likeStatus(status, $event);"></h3>
+								<h3 v-else class="far fa-heart pr-3 m-0 like-btn text-lighter cursor-pointer" title="Like" v-on:click="likeStatus(status, $event);"></h3>
 								<h3 v-if="!status.comments_disabled" class="far fa-comment text-lighter pr-3 m-0 cursor-pointer" title="Comment" v-on:click="commentFocus(status, $event)"></h3>
 								<h3 v-if="status.visibility == 'public'" v-bind:class="[status.reblogged ? 'fas fa-retweet pr-3 m-0 text-primary cursor-pointer' : 'fas fa-retweet pr-3 m-0 text-lighter share-btn cursor-pointer']" title="Share" v-on:click="shareStatus(status, $event)"></h3>
 								<h3 class="fas fa-expand pr-3 m-0 cursor-pointer text-lighter" v-on:click="lightbox(status)"></h3>
@@ -196,7 +197,7 @@
 											<span v-html="reply.content" style="word-break: break-all;" class="comment-body"></span>
 										</span>
 										<span class="mb-0" style="min-width:38px">
-											<span v-on:click="likeStatus(reply, $event)">
+											<span v-on:click="likeStatus(reply, $event);">
 												<i v-bind:class="[reply.favourited ? 'fas fa-heart fa-sm text-danger cursor-pointer':'far fa-heart fa-sm text-lighter cursor-pointer']"></i>
 											</span>
 											<!-- <post-menu :status="reply" :profile="profile" size="sm" :modal="'true'" :feed="feed" class="d-inline-flex pl-2"></post-menu> -->
@@ -411,7 +412,7 @@
 						<div class="ml-3">
 							<p class="mb-0">
 								<span v-if="statusOwner(s)" class="font-weight-bold small">{{s.favourites_count == 1 ? '1 like' : s.favourites_count+' likes'}}</span>
-								<span class="px-2"><i v-bind:class="[s.favourited ? 'fas fa-heart text-danger cursor-pointer' : 'far fa-heart like-btn text-lighter cursor-pointer']" v-on:click="likeStatus(s, $event)"></i></span>
+								<span class="px-2"><i v-bind:class="[s.favourited ? 'fas fa-heart text-danger cursor-pointer' : 'far fa-heart like-btn text-lighter cursor-pointer']" v-on:click="likeStatus(s, $event);"></i></span>
 								<span class="mr-2 cursor-pointer"><i class="fas fa-ellipsis-v" @click="ctxMenu(s)"></i></span>
 							</p>
 						</div>
@@ -922,7 +923,7 @@
 
 			},
 
-			likeStatus(status) {
+			likeStatus(status, event) {
 				if($('body').hasClass('loggedIn') == false) {
 					return;
 				}
@@ -937,6 +938,12 @@
 					status.favourites_count = count;
 					swal('Error', 'Something went wrong, please try again later.', 'error');
 				});
+				window.navigator.vibrate(200);
+				if(status.favourited) {
+					setTimeout(function() {
+						event.target.classList.add('animate__animated', 'animate__bounce');
+					},100);
+				}
 			},
 
 			shareStatus(status, $event) {