From 8be208c772a672c848c07d8e0ddd8b97ccc74f95 Mon Sep 17 00:00:00 2001
From: syeopite <syeopite@syeopite.dev>
Date: Mon, 12 Apr 2021 03:55:53 -0700
Subject: [PATCH] Refactor channel tab templates

(cherry picked from commit 40823d5816eb79109ec148aed81c60c0984e3a37)
---
 src/invidious/routes/channels.cr  |   1 -
 src/invidious/views/channel.ecr   | 114 +-----------------------------
 src/invidious/views/community.ecr |  74 ++-----------------
 src/invidious/views/playlists.ecr |  88 +----------------------
 4 files changed, 10 insertions(+), 267 deletions(-)

diff --git a/src/invidious/routes/channels.cr b/src/invidious/routes/channels.cr
index 29748cd0..cb80d2b4 100644
--- a/src/invidious/routes/channels.cr
+++ b/src/invidious/routes/channels.cr
@@ -48,7 +48,6 @@ module Invidious::Routes::Channels
     end
     locale, user, subscriptions, continuation, ucid, channel = data
 
-    sort_options = {"last", "oldest", "newest"}
     sort_by = env.params.query["sort_by"]?.try &.downcase
     sort_by ||= "last"
 
diff --git a/src/invidious/views/channel.ecr b/src/invidious/views/channel.ecr
index f285358e..cad0a568 100644
--- a/src/invidious/views/channel.ecr
+++ b/src/invidious/views/channel.ecr
@@ -1,116 +1,6 @@
-<% ucid = channel.ucid %>
-<% author = HTML.escape(channel.author) %>
+<% content_type =  0 %>
 
-<% content_for "header" do %>
-<title><%= author %> - Invidious</title>
-<link rel="alternate" type="application/rss+xml" title="RSS" href="/feed/channel/<%= ucid %>" />
-<% end %>
-
-<% if channel.banner %>
-    <div class="h-box">
-        <img style="width:100%" src="/ggpht<%= URI.parse(channel.banner.not_nil!.gsub("=w1060-", "=w1280-")).request_target %>">
-    </div>
-
-    <div class="h-box">
-        <hr>
-    </div>
-<% end %>
-
-<div class="pure-g h-box">
-    <div class="pure-u-2-3">
-        <div class="channel-profile">
-            <img src="/ggpht<%= URI.parse(channel.author_thumbnail).request_target %>">
-            <span><%= author %></span>
-        </div>
-    </div>
-    <div class="pure-u-1-3">
-        <h3 style="text-align:right">
-            <a href="/feed/channel/<%= ucid %>"><i class="icon ion-logo-rss"></i></a>
-        </h3>
-    </div>
-</div>
-
-<div class="h-box">
-    <div id="descriptionWrapper">
-        <p><span style="white-space:pre-wrap"><%= channel.description_html %></span></p>
-    </div>
-</div>
-
-<div class="h-box">
-    <% sub_count_text = number_to_short_text(channel.sub_count) %>
-    <%= rendered "components/subscribe_widget" %>
-</div>
-
-<div class="pure-g h-box" id="content-navigation">
-    <div class="pure-u-1-3">
-        <!-- <a href="https://www.youtube.com/channel/<%= channel.ucid %>"><%= translate(locale, "View channel on YouTube") %></a> -->
-        <!--             <a href="/redirect?referer=<%= env.get?("current_page") %>"><%= translate(locale, "Switch Invidious Instance") %></a> -->
-        <div class="pure-menu pure-menu-horizontal">
-          <ui class="pure-menu-list">
-              <% if !channel.auto_generated %>
-                  <li class="pure-menu-item pure-menu-selected">
-                    <a href="/channel/<%= channel.ucid %>" class="pure-menu-link">
-                      <b><%= translate(locale, "Videos") %></b>
-                    </a>
-                  </li>
-              <% end %>
-              <li class="pure-menu-item">
-                  <% if channel.auto_generated %>
-                      <b><%= translate(locale, "Playlists") %></b>
-                  <% else %>
-                      <a class="pure-menu-link" href="/channel/<%= channel.ucid %>/playlists">
-                        <%= translate(locale, "Playlists") %>
-                      </a>
-                  <% end %>
-              </li>
-              <li class="pure-menu-item">
-                  <% if channel.tabs.includes? "community" %>
-                      <a class="pure-menu-link" href="/channel/<%= channel.ucid %>/community">
-                        <%= translate(locale, "Community") %>
-                      </a>
-                  <% end %>
-              </li>
-              <li class="pure-menu-item navbar" style="margin: 0 0 0 0.5em">
-                  <div class="searchbar">
-                      <form class="pure-form" action="/search" method="get">
-                          <fieldset>
-                              <button class="search-button"><i class="icon ion-md-search"></i></button>
-                              <input type="search" name="q" placeholder="<%= translate(locale, "search") %>" value="<%= env.get?("search").try {|x| HTML.escape(x.as(String)) } %>">
-                              <input type="hidden" name="channel" value="<%= channel.ucid %>">
-                          </fieldset>
-                      </form>
-                  </div>
-              </li>
-          </ui>
-        </div>
-    </div>
-    <div class="pure-u-1-3"></div>
-    <div class="pure-u-1-3"> <!-- Sort by -->
-        <div class="pure-menu pure-menu-horizontal" style="">
-            <ul class="pure-menu-list", style="float: right">
-                <% sort_options.each do |sort| %>
-                    <% if sort_by == sort %>
-                        <li class="pure-menu-item pure-menu-selected">
-                            <a class="pure-menu-link" href="/channel/<%= channel.ucid %>?page=<%= page %>&sort_by=<%= sort %>">
-                                <b><%= translate(locale, sort) %></b>
-                            </a>
-                        </li>
-                    <% else %>
-                        <li class="pure-menu-item">
-                            <a class="pure-menu-link" href="/channel/<%= channel.ucid %>?page=<%= page %>&sort_by=<%= sort %>">
-                                <%= translate(locale, sort) %>
-                            </a>
-                        </li>
-                    <% end %>
-                <% end %>
-            </ul>
-        </div>
-    </div>
-</div>
-
-<div class="h-box">
-    <hr>
-</div>
+<%= rendered "components/channel-information" %>
 
 <div class="pure-g">
 <% items.each do |item| %>
diff --git a/src/invidious/views/community.ecr b/src/invidious/views/community.ecr
index 15d8ed1e..3288f6b7 100644
--- a/src/invidious/views/community.ecr
+++ b/src/invidious/views/community.ecr
@@ -1,71 +1,9 @@
-<% ucid = channel.ucid %>
-<% author = HTML.escape(channel.author) %>
-
-<% content_for "header" do %>
-<title><%= author %> - Invidious</title>
-<% end %>
-
-<% if channel.banner %>
-    <div class="h-box">
-        <img style="width:100%" src="/ggpht<%= URI.parse(channel.banner.not_nil!.gsub("=w1060-", "=w1280-")).request_target %>">
-    </div>
-
-    <div class="h-box">
-        <hr>
-    </div>
-<% end %>
-
-<div class="pure-g h-box">
-    <div class="pure-u-2-3">
-        <div class="channel-profile">
-            <img src="/ggpht<%= URI.parse(channel.author_thumbnail).request_target %>">
-            <span><%= author %></span>
-        </div>
-    </div>
-    <div class="pure-u-1-3" style="text-align:right">
-        <h3 style="text-align:right">
-            <a href="/feed/channel/<%= channel.ucid %>"><i class="icon ion-logo-rss"></i></a>
-        </h3>
-    </div>
-</div>
-
-<div class="h-box">
-    <div id="descriptionWrapper">
-        <p><span style="white-space:pre-wrap"><%= XML.parse_html(channel.description_html).xpath_node(%q(.//pre)).try &.content %></span></p>
-    </div>
-</div>
-
-<div class="h-box">
-    <% sub_count_text = number_to_short_text(channel.sub_count) %>
-    <%= rendered "components/subscribe_widget" %>
-</div>
-
-<div class="pure-g h-box">
-    <div class="pure-u-1-3">
-        <a href="https://www.youtube.com/channel/<%= channel.ucid %>/community"><%= translate(locale, "View channel on YouTube") %></a>
-        <div class="pure-u-1 pure-md-1-3">
-            <a href="/redirect?referer=<%= env.get?("current_page") %>"><%= translate(locale, "Switch Invidious Instance") %></a>
-        </div>
-        <% if !channel.auto_generated %>
-            <div class="pure-u-1 pure-md-1-3">
-                <a href="/channel/<%= channel.ucid %>"><%= translate(locale, "Videos") %></a>
-            </div>
-        <% end %>
-        <div class="pure-u-1 pure-md-1-3">
-            <a href="/channel/<%= channel.ucid %>/playlists"><%= translate(locale, "Playlists") %></a>
-        </div>
-        <div class="pure-u-1 pure-md-1-3">
-            <% if channel.tabs.includes? "community" %>
-                <b><%= translate(locale, "Community") %></b>
-            <% end %>
-        </div>
-    </div>
-    <div class="pure-u-2-3"></div>
-</div>
-
-<div class="h-box">
-    <hr>
-</div>
+<% content_type =  2 %>
+<%
+# Make compiler happy
+%>
+<% sort_options = Tuple.new %>
+<%= rendered "components/channel-information" %>
 
 <% if error_message %>
     <div class="h-box">
diff --git a/src/invidious/views/playlists.ecr b/src/invidious/views/playlists.ecr
index 1245256f..b5e094d8 100644
--- a/src/invidious/views/playlists.ecr
+++ b/src/invidious/views/playlists.ecr
@@ -1,90 +1,6 @@
-<% ucid = channel.ucid %>
-<% author = HTML.escape(channel.author) %>
+<% content_type =  1 %>
 
-<% content_for "header" do %>
-<title><%= author %> - Invidious</title>
-<% end %>
-
-<% if channel.banner %>
-    <div class="h-box">
-        <img style="width:100%" src="/ggpht<%= URI.parse(channel.banner.not_nil!.gsub("=w1060-", "=w1280-")).request_target %>">
-    </div>
-
-    <div class="h-box">
-        <hr>
-    </div>
-<% end %>
-
-<div class="pure-g h-box">
-    <div class="pure-u-2-3">
-        <div class="channel-profile">
-            <img src="/ggpht<%= URI.parse(channel.author_thumbnail).request_target %>">
-            <span><%= author %></span>
-        </div>
-    </div>
-    <div class="pure-u-1-3" style="text-align:right">
-        <h3 style="text-align:right">
-            <a href="/feed/channel/<%= ucid %>"><i class="icon ion-logo-rss"></i></a>
-        </h3>
-    </div>
-</div>
-
-<div class="h-box">
-    <div id="descriptionWrapper">
-        <p><span style="white-space:pre-wrap"><%= XML.parse_html(channel.description_html).xpath_node(%q(.//pre)).try &.content if !channel.description_html.empty? %></span></p>
-    </div>
-</div>
-
-<div class="h-box">
-    <% sub_count_text = number_to_short_text(channel.sub_count) %>
-    <%= rendered "components/subscribe_widget" %>
-</div>
-
-<div class="pure-g h-box">
-    <div class="pure-g pure-u-1-3">
-        <div class="pure-u-1 pure-md-1-3">
-            <a href="https://www.youtube.com/channel/<%= ucid %>/playlists"><%= translate(locale, "View channel on YouTube") %></a>
-        </div>
-
-        <div class="pure-u-1 pure-md-1-3">
-            <a href="/redirect?referer=<%= env.get?("current_page") %>"><%= translate(locale, "Switch Invidious Instance") %></a>
-        </div>
-
-        <div class="pure-u-1 pure-md-1-3">
-            <a href="/channel/<%= ucid %>"><%= translate(locale, "Videos") %></a>
-        </div>
-        <div class="pure-u-1 pure-md-1-3">
-            <% if !channel.auto_generated %>
-                <b><%= translate(locale, "Playlists") %></b>
-            <% end %>
-        </div>
-        <div class="pure-u-1 pure-md-1-3">
-            <% if channel.tabs.includes? "community" %>
-                <a href="/channel/<%= ucid %>/community"><%= translate(locale, "Community") %></a>
-            <% end %>
-        </div>
-    </div>
-    <div class="pure-u-1-3"></div>
-    <div class="pure-u-1-3">
-        <div class="pure-g" style="text-align:right">
-            <% {"last", "oldest", "newest"}.each do |sort| %>
-                <div class="pure-u-1 pure-md-1-3">
-                    <% if sort_by == sort %>
-                        <b><%= translate(locale, sort) %></b>
-                    <% else %>
-                        <a href="/channel/<%= ucid %>/playlists?sort_by=<%= sort %>">
-                            <%= translate(locale, sort) %>
-                        </a>
-                    <% end %>
-                </div>
-            <% end %>
-        </div>
-    </div>
-</div>
-
-<div class="h-box">
-    <hr>
-</div>
+<%= rendered "components/channel-information" %>
 
 <div class="pure-g">
 <% items.each do |item| %>