jonny/jonnybarnes.uk
1
0
Fork 0
Code Issues 8 Pull requests Projects Releases 5 Packages Wiki Activity Actions

feat: Add webmention counts and icons for replies, likes, and reposts.

Browse source 
- Add new SVG icons for the "reply", "like", and "repost" actions
- Update webmention info display in note template to include counts and icons for replies, likes, and reposts
- Add webmention counts to FrontPageController.php and modify queries in NotesController.php
- Modify WebMentionsTableSeeder.php to change URLs, commentable ID, and add new WebMentions
This commit is contained in:
Jonny Barnes 2023-11-25 16:08:07 +00:00
parent 5bc03f36d2
commit 92098a793e
Signed by: jonny
SSH key fingerprint: SHA256:CTuSlns5U7qlD9jqHvtnVmfYV3Zwl2Z7WnJ4/dqOaL8
15 changed files with 179 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

1
resources/views/icons/like.blade.php Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-heart"><path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 372 B

1
resources/views/icons/reply.blade.php Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-message-circle"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 429 B

1
resources/views/icons/repost.blade.php Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-repeat"><polyline points="17 1 21 5 17 9"></polyline><path d="M3 11V9a4 4 0 0 1 4-4h14"></path><polyline points="7 23 3 19 7 15"></polyline><path d="M21 13v2a4 4 0 0 1-4 4H3"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 393 B

45
resources/views/notes/show.blade.php
View file

@ -25,29 +25,36 @@
</div>
@endforeach
@if($note->webmentions->filter(function ($webmention) {
return ($webmention->type == 'like-of');
})->count() > 0) <h1 class="notes-subtitle">Likes</h1>
@foreach($note->webmentions->filter(function ($webmention) {
return ($webmention->type == 'like-of');
}) as $like)
<a href="{{ $like['author']['properties']['url'][0] }}"><img src="{{ $like['author']['properties']['photo'][0] }}" alt="profile picture of {{ $like['author']['properties']['name'][0] }}" class="like-photo"></a>
@endforeach
return ($webmention->type === 'like-of');
})->count() > 0)
<h1 class="notes-subtitle">Likes</h1>
<div class="webmentions-author-list">
@foreach($note->webmentions->filter(function ($webmention) {
return ($webmention->type === 'like-of');
}) as $like)
<a href="{{ $like['author']['properties']['url'][0] }}">
<img src="{{ $like['author']['properties']['photo'][0] }}" alt="profile picture of {{ $like['author']['properties']['name'][0] }}" class="like-photo">
</a>
@endforeach
</div>
@endif
@if($note->webmentions->filter(function ($webmention) {
return ($webmention->type == 'repost-of');
})->count() > 0) <h1 class="notes-subtitle">Reposts</h1>
@foreach($note->webmentions->filter(function ($webmention) {
return ($webmention->type == 'repost-of');
}) as $repost)
<p>
<a class="h-card vcard mini-h-card p-author" href="{{ $repost['author']['properties']['url'][0] }}">
<img src="{{ $repost['author']['properties']['photo'][0] }}" alt="profile picture of {{ $repost['author']['properties']['name'][0] }}" class="photo u-photo logo"> <span class="fn">{{ $repost['author']['properties']['name'][0] }}</span>
</a> reposted this at <a href="{{ $repost['source'] }}">{{ $repost['published'] }}</a>.
</p>
@endforeach
return ($webmention->type === 'repost-of');
})->count() > 0)
<h1 class="notes-subtitle">Reposts</h1>
<div class="webmentions-author-list">
@foreach($note->webmentions->filter(function ($webmention) {
return ($webmention->type == 'repost-of');
}) as $repost)
<a href="{{ $repost['source'] }}">
<img src="{{ $repost['author']['properties']['photo'][0] }}" alt="{{ $repost['author']['properties']['name'][0] }} reposted this at {{ $repost['published'] }}">
</a>
@endforeach
</div>
@endif
@stop
@section('scripts')
<link rel="stylesheet" href="/assets/highlight/zenburn.css">
@parent
<link rel="stylesheet" href="/assets/highlight/zenburn.css">
@stop

25
resources/views/templates/note.blade.php
View file

@ -40,6 +40,31 @@
in <span class="p-location h-adr">{!! $note->address !!}<data class="p-latitude" value="{{ $note->latitude }}"></data><data class="p-longitude" value="{{ $note->longitude }}"></data></span>
@endif
</div>
@if($note->replies > 0 || $note->likes > 0 || $note->reposts > 0)
<div class="webmention-info">
@if($note->replies > 0)
<div class="replies">
@include('icons.reply')
{{ $note->replies }}
<span class="sr-only">replies</span>
</div>
@endif
@if($note->likes > 0)
<div class="likes">
@include('icons.like')
{{ $note->likes }}
<span class="sr-only">likes</span>
</div>
@endif
@if($note->reposts > 0)
<div class="reposts">
@include('icons.repost')
{{ $note->reposts }}
<span class="sr-only">reposts</span>
</div>
@endif
</div>
@endif
<div class="syndication-links">
@if(
$note->tweet_id ||