Skip to content

Commit 4609a43

Browse files
mauricerenckmauricerenck
committed
feat: use different avatar services
currently gravatar and initials
1 parent e0c02fa commit 4609a43

File tree

12 files changed

+228
-116
lines changed

12 files changed

+228
-116
lines changed

‎composer.lock‎

Lines changed: 99 additions & 91 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎index.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎index.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎lib/AvatarHandler.php‎

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
<?php
2+
3+
namespace mauricerenck\Komments;
4+
5+
class AvatarHandler
6+
{
7+
8+
public function __construct(private ?string $avatarReturnSvg = null, private ?string $avatarService = null)
9+
{
10+
$this->avatarReturnSvg = $avatarReturnSvg ?? option('mauricerenck.komments.avatar.svg', true);
11+
$this->avatarService = $avatarService ?? option('mauricerenck.komments.avatar.service', 'initials');
12+
}
13+
14+
public function getAvatar(string $authorGravatar, string $authorName): ?string
15+
{
16+
$avatarString = $this->getAvatarByType($authorGravatar, $authorName);
17+
18+
if ($this->avatarService !== 'gravatar' && $this->avatarReturnSvg) {
19+
return $avatarString;
20+
}
21+
22+
return <<<HTMLTAG
23+
<img class="u-photo" src="$avatarString" alt="$authorName" />
24+
HTMLTAG;
25+
}
26+
27+
public function getAvatarByType(string $authorGravatar, string $authorName): ?string
28+
{
29+
if ($this->avatarService === 'gravatar') {
30+
return $authorGravatar;
31+
}
32+
33+
if ($this->avatarReturnSvg) {
34+
return $this->author_initials_svg_data_uri($authorName)['svg'];
35+
}
36+
37+
return $this->author_initials_svg_data_uri($authorName)['dataUri'];
38+
}
39+
40+
public function author_initials_svg_data_uri($author)
41+
{
42+
// Extract initials
43+
$words = preg_split('/\s+/', trim($author));
44+
if (count($words) === 1) {
45+
$initials = mb_substr($words[0], 0, 2);
46+
} else {
47+
$initials = '';
48+
foreach (array_slice($words, 0, 2) as $word) {
49+
$initials .= mb_substr($word, 0, 1);
50+
}
51+
}
52+
$initials = htmlspecialchars($initials);
53+
54+
// SVG string
55+
$svg = <<<SVG
56+
<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" class="komment-avatar-initials">
57+
<style>
58+
.author-initials-bg { fill: var(--author-bg, #1391a4); }
59+
.author-initials-text {
60+
fill: var(--author-text, #fff);
61+
font-family: var(--author-font-family, system-ui, sans-serif);
62+
font-size: var(--author-font-size, 40px);
63+
font-weight: var(--author-font-weight, bold);
64+
dominant-baseline: middle;
65+
text-anchor: middle;
66+
text-transform: uppercase;
67+
}
68+
</style>
69+
<rect class="author-initials-bg" width="100" height="100"/>
70+
<text
71+
x="50"
72+
y="55"
73+
class="author-initials-text"
74+
dominant-baseline="middle"
75+
text-anchor="middle"
76+
>$initials</text>
77+
</svg>
78+
SVG;
79+
80+
// Encode as data URI
81+
$svg = preg_replace('/\s+/', ' ', trim($svg)); // Minify
82+
$dataUri = 'data:image/svg+xml;utf8,' . rawurlencode($svg);
83+
84+
return [
85+
'dataUri' => $dataUri,
86+
'svg' => $svg,
87+
];
88+
}
89+
}

‎lib/Storage.php‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@
77
use Kirby\Toolkit\Obj;
88
use Kirby\Toolkit\Collection;
99

10-
class Storage {
10+
class Storage
11+
{
1112

1213
public function __construct() {}
1314

@@ -49,14 +50,17 @@ public function createComment(
4950
string | null $updatedAt
5051
): Content {
5152

53+
$avatarHandler = new AvatarHandler();
54+
$avatar = $avatarHandler->getAvatar($authorAvatar, $authorName);
55+
5256
return new Content([
5357
'id' => $id,
5458
'pageUuid' => $pageUuid,
5559
'parentId' => $parentId,
5660
'type' => $type,
5761
'content' => $content,
5862
'authorName' => $authorName,
59-
'authorAvatar' => $authorAvatar,
63+
'authorAvatar' => $avatar,
6064
'authorEmail' => $authorEmail,
6165
'authorUrl' => $authorUrl,
6266
'published' => $published,

‎snippets/response-base.php‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
<?php
2-
$classNames = ['u-comment', 'h-cite'];
3-
$classNames[] = 'comment-type_' . $comment->type();
2+
$classNames = ['u-comment', 'h-cite'];
3+
$classNames[] = 'comment-type_' . $comment->type();
44

5-
if ($comment->verified()->isTrue()) {
6-
$classNames[] = 'verified';
7-
}
5+
if ($comment->verified()->isTrue()) {
6+
$classNames[] = 'verified';
7+
}
88
?>
99
<li class="<?= implode(' ', $classNames); ?>" id="c<?= $comment->id(); ?>">
1010
<?php if ($header = $slots->header()): ?>
1111
<?= $header ?>
1212
<?php else: ?>
1313
<header class="h-card">
14-
<img class="u-photo" src="<?= $comment->authorAvatar(); ?>" alt="<?= $comment->authorName(); ?>"/>
14+
<?= $comment->authorAvatar(); ?>
1515
<?php if ($comment->authorUrl()->isNotEmpty()): ?>
1616
<a class="u-author" href="<?= $comment->authorUrl(); ?>" rel="nofollow" target="_blank"><?= $comment->authorName(); ?></a>
1717
<?php else: ?>
@@ -39,4 +39,4 @@
3939
<?php if ($replies = $slots->replies()): ?>
4040
<?= $replies ?>
4141
<?php endif; ?>
42-
</li>
42+
</li>

‎src/components/DrawerDetails.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@
6060
</tr>
6161
<tr>
6262
<th data-mobile="true">Avatar</th>
63-
<td data-mobile="true">{{ comment.authoravatar }}</td>
63+
<td data-mobile="true" v-html="comment.authoravatar"></td>
6464
</tr>
6565
<tr>
6666
<th data-mobile="true">Email</th>

‎src/components/fields/CommentsTable.vue‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ export default {
156156
const newComment = {
157157
id: comment.id,
158158
pageTitle: `<a href="${pageOfComment.panel}">${pageOfComment.title}</a>`,
159-
author: `<span class="author-entry"><img src="${comment.authoravatar}" width="30px" height="30px" />${comment.authorname}</span>`,
159+
author: `<span class="author-entry">${comment.authoravatar} ${comment.authorname}</span>`,
160160
content: content,
161161
updatedAt: publishDate,
162162
type: this.tableIcon(typeIcons[comment.type], '--color-blue-700', comment.type),
@@ -287,6 +287,13 @@ export default {
287287
align-items: center;
288288
color: var(--color-black);
289289
text-decoration: none;
290+
291+
svg,
292+
img {
293+
width: 32px;
294+
height: 32px;
295+
object-fit: cover;
296+
}
290297
}
291298
292299
.center-icon {

‎tests/KommentsModerationTest.php‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@
55

66
final class KommentsModerationTest extends TestCaseMocked
77
{
8+
private $avatar = '<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" class="komment-avatar-initials"> <style> .author-initials-bg { fill: var(--author-bg, #1391a4); } .author-initials-text { fill: var(--author-text, #fff); font-family: var(--author-font-family, system-ui, sans-serif); font-size: var(--author-font-size, 40px); font-weight: var(--author-font-weight, bold); dominant-baseline: middle; text-anchor: middle; text-transform: uppercase; } </style> <rect class="author-initials-bg" width="100" height="100"/> <text x="50" y="55" class="author-initials-text" dominant-baseline="middle" text-anchor="middle" >AN</text> </svg>';
9+
810
public function setUp(): void
911
{
1012
parent::setUp();
@@ -25,7 +27,7 @@ public function testGetComment()
2527
'type' => 'comment',
2628
'content' => 'lorem ipsum dolor sit amet.',
2729
'authorname' => 'Author Name',
28-
'authoravatar' => 'https://api.dicebear.com/9.x/pixel-art/png?seed=AuthorName',
30+
'authoravatar' => $this->avatar,
2931
'authoremail' => '[email protected]',
3032
'authorurl' => 'https://example.com',
3133
'published' => true,
@@ -44,9 +46,9 @@ public function testGetComment()
4446
}
4547

4648
/**
47-
* @group moderation
48-
* @testdox getPendingComments - should return pending comments
49-
*/
49+
* @group moderation
50+
* @testdox getPendingComments - should return pending comments
51+
*/
5052
public function testGetPendingComments()
5153
{
5254
$moderationClass = new KommentModeration(storageType: 'phpunit');
@@ -58,7 +60,7 @@ public function testGetPendingComments()
5860
'type' => 'comment',
5961
'content' => 'lorem ipsum dolor sit amet.',
6062
'authorname' => 'Author Name',
61-
'authoravatar' => 'https://api.dicebear.com/9.x/pixel-art/png?seed=AuthorName',
63+
'authoravatar' => $this->avatar,
6264
'authoremail' => '[email protected]',
6365
'authorurl' => 'https://example.com',
6466
'published' => false,
@@ -86,9 +88,9 @@ public function testGetPendingComments()
8688
}
8789

8890
/**
89-
* @group moderation
90-
* @testdox getAllPageComments - should return comments of a page
91-
*/
91+
* @group moderation
92+
* @testdox getAllPageComments - should return comments of a page
93+
*/
9294
public function testGetAllPageComments()
9395
{
9496
$moderationClass = new KommentModeration(storageType: 'phpunit');

‎vendor/composer/autoload_classmap.php‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@
1313
'Kirby\\ComposerInstaller\\Installer' => $vendorDir . '/getkirby/composer-installer/src/ComposerInstaller/Installer.php',
1414
'Kirby\\ComposerInstaller\\Plugin' => $vendorDir . '/getkirby/composer-installer/src/ComposerInstaller/Plugin.php',
1515
'Kirby\\ComposerInstaller\\PluginInstaller' => $vendorDir . '/getkirby/composer-installer/src/ComposerInstaller/PluginInstaller.php',
16+
'mauricerenck\\Komments\\AvatarHandler' => $baseDir . '/lib/AvatarHandler.php',
1617
'mauricerenck\\Komments\\DatabaseAbstraction' => $baseDir . '/lib/DatabaseAbstraction.php',
1718
'mauricerenck\\Komments\\KommentModeration' => $baseDir . '/lib/KommentModeration.php',
1819
'mauricerenck\\Komments\\KommentNotifications' => $baseDir . '/lib/KommentNotifications.php',

0 commit comments

Comments
 (0)