Add rudimentary support for embedding videos

app/assets/stylesheets/base.css

@@ -75,6 +75,10 @@ a:not([class]) {
   list-style: none;
 }
 
+video {
+  max-inline-size: 100%;
+}
+
 /* Printing */
 @page {
   margin: 1in;

config/initializers/sanitization.rb

@@ -1,4 +1,4 @@
 Rails.application.config.after_initialize do
-  Rails::HTML5::SafeListSanitizer.allowed_tags.merge(%w[ s table tr td th thead tbody details summary ])
-  Rails::HTML5::SafeListSanitizer.allowed_attributes.merge(%w[ data-turbo-frame ])
+  Rails::HTML5::SafeListSanitizer.allowed_tags.merge(%w[ s table tr td th thead tbody details summary video source])
+  Rails::HTML5::SafeListSanitizer.allowed_attributes.merge(%w[ data-turbo-frame controls type width ])
 end

lib/markdown_renderer.rb

@@ -37,6 +37,8 @@ class MarkdownRenderer < Redcarpet::Render::HTML
   end
 
   def link(url, title, content)
+    return video_tag(url, title) if video_url?(url)
+
     attributes = { href: url }
     attributes[:title] = title if title
     attributes["data-turbo-frame"] = "_top"
@@ -64,4 +66,16 @@ class MarkdownRenderer < Redcarpet::Render::HTML
         id_counts[base_id] > 1 ? "#{base_id}-#{id_counts[base_id]}" : base_id
       end
     end
+
+    def video_url?(url)
+      File.extname(url).downcase.match?(/\.(mp4|webm|ogg)/)
+    end
+
+    def video_tag(url, title)
+      <<~HTML.chomp
+        <video controls title="#{title}" width="1024">
+          <source src="#{url}" type="video/#{File.extname(url).delete('.')}">
+        </video>
+      HTML
+    end
 end