From 8764b298adea2440ec586c63425c85acc14d7dd1 Mon Sep 17 00:00:00 2001
From: Omar Roth <omarroth@hotmail.com>
Date: Thu, 26 Jul 2018 12:09:29 -0500
Subject: [PATCH] Add thin mode

---
 src/invidious.cr                              |  5 +++++
 src/invidious/helpers.cr                      | 19 +++++++++++++------
 .../views/components/subscription_video.ecr   |  3 +++
 src/invidious/views/components/video.ecr      |  3 +++
 src/invidious/views/preferences.ecr           |  5 +++++
 src/invidious/views/watch.ecr                 |  5 ++++-
 6 files changed, 33 insertions(+), 7 deletions(-)

diff --git a/src/invidious.cr b/src/invidious.cr
index b16af9a4..7ab9b4c7 100644
--- a/src/invidious.cr
+++ b/src/invidious.cr
@@ -1359,6 +1359,10 @@ post "/preferences" do |env|
     dark_mode ||= "off"
     dark_mode = dark_mode == "on"
 
+    thin_mode = env.params.body["thin_mode"]?.try &.as(String)
+    thin_mode ||= "off"
+    thin_mode = thin_mode == "on"
+
     max_results = env.params.body["max_results"]?.try &.as(String).to_i
     max_results ||= 40
 
@@ -1376,6 +1380,7 @@ post "/preferences" do |env|
       "quality"     => quality,
       "volume"      => volume,
       "dark_mode"   => dark_mode,
+      "thin_mode"   => thin_mode,
       "max_results" => max_results,
       "sort"        => sort,
       "latest_only" => latest_only,
diff --git a/src/invidious/helpers.cr b/src/invidious/helpers.cr
index 3448245b..35d411a8 100644
--- a/src/invidious/helpers.cr
+++ b/src/invidious/helpers.cr
@@ -24,6 +24,7 @@ DEFAULT_USER_PREFERENCES = Preferences.from_json({
   "quality"     => "hd720",
   "volume"      => 100,
   "dark_mode"   => false,
+  "thin_mode "  => false,
   "max_results" => 40,
   "sort"        => "published",
   "latest_only" => false,
@@ -145,14 +146,20 @@ class User
   })
 end
 
+# TODO: Migrate preferences so this will not be nilable
 class Preferences
   JSON.mapping({
-    video_loop:  Bool,
-    autoplay:    Bool,
-    speed:       Float32,
-    quality:     String,
-    volume:      Int32,
-    dark_mode:   Bool,
+    video_loop: Bool,
+    autoplay:   Bool,
+    speed:      Float32,
+    quality:    String,
+    volume:     Int32,
+    dark_mode:  Bool,
+    thin_mode:  {
+      type:    Bool,
+      nilable: true,
+      default: false,
+    },
     max_results: Int32,
     sort:        String,
     latest_only: Bool,
diff --git a/src/invidious/views/components/subscription_video.ecr b/src/invidious/views/components/subscription_video.ecr
index 377f51cb..f1ad4bb3 100644
--- a/src/invidious/views/components/subscription_video.ecr
+++ b/src/invidious/views/components/subscription_video.ecr
@@ -1,7 +1,10 @@
 <div class="pure-u-1 pure-u-md-1-4">
     <div class="h-box">
         <a style="width:100%;" href="/watch?v=<%= video.id %>">
+            <% if env.get?("user") && env.get("user").as(User).preferences.thin_mode %>
+            <% else %>
             <img style="width:100%;" src="https://i.ytimg.com/vi/<%= video.id %>/mqdefault.jpg"/>
+            <% end %>
             <p><%= video.title %></p>
         </a>
         <p>
diff --git a/src/invidious/views/components/video.ecr b/src/invidious/views/components/video.ecr
index 804080cc..d145270f 100644
--- a/src/invidious/views/components/video.ecr
+++ b/src/invidious/views/components/video.ecr
@@ -1,7 +1,10 @@
 <div class="pure-u-1 pure-u-md-1-4">
     <div class="h-box">
         <a style="width:100%;" href="/watch?v=<%= video.id %>">
+            <% if env.get?("user") && env.get("user").as(User).preferences.thin_mode %>
+            <% else %>
             <img style="width:100%;" src="https://i.ytimg.com/vi/<%= video.id %>/mqdefault.jpg"/>
+            <% end %>
             <p><%= video.title %></p>
         </a>
         <p>
diff --git a/src/invidious/views/preferences.ecr b/src/invidious/views/preferences.ecr
index 370dfc0f..50e8b0e9 100644
--- a/src/invidious/views/preferences.ecr
+++ b/src/invidious/views/preferences.ecr
@@ -53,6 +53,11 @@ function update_value(element) {
                 <input name="dark_mode" id="dark_mode" type="checkbox" <% if user.preferences.dark_mode %>checked<% end %>>
             </div>
 
+            <div class="pure-control-group">
+                <label for="thin_mode">Thin mode: </label>
+                <input name="thin_mode" id="thin_mode" type="checkbox" <% if user.preferences.thin_mode %>checked<% end %>>
+            </div>
+
             <legend>Subscription preferences</legend>
             <div class="pure-control-group">
                 <label for="max_results">Number of videos shown in feed: </label>
diff --git a/src/invidious/views/watch.ecr b/src/invidious/views/watch.ecr
index 06dd3d5a..2df1e4f1 100644
--- a/src/invidious/views/watch.ecr
+++ b/src/invidious/views/watch.ecr
@@ -278,7 +278,10 @@ String.prototype.supplant = function (o) {
         <% rvs.each do |rv| %>
             <% if rv.has_key?("id") %>
             <a href="/watch?v=<%= rv["id"] %>">
-                <img style="width:100%;" alt="thumbnail" src="<%= rv["iurlmq"] %>">
+                <% if preferences && preferences.thin_mode %>
+                <% else %>
+                <img style="width:100%;" src="<%= rv["iurlmq"] %>">
+                <% end %>
                 <p style="width:100%"><%= rv["title"] %></p>
                 <p>
                     <b style="width: 100%"><%= rv["author"] %></b>