Add video playback preferences

nitter.conf

@@ -1,6 +1,7 @@
 [Server]
 address = "0.0.0.0"
 port = 8080
+https = true  # disable to enable cookies when not using https
 title = "nitter"
 staticDir = "./public"
 

src/prefs_impl.nim

@@ -32,8 +32,16 @@ const prefList*: Table[string, seq[Pref]] = {
   ],
 
   "Media": @[
-    Pref(kind: checkbox, name: "videoPlayback",
+    Pref(kind: checkbox, name: "mp4Playback",
-         label: "Enable hls.js video playback (requires JavaScript)",
+        label: "Enable mp4 video playback",
+        defaultState: true),
+
+    Pref(kind: checkbox, name: "hlsPlayback",
+         label: "Enable hls video streaming (requires JavaScript)",
+         defaultState: false),
+
+    Pref(kind: checkbox, name: "muteVideos",
+         label: "Mute videos by default",
          defaultState: false),
 
     Pref(kind: checkbox, name: "autoplayGifs", label: "Autoplay gifs",

src/types.nim

@@ -51,7 +51,9 @@ db("cache.db", "", "", ""):
         .}: VideoType
 
     Prefs* = object
-      videoPlayback*: bool
+      hlsPlayback*: bool
+      mp4Playback*: bool
+      muteVideos*: bool
       autoplayGifs*: bool
       hideTweetStats*: bool
       hideBanner*: bool

src/views/tweet.nim

@@ -45,24 +45,42 @@ proc renderAlbum(tweet: Tweet): VNode =
               target="_blank", style={display: flex}):
               genImg(photo)
 
+proc isPlaybackEnabled(prefs: Prefs; video: Video): bool =
+  case video.playbackType
+  of mp4: prefs.mp4Playback
+  of m3u8, vmap: prefs.hlsPlayback
+
+proc renderVideoDisabled(video: Video): VNode =
+  buildHtml(tdiv):
+    img(src=video.thumb.getSigUrl("pic"))
+    tdiv(class="video-overlay"):
+      case video.playbackType
+      of mp4:
+        p: text "mp4 playback disabled in preferences"
+      of m3u8, vmap:
+        p: text "hls playback disabled in preferences"
+
 proc renderVideo(video: Video; prefs: Prefs): VNode =
   buildHtml(tdiv(class="attachments")):
     tdiv(class="gallery-video"):
       tdiv(class="attachment video-container"):
-        let thumb = video.thumb.getSigUrl("pic")
+        if prefs.isPlaybackEnabled(video):
-        case video.playbackType
+          let thumb = video.thumb.getSigUrl("pic")
-        of mp4:
+          let source = video.url.getSigUrl("video")
-          video(poster=thumb, controls=""):
+          case video.playbackType
-            source(src=video.url.getSigUrl("video"), `type`="video/mp4")
+          of mp4:
-        of m3u8, vmap:
+            if prefs.muteVideos:
-          if prefs.videoPlayback:
+              video(poster=thumb, controls="", muted=""):
+                source(src=source, `type`="video/mp4")
+            else:
+              video(poster=thumb, controls=""):
+                source(src=source, `type`="video/mp4")
+          of m3u8, vmap:
             video(poster=thumb)
             tdiv(class="video-overlay"):
               p: text "Video playback not supported yet"
-          else:
+        else:
-            img(src=thumb)
+          renderVideoDisabled(video)
-            tdiv(class="video-overlay"):
-              p: text "Video playback disabled"
 
 proc renderGif(gif: Gif; prefs: Prefs): VNode =
   buildHtml(tdiv(class="attachments media-gif")):