Fix up search

src/invidious.cr

@@ -178,35 +178,44 @@ get "/search" do |env|
 
   client = get_client
 
-  html = client.get("https://www.youtube.com/results?q=#{URI.escape(query)}&page=#{page}").body
+  html = client.get("https://www.youtube.com/results?q=#{URI.escape(query)}&page=#{page}&sp=EgIQAVAU").body
   html = XML.parse_html(html)
 
   videos = Array(Hash(String, String)).new
 
-  html.xpath_nodes(%q(//div[contains(@class,"yt-lockup-video")]/div)).each do |item|
+  html.xpath_nodes(%q(//ol[@class="item-section"]/li)).each do |item|
-    video = {} of String => String
+    root = item.xpath_node(%q(div[contains(@class,"yt-lockup-video")]/div))
+    if root
+      video = {} of String => String
 
-    link = item.xpath_node(%q(div/div[@class="yt-lockup-content"]/h3/a/@href))
+      link = root.xpath_node(%q(div[contains(@class,"yt-lockup-thumbnail")]/a/@href))
-    if link
-      video["link"] = link.content
-    else
-      link = item.xpath_node(%q(div[@class="yt-lockup-content"]/h3/a/@href))
       if link
         video["link"] = link.content
+      else
+        video["link"] = "#"
       end
-    end
 
-    title = item.xpath_node(%q(div/div[@class="yt-lockup-content"]/h3/a))
+      title = root.xpath_node(%q(div[@class="yt-lockup-content"]/h3/a))
-    if title
-      video["title"] = title.content
-    else
-      title = item.xpath_node(%q(div[@class="yt-lockup-content"]/h3/a))
       if title
         video["title"] = title.content
+      else
+        video["title"] = "Something went wrong"
       end
-    end
 
-    videos << video
+      thumbnail = root.xpath_node(%q(div[contains(@class,"yt-lockup-thumbnail")]/a/div/span/img/@src))
+      if thumbnail && !thumbnail.content.ends_with?(".gif")
+        video["thumbnail"] = thumbnail.content
+      else
+        thumbnail = root.xpath_node(%q(div[contains(@class,"yt-lockup-thumbnail")]/a/div/span/img/@data-thumb))
+        if thumbnail
+          video["thumbnail"] = thumbnail.content
+        else
+          video["thumbnail"] = "http://via.placeholder.com/246x138"
+        end
+      end
+
+      videos << video
+    end
   end
 
   POOL << client

src/views/search.ecr

@@ -3,7 +3,23 @@
 <% end %>
 
 <% videos.each do |item| %>
-<p><a class="link" href="<%= item["link"] %>"><%= item["title"] %></a></p>
+<p>
+    <div class="pure-g">
+        <div class="pure-u-1 pure-u-md-1-5">
+            <a class="link" href="<%= item["link"] %>">
+                <img style="width:90%" alt="thumbnail" src="<%= item["thumbnail"] %>">
+            </a>
+        </div>
+        <div class="pure-u-1 pure-u-md-4-5">
+            <a style="display:block; width:100%; height:100%" class="link" href="<%= item["link"] %>">
+                <%= item["title"] %>
+            </a>
+        </div>
+    </div>
+    </a>
+</p>
 <% end %>
 
-<p style="text-align: right"><a href="/search?q=<%= query %>&page=<%= page + 1 %>">Next page</a></p>
+<p style="text-align: right">
+    <a href="/search?q=<%= query %>&page=<%= page + 1 %>">Next page</a>
+</p>