invidious/src/invidious/views/channel.ecr

<% content_for "header" do %>
<title><%= channel.author %> - Invidious</title>
<link rel="alternate" type="application/rss+xml" title="RSS" href="/feed/channel/<%= 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><%= channel.author %></span>
        </div>
    </div>
    <div class="pure-u-1-3" style="text-align:right">
        <h3>
            <a href="/feed/channel/<%= channel.ucid %>"><i class="icon ion-logo-rss"></i></a>
        </h3>
    </div>
</div>

<div class="h-box">
    <p><span style="white-space:pre-wrap"><%= channel.description_html %></span></p>
</div>

<div class="h-box">
    <% ucid = channel.ucid %>
    <% author = channel.author %>
    <% 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>

<div class="pure-g">
    <% items.each_slice(4) do |slice| %>
        <% slice.each do |item| %>
            <%= rendered "components/item" %>
        <% end %>
    <% end %>
</div>

<div class="pure-g h-box">
    <div class="pure-u-1 pure-u-lg-1-5">
        <% if page > 1 %>
            <a href="/channel/<%= channel.ucid %>?page=<%= page - 1 %><% if sort_by != "newest" %>&sort_by=<%= HTML.escape(sort_by) %><% end %>">
                <%= translate(locale, "Previous page") %>
            </a>
        <% end %>
    </div>
    <div class="pure-u-1 pure-u-lg-3-5"></div>
    <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
        <% if count == 60 %>
            <a href="/channel/<%= channel.ucid %>?page=<%= page + 1 %><% if sort_by != "newest" %>&sort_by=<%= HTML.escape(sort_by) %><% end %>">
                <%= translate(locale, "Next page") %>
            </a>
        <% end %>
    </div>
</div>