From 647674ed355b89583ff3c57658af33e0e74bc2d9 Mon Sep 17 00:00:00 2001
From: Ashley //// <iamashley@duck.com>
Date: Mon, 22 Jan 2024 14:16:02 +0000
Subject: [PATCH] quality of life stuff :^

---
 html/poketube.ejs | 61 +++++++++++++++++++++--------------------------
 1 file changed, 27 insertions(+), 34 deletions(-)

diff --git a/html/poketube.ejs b/html/poketube.ejs
index 146727b4..7bb5be08 100644
--- a/html/poketube.ejs
+++ b/html/poketube.ejs
@@ -1126,7 +1126,7 @@ display: block; !important;" autoplay controls>
                <div class="video-chnl-info-pill"  name="chnl">
   <a name="chnl"></a>
 
-				<a href="/channel?id=<%=video?.Channel.id || k.Video.Channel.id%>" class="avatar">
+				<a href="/channel?id=<%=video?.Channel.id || k.Video.Channel.id%>@youtube.com" class="avatar">
 					<img loading="lazy" src="/avatars/<%= k.Video.Channel.Avatar[1].$t.replace("https://yt3.ggpht.com/", "") %>" %>">
 				</a>
 				<div class="name" >
@@ -1328,15 +1328,14 @@ display: block; !important;" autoplay controls>
               
                        <a id="metadata"></a>
                            <div class="video-title" style="color:var(--text-color);font-family:var(--text-font-primary);;font-weight:var(--text-header-weight);font-stretch: extra-expanded;margin-top: 10px;margin-bottom: 10px;">Metadata And Engagement</div>
- <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;/*! width: 4.5em; */height: 0;">
-
+ 
      <p  style="font-weight: bold;">
  
                     <span>Views : <%=engagement.viewCount.toLocaleString()%> <br>
                         Genre: <%-inv_vid.genre %>  <br>
 
                       Upload date:  <%=date%> ^^ <br>
-                       <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;/*! width: 4.5em; */height: 0;">
+                       <hr style="clear: both;display: none;border: none;border-bottom: 0.5px solid #2f2f2f;/*! width: 4.5em; */height: 0;">
                    Rating  :  <%=engagement.rating.toLocaleString()%> (<%=engagement.dislikes.toLocaleString()%>/<%=engagement.likes.toLocaleString()%> LTDR) <br>
                       RYD date created : <%=engagement.dateCreated.toLocaleString()%>  <br>
                       <a href="https://returnyoutubedislikeapi.com/votes?videoId=<%=inv_vid.videoId%>">See in json</a>
@@ -1347,8 +1346,7 @@ display: block; !important;" autoplay controls>
                       </span>                              
 
 
-                                                 <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;/*! width: 4.5em; */height: 0;">
-        
+         
      <%  if (Array.isArray(inv_vid?.keywords)) { %> 
 
                             <div class="video-title" style="color:var(--text-color);font-family:var(--text-font-primary);;font-weight:var(--text-header-weight);font-stretch: extra-expanded;margin-top: 10px;margin-bottom: 10px;">Tags</div>
@@ -1365,8 +1363,7 @@ display: block; !important;" autoplay controls>
            </div>
    
    
-           <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;/*! width: 4.5em; */height: 0;">
-            <% } %>  
+             <% } %>  
               
   
                        
@@ -1527,16 +1524,17 @@ display: block; !important;" autoplay controls>
 
 <div class="comments-class-or-something-i-cant-find-a-name-lol">
         <a id="comments-container"></a>
-
+<div style="text-align: center;margin-bottom: -1em;">
                                                  <h5 style="font-family:var(--text-font-primary);font-weight:var(--text-header-weight);white-space:yes;font-stretch: ultra-expanded;margin-bottom: 11px;margin-top: 6px;padding-top: 10px;">
-                                                   Comments <span style="font-family: inter;font-weight: 900;text-transform: lowercase;margin: 1px;">- <%- convert(inv.commentCount) %> </span>
+                                                 YouTube Comments <span style="font-family: inter;font-weight: 900;text-transform: lowercase;margin: 1px;">- <%- inv.commentCount %> </span>
                                                    </h5> 
                                                      
-                                            <p style="padding: 0;margin: 0;font-family: Inter;margin-bottom: 10px;">
-     Top Comments of this video!! :3
-  </p>              
-                                                                                       <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
-<% inv.comments.forEach(x =>{ %><div class="fade-in<%- x.commentId %><%- btoa(x.commentId) %>"><div class="_ comment_<%- x.commentId %><%- btoa(btoa(x.commentId)) %>"style="padding:10px"><div class="comment-list left-padding"style="background:#333;padding-top:1px;padding:10px;border-radius:30px;padding-top:0"><div class="d-flex justify-content-between single-comment"style="padding-top:none"><div class="d-flex justify-content-between user"><div class="desc"><h5 style="display:flex;margin-top:7px;padding-top:10px"><div class="thumb"><a href="/channel?id=<%- x.authorId%>"style="width:40px;height:40px"class="avatar"><img loading="lazy"src="<%- media_proxy_url %>/proxy?url=<%= x.authorThumbnails[1].url.replace("https://yt3.ggpht.com/", "https://iv.ggtyler.dev/ggpht/") %>"></a></div><%  if (!x.authorIsChannelOwner) { %><p class="comments-author"><a href="/channel?id=<%- x.authorId%>"style="color:var(--text-color);text-decoration:none"><%- x.author%><%  if (x.verified) { %><i class="icon ion ion-md-checkmark-circle"></i><% } %><p class="date-publish"><%- x.publishedText %></p></a></p><% } %><%  if (x.authorIsChannelOwner) { %><p class="comments-author owner"><a href="/channel?id=<%- x.authorId%>"style="color:var(--text-color);text-decoration:none"><%- x.author%><%  if (x.verified) { %><i class="icon ion ion-md-checkmark-circle"></i><% } %><p class="date-publish"><%- x.publishedText %></p></a><% } %></h5><p class="comment"style="font-weight:700"><%- x.contentHtml %><br><br><% if (x.likeCount === 0) { %><i class="fa-light fa-thumbs-up"></i> | <i class="fa-light fa-thumbs-down"></i><% } else { %><i class="fa-light fa-thumbs-up"></i> <%= convert(x.likeCount) %> | <i class="fa-light fa-thumbs-down"></i><% } %><%   if(x.creatorHeart) { %> <i class="icon creator-heart-small-container ion-ios-heart"style="color:#ffabcc"title="<%= x.creatorHeart.creatorName%> marked it with a ❤ owo"></i><% } %></div></div></div></div></div></div><% }) %>
+<p style="padding: 0;margin: 0;font-family: 'PokeTube flex';margin-bottom: 10px;font-weight: 700;font-stretch: ultra-expanded;" class="loaded">
+     Top Comments of this video!! :3  
+  </p>    
+                                        
+                                                   </div>
+ <% inv.comments.forEach(x =>{ %><div class="fade-in<%- x.commentId %><%- btoa(x.commentId) %>"><div class="_ comment_<%- x.commentId %><%- btoa(btoa(x.commentId)) %>"style="padding:10px"><div class="comment-list left-padding"style="background:#333;padding-top:1px;padding:10px;border-radius:30px;padding-top:0"><div class="d-flex justify-content-between single-comment"style="padding-top:none"><div class="d-flex justify-content-between user"><div class="desc"><h5 style="display:flex;margin-top:7px;padding-top:10px"><div class="thumb"><a href="/channel?id=<%- x.authorId%>@youtube.com"style="width:40px;height:40px"class="avatar"><img loading="lazy"src="<%- media_proxy_url %>/proxy?url=<%= x.authorThumbnails[1].url.replace("https://yt3.ggpht.com/", "https://iv.ggtyler.dev/ggpht/") %>"></a></div><%  if (!x.authorIsChannelOwner) { %><p class="comments-author"><a href="/channel?id=<%- x.authorId%>"style="color:var(--text-color);text-decoration:none"><%- x.author%><%  if (x.verified) { %><i class="icon ion ion-md-checkmark-circle"></i><% } %><p class="date-publish"><%- x.publishedText %></p></a></p><% } %><%  if (x.authorIsChannelOwner) { %><p class="comments-author owner"><a href="/channel?id=<%- x.authorId%>@youtube.com"style="color:var(--text-color);text-decoration:none"><%- x.author%><%  if (x.verified) { %><i class="icon ion ion-md-checkmark-circle"></i><% } %><p class="date-publish"><%- x.publishedText %></p></a><% } %></h5><p class="comment"style="font-weight:700"><%- x.contentHtml %><br><br><% if (x.likeCount === 0) { %><i class="fa-light fa-thumbs-up"></i> | <i class="fa-light fa-thumbs-down"></i><% } else { %><i class="fa-light fa-thumbs-up"></i> <%= convert(x.likeCount) %> | <i class="fa-light fa-thumbs-down"></i><% } %><%   if(x.creatorHeart) { %> <i class="icon creator-heart-small-container ion-ios-heart"style="color:#ffabcc"title="<%= x.creatorHeart.creatorName%> marked it with a ❤ owo"></i><% } %></div></div></div></div></div></div><% }) %>
       <center>
                   <a href="#top">Go To Top</a>
                     </center>
@@ -1597,7 +1595,7 @@ Recommended Videos
                                 
                                 
 <% if (!f) { %>
-<% k.Video.Recommendations?.Video?.forEach(x => { %> <div class="fade-in video">  <% if (!optout) { %><a class="thumbnail" href="/watch?v=<%= x.id %>" style="background-image:url(<%- media_proxy_url %>/proxy?url=https://iv.ggtyler.dev/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw);border-radius:9.5px" alt="<%= x.Title %>"><span class="video-length"><%- x.duration || "LIVE"%></span><% } %><% if (optout) { %><a class="thumbnail"href="/watch?v=<%= x.id %>&m=f"style="background-image:url(<%- media_proxy_url %>/proxy?url=https://iv.ggtyler.dev/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw);border-radius:9.5px"alt="<%= x.Title %>"><span class="video-length"><%- x.duration || "LIVE"%></span><% } %></a><div class="info"><% if (!optout) { %><a class="max-lines-2 title" href="/watch?v=<%= x.id %>" style="font-stretch:ultra-expanded;font-weight:850" title="<%= x.Title %>"><%= x.Title %></a><% } %><% if (optout) { %><a class="max-lines-2 title" href="/watch?v=<%= x.id %>&m=f" style="font-stretch:100%;font-weight:800" title="<%= x.Title %>"><%= x.Title %></a><% } %><div><a class="max-lines-2" href="/channel?id=<%= x.Channel.id %>" style="-webkit-line-clamp:1;width:12em;word-wrap:break-word"><%=x.Channel.Name %></a><div class="video-views"><% if (universe) { %><%= x.uploadedAt.replace("Streamed ", " ") %>  <br> <%= convert(x.views) %> views  <% } %>  <% if (!universe) { %><%= x.uploadedAt.replace("Streamed", " ") %> • <%= convert(x.views) %> views <% } %>  </div></div></div></div><% }) %><% } %>  
+<% k.Video.Recommendations?.Video?.forEach(x => { %> <div class="fade-in video">  <% if (!optout) { %><a class="thumbnail" href="/watch?v=<%= x.id %>" style="background-image:url(<%- media_proxy_url %>/proxy?url=https://iv.ggtyler.dev/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw);border-radius:9.5px" alt="<%= x.Title %>"><span class="video-length"><%- x.duration || "LIVE"%></span><% } %><% if (optout) { %><a class="thumbnail"href="/watch?v=<%= x.id %>&m=f"style="background-image:url(<%- media_proxy_url %>/proxy?url=https://iv.ggtyler.dev/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw);border-radius:9.5px"alt="<%= x.Title %>"><span class="video-length"><%- x.duration || "LIVE"%></span><% } %></a><div class="info"><% if (!optout) { %><a class="max-lines-2 title" href="/watch?v=<%= x.id %>" style="font-stretch:ultra-expanded;font-weight:850" title="<%= x.Title %>"><%= x.Title %></a><% } %><% if (optout) { %><a class="max-lines-2 title" href="/watch?v=<%= x.id %>&m=f" style="font-stretch:100%;font-weight:800" title="<%= x.Title %>"><%= x.Title %></a><% } %><div><a class="max-lines-2" href="/channel?id=<%= x.Channel.id %>@youtube.com" style="-webkit-line-clamp:1;width:12em;word-wrap:break-word"><%=x.Channel.Name %></a><div class="video-views"><% if (universe) { %><%= x.uploadedAt.replace("Streamed ", " ") %>  <br> <%= convert(x.views) %> views  <% } %>  <% if (!universe) { %><%= x.uploadedAt.replace("Streamed", " ") %> • <%= convert(x.views) %> views <% } %>  </div></div></div></div><% }) %><% } %>  
     
   <% if (f) { %> 
 
@@ -1670,26 +1668,13 @@ Recommended Videos
                     </div>
                            <% } %>
                               
-              <div style="font-family:Inter,sans-serif;;white-space:yes;" align="center">
-                                 <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
-<br>
-       <a href="https://youtube.com/watch?v=<%=inv_vid.videoId%>">Open On YouTube</a> • <a href="/privacy">Privacy</a> • <a href="https://codeberg.org/Ashley/poketube/">Git</a> 
-       </div> 
+              <div style="font-family:poketube flex,sans-serif;font-weight: 500;font-stretch: extra-expanded;" align="center">
+          
+                <div>Options got Moved to the <i class="fa-light fa-gear loaded"></i> icon :3</div>
+                             </div> 
                                                                         
                
-      <% if (optout) { %> 
-        
- <% } %>
-     
-      <% if (!optout) { %> 
-        
-                  <div style="font-family:Inter,sans-serif;;white-space:yes;" align="center">
-
-<a href="/watch?v=<%=inv_vid.videoId%>&m=f"> 
- Opt out of Metrics</a> (<a href="/privacy" style="color:var(--text-color)">Wut?</a>)
-               
-   </div>
-     <% } %>
+ 
             
                      </div>
            
@@ -2088,6 +2073,14 @@ a {
  .comment-mini:hover {
        background:#3f3f3f !important;
   }
+  
+
+.avatar > img {
+  border-radius:50%;
+  width: 50px;
+  height: 50px;
+}
+
 </style>
   
              <%  if (Array.isArray( !inv.comments)) { %>