Spin parts into components

7 files changed, 54 insertions, 73 deletions

diff --git a/src/helpers.cr b/src/helpers.cr
index 9375b3a6..e7a1e688 100644
--- a/src/helpers.cr
+++ b/src/helpers.cr
@@ -13,6 +13,10 @@ macro templated(filename)
   render "src/views/#{{{filename}}}.ecr", "src/views/layout.ecr"
 end
 
+macro rendered(filename)
+  render "src/views/#{{{filename}}}.ecr"
+end
+
 class Config
   YAML.mapping({
     crawl_threads:   Int32,
@@ -297,7 +301,7 @@ end
 
 def decrypt_signature(a)
   a = a.split("")
-  
+
   a.reverse!
   a = splice(a, 50)
   a.delete_at(0..1)
diff --git a/src/invidious.cr b/src/invidious.cr
index 2d9062c3..f86d9331 100644
--- a/src/invidious.cr
+++ b/src/invidious.cr
@@ -386,34 +386,32 @@ get "/search" do |env|
   html = client.get("/results?q=#{URI.escape(query)}&page=#{page}&sp=EgIQAVAU").body
   html = XML.parse_html(html)
 
-  videos = Array(Hash(String, String)).new
+  videos = [] of Video
 
   html.xpath_nodes(%q(//ol[@class="item-section"]/li)).each do |item|
     root = item.xpath_node(%q(div[contains(@class,"yt-lockup-video")]/div))
     if root
-      video = {} of String => String
-
       id = root.xpath_node(%q(div[contains(@class,"yt-lockup-thumbnail")]/a/@href))
       if id
         id = id.content.lchop("/watch?v=")
       end
       id ||= ""
-      video["id"] = id
 
       title = root.xpath_node(%q(div[@class="yt-lockup-content"]/h3/a))
       if title
-        video["title"] = title.content
+        title = title.content
       end
-      video["title"] ||= ""
+      title ||= ""
 
       author = root.xpath_node(%q(div[@class="yt-lockup-content"]/div/a))
       if author
-        video["author"] = author.content
-        video["ucid_url"] = author["href"]
+        ucid = author["href"].rpartition("/")[-1]
+        author = author.content
       end
-      video["author"] ||= ""
-      video["ucid_url"] ||= ""
+      author ||= ""
+      ucid ||= ""
 
+      video = Video.new(id, HTTP::Params.parse(""), Time.now, title, 0_i64, 0, 0, 0.0, Time.now, "", nil, author, ucid)
       videos << video
     end
   end
diff --git a/src/views/components/subscription_video.ecr b/src/views/components/subscription_video.ecr
new file mode 100644
index 00000000..9abbb09f
--- /dev/null
+++ b/src/views/components/subscription_video.ecr
@@ -0,0 +1,14 @@
+<div class="pure-u-1 pure-u-md-1-4">
+    <div class="h-box">
+        <a style="width:100%;" href="/watch?v=<%= video.id %>">
+            <img style="width:100%;" src="https://i.ytimg.com/vi/<%= video.id %>/mqdefault.jpg"/>
+            <p style="height:100%"><%= video.title %></p>
+        </a>
+        <p>
+            <b><a style="width:100%;" href="/channel/<%= video.ucid %>"><%= video.author %></a></b>
+        </p>
+        <p>
+            <h5>Shared <%= video.published.to_s("%B %-d, %Y at %r UTC") %></h5>
+        </p>
+    </div>
+</div> 
\ No newline at end of file
diff --git a/src/views/components/video.ecr b/src/views/components/video.ecr
new file mode 100644
index 00000000..804080cc
--- /dev/null
+++ b/src/views/components/video.ecr
@@ -0,0 +1,11 @@
+<div class="pure-u-1 pure-u-md-1-4">
+    <div class="h-box">
+        <a style="width:100%;" href="/watch?v=<%= video.id %>">
+            <img style="width:100%;" src="https://i.ytimg.com/vi/<%= video.id %>/mqdefault.jpg"/>
+            <p><%= video.title %></p>
+        </a>
+        <p>
+            <b><a style="width:100%;" href="/channel/<%= video.ucid %>"><%= video.author %></a></b>
+        </p>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/views/index.ecr b/src/views/index.ecr
index 363ef9cd..f58a6d89 100644
--- a/src/views/index.ecr
+++ b/src/views/index.ecr
@@ -3,19 +3,9 @@
 <% end %>
 
 <% top_videos.each_slice(4) do |slice| %>
-<div class="pure-g">
-<% slice.each do |video| %>
-    <div class="pure-u-1 pure-u-md-1-4">
-        <div class="h-box">
-            <a style="width:100%;" href="/watch?v=<%= video.id %>">
-                <img style="width:100%;" src="https://i.ytimg.com/vi/<%= video.id %>/mqdefault.jpg"/>
-                <p><%= video.title %></p>
-            </a>
-            <p>
-                <b><a style="width:100%;" href="https://youtube.com/channel/<%= video.info["ucid"] %>"><%= video.info["author"] %></a></b>
-            </p>
-        </div>
+    <div class="pure-g">
+        <% slice.each do |video| %>
+            <%= rendered "components/video" %>
+        <% end %>
     </div>
-    <% end %>
-</div>
 <% end %>
diff --git a/src/views/search.ecr b/src/views/search.ecr
index 1fa297ab..ba47f546 100644
--- a/src/views/search.ecr
+++ b/src/views/search.ecr
@@ -5,19 +5,9 @@
 <% videos.each_slice(4) do |slice| %>
 <div class="pure-g">
     <% slice.each do |video| %>
-    <div class="pure-u-1 pure-u-md-1-4">
-        <div class="h-box">
-            <a style="width:100%;" href="/watch?v=<%= video["id"] %>">
-                <img style="width:100%;" src="https://i.ytimg.com/vi/<%= video["id"] %>/mqdefault.jpg"/>
-                <p><%= video["title"] %></p>
-            </a>
-            <p>
-                <b><a style="width:100%;" href="https://youtube.com<%= video["ucid_url"]%>"><%= video["author"] %></a></b>
-            </p>
-        </div>
-    </div>
+        <%= rendered "components/video" %>
     <% end %>
-</div>
+</div> 
 <% end %>
 
 <div class="pure-g">
diff --git a/src/views/subscriptions.ecr b/src/views/subscriptions.ecr
index 99cff3de..c0e15b47 100644
--- a/src/views/subscriptions.ecr
+++ b/src/views/subscriptions.ecr
@@ -3,48 +3,22 @@
 <% end %>
 
 <% if !notifications.empty? %>
-<% notifications.each_slice(4) do |slice| %>
-<div class="pure-g">
-    <% slice.each do |video| %>
-    <div class="pure-u-1 pure-u-md-1-4">
-        <div class="h-box">
-            <a style="width:100%;" href="/watch?v=<%= video.id %>">
-                <img style="width:100%;" src="https://i.ytimg.com/vi/<%= video.id %>/mqdefault.jpg"/>
-                <p style="height:100%"><%= video.title %></p>
-            </a>
-            <p>
-                <b><a style="width:100%;" href="https://youtube.com/channel/<%= video.ucid %>"><%= video.author %></a></b>
-            </p>
-            <p>
-                <h5>Shared <%= video.published.to_s("%B %-d, %Y at %r UTC") %></h5>
-            </p>
+    <% notifications.each_slice(4) do |slice| %>
+        <div class="pure-g">
+            <% slice.each do |video| %>
+                <%= rendered "components/subscription_video" %>
+            <% end %>
         </div>
-    </div>
     <% end %>
-</div>
-<% end %>
-<hr style="margin-left:1em; margin-right:1em;">
+    <hr style="margin-left:1em; margin-right:1em;">
 <% end %>
 
 <% videos.each_slice(4) do |slice| %>
-<div class="pure-g">
-    <% slice.each do |video| %>
-    <div class="pure-u-1 pure-u-md-1-4">
-        <div class="h-box">
-            <a style="width:100%;" href="/watch?v=<%= video.id %>">
-                <img style="width:100%;" src="https://i.ytimg.com/vi/<%= video.id %>/mqdefault.jpg"/>
-                <p style="height:100%"><%= video.title %></p>
-            </a>
-            <p>
-                <b><a style="width:100%;" href="https://youtube.com/channel/<%= video.ucid %>"><%= video.author %></a></b>
-            </p>
-            <p>
-                <h5>Shared <%= video.published.to_s("%B %-d, %Y at %r UTC") %></h5>
-            </p>
-        </div>
+    <div class="pure-g">
+        <% slice.each do |video| %>
+            <%= rendered "components/subscription_video" %>
+        <% end %>
     </div>
-    <% end %>
-</div>
 <% end %>
 
 <div class="pure-g">