From 48c46f4d6168d0e7c80a02dc3e6de4cd71582654 Mon Sep 17 00:00:00 2001
From: syeopite <syeopite@syeopite.dev>
Date: Fri, 16 Apr 2021 01:13:58 -0700
Subject: [PATCH] Add links widget to channel banner + tiny refactor

(cherry picked from commit ab69c9ab351300fd738d97efe4e1137abe4e55e8)
---
 assets/css/channel.css                        | 39 +++++++++++++++++++
 src/invidious/views/channel.ecr               |  7 +++-
 src/invidious/views/channel_about.ecr         |  5 +++
 src/invidious/views/community.ecr             |  5 +++
 .../views/components/channel-information.ecr  | 24 +++++++++---
 src/invidious/views/playlists.ecr             |  6 ++-
 6 files changed, 78 insertions(+), 8 deletions(-)

diff --git a/assets/css/channel.css b/assets/css/channel.css
index e40dc6aa..057756fc 100644
--- a/assets/css/channel.css
+++ b/assets/css/channel.css
@@ -11,3 +11,42 @@
   background-repeat: no-repeat !important;
 }
 
+#link-holder {
+  display: flex;
+  background: rgba(0, 0, 0, 0.3);
+  align-self: flex-end;
+  margin: 15px;
+  padding: 12px;
+}
+
+@media screen and (max-width: 640px) {
+  #link-holder {
+    display: none;
+  }
+}
+
+#link-widget-primary {
+  margin-right: 1.5em;
+}
+
+.link-widget-link {
+  margin-right: 10px;
+}
+
+.link-widget-link:last-child {
+  margin-right: 0;
+}
+
+.link-widget-link img, #external-links img {
+  vertical-align: sub;
+  width: 20px;
+  height: 20px;
+}
+
+#link-widget-primary a {
+  color: white !important;
+}
+
+#link-widget-primary a:hover {
+  color: #e1e1e1 !important;
+}
diff --git a/src/invidious/views/channel.ecr b/src/invidious/views/channel.ecr
index cad0a568..7861ae5b 100644
--- a/src/invidious/views/channel.ecr
+++ b/src/invidious/views/channel.ecr
@@ -1,5 +1,10 @@
-<% content_type =  0 %>
+<% content_for "header" do %>
+<title><%= channel.author %> - Invidious</title>
+<link rel="stylesheet" href="/css/channel.css?v=<%= ASSET_COMMIT %>">
+<link rel="alternate" type="application/rss+xml" title="RSS" href="/feed/channel/<%= channel.ucid %>" >
+<% end %>
 
+<% content_type =  0 %>
 <%= rendered "components/channel-information" %>
 
 <div class="pure-g">
diff --git a/src/invidious/views/channel_about.ecr b/src/invidious/views/channel_about.ecr
index 4f05e1b3..8e34f77c 100644
--- a/src/invidious/views/channel_about.ecr
+++ b/src/invidious/views/channel_about.ecr
@@ -1,3 +1,8 @@
+<% content_for "header" do %>
+<title><%= channel.author %> - Invidious</title>
+<link rel="stylesheet" href="/css/channel.css?v=<%= ASSET_COMMIT %>">
+<% end %>
+
 <% content_type =  4 %>
 <% sort_options = Tuple.new %>
 <%= rendered "components/channel-information" %>
diff --git a/src/invidious/views/community.ecr b/src/invidious/views/community.ecr
index 7d8fefbe..3cbc346a 100644
--- a/src/invidious/views/community.ecr
+++ b/src/invidious/views/community.ecr
@@ -1,3 +1,8 @@
+<% content_for "header" do %>
+<title><%= channel.author %> - Invidious</title>
+<link rel="stylesheet" href="/css/channel.css?v=<%= ASSET_COMMIT %>">
+<% end %>
+
 <% content_type =  2 %>
 <% sort_options = Tuple.new %>
 <%= rendered "components/channel-information" %>
diff --git a/src/invidious/views/components/channel-information.ecr b/src/invidious/views/components/channel-information.ecr
index 6d272abc..1c738638 100644
--- a/src/invidious/views/components/channel-information.ecr
+++ b/src/invidious/views/components/channel-information.ecr
@@ -1,12 +1,24 @@
-<% content_for "header" do %>
-<title><%= channel.author %> - Invidious</title>
-<link rel="stylesheet" href="/css/channel.css?v=<%= ASSET_COMMIT %>"/>
-<link rel="alternate" type="application/rss+xml" title="RSS" href="/feed/channel/<%= channel.ucid %>" />
-<% end %>
-
 <% if channel.banner %>
     <div class="pure-g" id="channel-banner-container">
         <div class="pure-u-1" id="banner" style='background: url(/ggpht<%= URI.parse(channel.banner.not_nil!.gsub("=w1060-", "=w1280-")).request_target %>)'>
+            <% if channel.links %>
+                <div id="link-holder">
+                    <div id="link-widget-primary" class="link-widget-link">
+                        <a href="<%=channel.links[0][1]%>" title=<%=channel.links[0][0]%>>
+                            <img src="/fetch_link_favicon?url=<%=channel.links[0][2]%>">
+                            <b> <%=channel.links[0][0]%> </b>
+                        </a>
+                    </div>
+
+                    <% channel.links[1..4].each do |link_tuple| %>
+                        <div class="link-widget-link">
+                            <a href="<%=link_tuple[1]%>" title=<%=link_tuple[0]%>>
+                                <img src="/fetch_link_favicon?url=<%=link_tuple[2]%>">
+                            </a>
+                        </div>
+                    <% end %>
+                </div>
+            <% end %>
         </div>
     </div>
 
diff --git a/src/invidious/views/playlists.ecr b/src/invidious/views/playlists.ecr
index b5e094d8..920b2b15 100644
--- a/src/invidious/views/playlists.ecr
+++ b/src/invidious/views/playlists.ecr
@@ -1,5 +1,9 @@
-<% content_type =  1 %>
+<% content_for "header" do %>
+<title><%= channel.author %> - Invidious</title>
+<link rel="stylesheet" href="/css/channel.css?v=<%= ASSET_COMMIT %>">
+<% end %>
 
+<% content_type =  1 %>
 <%= rendered "components/channel-information" %>
 
 <div class="pure-g">