Feed html reorganized into partials for infinite scroll feature.

mikeckennedy · mikeckennedy · commit 4ff7543cf8d2 · 2021-09-22T10:47:34.000-07:00
diff --git a/code/ch7_infinite_scroll/ch7_final_video_collector/templates/feed/index.html b/code/ch7_infinite_scroll/ch7_final_video_collector/templates/feed/index.html
@@ -5,22 +5,7 @@
 
         <h1>Video Collector: Recent Videos</h1>
 
-        {% for v in videos %}
-
-            <div class="video">
-                <div><span class="title">{{ v.title }}</span></div>
-                <a href="/videos/play/{{ v.id }}">
-
-                    <img src="https://img.youtube.com/vi/{{ v.id }}/maxresdefault.jpg"
-                         class="img img-responsive {{ ' '.join(classes) }}"
-                         alt="{{ v.title }}"
-                         title="{{ v.title }}">
-
-                </a>
-            </div>
-
-        {% endfor %}
-
+        {{ render_partial('feed/partials/video_list.html', videos=videos) }}
 
     </div>
 
diff --git a/code/ch7_infinite_scroll/ch7_final_video_collector/templates/feed/partials/video_list.html b/code/ch7_infinite_scroll/ch7_final_video_collector/templates/feed/partials/video_list.html
@@ -0,0 +1,10 @@
+{% for v in videos %}
+
+    <div class="video">
+        <div><span class="title">{{ v.title }}</span></div>
+        <a href="/videos/play/{{ v.id }}">
+            {{ render_partial('shared/partials/_video_image.html', video=v) }}
+        </a>
+    </div>
+
+{% endfor %}
