Add speed and fix <select> options

src/invidious.cr

@@ -700,6 +700,9 @@ post "/preferences" do |env|
     autoplay ||= "off"
     autoplay = autoplay == "on"
 
+    speed = env.params.body["speed"]?.try &.as(String).to_f
+    speed ||= 1.0
+
     quality = env.params.body["quality"]?.try &.as(String)
     quality ||= "hd720"
 
@@ -713,6 +716,7 @@ post "/preferences" do |env|
     preferences = {
       "video_loop" => video_loop,
       "autoplay"   => autoplay,
+      "speed"      => speed,
       "quality"    => quality,
       "volume"     => volume,
       "dark_mode"  => dark_mode,

src/invidious/helpers.cr

@@ -20,6 +20,7 @@ end
 DEFAULT_USER_PREFERENCES = Preferences.from_json({
   "video_loop" => false,
   "autoplay"   => false,
+  "speed"      => 1.0,
   "quality"    => "hd720",
   "volume"     => 100,
   "dark_mode"  => false,
@@ -137,6 +138,7 @@ class Preferences
   JSON.mapping({
     video_loop: Bool,
     autoplay:   Bool,
+    speed:      Float32,
     quality:    String,
     volume:     Int32,
     dark_mode:  Bool,

src/invidious/views/preferences.ecr

@@ -22,12 +22,21 @@ function update_value(element) {
             <input name="autoplay" id="autoplay" type="checkbox" <% if user.preferences.autoplay %>checked<% end %>>
         </div>
 
+        <div class="pure-control-group">
+            <label for="speed">Default speed: </label>
+            <select name="speed" id="speed">
+            <% [2.0, 1.5, 1.0, 0.5].each do |option| %>
+                <option <% if user.preferences.speed == option %> selected <% end %>><%= option %></option>
+            <% end %>
+            </select>
+        </div>
+
         <div class="pure-control-group">
             <label for="quality">Preferred video quality: </label>
-            <select name="quality" id="quality" selected="<%= user.preferences.quality %>">
+            <select name="quality" id="quality">
-                <option>hd720</option>
+            <% ["hd720", "medium", "small"].each do |option| %>
-                <option>medium</option>
+                <option <% if user.preferences.quality == option %> selected <% end %>><%= option %></option>
-                <option>small</option>
+            <% end %>
             </select>
         </div>
 

src/invidious/views/watch.ecr

@@ -91,6 +91,7 @@ var player = videojs('player', options, function() {
 
 <% if preferences %>
 player.volume(<%= preferences.volume.to_f / 100 %>);
+player.playbackRate(<%= preferences.speed %>);
 <% end %>
 player.offset({
   start: <%= video_start %>,