From 56fa0986bedeed0342a96494d409a31a08ff58d4 Mon Sep 17 00:00:00 2001
From: j <j@mailb.org>
Date: Sat, 1 Feb 2025 16:00:42 +0530
Subject: [PATCH] unify video element

---
 content/models.py                    | 5 +++++
 content/templates/content.html       | 2 +-
 content/templates/event_preview.html | 2 +-
 content/templates/featured.html      | 2 +-
 content/templates/preview.html       | 2 +-
 content/templates/results.html       | 2 +-
 content/templates/section_index.html | 2 +-
 7 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/content/models.py b/content/models.py
index fdaafe4..93e5064 100644
--- a/content/models.py
+++ b/content/models.py
@@ -217,6 +217,11 @@ class Content(models.Model):
                 subprocess.call(cmd)
             return self.photo.image.url.replace('.gif', '.mp4')
 
+    @cached_property
+    def video_gif(self):
+        html = '<video autoplay loop mouted playsinline src="%s" class="gif"></video>' % self.video_url
+        return mark_safe(html)
+
     @cached_property
     def image_url(self):
         if self.photo:
diff --git a/content/templates/content.html b/content/templates/content.html
index 2c84280..e2a7613 100644
--- a/content/templates/content.html
+++ b/content/templates/content.html
@@ -7,7 +7,7 @@
     {% include "edit.html" %}
     <div class="large-8 medium-8 columns special-column">
         {% if content.video_url %}
-        <video class="gif" autoplay loop src="{{ content.video_url }}"></video>
+        {{ content.video_gif }}
         {% elif content.image_url %}
         <img src="{{ content.image_url }}">
         {% endif %}
diff --git a/content/templates/event_preview.html b/content/templates/event_preview.html
index e56176a..9f1822c 100644
--- a/content/templates/event_preview.html
+++ b/content/templates/event_preview.html
@@ -17,7 +17,7 @@
         <div class="small-6 columns">
             <a href="{{ content.get_absolute_url }}">
                 {% if content.video_url %}
-                <video class="gif" autoplay loop src="{{ content.video_url }}"></video>
+                {{ content.video_gif }}
                 {% else %}
                 <img src="{{ content.image_url }}">
                 {% endif %}
diff --git a/content/templates/featured.html b/content/templates/featured.html
index 039855a..f93359b 100644
--- a/content/templates/featured.html
+++ b/content/templates/featured.html
@@ -1,7 +1,7 @@
 {% for content in featured %}
 <div class="large-8 medium-8 columns special-column">
     {% if content.video_url %}
-    <a href="{{ content.get_absolute_url }}"><video class="gif" autoplay loop src="{{ content.video_url }}"></video></a>
+    <a href="{{ content.get_absolute_url }}">{{ content.video_gif }}</a>
     {% elif content.image_url %}
     <a href="{{ content.get_absolute_url }}"><img src="{{ content.image_url }}"></a>
     {% endif %}
diff --git a/content/templates/preview.html b/content/templates/preview.html
index 377a262..729c771 100644
--- a/content/templates/preview.html
+++ b/content/templates/preview.html
@@ -11,7 +11,7 @@
     {% else %}
     <div class="small-6 columns">
         {% if content.video_url %}
-        <a href="{{ content.get_absolute_url }}"><video class="gif" autoplay loop src="{{ content.video_url }}"></video></a>
+        <a href="{{ content.get_absolute_url }}">{{ content.video_gif }}</a>
         {% elif content.image_url %}
         <a href="{{ content.get_absolute_url }}"><img src="{{ content.image_url }}"></a>
         {% endif %}
diff --git a/content/templates/results.html b/content/templates/results.html
index 53eae62..5604c98 100644
--- a/content/templates/results.html
+++ b/content/templates/results.html
@@ -26,7 +26,7 @@
     <div class="row results">
         <div class="small-6 medium-4 medium-offset-2 large-2 large-offset-2 columns">
             {% if row.video_url %}
-            <a href="{{ row.get_absolute_url }}"><video class="gif" autoplay loop src="{{ row.video_url }}"></video></a>
+            <a href="{{ row.get_absolute_url }}">{{ row.video_gif }}</a>
             {% elif row.image_url %}
             <a href="{{ row.get_absolute_url }}"><img src="{{ row.image_url }}"></a>
             {% else %}
diff --git a/content/templates/section_index.html b/content/templates/section_index.html
index 04b48db..105de1e 100644
--- a/content/templates/section_index.html
+++ b/content/templates/section_index.html
@@ -12,7 +12,7 @@
                 {% if content.image_url %}
                 <div class="small-6 columns">
                     {% if content.video_url %}
-                    <video class="gif" autoplay loop src="{{ content.video_url }}"></video>
+                    {{ content.video_gif }}
                     {% elif content.image_url %}
                     <img src="{{ content.image_url }}">
                     {% endif %}