Merge pull request #2850 from pixelfed/staging

Staging

CHANGELOG.md

@@ -52,6 +52,10 @@
 - Updated PublicApiController, impr home timeline perf. ([4fe42e5b](https://github.com/pixelfed/pixelfed/commit/4fe42e5b))
 - Updated Timeline.vue, fix comment button. ([b6b5ce7c](https://github.com/pixelfed/pixelfed/commit/b6b5ce7c))
 - Updated StatusEntityLexer, only add specific status types to PublicTimelineService. ([1fdcbe5b](https://github.com/pixelfed/pixelfed/commit/1fdcbe5b))
+- Updated ActivityPub helpers, fix comment threading in statusFetch() method ([26b9c140](https://github.com/pixelfed/pixelfed/commit/26b9c140))
+- Updated NotificationCard, fix typo in mention, share and comments. Fixes #2848. ([b37bb426](https://github.com/pixelfed/pixelfed/commit/b37bb426))
+- Updated StatusCard.vue, add togglecw events to other presenters. ([9607243f](https://github.com/pixelfed/pixelfed/commit/9607243f))
+- Updated presenters, fix content warning layout. ([fc56acb8](https://github.com/pixelfed/pixelfed/commit/fc56acb8))
 -  ([](https://github.com/pixelfed/pixelfed/commit/))
 
 ## [v0.11.0 (2021-06-01)](https://github.com/pixelfed/pixelfed/compare/v0.10.10...v0.11.0)

app/Http/Controllers/SearchController.php

@@ -321,13 +321,18 @@ class SearchController extends Controller
 
 		if(Status::whereUri($tag)->whereLocal(false)->exists()) {
 			$item = Status::whereUri($tag)->first();
+			$media = $item->firstMedia();
+			$url = null;
+			if($media) {
+				$url = $media->remote_url;
+			}
 			$this->tokens['posts'] = [[
 				'count'  => 0,
 				'url'    => "/i/web/post/_/$item->profile_id/$item->id",
 				'type'   => 'status',
 				'username' => $item->profile->username,
 				'caption'   => $item->rendered ?? $item->caption,
-				'thumb'  => $item->firstMedia()->remote_url,
+				'thumb'  => $url,
 				'timestamp' => $item->created_at->diffForHumans()
 			]];
 		}
@@ -336,13 +341,18 @@ class SearchController extends Controller
 
 		if(isset($remote['type']) && $remote['type'] == 'Note') {
 			$item = Helpers::statusFetch($tag);
+			$media = $item->firstMedia();
+			$url = null;
+			if($media) {
+				$url = $media->remote_url;
+			}
 			$this->tokens['posts'] = [[
 				'count'  => 0,
 				'url'    => "/i/web/post/_/$item->profile_id/$item->id",
 				'type'   => 'status',
 				'username' => $item->profile->username,
 				'caption'   => $item->rendered ?? $item->caption,
-				'thumb'  => $item->firstMedia()->remote_url,
+				'thumb'  => $url,
 				'timestamp' => $item->created_at->diffForHumans()
 			]];
 		}

app/Util/ActivityPub/Helpers.php

@@ -351,7 +351,7 @@ class Helpers {
 		}
 
 		$profile = self::profileFirstOrNew($activity['object']['attributedTo']);
-		if(isset($activity['object']['inReplyTo']) && !empty($activity['object']['inReplyTo']) && $replyTo == true) {
+		if(isset($activity['object']['inReplyTo']) && !empty($activity['object']['inReplyTo']) || $replyTo == true) {
 			$reply_to = self::statusFirstOrFetch($activity['object']['inReplyTo'], false);
 			$reply_to = optional($reply_to)->id;
 		} else {

resources/assets/js/components/NotificationCard.vue

@@ -131,13 +131,13 @@
 				axios.get('/api/pixelfed/v1/notifications?pg=true')
 				.then(res => {
 					let data = res.data.filter(n => {
-						if(n.type == 'share' && !status) {
+						if(n.type == 'share' && !n.status) {
 							return false;
 						}
-						if(n.type == 'comment' && !status) {
+						if(n.type == 'comment' && !n.status) {
 							return false;
 						}
-						if(n.type == 'mention' && !status) {
+						if(n.type == 'mention' && !n.status) {
 							return false;
 						}
 						return true;
@@ -162,13 +162,13 @@
 				}).then(res => {
 					if(res.data.length) {
 						let data = res.data.filter(n => {
-							if(n.type == 'share' && !status) {
+							if(n.type == 'share' && !n.status) {
 								return false;
 							}
-							if(n.type == 'comment' && !status) {
+							if(n.type == 'comment' && !n.status) {
 								return false;
 							}
-							if(n.type == 'mention' && !status) {
+							if(n.type == 'mention' && !n.status) {
 								return false;
 							}
 							if(_.find(this.notifications, {id: n.id})) {

resources/assets/js/components/partials/StatusCard.vue

@@ -40,19 +40,19 @@
 				</div>
 
 				<div v-else-if="status.pf_type === 'video'" class="w-100">
-					<video-presenter :status="status"></video-presenter>
+					<video-presenter :status="status" v-on:togglecw="status.sensitive = false"></video-presenter>
 				</div>
 
 				<div v-else-if="status.pf_type === 'photo:album'" class="w-100">
-					<photo-album-presenter :status="status" v-on:lightbox="lightbox"></photo-album-presenter>
+					<photo-album-presenter :status="status" v-on:lightbox="lightbox" v-on:togglecw="status.sensitive = false"></photo-album-presenter>
 				</div>
 
 				<div v-else-if="status.pf_type === 'video:album'" class="w-100">
-					<video-album-presenter :status="status"></video-album-presenter>
+					<video-album-presenter :status="status" v-on:togglecw="status.sensitive = false"></video-album-presenter>
 				</div>
 
 				<div v-else-if="status.pf_type === 'photo:video:album'" class="w-100">
-					<mixed-album-presenter :status="status" v-on:lightbox="lightbox"></mixed-album-presenter>
+					<mixed-album-presenter :status="status" v-on:lightbox="lightbox" v-on:togglecw="status.sensitive = false"></mixed-album-presenter>
 				</div>
 
 				<div v-else class="w-100">

resources/assets/js/components/presenter/PhotoPresenter.vue

@@ -54,12 +54,14 @@
     border-top-left-radius: 0 !important;
     border-top-right-radius: 0 !important;
   }
+  .content-label-wrapper {
+  	position: relative;
+  }
   .content-label {
   	margin: 0;
   	position: absolute;
   	top:50%;
   	left:50%;
-  	z-index: 2;
   	transform: translate(-50%, -50%);
   	display: flex;
   	flex-direction: column;

resources/assets/js/components/presenter/VideoPresenter.vue

@@ -1,16 +1,25 @@
 <template>
-	<div v-if="status.sensitive == true">
-		<details class="details-animated">
-			<summary>
-				<p class="mb-0 lead font-weight-bold">{{ status.spoiler_text ? status.spoiler_text : 'CW / NSFW / Hidden Media'}}</p>
-				<p class="font-weight-light">(click to show)</p>
-			</summary>
-			<div class="embed-responsive embed-responsive-1by1">
-				<video class="video" preload="none" loop :poster="status.media_attachments[0].preview_url":data-id="status.id" @click="playOrPause($event)">
-					<source :src="status.media_attachments[0].url" :type="status.media_attachments[0].mime">
-				</video>
-			</div>
-		</details>
+	<div v-if="status.sensitive == true" class="content-label-wrapper">
+		<div class="text-light content-label">
+			<p class="text-center">
+				<i class="far fa-eye-slash fa-2x"></i>
+			</p>
+			<p class="h4 font-weight-bold text-center">
+				Sensitive Content
+			</p>
+			<p class="text-center py-2">
+				{{ status.spoiler_text ? status.spoiler_text : 'This post may contain sensitive content.'}}
+			</p>
+			<p class="mb-0">
+				<button @click="toggleContentWarning()" class="btn btn-outline-light btn-block btn-sm font-weight-bold">See Post</button>
+			</p>
+		</div>
+		<blur-hash-image
+			width="32"
+			height="32"
+			:punch="1"
+			:hash="status.media_attachments[0].blurhash"
+			:alt="altText(status)"/>
 	</div>
 	<div v-else class="embed-responsive embed-responsive-16by9">
 		<video class="video" controls preload="metadata" loop :poster="status.media_attachments[0].preview_url" :data-id="status.id">
@@ -19,11 +28,41 @@
 	</div>
 </template>
 
+<style type="text/css" scoped>
+  .content-label-wrapper {
+  	position: relative;
+  }
+  .content-label {
+  	margin: 0;
+  	position: absolute;
+  	top:50%;
+  	left:50%;
+  	transform: translate(-50%, -50%);
+  	display: flex;
+  	flex-direction: column;
+  	align-items: center;
+  	justify-content: center;
+  	width: 100%;
+  	height: 100%;
+  	z-index: 2;
+  	background: rgba(0, 0, 0, 0.2)
+  }
+</style>
+
 <script type="text/javascript">
 	export default {
 		props: ['status'],
 
 		methods: {
+			altText(status) {
+				let desc = status.media_attachments[0].description;
+				if(desc) {
+					return desc;
+				}
+
+				return 'Video was not tagged with any alt text.';
+			},
+
 			playOrPause(e) {
 				let el = e.target;
 				if(el.getAttribute('playing') == 1) {
@@ -33,6 +72,10 @@
 					el.setAttribute('playing', 1);
 					el.play();
 				}
+			},
+
+			toggleContentWarning(status) {
+				this.$emit('togglecw');
 			}
 		}
 	}