From 2b8d6d94f91cb2588df7e0e074fd95899c50c001 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20FAMIBELLE-PRONZOLA?= <c.pronzola@tuta.io>
Date: Wed, 9 Apr 2025 08:40:03 +0400
Subject: [PATCH] add channel avatar

---
 css/styles.css      | 30 ++++++++++++++++++++++++++++++
 includes/config.php |  6 ++++++
 index.php           | 33 ++++++++++++++++++++++++++++++---
 3 files changed, 66 insertions(+), 3 deletions(-)

diff --git a/css/styles.css b/css/styles.css
index 6368c6c..13f5efd 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -415,6 +415,36 @@ img {
     font-size: 14px;
     color: #555;
     margin-bottom: 8px;
+    display: flex;
+    align-items: center;
+    overflow: hidden;
+}
+
+.channel-avatar {
+    width: 24px;
+    height: 24px;
+    border-radius: 50%;
+    margin-right: 8px;
+    object-fit: cover;
+    flex-shrink: 0;
+    border: 1px solid #e5e5e5;
+}
+
+.channel-avatar-placeholder {
+    width: 24px;
+    height: 24px;
+    border-radius: 50%;
+    margin-right: 8px;
+    flex-shrink: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: #e5e5e5;
+    color: #666;
+    font-size: 16px;
+}
+
+.channel-name {
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
diff --git a/includes/config.php b/includes/config.php
index 911aa5a..7946bc5 100644
--- a/includes/config.php
+++ b/includes/config.php
@@ -274,6 +274,11 @@ function formatVideosData($videosData) {
         $thumbnail = isset($video['previewPath']) 
             ? PEERTUBE_URL . $video['previewPath'] 
             : 'img/default-thumbnail.jpg';
+            
+        // Récupérer l'avatar de la chaîne
+        $channelAvatar = isset($video['channel']['avatars'][0]['path']) && isset($video['channel']['avatars'][0]['path'])
+            ? PEERTUBE_URL . $video['channel']['avatars'][0]['path']
+            : 'img/default-avatar.png';
         
         // Formater les données
         $videos[] = [
@@ -282,6 +287,7 @@ function formatVideosData($videosData) {
             'thumbnail' => $thumbnail,
             'duration' => $video['duration'],
             'channel' => $video['channel']['displayName'],
+            'channelAvatar' => $channelAvatar,
             'views' => $video['views'],
             'date' => $video['publishedAt'],
             'aspectRatio' => $video['aspectRatio'],
diff --git a/index.php b/index.php
index 06a922c..8d2ccb5 100644
--- a/index.php
+++ b/index.php
@@ -218,7 +218,16 @@
                     </div>
                     <div class="video-info">
                         <h3 class="video-title"><?php echo $video['title']; ?></h3>
-                        <div class="video-channel"><?php echo $video['channel']; ?></div>
+                        <div class="video-channel">
+                            <?php if (strpos($video['channelAvatar'], 'default-avatar.png') !== false || empty($video['channelAvatar'])): ?>
+                                <div class="channel-avatar-placeholder">
+                                    <i class="fas fa-user-circle"></i>
+                                </div>
+                            <?php else: ?>
+                                <img src="<?php echo $video['channelAvatar']; ?>" alt="<?php echo $video['channel']; ?>" class="channel-avatar">
+                            <?php endif; ?>
+                            <span class="channel-name"><?php echo $video['channel']; ?></span>
+                        </div>
                         <div class="video-metadata">
                             <span class="video-views"><i class="fas fa-eye"></i> <?php echo formatViewCount($video['views']); ?> vues</span>
                             <span class="video-date"><i class="far fa-calendar-alt"></i> <?php echo formatDate($video['date']); ?></span>
@@ -264,7 +273,16 @@
                     </div>
                     <div class="video-info">
                         <h3 class="video-title"><?php echo $video['title']; ?></h3>
-                        <div class="video-channel"><?php echo $video['channel']; ?></div>
+                        <div class="video-channel">
+                            <?php if (strpos($video['channelAvatar'], 'default-avatar.png') !== false || empty($video['channelAvatar'])): ?>
+                                <div class="channel-avatar-placeholder">
+                                    <i class="fas fa-user-circle"></i>
+                                </div>
+                            <?php else: ?>
+                                <img src="<?php echo $video['channelAvatar']; ?>" alt="<?php echo $video['channel']; ?>" class="channel-avatar">
+                            <?php endif; ?>
+                            <span class="channel-name"><?php echo $video['channel']; ?></span>
+                        </div>
                         <div class="video-metadata">
                             <span class="video-views"><i class="fas fa-eye"></i> <?php echo formatViewCount($video['views']); ?> vues</span>
                             <span class="video-date"><i class="far fa-calendar-alt"></i> <?php echo formatDate($video['date']); ?></span>
@@ -310,7 +328,16 @@
                     </div>
                     <div class="video-info">
                         <h3 class="video-title"><?php echo $video['title']; ?></h3>
-                        <div class="video-channel"><?php echo $video['channel']; ?></div>
+                        <div class="video-channel">
+                            <?php if (strpos($video['channelAvatar'], 'default-avatar.png') !== false || empty($video['channelAvatar'])): ?>
+                                <div class="channel-avatar-placeholder">
+                                    <i class="fas fa-user-circle"></i>
+                                </div>
+                            <?php else: ?>
+                                <img src="<?php echo $video['channelAvatar']; ?>" alt="<?php echo $video['channel']; ?>" class="channel-avatar">
+                            <?php endif; ?>
+                            <span class="channel-name"><?php echo $video['channel']; ?></span>
+                        </div>
                         <div class="video-metadata">
                             <span class="video-views"><i class="fas fa-eye"></i> <?php echo formatViewCount($video['views']); ?> vues</span>
                             <span class="video-date"><i class="far fa-calendar-alt"></i> <?php echo formatDate($video['date']); ?></span>